:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--night-0:#02060d;--night-1:#06101f;--night-2:#0a1830;--mint:#9eeea9;--moon:#d9e8ff;--warm:#ffd875;--danger:#ff8c91}*{box-sizing:border-box}html,body{background:var(--night-0);width:100%;height:100%;margin:0;overflow:hidden}body{color:#f4f7f1;overscroll-behavior:none;font-family:Microsoft YaHei UI,PingFang SC,Noto Sans CJK SC,sans-serif}button,a{font:inherit}.door-world-root{--reveal-frame:0;--reveal-cover:0;--reveal-title:0;--reveal-data:0;--intro-opacity:1;--sample-opacity:1;--sample-detail:1;isolation:isolate;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;cursor:grab;background:radial-gradient(ellipse at 50% 44%, #5378a529 0%, #10234114 30%, transparent 60%), linear-gradient(180deg, var(--night-2) 0%, var(--night-1) 42%, var(--night-0) 100%);outline:none;position:fixed;inset:0;overflow:hidden}.door-world-root:active{cursor:grabbing}.door-world-root:before{content:"";z-index:-1;pointer-events:none;opacity:.42;background-image:radial-gradient(circle at 17% 27%,#d2e6ff8c 0 1px,#0000 1.4px),radial-gradient(circle at 72% 16%,#d2e6ff61 0 1px,#0000 1.5px),radial-gradient(circle at 82% 61%,#9eeea938 0 1px,#0000 1.6px);background-size:210px 190px,270px 230px,330px 270px;animation:42s linear infinite alternate sky-drift;position:absolute;inset:-20%}.night-canvas{z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.moon-haze{aspect-ratio:1;z-index:0;pointer-events:none;filter:blur(7px);background:radial-gradient(circle,#c2dcff33 0%,#618fcd17 32%,#0000 69%);border-radius:50%;width:min(72vw,880px);position:absolute;top:44%;left:50%;translate:-50% -50%}.ground-mist{z-index:1;pointer-events:none;opacity:.36;filter:blur(18px);background:radial-gradient(at 34% 56%,#9db9d329,#0000 51%),radial-gradient(at 68% 68%,#6e9ab824,#0000 48%);height:34%;animation:34s ease-in-out infinite alternate mist-drift;position:absolute;bottom:-8%;left:-15%;right:-15%}.brand-layer{z-index:4;pointer-events:none;position:absolute;inset:0;opacity:var(--intro-opacity)!important}.brand-layer h1{top:max(5.5vh, env(safe-area-inset-top));color:#f7f9f1f5;letter-spacing:.12em;text-shadow:0 0 30px #b0dcff2e,0 3px #00000075;white-space:nowrap;margin:0;font-family:STKaiti,KaiTi,FZKai-Z03,serif;font-size:clamp(29px,4.1vw,58px);font-weight:700;position:absolute;left:50%;translate:-50%}.brand-layer p{bottom:max(4.8vh, env(safe-area-inset-bottom));color:#e5eef5b8;letter-spacing:.36em;white-space:nowrap;margin:0;font-size:clamp(12px,1.2vw,15px);animation:3.6s ease-in-out infinite hint-breathe;position:absolute;left:50%;translate:-50%}.door-world{z-index:2;transform-origin:0 0;will-change:transform;contain:layout style;filter:drop-shadow(0 0 10px #b0e4ff29)drop-shadow(0 18px 35px #00000075);position:absolute;top:0;left:0}.pixel-door{perspective:none;transform-style:flat;contain:layout style;outline:none;position:absolute}.pixel-door.is-opening{z-index:10;perspective:190px;transform-style:preserve-3d}.sample-detail,.sample-surface,.door-frame,.door-panel,.cover-fallback{border-radius:calc(2px + var(--reveal-frame) * 3px);position:absolute;inset:0}.sample-surface{z-index:1;opacity:var(--sample-opacity);box-shadow:inset 0 0 0 calc(var(--reveal-frame) * 1.2px) rgba(3, 8, 14, calc(var(--reveal-frame) * .72))}.sample-detail{z-index:0;opacity:var(--sample-detail);image-rendering:auto;pointer-events:none;border-radius:0;inset:-2px}.door-frame{z-index:2;pointer-events:none;opacity:var(--reveal-frame);border:calc(.7px + var(--reveal-frame) * 1.1px) solid #0f1b23eb;box-shadow:inset 0 0 0 1px #bce5cf38, inset -3px 0 6px #0000005c, 0 0 calc(2px + var(--reveal-frame) * 7px) rgba(142, 225, 172, calc(var(--reveal-frame) * .18))}.door-frame:after{content:"";width:3px;height:3px;opacity:var(--reveal-frame);background:#e7d59b;border-radius:50%;position:absolute;top:50%;right:7px;box-shadow:0 0 4px #ffe189b8}.door-panel{z-index:3;color:#fff;transform-origin:0;backface-visibility:hidden;background:rgba(5, 13, 22, calc(var(--reveal-cover) * .82));pointer-events:none;outline:none;text-decoration:none;overflow:hidden;transform:rotateY(0)}.door-panel.is-interactive{pointer-events:auto}.door-panel:after{content:"";z-index:2;opacity:var(--reveal-cover);pointer-events:none;background:linear-gradient(#03090f0d 34%,#03080dd1 77%,#02060af5 100%);position:absolute;inset:0}.door-panel.is-opening{z-index:8;filter:brightness(1.18);transition:transform .56s cubic-bezier(.22,.72,.21,1),filter .56s;transform:rotateY(-86deg)}.door-panel:focus-visible{box-shadow:inset 0 0 0 2px var(--warm), 0 0 0 2px #06111d, 0 0 15px #ffd87599}.door-panel img,.cover-fallback{z-index:1;object-fit:cover;opacity:0;pointer-events:none;width:100%;height:100%;transition:opacity .26s}.door-panel img[data-loaded=true]{opacity:var(--reveal-cover)}.cover-fallback{color:#f5fbf4d6;letter-spacing:.05em;background:radial-gradient(circle at 72% 24%,#9eeea947,#0000 34%),linear-gradient(145deg,#122639,#07101d);place-items:center;font-size:20px;font-weight:800;display:grid}.cover-fallback.is-visible{opacity:var(--reveal-cover)}.rank-chip{z-index:4;opacity:var(--reveal-title);color:#07101a;letter-spacing:-.04em;background:#ffda75f0;border-radius:2px;padding:2px 4px;font:800 7px/1 ui-monospace,Cascadia Mono,monospace;position:absolute;top:5px;left:5px}.door-copy{z-index:4;pointer-events:none;min-width:0;position:absolute;inset:auto 6px 22px}.door-copy h2{color:#f8faf3;opacity:var(--reveal-title);letter-spacing:-.02em;text-shadow:0 1px 3px #000000e0;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 3px;font-size:8.5px;font-weight:800;line-height:1.18;display:-webkit-box;overflow:hidden}.score-line{opacity:var(--reveal-data);white-space:nowrap;align-items:baseline;gap:4px;display:flex}.score-line strong{color:var(--warm);font:800 7.5px/1 ui-monospace,Cascadia Mono,monospace}.score-line span{color:#ebf2f1c2;text-overflow:ellipsis;font-size:5.6px;overflow:hidden}.badge-row{min-width:0;opacity:var(--reveal-data);gap:2px;margin-top:3px;display:flex}.badge-row span{color:#d9f5df;text-overflow:ellipsis;white-space:nowrap;background:#061c16b8;border:1px solid #9eeea959;border-radius:2px;max-width:31%;padding:1.5px 2px;font-size:4.7px;line-height:1;overflow:hidden}.vote-area{z-index:8;height:14px;opacity:var(--reveal-data);pointer-events:none;position:absolute;bottom:5px;left:6px;right:6px;transform:translateZ(10px)}.door-world-root[data-interactive=true] .vote-area{pointer-events:auto}.vote-buttons{gap:4px;height:100%;display:flex}.vote-buttons button{color:#f2f7f5d1;cursor:pointer;background:#030b12bd;border:1px solid #d2e6e42e;border-radius:3px;flex:1;justify-content:center;align-items:center;gap:2px;min-width:0;padding:0 2px;font-size:5px;line-height:1;display:flex}.vote-buttons button strong{font:700 5.4px/1 ui-monospace,Cascadia Mono,monospace}.vote-buttons button[aria-pressed=true]:first-child{color:var(--mint);background:#194831c7;border-color:#9eeea9b8}.vote-buttons button[aria-pressed=true]:last-child{color:#ffb0b3;background:#4c1920c7;border-color:#ff8c91a3}.vote-buttons button:focus-visible{outline:1px solid var(--warm);outline-offset:1px}.vote-buttons button:disabled{cursor:wait;opacity:.58}.vote-error{color:#ffd2d2;text-align:center;text-overflow:ellipsis;white-space:nowrap;font-size:4.8px;line-height:1;position:absolute;bottom:-9px;left:0;right:0;overflow:hidden}.fatal-state{text-align:center;background:radial-gradient(circle,#10233c,#030812 68%);place-content:center;gap:14px;width:100%;height:100%;display:grid}.fatal-state h1{margin:0;font-family:STKaiti,KaiTi,serif}.fatal-state p{color:#b9c6d4;margin:0}.fatal-state button{color:#fff;background:#10223a;border:1px solid #58708d;border-radius:6px;justify-self:center;padding:8px 16px}.sr-only{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@keyframes hint-breathe{0%,to{opacity:.55;translate:-50%}50%{opacity:.94;translate:-50% -4px}}@keyframes sky-drift{0%{transform:translate(-1%,-.5%)}to{transform:translate(2%,1.5%)}}@keyframes mist-drift{0%{transform:translate(-2%)scaleX(1.02)}to{transform:translate(3%,-2%)scaleX(.98)}}@media (max-width:600px){.brand-layer h1{top:max(6.5vh, calc(env(safe-area-inset-top) + 18px));letter-spacing:.09em}.brand-layer p{bottom:max(5vh, calc(env(safe-area-inset-bottom) + 14px))}.moon-haze{width:128vw;top:43%}.ground-mist{height:29%}}@media (prefers-reduced-motion:reduce){.door-world-root:before,.ground-mist,.brand-layer p{animation:none}.door-panel,.door-panel img,.cover-fallback{transition:none}}
