/* Typography compliance terms: Inter against the ornamental Garamond creates the core typographic tension: clinical observation meets baroque display. Inter" (Google Fonts Interaction:** On mouse movement IntersectionObserver for scroll-triggered cell reveals (threshold: 0.15 IntersectionObserver. Space Mono in electric cyan Space Mono" (Google Fonts */
:root{--abyss:#060d1a;--deep:#0a1e3d;--twilight:#143a5e;--cyan:#00e5ff;--green:#7dffc4;--gold:#ffd166;--foam:#d4eaf7;--pink:#ff6b8a;--surface:#e8f4fd;--muted:#8ab4c8;--ink:#0a1628;--title:#c8f0ff;--gap:10px;--elastic:cubic-bezier(.68,-.55,.27,1.55)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;overflow-x:hidden;background:var(--abyss);color:var(--foam);font-family:Inter,system-ui,sans-serif;letter-spacing:.01em;background-image:radial-gradient(circle at 20% 0%,rgba(0,229,255,.16),transparent 28rem),radial-gradient(circle at 82% 26%,rgba(125,255,196,.09),transparent 34rem),linear-gradient(180deg,#0a1e3d 0%,#060d1a 42%,#02050b 100%)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(212,234,247,.025) 0 1px,transparent 1px 9vw),repeating-linear-gradient(0deg,rgba(0,229,255,.018) 0 1px,transparent 1px 12vh);mix-blend-mode:screen;z-index:1}.particle-field{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}.particle{position:absolute;width:var(--s);height:var(--s);left:var(--x);top:var(--y);border-radius:50%;background:var(--c);box-shadow:0 0 16px var(--c);opacity:.45;animation:drift var(--d) var(--elastic) infinite alternate}.sonar-depth-indicator{position:fixed;right:18px;top:4vh;width:28px;height:92vh;z-index:20;border-right:2px solid rgba(0,229,255,.32)}#depthPing{position:absolute;right:-7px;top:0;width:12px;height:12px;border:2px solid var(--cyan);border-radius:50%;box-shadow:0 0 0 8px rgba(0,229,255,.08),0 0 28px var(--cyan);transition:top .55s var(--elastic)}#depthReadout{position:absolute;right:18px;top:0;font-family:"Space Mono",monospace;font-size:.72rem;color:var(--green);writing-mode:vertical-rl;text-shadow:0 0 18px rgba(125,255,196,.65);transition:top .55s var(--elastic)}
.depth-zone{position:relative;min-height:100vh;padding:7vw 6vw;z-index:3}.surface-zone{display:grid;place-items:center;min-height:112vh}.surface-vitrine{width:min(1180px,88vw);min-height:68vh;padding:clamp(2rem,5vw,5rem);background:linear-gradient(135deg,rgba(232,244,253,.88),rgba(212,234,247,.18) 42%,rgba(10,30,61,.58));color:var(--ink);border-color:rgba(232,244,253,.7)}.hero-title{font-family:"Cormorant Garamond",serif;font-size:clamp(3rem,10vw,9rem);line-height:.82;margin:.1em 0;color:var(--ink);text-shadow:0 0 42px rgba(0,229,255,.35);letter-spacing:-.06em}.hero-title span{color:var(--cyan)}.hero-title i{color:var(--twilight)}.hero-subtitle{max-width:760px;font-size:clamp(1rem,1.7vw,1.35rem);line-height:1.65;color:#0a1e3d}.zone-title,.abyssal-text{font-family:"Cormorant Garamond",serif;font-size:clamp(1.8rem,4vw,4rem);font-style:italic;color:var(--title);font-weight:700;margin:0 0 3rem;text-shadow:0 0 32px rgba(0,229,255,.45)}
.specimen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-auto-rows:minmax(150px,auto);gap:var(--gap);transition:gap .45s var(--elastic);perspective:1000px}.twilight-grid{grid-auto-rows:190px}.midnight-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));grid-auto-rows:150px}.specimen-cell{position:relative;overflow:hidden;min-height:170px;padding:1.25rem;border:1px solid rgba(212,234,247,.18);background:linear-gradient(145deg,rgba(20,58,94,.8),rgba(10,30,61,.86));box-shadow:inset 0 0 32px rgba(0,229,255,.06),0 18px 55px rgba(0,0,0,.35);isolation:isolate;transition:transform .65s var(--elastic),box-shadow .65s var(--elastic),filter .65s var(--elastic)}.specimen-cell:before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 12% 26%,rgba(0,229,255,.04),transparent 22%),radial-gradient(circle at 72% 66%,rgba(125,255,196,.03),transparent 18%),radial-gradient(circle at 50% 6%,rgba(212,234,247,.05),transparent 20%);mix-blend-mode:overlay;animation:caustic-shift 9s var(--elastic) infinite alternate;z-index:-2}.specimen-cell:after{content:"";position:absolute;inset:auto 0 0;height:8px;background:linear-gradient(90deg,transparent,rgba(255,209,102,.25),transparent);background-size:200% 100%;opacity:.35;animation:vent-flow 5s var(--elastic) infinite;z-index:-1}.specimen-cell h3{font-family:"Cormorant Garamond",serif;font-size:clamp(1.45rem,2.5vw,2.65rem);line-height:.95;margin:.3rem 0 .55rem;color:var(--title);font-weight:700}.specimen-cell p{font-size:clamp(.875rem,1.2vw,1.1rem);line-height:1.65;color:var(--muted);max-width:38rem}.catalogue-mark{font-family:"Space Mono",monospace;font-size:.68rem;color:var(--green);text-transform:uppercase;letter-spacing:.12em;text-shadow:0 0 12px rgba(125,255,196,.55)}.wide{grid-column:span 2}.tall{grid-row:span 2}.big{grid-column:span 2;grid-row:span 2}.slim{grid-row:span 1}.featured{background:linear-gradient(145deg,rgba(20,58,94,.92),rgba(6,13,26,.92));border-color:rgba(255,209,102,.26)}.gold h3{color:var(--gold)}.portal{cursor:pointer;box-shadow:inset 0 0 32px rgba(0,229,255,.08),0 0 0 2px rgba(0,229,255,.16),0 0 0 10px rgba(0,229,255,.04)}
.specimen-grid:hover .specimen-cell:not(:hover){transform:scale(.97);filter:saturate(.82) brightness(.86)}.specimen-cell:hover{transform:scale(1.04) translateZ(20px);z-index:8;box-shadow:0 0 0 2px rgba(0,229,255,.3),0 0 0 6px rgba(0,229,255,.15),0 0 0 12px rgba(0,229,255,.05),0 30px 90px rgba(0,229,255,.14)}.reveal{opacity:0;transform:translateY(60px) scale(.85)}.reveal.visible{opacity:1;transform:translateY(0) scale(1);transition:opacity .8s var(--elastic),transform .8s var(--elastic),box-shadow .65s var(--elastic),filter .65s var(--elastic)}.bid-bubble{display:inline-grid;place-items:center;min-width:116px;min-height:116px;padding:1rem;margin-top:.6rem;border-radius:50%;border:1px solid rgba(0,229,255,.32);background:radial-gradient(circle at 36% 25%,rgba(232,244,253,.2),rgba(0,229,255,.08) 38%,rgba(10,30,61,.36));color:var(--cyan);box-shadow:inset 0 0 28px rgba(0,229,255,.14),0 0 28px rgba(0,229,255,.18);transition:transform .55s var(--elastic)}.bid-bubble:hover{transform:scale(1.15)}.bid-bubble .counter{font-family:"Space Mono",monospace;font-size:clamp(1.2rem,2.5vw,2.4rem);color:var(--cyan);text-shadow:0 0 20px rgba(0,200,255,.6)}.bid-bubble small{font-size:.65rem;color:var(--muted);text-transform:uppercase}.bid-bubble.pink{border-color:rgba(255,107,138,.42)}.bid-bubble.pink .counter{color:var(--pink)}.bubble-cluster,.bubble-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.bubble-cluster circle{fill:none;stroke:rgba(0,229,255,.18);stroke-width:1.2;animation:bubble-rise 7s var(--elastic) infinite}.bubble-svg:before,.bubble-svg:after{content:"";position:absolute;border:1px solid rgba(0,229,255,.16);border-radius:50%;animation:bubble-rise 6s var(--elastic) infinite}.bubble-svg:before{width:38px;height:38px;left:18%;bottom:-40px}.bubble-svg:after{width:16px;height:16px;right:22%;bottom:-20px;animation-duration:4s}.cursor-bubble{position:fixed;width:10px;height:10px;border:1px solid rgba(0,229,255,.42);border-radius:50%;pointer-events:none;z-index:30;animation:cursor-rise 1.3s var(--elastic) forwards}.abyssal-zone{display:grid;place-items:center;text-align:center;min-height:120vh;background:radial-gradient(circle at 50% 45%,rgba(0,229,255,.08),transparent 28rem)}.abyssal-text{font-size:clamp(3rem,8vw,8rem);max-width:980px;margin:auto}.abyssal-subtext{max-width:800px;color:var(--muted);line-height:1.8}.bioluminescent-fade{display:flex;flex-wrap:wrap;gap:1.3rem;justify-content:center}.bioluminescent-fade span{font-family:"Space Mono",monospace;color:var(--green);text-shadow:0 0 20px rgba(125,255,196,.75);animation:drift 4s var(--elastic) infinite alternate}
@keyframes caustic-shift{to{transform:translate3d(8%,-6%,0) rotate(8deg)}}@keyframes bubble-rise{0%{transform:translateY(30%) translateX(0) scale(.65);opacity:0}22%{opacity:.95}70%{transform:translateY(-42%) translateX(18px) scale(1.08)}100%{transform:translateY(-110%) translateX(-10px) scale(.82);opacity:0}}@keyframes drift{to{transform:translate3d(18px,-30px,0) scale(1.2);opacity:.8}}@keyframes vent-flow{to{background-position:200% 0}}@keyframes cursor-rise{to{transform:translateY(-48px) translateX(14px) scale(1.7);opacity:0}}
@media(max-width:760px){.depth-zone{padding:5rem 1rem}.wide,.big{grid-column:span 1}.tall,.big{grid-row:span 1}.sonar-depth-indicator{right:8px}.surface-vitrine{width:94vw}.specimen-grid{grid-template-columns:1fr}}