/* The sea stays in WebGL at z=0; every glass keepsake is a real foreground button. */
#bottles {position:relative;align-items:center;justify-content:center;padding:64px 20px 48px;
  pointer-events:auto;text-align:center;}
#bottles .kicker {align-self:center;margin-bottom:10px;}
#bottles .h2 {font-family:'Songti SC','SimSun',serif;font-size:clamp(29px,7vw,44px);
  font-weight:400;letter-spacing:.07em;line-height:1.3;}
#bottles .lede {max-width:26em;margin:6px 0 14px;color:#476d84;font-size:12.5px;line-height:1.8;letter-spacing:.03em;}
.bottle-categories {display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.bottle-categories button {padding:9px 15px;min-height:40px;border:1px solid rgba(255,255,255,.7);
  border-radius:999px;background:rgba(255,255,255,.22);color:#577990;font-size:12px;
  cursor:pointer;backdrop-filter:blur(16px);transition:background .25s,box-shadow .25s;}
.bottle-categories button[aria-pressed=true] {color:#35576c;background:rgba(255,255,255,.72);
  box-shadow:0 5px 16px #547d9815,inset 0 1px 0 #fff;}
.bottle-categories button small {margin-left:5px;font-family:var(--mono);font-size:9px;opacity:.58;}
.bottle-board {position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px 12px;width:min(650px,100%);isolation:isolate;}
.bottle-pick {display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  position:relative;width:100%;min-width:0;min-height:154px;padding:6px 0 8px;
  border:0;border-radius:22px;background:transparent;color:#31556d;cursor:pointer;
  -webkit-tap-highlight-color:transparent;touch-action:pan-y;}
.bottle-pick[hidden] {display:none;}
.bottle-pick:nth-of-type(7n) {grid-column:2;}
.bottle-portrait {display:block;width:100%;height:112px;object-fit:contain;pointer-events:none;
  animation:bottle-float 6s ease-in-out infinite;animation-delay:var(--float-delay);
  animation-play-state:paused;transition:filter .3s;}
.bottles-in-view .bottle-portrait {animation-play-state:running;}
.bottle-pick:hover .bottle-portrait {filter:brightness(1.07);}
.bottle-pick:focus-visible {outline:2px solid #729eb7;outline-offset:1px;background:#ffffff26;}
.bottle-pick-hint {margin-top:5px;font-size:10px;line-height:1.5;letter-spacing:.1em;color:#627f91;}
.bottle-pick.is-read .bottle-pick-hint {color:#527c92;}
@keyframes bottle-float {0%,100%{transform:translateY(0) rotate(var(--bottle-lean));}
  50%{transform:translateY(-5px) rotate(calc(var(--bottle-lean) + 1deg));}}
.bottle-reader {position:fixed;inset:0;z-index:400;display:grid;place-items:center;padding:24px 18px;
  background:rgba(135,173,195,.36);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}
.bottle-reader[hidden] {display:none;}
.bottle-note {position:relative;width:min(430px,100%);max-height:86svh;overflow-y:auto;overscroll-behavior:contain;
  border:1px solid rgba(255,255,255,.92);border-radius:28px;padding:23px 27px 25px;
  background:#fffef8 url('ceremony/letter-paper.png') center/cover;
  box-shadow:0 25px 80px #446a8233,inset 0 1px 0 #fff;color:#3b5a6b;text-align:center;
  animation:bottle-note-arrive .5s cubic-bezier(.2,.65,.2,1) both;}
.bottle-note-image {width:72px;height:108px;object-fit:contain;display:block;margin:0 auto 8px;pointer-events:none;}
.bottle-note-category {margin:0 0 13px;font-family:var(--mono);font-size:9px;line-height:1.6;letter-spacing:.05em;color:#73909e;}
.bottle-note h3 {margin:0 0 22px;font-family:'Songti SC','SimSun',serif;font-weight:400;
  font-size:25px;line-height:1.4;letter-spacing:.05em;color:#36556a;}
.bottle-message {text-align:left;font-family:'Songti SC','SimSun',serif;font-size:16px;line-height:1.95;letter-spacing:.025em;}
.bottle-message p {margin:0 0 15px;}
.bottle-signature {text-align:right;margin:19px 0 22px;font-size:11px;letter-spacing:.04em;color:#77909d;}
.bottle-close {width:100%;min-height:46px;padding:11px 17px;border:1px solid #d0e0e5;border-radius:999px;
  background:rgba(219,237,244,.64);font-size:13px;letter-spacing:.1em;color:#466c83;cursor:pointer;}
@keyframes bottle-note-arrive {from{opacity:0;transform:translateY(16px) scale(.97);}to{opacity:1;transform:none;}}
@media(min-width:768px){.bottle-portrait{height:165px;}.bottle-pick{min-height:210px;}}
@media(max-width:360px){#bottles{padding-left:14px;padding-right:14px;}.bottle-board{gap:6px;}
  .bottle-portrait{height:110px;}.bottle-pick{min-height:154px;}
  .bottle-note{padding:20px;}.bottle-message{font-size:15px;}}
@media(prefers-reduced-motion:reduce){.bottle-portrait,.bottle-note{animation:none;}.bottle-categories button{transition:none;}}