*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:#000;color:#D9E8FC;font:400 14px Inter,sans-serif}button,a{font:inherit;color:inherit}a{text-decoration:none}button{cursor:pointer}#topbar{height:80px;position:fixed;z-index:30;top:0;left:0;right:0;display:flex;align-items:center;gap:34px;padding:0 3.3%;background:linear-gradient(#000 70%,transparent)}.logo{width:225px;max-width:21vw}nav{display:flex;gap:26px}nav a,.account a{font:500 14px Unbounded,sans-serif}.account{margin-left:auto;display:flex;align-items:center;gap:16px}.account a{border:1px solid #394550;border-radius:40px;padding:8px 16px}.account a.filled,.filled{background:#D9E8FC;color:#080b11;border:0}.account a:hover,.filled:hover{background:#4dcaf3;color:#080b11}#viewport{position:fixed;inset:0;z-index:0;pointer-events:none}#viewport canvas{display:block;width:100%;height:100%}#scroll-track{position:relative;z-index:2;pointer-events:none}#scroll-track>*{pointer-events:none}#hero{height:100vh;min-height:670px;display:flex;justify-content:center;align-items:flex-start;text-align:center}.hero-center{position:relative;padding-top:clamp(115px,17vh,160px);width:100%;isolation:isolate}.hero-avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;display:block;margin:auto auto 25px}h1{font:500 clamp(36px,6.2vw,96px)/1.15 Unbounded,sans-serif;letter-spacing:-.05em;-webkit-text-stroke:1.5px var(--op-ink);color:transparent;margin:20px auto 38px;max-width:1200px;position:relative;z-index:2}#hero-count{font:400 336px/.8 Splash,cursive;color:#79004d;position:absolute;top:clamp(170px,22vh,225px);left:50%;transform:translateX(-50%) rotate(-10deg);z-index:1;opacity:.95;white-space:nowrap}#explore{position:relative;z-index:3;width:216px;height:56px;border-radius:60px;font:500 28px Unbounded,sans-serif;pointer-events:auto}#room-scroll{height:180vh;min-height:1000px}#next-section{height:65vh;min-height:460px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative}#next-section>span{font:500 14px Unbounded}#next-title{font:500 clamp(38px,5.7vw,90px)/1.1 Unbounded;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px var(--op-ink);max-width:1100px;margin:45px 0}#next-room{width:68px;height:68px;border-radius:50%;border:1px solid #394550;background:#050505;color:#D9E8FC;font-size:30px;pointer-events:auto}#next-room:hover{border-color:var(--op-ink)}.next-author{position:absolute;right:3.3%;bottom:45px;display:flex;flex-direction:column;gap:8px;align-items:center}.next-author img{width:48px;height:48px;object-fit:cover;border-radius:50%}#footer{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 3.3%;font:200 14px Unbounded,sans-serif;background:#090909}#footer>div{display:flex;gap:25px;flex-wrap:wrap}#footer>div:first-child{color:#606a78}#footer a{pointer-events:auto}#footer a:hover{color:#4dcaf3}#collection-like{position:fixed;z-index:25;right:3.3%;top:128px;width:68px;height:68px;border:1px solid #394550;border-radius:50%;background:#050505;color:#D9E8FC;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px}#collection-like img{width:24px;height:24px}#collection-like span{font:400 14px Unbounded}#collection-like[aria-pressed=true]{border-color:#D9E8FC}#sticky-author{position:fixed;z-index:20;right:3.3%;bottom:calc(9% + 100px);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transition:opacity .3s;pointer-events:none}#sticky-author.visible{opacity:1}#sticky-author img{width:48px;height:48px;object-fit:cover;border-radius:50%}#sticky-author span{font:500 14px Inter}#game-modal[hidden],#error[hidden]{display:none}#game-modal{position:fixed;z-index:60;inset:0;display:flex;align-items:center;justify-content:center}.modal-shade{position:absolute;inset:0;background:#000a}.modal-card{position:relative;width:min(600px,90vw);padding:48px;background:linear-gradient(135deg,#222735,#0d0f18);border-radius:12px;pointer-events:auto}.modal-card h2{font:500 22px Unbounded}.modal-card p{line-height:1.7;font-size:18px}#modal-close{position:absolute;right:20px;top:15px;background:transparent;border:0;font-size:30px}#error{position:fixed;z-index:50;bottom:20px;left:20px;padding:18px;border-radius:10px;background:#331c25;color:#D9E8FC}@media(max-width:800px){#topbar{gap:12px;padding:0 15px}.logo{width:145px}.account a{font-size:12px;padding:8px}nav{display:none}#footer{font-size:12px}.hero-center{padding-top:140px}#hero-count{font-size:220px}#room-scroll{height:140vh}}
/* Shared visual tokens and reliable outlined typography. The black fill covers internal glyph strokes. */
h1,#next-title{color:transparent;paint-order:stroke fill;-webkit-text-stroke:2px var(--op-ink);text-shadow:none;background:transparent}
#viewport{pointer-events:auto}#viewport canvas{touch-action:pan-y}
#game-modal .modal-card{width:min(560px,48vw);margin-left:36vw;max-height:75vh;overflow:auto}
#game-modal{pointer-events:none}#game-modal .modal-card,#game-modal .modal-shade{pointer-events:auto}
#game-modal .modal-shade{background:rgba(0,0,0,.48)}
#modal-close{color:var(--op-ink)}
#modal-title{font-size:20px}
#modal-notes{white-space:pre-wrap}
#game-modal .modal-card p{font-size:18px}
#collection-like img{filter:none}

