:root{--ink:#eef3fb;--ink-2:#b9c4d6;--ink-3:#7e8aa0;--glass:#0a0e189e;--glass-strong:#090c14d1;--line:#ffffff24;--accent:#7cc4ff;--accent-2:#ffcf7a;--gutter:24px;--ruler-w:88px;--mono:"JetBrains Mono", ui-monospace, monospace;--sans:"Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", sans-serif;--serif:"Fraunces", Georgia, serif}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;background:#000;overflow:hidden}body{touch-action:none;-webkit-user-select:none;user-select:none}sup{vertical-align:.5em;font-size:.62em;line-height:0}#gl{cursor:grab;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#gl:active{cursor:grabbing}#vignette{pointer-events:none;background:radial-gradient(#0000 55%,#00000061 100%);position:fixed;inset:0}#brand{top:var(--gutter);left:var(--gutter);pointer-events:none;position:fixed}.brand-mark{font-family:var(--mono);letter-spacing:.32em;color:var(--ink);font-size:12px;font-weight:600}.brand-sub{color:var(--ink-3);margin-top:4px;font-size:12px}#readout{top:calc(var(--gutter) - 4px);text-align:center;pointer-events:none;text-shadow:0 1px 12px #0009;position:fixed;left:50%;transform:translate(-50%)}.ro-label{color:var(--ink-3);letter-spacing:.08em;font-size:11px}.ro-label span{font-family:var(--mono);text-transform:uppercase;margin-left:4px;font-size:10px}.ro-sci{font-family:var(--mono);font-variant-numeric:tabular-nums;margin-top:2px;font-size:26px;font-weight:600}.ro-human{color:var(--ink-2);font-variant-numeric:tabular-nums;margin-top:1px;font-size:13px}#ruler{width:var(--ruler-w);position:fixed;top:84px;bottom:96px;right:0}.ruler-track{border-right:1px solid var(--line);cursor:pointer;position:absolute;inset:0 22px 0 0}.r-tick{background:#ffffff38;width:6px;height:1px;position:absolute;right:-1px}.r-tick.major{background:#ffffff73;width:12px}.r-tick span{font-family:var(--mono);color:var(--ink-3);white-space:nowrap;font-size:10px;position:absolute;top:-7px;right:16px}.r-stage{cursor:pointer;background:#0a0e18e6;border:1.5px solid #ffffff8c;border-radius:50%;width:9px;height:9px;margin-top:-4.5px;transition:transform .2s,background .2s,border-color .2s;position:absolute;right:-5px}.r-stage:hover,.r-stage.active{background:var(--accent);border-color:var(--accent);transform:scale(1.35)}.r-stage .r-name{white-space:nowrap;background:var(--glass-strong);border:1px solid var(--line);opacity:0;pointer-events:none;border-radius:6px;padding:3px 8px;font-size:12px;transition:opacity .15s;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.r-stage:hover .r-name{opacity:1}.r-cursor{background:var(--accent);width:34px;height:2px;box-shadow:0 0 10px var(--accent);pointer-events:none;margin-top:-1px;position:absolute;right:-1px}.r-cursor span{font-family:var(--mono);color:var(--accent);white-space:nowrap;font-size:11px;position:absolute;top:-9px;right:40px}.r-region{opacity:.55;border-radius:2px;width:3px;position:absolute;right:-1px}.r-region-label{font-family:var(--mono);letter-spacing:.14em;color:var(--ink-3);writing-mode:vertical-rl;opacity:.8;font-size:9px;position:absolute;right:14px;transform:rotate(180deg)}#scalebar{bottom:calc(var(--gutter) + 4px);text-align:center;pointer-events:none;position:fixed;left:50%;transform:translate(-50%)}.sb-bar{border:1.5px solid var(--ink);border-top:none;height:8px;margin:0 auto;transition:width .12s;position:relative;box-shadow:0 2px 8px #0006}.sb-bar i{background:var(--ink);width:1px;height:4px;position:absolute;bottom:0}.sb-bar i:first-child{left:25%}.sb-bar i:nth-child(2){height:6px;left:50%}.sb-text{font-family:var(--mono);color:var(--ink);text-shadow:0 1px 8px #000c;margin-top:6px;font-size:12px}#controls{left:var(--gutter);bottom:var(--gutter);gap:8px;display:flex;position:fixed}.btn{font-family:var(--sans);color:var(--ink);background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);cursor:pointer;border-radius:10px;align-items:center;gap:8px;height:38px;padding:0 14px;font-size:13px;font-weight:600;transition:background .2s,border-color .2s,transform .1s;display:inline-flex}.btn:hover{background:#28344cb3;border-color:#ffffff47}.btn:active{transform:scale(.97)}.btn.icon{justify-content:center;width:38px;padding:0;font-size:15px}.btn.primary{background:#7cc4ff29;border-color:#7cc4ff73}.btn.primary:hover{background:#7cc4ff47}.btn.on{color:var(--accent);border-color:#7cc4ff73}.btn.big{border-radius:12px;height:48px;padding:0 26px;font-size:15px}.btn:disabled{opacity:.4;cursor:default}.btn .ic{font-size:11px}#help{left:var(--gutter);bottom:calc(var(--gutter) + 50px);background:var(--glass-strong);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);color:var(--ink-2);border-radius:12px;padding:16px 18px;font-size:13px;line-height:1.9;transition:opacity .2s,transform .2s;position:fixed}#help.hidden{opacity:0;pointer-events:none;transform:translateY(8px)}#help h3{color:var(--ink);margin-bottom:6px;font-size:14px}#help h3 span{font-family:var(--mono);color:var(--ink-3);letter-spacing:.1em;text-transform:uppercase;margin-left:6px;font-size:10px}#help ul{list-style:none}#help b{color:var(--ink);margin-right:6px;font-weight:600}#cards{pointer-events:none;position:fixed;inset:0}.card{width:min(380px, calc(100vw - 2 * var(--gutter)));background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(18px)saturate(1.2);opacity:0;pointer-events:none;border-radius:16px;padding:20px 22px 18px;transition:opacity .55s,transform .7s cubic-bezier(.2,.8,.2,1);position:absolute;box-shadow:0 20px 60px #00000059}.card.show{opacity:1;pointer-events:auto;transform:none!important}.card.pos-left{left:var(--gutter);margin-top:-170px;top:50%;transform:translate(-40px)}.card.pos-right{right:calc(var(--ruler-w) + 16px);margin-top:-170px;top:50%;transform:translate(40px)}.card.pos-top-left{left:var(--gutter);top:88px;transform:translateY(-30px)}.card.pos-top-right{right:calc(var(--ruler-w) + 16px);top:100px;transform:translateY(-30px)}.card.pos-bottom-left{left:var(--gutter);bottom:84px;transform:translateY(30px)}.card.pos-bottom-right{right:calc(var(--ruler-w) + 16px);bottom:84px;transform:translateY(30px)}.card.pos-bottom{margin-left:min(-190px, calc(-50vw + var(--gutter)));bottom:96px;left:50%;transform:translateY(30px)}.card.pos-top{margin-left:min(-190px, calc(-50vw + var(--gutter)));top:110px;left:50%;transform:translateY(-30px)}.card.interlude{background:#080a1280;border-style:dashed}.card-meta{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.chip{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;border:1px solid;border-radius:999px;padding:3px 8px;font-size:10px}.card-idx{font-family:var(--mono);color:var(--ink-3);font-size:11px}.card h2{letter-spacing:-.01em;font-size:26px;font-weight:700;line-height:1.2}.card .en{font-family:var(--serif);color:var(--ink-2);margin-top:2px;font-size:16px;font-style:italic;font-weight:300}.card .stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 12px;padding:12px 0;display:grid}.stat .k{color:var(--ink-3);font-size:11px}.stat .v{font-family:var(--mono);margin-top:2px;font-size:15px;font-weight:600}.stat .v small{font-family:var(--sans);color:var(--ink-2);margin-top:1px;font-size:12px;font-weight:500;display:block}.card p.desc{color:var(--ink-2);word-break:keep-all;font-size:13.5px;line-height:1.72}.card p.desc em{color:var(--ink);font-style:normal}.card .fact{color:var(--ink);border-left:2px solid var(--accent-2);word-break:keep-all;background:#ffffff0d;border-radius:10px;margin-top:12px;padding:10px 12px;font-size:12.5px;line-height:1.65}.card .fact b{color:var(--accent-2);margin-right:4px;font-weight:600}.card .credit{color:var(--ink-3);margin-top:10px;font-size:10.5px}#labels{pointer-events:none;position:fixed;inset:0;overflow:hidden}.lbl{will-change:transform, opacity;transition:opacity .35s;position:absolute;top:0;left:0}.lbl .dot{background:#fff;border-radius:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;position:absolute;box-shadow:0 0 0 2px #00000059,0 0 10px #fffc}.lbl svg{position:absolute;top:0;left:0;overflow:visible}.lbl svg line{stroke:#fff9;stroke-width:1px}.lbl .txt{white-space:nowrap;-webkit-backdrop-filter:blur(8px);background:#080b1399;border:1px solid #ffffff24;border-radius:7px;padding:4px 9px 5px;position:absolute}.lbl .txt b{color:var(--ink);font-size:13px;font-weight:600;display:block}.lbl .txt i{font-style:normal;font-family:var(--mono);color:var(--ink-3);letter-spacing:.04em;margin-top:1px;font-size:9.5px;display:block}.lbl .txt u{color:var(--ink-2);white-space:normal;max-width:220px;margin-top:3px;font-size:11px;line-height:1.45;text-decoration:none;display:block}.lbl.plain .dot,.lbl.plain svg{display:none}.lbl.plain .txt{-webkit-backdrop-filter:none;text-shadow:0 1px 6px #000000e6;background:0 0;border:none;transform:translate(-50%,-50%)}.reticle{pointer-events:none;opacity:0;transition:opacity .4s;position:fixed;top:0;left:0}.reticle-ring{border:1.5px solid #7cc4ffcc;border-radius:50%;width:44px;height:44px;margin:-22px 0 0 -22px;animation:2.2s ease-out infinite pulse;position:absolute}.reticle-ring:before,.reticle-ring:after{content:"";background:var(--accent);border-radius:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;position:absolute;top:50%;left:50%}.reticle-text{white-space:nowrap;color:var(--accent);text-shadow:0 1px 8px #000000e6;font-size:12px;font-weight:600;position:absolute;top:-9px;left:30px}.reticle-text span{font-family:var(--mono);color:var(--ink-3);margin-left:6px;font-size:10px;font-weight:400}@keyframes pulse{0%{opacity:1;transform:scale(.7)}to{opacity:0;transform:scale(1.5)}}body.intro #labels,body.intro #cards,body.intro #reticle,body.intro #readout,body.intro #scalebar,body.intro #controls,body.intro #ruler{opacity:0;pointer-events:none}#labels,#cards,#readout,#scalebar,#controls,#ruler{transition:opacity .8s}#intro{z-index:10;background:radial-gradient(at 50% 60%,#0a10208c,#000000eb);justify-content:center;align-items:center;transition:opacity 1.2s;display:flex;position:fixed;inset:0}#intro.gone{opacity:0;pointer-events:none}.intro-inner{text-align:center;max-width:640px;padding:0 28px}.intro-kicker{font-family:var(--mono);letter-spacing:.3em;color:var(--accent);font-size:11px}#intro h1{letter-spacing:-.02em;margin-top:14px;font-size:clamp(40px,8vw,72px);font-weight:800;line-height:1.05}.intro-en{font-family:var(--serif);color:var(--ink-2);margin-top:8px;font-size:20px;font-style:italic;font-weight:300}.intro-desc{color:var(--ink-2);word-break:keep-all;margin-top:22px;font-size:15px;line-height:1.8}.intro-progress{background:#ffffff1a;border-radius:2px;width:240px;height:2px;margin:30px auto 0;overflow:hidden}#progBar{background:var(--accent);width:0;height:100%;transition:width .2s}.intro-status{font-family:var(--mono);color:var(--ink-3);min-height:16px;margin-top:10px;font-size:11px}.intro-actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:22px;display:flex}.intro-hint{color:var(--ink-3);margin-top:18px;font-size:12px}.intro-credit{color:var(--ink-3);margin-top:14px;font-size:12px}.intro-lang{margin-top:14px}.intro-lang .btn{padding:6px 14px;font-size:12px}#btnLang{font-family:var(--mono);letter-spacing:.05em;font-size:11px}.intro-credit b{color:var(--ink-2);font-weight:600}.intro-credit a,.help-credit a{color:var(--ink-2);text-underline-offset:2px;text-decoration:underline}.help-credit{border-top:1px solid var(--line);color:var(--ink-3);margin-top:8px;padding-top:8px;font-size:11.5px}@media (width<=720px){:root{--gutter:16px;--ruler-w:58px}#brand{display:none}#readout{top:12px}.ro-sci{font-size:20px}#ruler{top:110px;bottom:150px}.r-tick span,.r-region-label{display:none}.card,.card.pos-left,.card.pos-right,.card.pos-top-left,.card.pos-top-right,.card.pos-bottom-left,.card.pos-bottom-right,.card.pos-bottom,.card.pos-top{left:var(--gutter);width:calc(100vw - 2 * var(--gutter) - var(--ruler-w));max-height:42vh;margin:0;padding:14px 16px;top:auto;bottom:120px;right:auto;overflow-y:auto;transform:translateY(24px)}.card h2{font-size:20px}.card .stats{margin:8px 0;padding:8px 0}.card p.desc{font-size:12.5px}#controls{bottom:16px}#controls .btn .tx{display:none}#scalebar{bottom:70px}.lbl .txt u{display:none}}
