.bookmark-notice{
  position:fixed;top:100px;right:28px;z-index:70;width:min(350px,calc(100vw - 56px));
  display:flex;gap:13px;padding:17px 45px 17px 17px;box-sizing:border-box;
  border:1px solid rgba(72,191,255,.43);border-radius:17px;background:linear-gradient(145deg,rgba(13,43,81,.98),rgba(4,20,48,.99));color:#eff9ff;
  box-shadow:0 18px 42px rgba(0,0,0,.42),inset 0 1px 0 rgba(167,232,255,.1);opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .22s ease,transform .22s ease;
}
.bookmark-notice.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}
.bookmark-notice.is-hiding{opacity:0;transform:translateY(-8px);pointer-events:none}
.bookmark-notice__icon{
  display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:13px;
  border:1px solid rgba(81,208,255,.48);background:linear-gradient(145deg,rgba(23,142,222,.25),rgba(12,70,136,.2));color:#75e1ff;
}
.bookmark-notice__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.bookmark-notice__body{min-width:0}
.bookmark-notice__title{margin:0;color:#f5fbff;font-size:18px;font-weight:700;line-height:1.3}
.bookmark-notice__domain{margin:3px 0 7px;color:#5cdcff;font-size:14px;font-weight:650;line-height:1.35}
.bookmark-notice__copy{margin:0;color:#b5cbed;font-size:13px;line-height:1.65}
.bookmark-notice__copy strong{color:#fff;font-weight:750}
.bookmark-notice__actions{display:flex;gap:9px;margin-top:12px}
.bookmark-notice__button{
  min-height:31px;padding:0 12px;border:1px solid rgba(85,197,255,.48);border-radius:9px;background:rgba(6,34,73,.72);color:#a7e9ff;
  font:600 13px/1 system-ui,-apple-system,"Microsoft YaHei",sans-serif;cursor:pointer;transition:background .15s ease,border-color .15s ease;
}
.bookmark-notice__button:hover{border-color:#6be1ff;background:rgba(24,142,216,.3);color:#fff}
.bookmark-notice__button--primary{border-color:#21b5ef;background:linear-gradient(135deg,#1689dd,#16b6d0);color:#fff}
.bookmark-notice__button--primary:hover{border-color:#5be0ff;background:linear-gradient(135deg,#1b9df4,#1ac9dc)}
.bookmark-notice__close{
  position:absolute;top:10px;right:11px;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:#a7bedc;
  font:400 25px/25px system-ui,-apple-system,"Microsoft YaHei",sans-serif;cursor:pointer;
}
.bookmark-notice__close:hover{background:rgba(74,190,255,.16);color:#fff}
@media (max-width:768px){
  .bookmark-notice{
    top:auto;right:12px;bottom:max(84px,calc(16px + env(safe-area-inset-bottom)));left:12px;width:auto;
    padding:15px 41px 15px 14px;border-radius:15px;transform:translateY(8px);
  }
  .bookmark-notice.is-hiding{transform:translateY(8px)}
  .bookmark-notice__icon{flex-basis:42px;width:42px;height:42px;border-radius:12px}
  .bookmark-notice__title{font-size:16px}.bookmark-notice__copy{font-size:12px;line-height:1.55}
  .bookmark-notice__actions{margin-top:10px}.bookmark-notice__button{min-height:30px;padding:0 11px}
}