/* v1.2.69 — the public page uses the actual Shelf Editor scene. */
#viewport{width:100%;height:100%;border:0}
#hero,#next-section{pointer-events:none}
#explore,#next-room{pointer-events:auto}
#next-section[hidden]{display:none!important}
:root{--op-ink:#D9E8FC;--op-hover:#4DCAF3}

/* v1.2.72 — outlined lettering is drawn with an SVG silhouette difference,
   not text-stroke. This avoids the intersecting glyph contours. */
h1#collection-title,#next-title{font-size:0!important;-webkit-text-stroke:0!important;color:transparent!important;letter-spacing:0;line-height:1;margin-left:auto;margin-right:auto;width:min(94vw,1200px)}
h1#collection-title{height:clamp(72px,9vw,130px)}
#next-title{height:clamp(100px,15vw,220px)}
.op-outline-svg{display:block;width:100%;height:100%;overflow:visible}
/* Public scrolling begins moving the shelves during the opening section. */
#room-scroll{min-height:60vh}

/* v1.2.73 — avatar is the foremost element in the hero composition. */
.hero-avatar{position:relative;z-index:5}
#collection-title{position:relative;z-index:2}

/* v1.2.78 — local camera tuning overlay, separate from the public design */
#camera-tuner{position:fixed;z-index:99999;left:18px;bottom:18px;width:288px;max-width:calc(100vw - 36px);padding:16px;background:#111820ee;color:#D9E8FC;border:1px solid #596675;border-radius:12px;box-shadow:0 12px 38px #0009;font:14px Inter,sans-serif;backdrop-filter:blur(12px)}
#camera-tuner[hidden]{display:none!important}
#camera-tuner .tuner-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
#camera-tuner .tuner-head strong{font-weight:600}
#camera-tuner button{cursor:pointer;border:1px solid #596675;border-radius:7px;padding:6px 10px;background:transparent;color:#D9E8FC;font:inherit}
#camera-tuner button:not(:disabled):hover{border-color:#D9E8FC}
#camera-tuner label{display:block;margin:12px 0 18px;font-size:12px}
#camera-tuner output{float:right;font-variant-numeric:tabular-nums;font-size:14px}
#camera-tuner input[type=range]{display:block;width:100%;margin:12px 0 0;accent-color:#4DCAF3;cursor:pointer}
#camera-tuner .tuner-actions{display:flex;gap:8px;margin-top:10px}
#camera-tuner small{display:block;line-height:1.4;margin-top:12px;opacity:.65;font-size:12px}
#camera-tuner.collapsed #tuner-fields{display:none}
#camera-tuner.collapsed .tuner-head{margin-bottom:0}

/* Public inspection overlay: hide collection-level like while a game is inspected. */
#collection-like.inspection-hidden{display:none!important}
.hero-center{will-change:transform}

/* v1.2.82 — shared public shell states, no per-button hover patches. */
#topbar{background:transparent}
#topbar nav a:hover,#topbar .account a:not(.filled):hover{color:var(--op-hover);background:transparent;border-color:var(--op-hover)}
#topbar nav a{transition:color .15s ease}
#collection-like{transition:border-color .15s ease,background-color .15s ease}
#collection-like:hover{border-color:var(--op-hover);background:var(--op-hover)}
#collection-like:hover img{filter:brightness(0) saturate(100%)}
#collection-like:hover span{color:#080b11}
#next-section{isolation:isolate}
#next-title{position:relative;z-index:2}
#next-count{position:absolute;z-index:1;top:38%;left:50%;transform:translate(-50%,-50%) rotate(-10deg);font:400 336px/.8 Splash,cursive;color:#79004D;white-space:nowrap;pointer-events:none}
#next-section>span:first-child,#next-room{position:relative;z-index:3}
/* The 3D inspection UI belongs above the collection introduction. */
body.op-inspecting #hero,body.op-inspecting #next-section{visibility:hidden}
body.op-inspecting #sticky-author{opacity:0!important}
body.op-inspecting #scroll-track{pointer-events:none}
@media(max-width:800px){#next-count{font-size:220px}}

/* v1.2.84: Shared navigation, matching editor 14px typography and outlined action hover. */
#topbar nav a{font:500 14px Unbounded,sans-serif;color:var(--op-ink)}
#topbar nav a:hover{color:var(--op-hover)}
#collection-like:hover{background:transparent;border-color:var(--op-ink)}
#collection-like:hover img{filter:none}
#collection-like:hover span{color:var(--op-ink)}
/* The generic Next room label must not override the Splash count typography. */
#next-section > #next-count{position:absolute;z-index:1;top:38%;left:50%;transform:translate(-50%,-50%) rotate(-10deg);font-family:Splash,cursive;font-weight:400;font-size:336px;line-height:.8;color:#79004D;white-space:nowrap;pointer-events:none}
@media(max-width:800px){#next-section > #next-count{font-size:220px}}

/* v1.2.85 — transparent surfaces: the shared room is always visible behind UI. */
#footer{background:transparent!important;background-color:transparent!important}
#next-room,#collection-like{background:transparent!important;background-color:transparent!important}
#next-room:hover,#collection-like:hover{background:transparent!important;background-color:transparent!important;border-color:var(--op-ink)!important}
#next-room{display:flex;align-items:center;justify-content:center;padding:0}
#next-room img{display:block;width:24px;height:24px;transform:rotate(90deg);pointer-events:none;filter:brightness(0) saturate(100%) invert(89%) sepia(13%) saturate(419%) hue-rotate(181deg) brightness(102%) contrast(101%)}

/* v1.2.86 — developer tuner can be dismissed completely and reopened. */
#tuner-open{position:fixed;z-index:99999;bottom:18px;left:18px;padding:9px 13px;border-radius:9px;background:#111820ee;border:1px solid #596675;color:#D9E8FC;font:500 12px Inter,sans-serif;cursor:pointer}
#tuner-open[hidden]{display:none!important}
#tuner-open:hover{border-color:#D9E8FC}
/* Report icon: outer ring 20px diameter, inner ring 10px diameter. */
#footer .op-report-icon{position:relative;display:inline-block;flex:none;width:20px;height:20px;border:1px solid currentColor;border-radius:50%;vertical-align:middle;margin-right:10px}
#footer .op-report-icon:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;border:1px solid currentColor;border-radius:50%}
#footer a:has(.op-report-icon){display:inline-flex;align-items:center}

/* v1.2.88 — Explore becomes an outlined button after first use. */
#explore.op-explored,
#explore.op-explored:focus-visible{
  background:transparent;
  background-color:transparent;
  color:#D9E8FC;
  border:1px solid #394550;
}
#explore.op-explored:hover{
  background:transparent;
  background-color:transparent;
  color:#D9E8FC;
  border-color:#D9E8FC;
}

/* v1.2.95 — the original hero is replaced by its dimmed copy in the
   inspection iframe. It must not cover the foreground 3D canvas. */
body.op-inspecting #hero,body.op-inspecting #next-section{visibility:visible!important;opacity:0!important}

#sticky-author{cursor:pointer;pointer-events:auto!important;text-decoration:none!important}
#sticky-author img{outline:1px solid transparent;outline-offset:4px;transition:outline-color .22s ease}
#sticky-author:hover img{outline-color:#D9E8FC}
#sticky-author span{text-decoration:none!important}

#camera-tuner,#tuner-open{display:none!important}

/* Public collection author is a real navigation link, not a decorative overlay. */
#sticky-author{pointer-events:none!important}
#sticky-author.visible{pointer-events:auto!important}