:root{--ink:#eaf6ff;--accent:#39d0ff;--accent-soft:#7fe0ff;--panel:#0a1a289e;--panel-line:#78d2ff59}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;background:#0a1a2f;font-family:Pretendard,system-ui,-apple-system,Apple SD Gothic Neo,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#app canvas{display:block}.hud{pointer-events:none;z-index:10;position:fixed;inset:0}.hud .glass{background:var(--panel);border:1px solid var(--panel-line);-webkit-backdrop-filter:blur(10px)saturate(1.1);border-radius:14px;box-shadow:0 10px 40px #00000059,inset 0 1px #ffffff0f}.progress{top:max(18px, env(safe-area-inset-top));align-items:center;gap:10px;padding:9px 14px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.progress .dot{background:#b4dcf547;border-radius:50%;width:9px;height:9px;transition:all .4s}.progress .dot.done{background:var(--accent-soft)}.progress .dot.active{background:var(--accent);box-shadow:0 0 12px var(--accent);transform:scale(1.5)}.stage{top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));min-width:190px;padding:12px 18px;position:absolute}.stage .kicker{letter-spacing:3px;color:var(--accent);text-transform:uppercase;opacity:.9;font-size:11px}.stage .title{margin-top:3px;font-size:24px;font-weight:700;line-height:1.1}.stage .en{color:#9fc4dc;letter-spacing:1px;margin-top:2px;font-size:12px}.vrnote{top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));color:#a7cadf;align-items:center;gap:8px;padding:10px 14px;font-size:12px;display:flex;position:absolute}.vrnote .glyph{background:#e8b53a;border-radius:50%;width:8px;height:8px;box-shadow:0 0 8px #e8b53a}.audiobtn{top:max(60px, calc(env(safe-area-inset-top) + 48px));right:max(16px, env(safe-area-inset-right));pointer-events:auto;border:1px solid var(--panel-line);width:42px;height:42px;color:var(--ink);cursor:pointer;border-radius:50%;place-items:center;font-size:18px;line-height:1;transition:transform .15s,opacity .2s;display:grid;position:absolute}.audiobtn:hover{transform:scale(1.08)}.audiobtn.off{opacity:.55}.caption{left:50%;bottom:max(96px, calc(env(safe-area-inset-bottom) + 92px));text-align:center;opacity:0;text-shadow:0 2px 12px #00000080;width:min(760px,100vw - 40px);padding:16px 22px;font-size:17px;line-height:1.55;transition:opacity .6s;position:absolute;transform:translate(-50%)}.caption.show{opacity:1}.advance{right:max(20px, env(safe-area-inset-right));bottom:max(28px, calc(env(safe-area-inset-bottom) + 22px));pointer-events:auto;color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));cursor:pointer;letter-spacing:.5px;opacity:0;border:none;border-radius:40px;padding:15px 26px;font-size:16px;font-weight:700;transition:transform .15s,box-shadow .2s,opacity .3s;position:absolute;transform:translateY(0);box-shadow:0 8px 26px #39d0ff66}.advance.show{opacity:1}.advance:hover{transform:translateY(-2px);box-shadow:0 12px 32px #39d0ff8c}.advance:active{transform:translateY(1px)}.advance.replay{background:linear-gradient(#cfe1ec,#9fb8c8)}.wsicta{left:50%;bottom:max(150px, calc(env(safe-area-inset-bottom) + 146px));color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));cursor:pointer;letter-spacing:.3px;opacity:0;pointer-events:none;border:none;border-radius:40px;padding:14px 30px;font-size:16px;font-weight:800;transition:opacity .4s,transform .15s,box-shadow .2s;position:absolute;transform:translate(-50%);box-shadow:0 10px 30px #39d0ff80}.wsicta.show{opacity:1;pointer-events:auto}.wsicta:hover{transform:translate(-50%)translateY(-2px);box-shadow:0 14px 38px #39d0ff9e}.wsi-overlay{z-index:50;opacity:0;pointer-events:none;background:#0a1622;flex-direction:column;transition:opacity .4s;display:flex;position:fixed;inset:0}.wsi-overlay.show{opacity:1;pointer-events:auto}.wsi-bar{background:var(--panel);border-bottom:1px solid var(--panel-line);flex:none;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;display:flex}.wsi-title{color:var(--ink);font-size:15px;font-weight:700}.wsi-close{color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));cursor:pointer;border:none;border-radius:30px;flex:none;padding:9px 18px;font-size:14px;font-weight:700}.wsi-frame{background:#fff;border:none;flex:auto;width:100%}.intro{pointer-events:auto;text-align:center;background:radial-gradient(circle at 50% 40%,#0a1e328c,#050e1ae6);flex-direction:column;justify-content:center;align-items:center;gap:26px;transition:opacity .8s;display:flex;position:absolute;inset:0}.intro.hide{opacity:0;pointer-events:none}.intro h1{letter-spacing:-1px;background:linear-gradient(180deg, #fff, var(--accent-soft));color:#0000;filter:drop-shadow(0 4px 24px #39d0ff59);-webkit-background-clip:text;background-clip:text;font-size:clamp(40px,8vw,74px);font-weight:800}.intro .lead{color:#bcd8ec;max-width:560px;padding:0 20px;font-size:clamp(15px,3.4vw,19px);line-height:1.7}.intro .start{pointer-events:auto;color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));cursor:pointer;border:none;border-radius:46px;margin-top:6px;padding:18px 46px;font-size:19px;font-weight:700;transition:transform .15s;box-shadow:0 10px 34px #39d0ff73}.intro .start:hover{transform:scale(1.04)}.intro .meta{color:#7fa3ba;letter-spacing:1px;font-size:12px}.intro .credit{color:#5f7d92;letter-spacing:.5px;opacity:.85;margin-top:2px;font-size:10px}.loading{color:#8fc8e6;letter-spacing:2px;z-index:20;background:#0a1a2f;justify-content:center;align-items:center;font-size:15px;transition:opacity .5s;display:flex;position:absolute;inset:0}.loading.hide{opacity:0;pointer-events:none}@media (max-width:560px){.vrnote{display:none}.audiobtn{top:max(14px, env(safe-area-inset-top));width:38px;height:38px;font-size:16px}.progress{top:auto;bottom:max(24px, calc(env(safe-area-inset-bottom) + 20px));padding:7px 11px;left:20px;transform:none}.stage{min-width:150px;padding:10px 14px}.stage .title{font-size:20px}.caption{bottom:max(88px, calc(env(safe-area-inset-bottom) + 84px));font-size:15px}.advance{padding:13px 20px;font-size:14px}.vrnote{padding:8px 10px;font-size:11px}}.intro .moderow{pointer-events:auto;gap:10px;display:flex}.intro .modebtn{color:#9dc0d6;cursor:pointer;background:#ffffff0f;border:1px solid #a0c8e140;border-radius:30px;padding:9px 18px;font-size:13px;font-weight:600;transition:all .18s}.intro .modebtn.on{color:#04121d;background:linear-gradient(180deg, #d8f2ff, var(--accent-soft));border-color:#0000}.intro .start.ghost{color:#9dc0d6;box-shadow:none;background:#ffffff0d;border:1px solid #a0c8e138;margin-top:-12px;padding:11px 28px;font-size:14px;font-weight:600}.intro .start.ghost:hover{background:#ffffff1a;transform:none}.progress.hide{opacity:0}.decision{left:50%;bottom:max(28px, calc(env(safe-area-inset-bottom) + 24px));opacity:0;pointer-events:none;width:min(760px,100vw - 32px);padding:18px 20px 20px;transition:opacity .4s,transform .4s;position:absolute;transform:translate(-50%,12px)}.decision.show{opacity:1;pointer-events:auto;transform:translate(-50%)}.decision .brief{text-align:center;color:#dcecf7;margin-bottom:16px;font-size:16px;line-height:1.6}.decision .cards{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.decision .card{pointer-events:auto;cursor:pointer;text-align:center;background:#ffffff12;border:1px solid #a0c8e147;border-radius:14px;padding:16px 10px;transition:all .16s}.decision .card:hover{border-color:var(--accent);background:#39d0ff29;transform:translateY(-2px)}.decision .card-label{color:#eaf7ff;font-size:19px;font-weight:700}.decision .card-sub{color:#8fb2c8;letter-spacing:.5px;margin-top:4px;font-size:12px}.verdict{left:50%;bottom:max(28px, calc(env(safe-area-inset-bottom) + 24px));opacity:0;pointer-events:none;border-left:4px solid var(--accent);width:min(700px,100vw - 32px);padding:20px 24px 22px;transition:opacity .5s,transform .5s;position:absolute;transform:translate(-50%,12px)}.verdict.show{opacity:1;pointer-events:auto;transform:translate(-50%)}.verdict.good{border-left-color:#4fd39a}.verdict.warn{border-left-color:#f0c04a}.verdict.bad{border-left-color:#f07a6a}.verdict .v-head{color:#f2fbff;margin-bottom:8px;font-size:20px;font-weight:700}.verdict .v-body{color:#c8dded;font-size:15px;line-height:1.65}.verdict .v-metrics{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;display:grid}.verdict .v-metric{text-align:center;background:#ffffff0d;border-radius:10px;padding:10px 8px}.verdict .v-mlabel{color:#85a8bf;letter-spacing:.5px;font-size:11px}.verdict .v-mvalue{color:#eaf7ff;margin-top:3px;font-size:17px;font-weight:700}.verdict .v-retry{pointer-events:auto;color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));cursor:pointer;border:none;border-radius:34px;margin-top:16px;padding:12px 24px;font-size:15px;font-weight:700;box-shadow:0 8px 24px #39d0ff59}@media (max-width:640px){.decision .cards{grid-template-columns:1fr}.decision .card{padding:12px 10px}.verdict .v-metrics{grid-template-columns:1fr}}.verdict .v-head{align-items:center;gap:12px;display:flex}.verdict .v-grade{color:#04121d;background:linear-gradient(180deg, var(--accent-soft), var(--accent));border-radius:10px;flex:none;justify-content:center;align-items:center;width:40px;height:40px;font-size:24px;font-weight:800;display:inline-flex}.verdict.good .v-grade{background:linear-gradient(#7ff0be,#4fd39a)}.verdict.warn .v-grade{background:linear-gradient(#f7d67a,#f0c04a)}.verdict.bad .v-grade{background:linear-gradient(#f5a99d,#f07a6a)}.verdict .v-line{color:#c8dded;font-size:14px;line-height:1.7}.intro{gap:16px;overflow-y:auto}.intro .pick-label{letter-spacing:2px;color:#7fa3ba;margin-bottom:-6px;font-size:12px}.intro .scnrow{pointer-events:auto;flex-wrap:wrap;justify-content:center;gap:8px;max-width:560px;display:flex}.intro .scnbtn{color:#9dc0d6;cursor:pointer;background:#ffffff0f;border:1px solid #a0c8e140;border-radius:30px;padding:9px 16px;font-size:13px;font-weight:600;transition:all .18s}.intro .scnbtn.on{color:#04121d;background:linear-gradient(180deg, #d8f2ff, var(--accent-soft));border-color:#0000}.verdict .v-btns{gap:10px;margin-top:16px;display:flex}.verdict .v-retry{margin-top:0}.verdict .v-retry.ghost{color:#cfe1ec;box-shadow:none;background:#ffffff14}
