/* 漂流瓶 — message in a bottle (herblue-moon) */
.bt-sea{position:relative;height:78vh;height:78svh;min-height:560px;overflow:hidden;background:radial-gradient(80% 60% at 70% 18%,#0a1240 0%,#050821 45%,var(--bg) 75%)}
.bt-canvas{position:absolute;inset:0;width:100%;height:100%}
.bt-copy{position:relative;z-index:2;padding-top:clamp(110px,16vh,170px)}
.bt-title{font-family:var(--font-heading);font-weight:500;font-size:clamp(30px,4.4vw,52px);letter-spacing:.14em;margin:.5em 0 .3em;color:var(--ink)}
.bt-line{font-family:var(--font-serif-cn);color:var(--ink-2);letter-spacing:.12em;margin:0}
.bt-hint{font-family:var(--font-serif-cn);font-size:13px;color:var(--ink-3);letter-spacing:.2em;margin-top:1.4em}
.bt-bottles{position:absolute;inset:0;z-index:3;pointer-events:none}
.bt-bottle{position:absolute;left:0;top:0;width:34px;height:64px;padding:0;border:0;background:none;cursor:pointer;pointer-events:auto;color:var(--moon);will-change:transform;-webkit-tap-highlight-color:transparent}
.bt-bottle svg{width:100%;height:100%;overflow:visible;transition:filter .5s var(--ease)}
.bt-bottle:hover svg,.bt-bottle:focus-visible svg{filter:drop-shadow(0 0 10px var(--amber-glow))}
.bt-bottle:focus-visible{outline:1px dashed var(--amber);outline-offset:6px;border-radius:6px}
.bt-bottle.is-new .bt-glow{opacity:1}
.bt-glow{opacity:.35;transition:opacity 1s}
.bt-status{position:absolute;left:0;right:0;bottom:18px;z-index:2;text-align:center;font-size:12px;letter-spacing:.24em;color:var(--ink-4);margin:0}
.bt-write{position:relative;padding:clamp(48px,8vw,96px) var(--gutter) 120px;max-width:720px}
.bt-card{position:relative;border:1px solid var(--line);border-radius:4px;padding:clamp(24px,4vw,44px);background:linear-gradient(180deg,rgba(10,15,46,.6),rgba(4,6,26,.4))}
.bt-card-title{font-family:var(--font-heading);font-weight:500;font-size:22px;letter-spacing:.2em;margin:0 0 .4em}
.bt-card-sub{color:var(--ink-3);font-size:13px;letter-spacing:.1em;margin:0 0 28px}
.bt-paper{transform-origin:50% 0;transition:transform .9s var(--ease),opacity .9s var(--ease),filter .9s}
.bt-field{display:block;position:relative;margin-bottom:22px}
.bt-field span{display:block;font-size:12px;letter-spacing:.24em;color:var(--ink-3);margin-bottom:8px}
.bt-field input,.bt-field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line-2);color:var(--ink);font:inherit;font-family:var(--font-serif-cn);font-size:15px;line-height:1.9;padding:6px 0;outline:none;resize:vertical;border-radius:0;transition:border-color .5s}
.bt-field textarea{background-image:repeating-linear-gradient(transparent 0 calc(1.9em - 1px),var(--line) calc(1.9em - 1px) 1.9em);background-attachment:local}
.bt-field input:focus,.bt-field textarea:focus{border-bottom-color:var(--amber)}
.bt-field ::placeholder{color:var(--ink-4)}
.bt-count{position:absolute;right:0;bottom:-20px;font-style:normal;font-size:11px;color:var(--ink-4);letter-spacing:.1em}
.bt-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.bt-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:34px;flex-wrap:wrap}
.bt-err{color:var(--amber);font-size:13px;margin:0;min-height:1em}
.bt-throw{background:transparent;cursor:pointer;color:var(--ink)}
.bt-throw:hover{border-color:var(--amber)}
.bt-throw[disabled]{opacity:.5;cursor:wait}
/* sealing sequence */
.bt-card.is-rolling .bt-paper{transform:scaleY(.04) scaleX(.18) translateY(40px);opacity:0;filter:blur(1px)}
.bt-seal{position:absolute;left:50%;top:50%;width:44px;height:84px;margin:-42px 0 0 -22px;color:var(--moon);z-index:5;pointer-events:none}
.bt-seal .bt-scroll{transform-origin:17px 40px;transform:scale(0);transition:transform .6s var(--ease) .1s}
.bt-seal.s1 .bt-scroll{transform:scale(1)}
.bt-seal .bt-cork{transform:translateY(-26px);opacity:0;transition:transform .5s cubic-bezier(.5,0,.3,1.4),opacity .3s}
.bt-seal.s2 .bt-cork{transform:none;opacity:1}
.bt-fly{position:fixed;left:0;top:0;width:34px;height:64px;color:var(--moon);z-index:60;pointer-events:none}
/* modal — 信纸 / paper note */
.bt-modal{border:0;padding:0;background:transparent;width:min(460px,calc(100vw - 36px));max-width:none;max-height:calc(100svh - 48px);margin:auto;color:#1c2333;overflow:visible}
.bt-modal::backdrop{background:radial-gradient(circle at 50% 45%,rgba(4,6,26,.55),rgba(2,3,14,.86));backdrop-filter:blur(2px)}
.bt-letter{--rule:32px;position:relative;max-height:calc(100svh - 48px);display:flex;flex-direction:column;padding:34px 34px 30px 40px;transform:rotate(-1.4deg);transform-origin:50% 8%;
  background:
    linear-gradient(180deg,rgba(90,70,40,.10),transparent 7%,transparent 46%,rgba(90,70,40,.10) 49.6%,rgba(255,255,255,.35) 50.4%,transparent 54%,transparent 93%,rgba(90,70,40,.14)),
    radial-gradient(120% 90% at 50% 40%,transparent 60%,rgba(120,90,50,.16)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .28 0 0 0 0 .18 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    #efe6d2;
  box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 2px 4px rgba(0,0,0,.25),0 18px 40px -8px rgba(0,0,0,.6),0 40px 80px -20px rgba(0,0,0,.5);
  clip-path:polygon(0 0,100% 0,100% 99.2%,97% 99.7%,94.5% 99.4%,90% 100%,86% 99.5%,83% 99.7%,77% 99.1%,73% 99.8%,68% 99.6%,62% 100%,57% 99.3%,53% 99.6%,48% 99.9%,42% 99.4%,38% 99.7%,33% 99.2%,27% 99.9%,22% 99.5%,18% 99.8%,12% 99.3%,8% 99.9%,4% 99.5%,0 99.8%);
  border-radius:2px 2px 0 0;animation:bt-unroll .62s cubic-bezier(.2,.7,.25,1) both}
.bt-letter::before{content:"";position:absolute;left:24px;top:0;bottom:0;width:1px;background:rgba(170,70,60,.22)}
.bt-letter::after{content:"";position:absolute;right:30px;bottom:26px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f6c97c,var(--amber) 55%,#b07a32);box-shadow:0 0 0 2px rgba(240,180,90,.18)}
.bt-letter .kicker{color:rgba(28,35,51,.45);letter-spacing:.36em;font-size:11px;line-height:var(--rule)}
@keyframes bt-unroll{0%{transform:rotate(-4deg) scaleY(.05) scaleX(.82);opacity:0;filter:brightness(.7)}35%{opacity:1}100%{transform:rotate(-1.4deg);opacity:1;filter:none}}
@keyframes bt-roll-up{to{transform:rotate(-3deg) scaleY(.05) scaleX(.85);opacity:0}}
.bt-modal.is-closing .bt-letter{animation:bt-roll-up .32s cubic-bezier(.5,0,.8,.4) both}
.bt-modal.is-closing::backdrop{opacity:0;transition:opacity .32s}
.bt-m-text{flex:1 1 auto;min-height:calc(var(--rule)*4);overflow:auto;overscroll-behavior:contain;font-family:var(--font-serif-cn);font-size:16px;line-height:var(--rule);letter-spacing:.05em;white-space:pre-wrap;word-break:break-word;margin:4px 0 calc(var(--rule)*.5);padding:0 2px;color:#1c2538;
  background:repeating-linear-gradient(180deg,transparent 0 calc(var(--rule) - 1px),rgba(60,80,130,.20) calc(var(--rule) - 1px) var(--rule));background-attachment:local;text-shadow:0 0 .4px rgba(28,37,56,.5)}
.bt-m-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;margin:0 22px 0 0;border:0;padding:0;font-size:12px;letter-spacing:.14em;color:rgba(28,35,51,.5)}
.bt-m-name{font-family:var(--font-serif-cn);font-size:16px;letter-spacing:.12em;color:#1f2a44;font-style:normal;transform:rotate(-2deg);margin-bottom:4px}
.bt-m-sub{display:block}
.bt-close{position:absolute;right:10px;top:8px;width:30px;height:30px;padding:0;background:none;border:0;border-radius:50%;color:rgba(28,35,51,.55);font-size:20px;line-height:30px;cursor:pointer;z-index:2}
.bt-close:hover{color:#1c2538;background:rgba(28,35,51,.06)}
.bt-close:focus{outline:none}.bt-close:focus-visible{outline:1px dashed #1c2538;outline-offset:2px}
@media (max-width:640px){.bt-letter{--rule:30px;padding:28px 22px 26px 32px}.bt-letter::before{left:18px}.bt-m-text{font-size:15px}}
@media (prefers-reduced-motion:reduce){.bt-letter{animation:bt-fade .3s both}.bt-modal.is-closing .bt-letter{animation:bt-fade .2s reverse both}}
@keyframes bt-fade{from{opacity:0}to{opacity:1}}
.bt-extra{margin-top:56px}
@media (max-width:640px){.bt-sea{min-height:520px}.bt-bottle{width:30px;height:56px}}
@media (prefers-reduced-motion:reduce){.bt-paper,.bt-seal *{transition:none!important}}
.bt-letter:focus{outline:none}
/* 1.2.3 — amber cork glows, slow staggered breathing */
.bt-halo{opacity:.3;filter:blur(3px);animation:bt-breathe 3.6s ease-in-out infinite;animation-delay:var(--gd,0s)}
.bt-cap{filter:drop-shadow(0 0 1.5px rgba(240,180,90,.75))}
@keyframes bt-breathe{0%,100%{opacity:.18}50%{opacity:.46}}
@keyframes bt-dot-breathe{0%,100%{box-shadow:0 0 6px 1px rgba(240,180,90,.35)}50%{box-shadow:0 0 11px 3px rgba(240,180,90,.55)}}
@media (prefers-reduced-motion:reduce){.bt-halo{animation:none;opacity:.32}.bt-fab-dot{animation:none!important}}

/* ---- replies (1.2.106) ---- */
.bt-rc{position:absolute;left:50%;top:-14px;transform:translateX(-50%);min-width:14px;font:500 10px/14px var(--font-sans,system-ui);letter-spacing:.04em;color:var(--amber);text-align:center;pointer-events:none;opacity:.85;text-shadow:0 0 6px var(--amber-glow)}
.bt-rc::before{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--amber);vertical-align:middle;margin:0 3px 2px 0}
.bt-letter{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.bt-letter .bt-m-text{flex:0 0 auto;overflow:visible;min-height:calc(var(--rule)*3)}
.bt-replies{position:relative;margin:calc(var(--rule)*.6) 0 0;padding-top:calc(var(--rule)*.5);border-top:1px solid rgba(28,35,51,.16)}
.bt-replies[hidden]{display:none}
.bt-r-list{list-style:none;margin:0;padding:0 2px}
.bt-r-item{padding:8px 0;border-bottom:1px solid rgba(28,35,51,.08)}
.bt-r-item.is-new{animation:bt-fade .5s both}
.bt-r-t{margin:0;font-family:var(--font-serif-cn);font-size:14px;line-height:1.75;letter-spacing:.04em;color:#26304a;white-space:pre-wrap;word-break:break-word;font-style:normal}
.bt-r-m{margin:2px 0 0;font-size:11px;letter-spacing:.12em;color:rgba(28,35,51,.45);text-align:right}
.bt-r-form{margin:10px 0 0;display:flex;flex-direction:column;gap:6px;padding-right:22px}
.bt-r-name,.bt-r-text{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid rgba(28,35,51,.22);background:transparent;color:#1c2538;font-family:var(--font-serif-cn);font-size:14px;line-height:1.7;letter-spacing:.04em;padding:4px 2px;border-radius:0;font-style:normal;resize:none;outline:0}
.bt-r-name{max-width:11em;font-size:12px;letter-spacing:.12em}
.bt-r-text{min-height:2.2em;field-sizing:content;max-height:8em}
.bt-r-name:focus,.bt-r-text:focus{border-bottom-color:var(--amber)}
.bt-r-name::placeholder,.bt-r-text::placeholder{color:rgba(28,35,51,.38);font-style:normal}
.bt-r-row{display:block}
.bt-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bt-r-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.bt-r-msg{font-size:11px;letter-spacing:.1em;color:rgba(28,35,51,.55)}
.bt-r-send{flex:none;border:1px solid rgba(28,35,51,.35);background:transparent;color:#1f2a44;font-family:var(--font-serif-cn);font-size:12px;letter-spacing:.24em;padding:5px 12px 5px 14px;border-radius:999px;cursor:pointer;transition:border-color .3s,color .3s}
.bt-r-send:hover,.bt-r-send:focus-visible{border-color:var(--amber);color:#8a5a1c}
.bt-r-send:disabled{opacity:.5;cursor:default}
@media (max-width:640px){.bt-r-form{padding-right:16px}.bt-r-text{font-size:16px}.bt-r-name{font-size:14px}}
.bt-letter:has(.bt-replies:not([hidden]))::after{display:none}
.bt-r-send::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--amber);box-shadow:0 0 6px var(--amber-glow);vertical-align:middle;margin:0 8px 2px 0}