:root{--hud-bg:#080e16b8;--hud-bg-flat:#080e16f0;--hud-border:#ffffff1f;--hud-text:#e8eef6;--hud-text-dim:#8a9cb0;--accent-amber:#ffa000;--accent-cool:#4ec0d6;--accent-danger:#ff5e48;--accent-success:#5ce073;--theme-player:var(--accent-cool);--theme-enemy:var(--accent-danger);--theme-accent:var(--accent-amber);--theme-intel:#e8d68b;--theme-bg:var(--hud-bg);--theme-bg-flat:var(--hud-bg-flat);--theme-border:var(--hud-border);--theme-border-thick:2.5px solid var(--theme-border);--key-neutral:#1c2635;--key-radar-miss:#3e4a5d;--key-radar-hit:var(--theme-player);--key-torp-hit:var(--theme-accent);--key-torp-miss:#8a2d2d;--font-display:"Rajdhani", "Inter", system-ui, sans-serif;--font-ui:"Inter", system-ui, -apple-system, sans-serif;--gap-1:6px;--gap-2:10px;--gap-3:14px;--gap-4:20px}#hud-root{z-index:10;pointer-events:none;color:var(--hud-text);font-family:var(--font-ui);position:absolute;inset:0}#hud-root button,#hud-root [data-interactive]{pointer-events:auto}.hud-panel{background:var(--theme-bg-flat);border:var(--theme-border-thick);font-family:var(--font-display);letter-spacing:.06em;color:var(--hud-text);border-radius:9999px;align-items:center;padding:8px 22px;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:0 8px 24px #00000080}@supports ((-webkit-backdrop-filter:blur(12px)) or (backdrop-filter:blur(12px))){.hud-panel{background:var(--theme-bg);-webkit-backdrop-filter:blur(12px)}}.target-intel,.event-log,.menu-content,.summary-content,.summary-feedback-section,.virtual-keyboard{border-radius:24px!important}.hud-top{top:var(--gap-3);left:var(--gap-3);right:var(--gap-3);gap:var(--gap-2);flex-wrap:wrap;align-items:flex-start;display:flex;position:absolute}.hud-bottom{bottom:var(--gap-3);left:var(--gap-3);right:var(--gap-3);gap:var(--gap-2);align-items:flex-end;display:flex;position:absolute}.target-intel{top:72px;right:var(--gap-3);width:240px;position:absolute}.word-progress{bottom:220px;left:var(--gap-4);min-width:220px;position:absolute}.mission-badge{border-color:#ffffff26;font-weight:600}.mission-badge__id{color:var(--hud-text-dim);margin-right:var(--gap-2);font-size:12px}.mission-badge__name{font-size:16px}.hud-combat-group{align-items:center;gap:0;display:flex}.hud-combat-group .battery{border-top-right-radius:0;border-bottom-right-radius:0}.hud-combat-group .torpedoes{border-top-left-radius:0;border-bottom-left-radius:0}.battery,.torpedoes{align-items:center;gap:var(--gap-2);font-variant-numeric:tabular-nums;border-radius:9999px;transition:all .25s;display:flex}.battery{box-shadow:0 0 12px #5fb6c833,0 8px 24px #00000080;border-color:var(--theme-player)!important}.torpedoes{box-shadow:0 0 12px #f0b40033,0 8px 24px #00000080;border-color:var(--theme-accent)!important}.battery__mode-label,.torpedoes__mode-label{text-transform:uppercase;letter-spacing:.1em;margin:0;padding:0;font-size:11px;font-weight:800}.battery__mode-label{color:var(--theme-player)}.torpedoes__mode-label{color:var(--theme-accent)}.battery__label,.torpedoes__label{color:var(--hud-text-dim);text-transform:uppercase;font-size:11px;font-weight:700}.battery__segs{gap:3px;display:flex}.battery__seg{background:#ffffff14;border:1px solid #ffffff1a;border-radius:9999px;width:8px;height:16px;transition:all .2s}.battery__seg--on{background:var(--theme-player);box-shadow:0 0 8px var(--theme-player)}.battery__value,.torpedoes__value{text-align:right;min-width:2ch;font-size:20px;font-weight:800}.battery__value{color:var(--theme-player)}.torpedoes__value{color:var(--theme-accent)}.mode-indicator{letter-spacing:.12em;border-radius:9999px;padding:8px 22px;font-weight:800}.mode-indicator[data-mode=RADAR]{color:var(--theme-player);border-color:var(--theme-player);box-shadow:0 0 14px #5fb6c84d}.mode-indicator[data-mode=TORPEDO]{color:var(--theme-accent);border-color:var(--theme-accent);box-shadow:0 0 14px #f0b4004d}.toast-container{align-items:center;gap:var(--gap-2);z-index:100;pointer-events:none;flex-direction:column;display:flex;position:absolute;bottom:80px;left:50%;transform:translate(-50%)}@media (width<=720px){.toast-container{bottom:auto;top:calc(var(--gap-3) + 40px);align-items:center;left:50%;right:auto;transform:translate(-50%)}}.toast-item{text-align:center;letter-spacing:.08em;pointer-events:auto;opacity:0;min-width:200px;font-weight:700;transition:opacity .2s,transform .2s;transform:translateY(10px)}.hud-help{pointer-events:none;z-index:50;opacity:.8;background:0 0;width:380px;position:absolute;top:70px;left:2%}@supports ((-webkit-backdrop-filter:blur(8px)) or (backdrop-filter:blur(8px))){.hud-help{-webkit-backdrop-filter:blur(8px);background:0 0}}.hud-help__title{font-family:var(--font-display);text-transform:uppercase;margin-bottom:var(--gap-1);letter-spacing:.05em;color:#fff;font-size:16px;font-weight:700;line-height:1.4}.hud-help__list{color:#ffffffd9;margin:0;list-style:none}.hud-help__item{margin-bottom:var(--gap-1);font-size:14px}.hud-help__item:last-child{margin-bottom:0}@media (width<=720px){.hud-help{display:none}}.toast-item[data-visible=true]{opacity:1;transform:translateY(0)}.toast-item[data-tone=danger]{color:var(--accent-danger);border-color:#ff3ca066}.toast-item[data-tone=success]{color:var(--accent-success);border-color:#8bff4c66}.toast-item[data-tone=info]{color:var(--theme-player)}.toast-item[data-tone=intel]{color:var(--theme-intel);border-color:#e8d68b66}.toast-item[data-tone=torpedo]{color:var(--theme-accent);border-color:#ffa00066}.toast-item[data-tone=enemy]{color:var(--theme-enemy);border-color:#ff5a7266}.toast-item[data-tone=hud-text]{color:var(--hud-text);border-color:var(--hud-border)}.hud-actions{top:var(--gap-3);right:var(--gap-3);gap:var(--gap-2);z-index:100;display:flex;position:absolute}.hud-actions button{background:var(--theme-bg-flat);color:var(--hud-text);font-family:var(--font-display);letter-spacing:.06em;cursor:pointer;border:2px solid #ffffff26;border-radius:9999px;padding:8px 22px;font-weight:700;transition:all .2s;box-shadow:0 4px 12px #0000004d}.hud-actions button:hover{border-color:var(--theme-player);background:#ffffff0f;box-shadow:0 0 10px #5fb6c866}.hud-actions button:focus-visible{outline:2px solid var(--theme-player);outline-offset:2px}@media (width<=720px){.hud-top{flex-direction:column;align-items:stretch}.target-intel{display:none}}.virtual-keyboard{left:var(--gap-4);bottom:var(--gap-4);padding:var(--gap-2) var(--gap-3);background:var(--theme-bg-flat);border:var(--theme-border-thick);z-index:11;border-radius:24px;flex-direction:column;gap:8px;display:flex;position:absolute;box-shadow:0 12px 40px #0009}@supports ((-webkit-backdrop-filter:blur(12px)) or (backdrop-filter:blur(12px))){.virtual-keyboard{background:var(--theme-bg);-webkit-backdrop-filter:blur(12px)}}.virtual-keyboard__row{justify-content:center;gap:8px;display:flex}.vkey{background:var(--key-neutral);min-width:44px;min-height:44px;color:var(--hud-text);font-family:var(--font-display);letter-spacing:.04em;cursor:pointer;-webkit-user-select:none;user-select:none;border:2px solid #ffffff1a;border-radius:12px;padding:0 10px;font-size:18px;font-weight:700;transition:background-color .12s,color .12s,opacity .12s,transform 60ms,box-shadow 60ms;transform:translateY(0);box-shadow:0 4px #00000059}.vkey:hover{border-color:var(--theme-player);background-color:#243042}.vkey:focus-visible{outline:2px solid var(--theme-player);outline-offset:2px}.vkey:active{transform:translateY(2px);box-shadow:0 2px #00000059}.vkey[data-tone=used-miss][data-mode=RADAR],.vkey[data-tone=used-hit][data-mode=RADAR],.vkey[data-tone=used-miss][data-mode=TORPEDO],.vkey[data-tone=used-hit][data-mode=TORPEDO]{border-color:#ffffff0d;transform:translateY(3px);box-shadow:0 1px #00000059}.vkey[data-tone=used-miss][data-mode=RADAR]{background:var(--key-radar-miss);color:var(--hud-text-dim)}.vkey[data-tone=used-hit][data-mode=RADAR]{background:var(--key-radar-hit);color:#061119;box-shadow:0 1px 8px #5fb6c866}.vkey[data-tone=used-miss][data-mode=TORPEDO]{background:var(--key-torp-miss);color:var(--hud-text-dim)}.vkey[data-tone=used-hit][data-mode=TORPEDO]{background:var(--key-torp-hit);color:#1a1300;box-shadow:0 1px 8px #f0b40066}.vkey[data-resolved=true]{opacity:.25;cursor:not-allowed}.vkey--back{min-width:60px;color:var(--hud-text-dim);font-size:18px}@keyframes vkey-pulse{0%{transform:scale(.95)}to{transform:scale(1)}}.vkey--pulse{animation:.22s ease-out vkey-pulse}@media (width<=720px){.virtual-keyboard{left:var(--gap-2);right:var(--gap-2);transform:none}.vkey{flex:1 1 0;min-width:28px;padding:0 2px;font-size:14px}.word-progress{bottom:210px;left:50%;transform:translate(-50%)}}:root{--sonar-bg:#040c08;--sonar-ring:#78d2a038;--sonar-sweep:#78d2a0a6;--mode-radar-text:var(--theme-player);--mode-torpedo-text:var(--theme-accent)}.sonar-panel{background:#030806;padding:6px;line-height:0;display:none;box-shadow:0 8px 32px #00000080;border:2.5px solid #78d2a04d!important;border-radius:9999px!important}.sonar-panel__svg{display:block}@keyframes sonar-sweep-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sonar-panel__sweep{transform-origin:0 0;animation:4s linear infinite sonar-sweep-spin}.event-log{min-width:220px;max-width:360px;padding:var(--gap-2) var(--gap-3);font-family:var(--font-display);letter-spacing:.04em;flex:auto;font-size:12px;line-height:1.4;display:none;box-shadow:0 8px 24px #00000080}.event-log__label{color:var(--hud-text-dim);letter-spacing:.12em;margin-bottom:var(--gap-1);font-size:10px;font-weight:700}.event-log__list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.log-line{font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.log-line--radar{color:var(--mode-radar-text)}.log-line--torpedo{color:var(--mode-torpedo-text)}.log-line--destroyed{color:#ff5e48;font-weight:700}.log-line--system{color:#ffffffb8}.view-cube{z-index:15;pointer-events:auto;opacity:.85;perspective:500px;transform-style:preserve-3d;transition:opacity .25s;position:fixed;bottom:20px;right:20px}.view-cube:hover{opacity:1}.view-cube__inner{transform-style:preserve-3d;transition:transform .4s cubic-bezier(.16,1,.3,1);transform:rotateX(35deg)rotate(10deg)}.view-cube:hover .view-cube__inner{transform:rotateX(28deg)rotate(0)translateZ(90px)translate(-10px)}.view-cube__svg{display:block}.view-cube__sweep{transform-origin:0 0;animation:4s linear infinite sonar-sweep-spin}.view-cube__btn{cursor:pointer;opacity:.75;transition:opacity .15s,filter .15s}.view-cube__btn:hover{opacity:1;filter:drop-shadow(0 0 4px #78d2a0cc)}.view-cube__btn:hover polygon{fill:#78d2a0f2;stroke:#78d2a0}.view-cube__btn:hover path{stroke:#78d2a0}@media (width<=840px){.view-cube{display:none}}@media (width<=600px){.view-cube{transform-origin:100% 100%;bottom:10px;right:10px;transform:scale(.8)}}.target-intel{gap:var(--gap-2);pointer-events:auto;flex-direction:column;max-height:320px;display:none;overflow-y:auto;box-shadow:0 8px 24px #00000080}.target-intel__empty{color:var(--hud-text-dim);text-align:center;padding:var(--gap-3) var(--gap-2);font-size:13px;font-style:italic}.intel-row{justify-content:space-between;align-items:center;gap:var(--gap-3);cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff05;border:2px solid #ffffff0f;border-radius:12px;padding:10px 14px;transition:all .15s;display:flex}.intel-row:hover{background:#ffffff0f;border-color:#ffffff1f}.intel-row:focus-visible{outline:2px solid var(--theme-player);outline-offset:1px}.intel-row--active{border-color:var(--theme-accent);background:#f0a0000f;box-shadow:0 0 10px #f0a00026}.intel-row--active:hover{background:#f0a0001a}.intel-row--destroyed{opacity:.4;cursor:default;background:0 0;border-color:#0000;text-decoration:line-through}.intel-row__name{font-family:var(--font-display);letter-spacing:.05em;font-size:16px;font-weight:700}.intel-row__length{color:var(--hud-text-dim);font-size:12px}.intel-row__progress{gap:3px;display:flex}.intel-row__progress-cell{background:#ffffff1f;border-radius:9999px;width:6px;height:12px;transition:background-color .2s,box-shadow .2s}.intel-row__progress-cell--lit{background-color:var(--theme-player)}.intel-row--active .intel-row__progress-cell--lit{background-color:var(--theme-accent);box-shadow:0 0 6px #f0a00099}.word-progress{align-items:stretch;gap:var(--gap-2);font-family:var(--font-display);letter-spacing:.12em;pointer-events:auto;flex-direction:column;padding:12px 18px;font-size:30px;font-weight:800;display:flex;box-shadow:0 8px 32px #00000080;border-radius:20px!important}.word-progress__header{text-transform:uppercase;color:var(--hud-text-dim);letter-spacing:.1em;border-bottom:1.5px solid var(--theme-border);justify-content:space-between;align-items:center;margin-bottom:4px;padding-bottom:6px;font-size:11px;display:flex}.word-progress__title{font-weight:700}.word-progress__count{font-variant-numeric:tabular-nums;color:var(--theme-accent);font-weight:700}.word-progress__body{justify-content:space-between;align-items:center;gap:var(--gap-4);display:flex}.word-progress__placeholder{color:var(--hud-text-dim);letter-spacing:.2em;text-align:center;flex-grow:1}.word-progress__skeleton{gap:var(--gap-2);display:flex}.word-progress__letter{text-align:center;min-width:1.2ch;display:inline-block}.word-progress__letter--pulse{animation:.24s ease-out word-letter-pulse}.word-progress__length{color:var(--hud-text-dim);border-left:1.5px solid var(--theme-border);padding-left:var(--gap-3);font-variant-numeric:tabular-nums;font-size:16px;line-height:1}@keyframes word-letter-pulse{0%{color:var(--theme-accent);text-shadow:0 0 8px var(--theme-accent);transform:scale(1.25)}to{color:var(--hud-text);text-shadow:none;transform:scale(1)}}.menu-overlay,.summary-overlay{z-index:1000;-webkit-backdrop-filter:blur(12px);pointer-events:auto;background:#04080cbf;justify-content:center;align-items:center;animation:.3s ease-out overlay-fade-in;display:flex;position:fixed;inset:0}.summary-overlay{padding:var(--gap-4) 0;overflow-y:auto}@keyframes overlay-fade-in{0%{opacity:0}to{opacity:1}}.menu-content,.summary-content{text-align:center;border-radius:24px;flex-direction:column;align-items:center;animation:.35s cubic-bezier(.16,1,.3,1) content-slide-up;display:flex;box-shadow:0 20px 50px #0009,inset 0 1px #ffffff1a;padding:var(--gap-4) var(--gap-4)!important;border-color:#ffffff26!important}.menu-content{width:90%;max-width:480px}.summary-content{width:100%}@keyframes content-slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.menu-title,.summary-outcome-text{font-family:var(--font-display);letter-spacing:.1em;color:var(--hud-text);text-shadow:0 0 10px #fff3;margin:0;font-size:30px;font-weight:800}.menu-subtitle{font-family:var(--font-display);letter-spacing:.2em;color:var(--theme-player);text-transform:uppercase;margin-top:4px;font-size:14px;font-weight:600}.menu-divider,.summary-divider{background:linear-gradient(90deg, transparent, var(--theme-border), transparent);width:100%;height:1px;margin:var(--gap-4) 0}.menu-buttons,.summary-buttons{gap:var(--gap-3);flex-direction:column;width:100%;display:flex}.menu-btn,.summary-btn{width:100%;font-family:var(--font-display);letter-spacing:.08em;color:var(--hud-text);cursor:pointer;background:#ffffff0a;border:2px solid #ffffff1f;border-radius:9999px;padding:12px 24px;font-size:16px;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px #0000004d}.menu-btn:hover,.summary-btn:not(:disabled):hover{border-color:var(--theme-player);background:#ffffff14;transform:translateY(-1px);box-shadow:0 0 15px #5fb6c859}.menu-btn--resume:hover{border-color:var(--accent-success);box-shadow:0 0 15px #5de07359}.menu-btn--restart:hover,.summary-btn--restart:hover{border-color:var(--theme-accent);box-shadow:0 0 15px #f0a00059}.menu-btn:focus-visible,.summary-btn:focus-visible{outline:2px solid var(--theme-player);outline-offset:2px}.summary-banner{width:100%;padding:var(--gap-2) var(--gap-3);margin-bottom:var(--gap-3);border-radius:12px}.summary-banner--success{background:#5ce0731a;border:2px solid #5ce0734d}.summary-banner--success h2{color:var(--accent-success);text-shadow:0 0 10px #5ce07366}.summary-banner--failure{background:#ff5e481a;border:2px solid #ff5e484d}.summary-banner--failure h2{color:var(--accent-danger);text-shadow:0 0 10px #ff5e4866}.summary-score-container{gap:var(--gap-1);margin-bottom:var(--gap-4);flex-direction:column;display:flex}.summary-score-label{letter-spacing:.15em;color:var(--hud-text-dim);font-size:11px;font-weight:700}.summary-score-val{font-family:var(--font-display);letter-spacing:.05em;color:var(--theme-accent);text-shadow:0 0 15px #f0a00066;font-size:44px;font-weight:800}.summary-stats-grid{gap:var(--gap-4);width:100%;margin-bottom:var(--gap-3);padding:var(--gap-4) var(--gap-4);background:#ffffff05;border-radius:12px;grid-template-columns:1fr 1fr;display:grid}.summary-stat-cell{text-align:left;flex-direction:column;align-items:center;display:flex}.summary-stat-label{letter-spacing:.08em;color:var(--hud-text-dim);font-size:10px;font-weight:700}.summary-stat-value{font-family:var(--font-display);color:var(--hud-text);font-variant-numeric:tabular-nums;margin-top:4px;font-size:18px;font-weight:800}.summary-btn--continue:disabled{opacity:.5;color:var(--hud-text-dim);border-color:var(--hud-border);cursor:not-allowed;background:#ffffff05}.summary-btn--quit{color:var(--hud-text);background:0 0;border:2px solid #ffffff1f}.summary-btn--quit:hover{background:#ffffff14;border-color:#ffffff3d}.home-overlay{z-index:100;-webkit-backdrop-filter:blur(8px);pointer-events:auto;background:#0009;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.home-content{text-align:center;align-items:center;gap:var(--gap-3);flex-direction:column;min-width:320px;max-width:420px;border-radius:24px!important}.home-title{font-family:var(--font-display);letter-spacing:.15em;color:var(--theme-player);text-shadow:0 0 20px #4ec0d680;margin:0;font-size:36px;font-weight:900}.home-subtitle{letter-spacing:.12em;color:var(--hud-text-dim);margin:0;font-size:12px;font-weight:600}.home-logo{width:120px;height:120px;color:var(--theme-accent);opacity:.9;margin:var(--gap-2) 0}.home-logo svg{filter:drop-shadow(0 0 10px #ffa0004d)}.home-buttons{gap:var(--gap-2);width:100%;margin-top:var(--gap-3);flex-direction:column;display:flex}.home-btn{width:100%;font-family:var(--font-display);letter-spacing:.1em;cursor:pointer;border:2px solid #0000;border-radius:12px;padding:12px 20px;font-size:14px;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1)}.home-btn--primary{background:var(--theme-player);color:#080e16;box-shadow:0 4px 12px #4ec0d64d}.home-btn--primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4ec0d680}.home-btn--secondary{background:var(--theme-accent);color:#080e16;box-shadow:0 4px 12px #ffa0004d}.home-btn--secondary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #ffa00080}.home-btn--secondary:disabled{opacity:.4;cursor:not-allowed}.home-btn--tertiary{color:var(--hud-text);background:0 0;border:2px solid #ffffff1f}.home-btn--tertiary:hover{background:#ffffff14;border-color:#ffffff3d}.home-credits{color:var(--hud-text-dim);letter-spacing:.06em;margin-top:var(--gap-2);font-size:10px}.showcase-overlay{z-index:1000;-webkit-backdrop-filter:blur(16px);pointer-events:auto;background:#04080ccc;justify-content:center;align-items:center;animation:.3s ease-out overlay-fade-in;display:flex;position:fixed;inset:0}.showcase-content{text-align:center;flex-direction:column;align-items:center;width:94%;max-width:980px;animation:.35s cubic-bezier(.16,1,.3,1) content-slide-up;display:flex;box-shadow:0 20px 50px #0009,inset 0 1px #ffffff1a;padding:var(--gap-4) var(--gap-4)!important;border-color:#ffffff26!important;border-radius:24px!important;overflow:visible!important}.showcase-title{font-family:var(--font-display);letter-spacing:.1em;color:var(--theme-player);text-shadow:0 0 15px #4ec0d666;margin:0;font-size:30px;font-weight:800}.showcase-subtitle{font-family:var(--font-display);letter-spacing:.2em;color:var(--hud-text-dim);text-transform:uppercase;margin-top:4px;font-size:14px;font-weight:600}.showcase-posters{gap:var(--gap-3);width:100%;margin:var(--gap-3) 0;display:flex;overflow:visible}.showcase-poster{cursor:pointer;min-width:0;height:380px;font-family:var(--font-ui);color:var(--hud-text);isolation:isolate;background:radial-gradient(120% 80% at 50% 18%,#4ec0d61a,#0000 70%),linear-gradient(#1c2a3a8c,#080e16bf);border:2px solid #ffffff1a;border-radius:16px;flex:1 1 0;padding:0;transition:border-color .3s,box-shadow .3s,transform .3s;position:relative;overflow:visible}.showcase-poster:hover,.showcase-poster:focus-visible{border-color:var(--theme-player);outline:none;box-shadow:0 0 28px #4ec0d638}.showcase-poster__images{pointer-events:none;position:absolute;inset:0}.showcase-poster__img{pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 8px 14px #00000073);will-change:transform;transition:transform .45s cubic-bezier(.16,1,.3,1),filter .45s;position:absolute}.showcase-poster[data-poster=viewer] .layer-battleship{transform-origin:10% 0;width:100%;top:0%;left:2%}.showcase-poster[data-poster=viewer]:hover .layer-battleship{transform:translate(-6%,-16%)scale(1.1)rotate(-2deg)}.showcase-poster[data-poster=viewer] .layer-pirate{transform-origin:110% 0;width:70%;top:22%;right:28%}.showcase-poster[data-poster=viewer]:hover .layer-pirate{transform:translate(12%,-10%)scale(1.1)}.showcase-poster[data-poster=viewer] .layer-lighthouse{transform-origin:85% 120%;width:24%;bottom:0%;right:3%}.showcase-poster[data-poster=viewer]:hover .layer-lighthouse{transform:translate(10%,3%)scale(1.18)}.showcase-poster[data-poster=editor] .layer-submarine{transform-origin:80% 10%;width:100%;top:4%;left:0%}.showcase-poster[data-poster=editor]:hover .layer-submarine{transform:translate(4%,-9%)scale(1.13)}.showcase-poster[data-poster=editor] .layer-toolbar{transform-origin:-140% 100%;width:94%;bottom:14%;left:2%}.showcase-poster[data-poster=editor]:hover .layer-toolbar{transform:translate(-7%,3%)scale(1.06)}.showcase-poster[data-poster=tuner] .layer-tuner{transform-origin:90% -40%;width:80%;top:6%;right:8%}.showcase-poster[data-poster=tuner]:hover .layer-tuner{transform:translate(11%,-11%)scale(1.17)}.showcase-poster__gradient{pointer-events:none;z-index:2;background:linear-gradient(#0000,#04080c8c 45%,#04080cf0 82%);border-radius:0 0 14px 14px;height:42%;position:absolute;bottom:0;left:0;right:0}.showcase-poster__text{padding:var(--gap-3);text-align:left;z-index:3;pointer-events:none;position:absolute;bottom:0;left:0;right:0}.showcase-poster__title{font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--hud-text);font-size:17px;font-weight:700}.showcase-poster__desc{color:var(--hud-text-dim);margin-top:3px;font-size:12px;line-height:1.4}@media (width<=720px){.showcase-posters{flex-direction:column}.showcase-poster{height:240px}}@media (width<=600px){[data-action=showcase]{display:none!important}}.showcase-close{width:100%;max-width:300px;font-family:var(--font-display);letter-spacing:.08em;color:var(--hud-text);cursor:pointer;margin-top:var(--gap-2);background:0 0;border:2px solid #ffffff1f;border-radius:9999px;padding:12px 24px;font-size:14px;font-weight:700;transition:all .2s}.showcase-close:hover{background:#ffffff14;border-color:#ffffff3d}.showcase-iframe-modal{z-index:1001;background:#04080cf2;border-radius:20px;flex-direction:column;margin:50px;animation:.2s ease-out overlay-fade-in;display:flex;position:fixed;inset:0;overflow:hidden;box-shadow:0 25px 60px #000000b3,0 0 0 1px #ffffff14}.showcase-iframe-header{align-items:center;gap:var(--gap-3);padding:10px var(--gap-4);background:#080e16f2;border-bottom:1px solid #ffffff1a;flex-shrink:0;display:flex}.showcase-iframe-label{font-family:var(--font-display);letter-spacing:.06em;color:var(--hud-text);flex:1;font-size:16px;font-weight:700}.showcase-demo-badge{font-family:var(--font-display);letter-spacing:.12em;color:var(--theme-player);background:#4ec0d61f;border:1px solid #4ec0d64d;border-radius:9999px;padding:3px 10px;font-size:10px;font-weight:700}.showcase-iframe-back{font-family:var(--font-display);letter-spacing:.04em;color:var(--hud-text-dim);cursor:pointer;background:0 0;border:1px solid #ffffff1f;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:700;transition:all .15s}.showcase-iframe-back:hover{color:var(--hud-text);border-color:var(--theme-player)}.showcase-iframe{background:#080e16;border:none;flex:1;width:100%}.summary-wrapper{align-items:center;gap:var(--gap-4);flex-direction:column;width:90%;max-width:480px;display:flex}.summary-share-bar{align-items:center;gap:var(--gap-2);width:100%;animation:.3s ease-out content-slide-up;display:flex;border-radius:9999px!important;padding:10px 18px!important}.share-url{font-family:var(--font-display);letter-spacing:.03em;color:var(--hud-text-dim);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:13px;font-weight:600;overflow:hidden}.share-copy-btn{width:32px;height:32px;color:var(--hud-text-dim);cursor:pointer;pointer-events:auto;background:#ffffff0f;border:1.5px solid #ffffff1f;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:all .15s;display:flex}.share-copy-btn:hover{color:var(--hud-text);border-color:var(--theme-player);background:#ffffff1a}.share-action-btn{font-family:var(--font-display);letter-spacing:.08em;color:#080e16;background:var(--theme-player);cursor:pointer;white-space:nowrap;pointer-events:auto;border:none;border-radius:9999px;flex-shrink:0;padding:8px 18px;font-size:12px;font-weight:700;transition:all .2s}.share-action-btn:hover{transform:translateY(-1px);box-shadow:0 0 12px #4ec0d666}.summary-feedback-section{gap:var(--gap-2);flex-direction:column;width:100%;animation:.35s ease-out content-slide-up;display:flex;border-radius:20px!important;padding:14px 20px!important}.summary-feedback-section--done{justify-content:center;align-items:center}.feedback-header-row{justify-content:space-between;align-items:center;gap:var(--gap-3);display:flex}.feedback-prompt{font-family:var(--font-display);letter-spacing:.04em;color:var(--hud-text);white-space:nowrap;font-size:15px;font-weight:700}.feedback-stars{gap:4px;display:flex}.feedback-star{color:#ffffff2e;cursor:pointer;pointer-events:auto;background:0 0;border:none;padding:2px 3px;font-size:26px;line-height:1;transition:color .12s,transform .12s}.feedback-star--hover{color:var(--theme-accent);transform:scale(1.15)}.feedback-star--active{color:var(--theme-accent);text-shadow:0 0 8px #ffa00080}.feedback-detail{gap:var(--gap-2);flex-direction:column;width:100%;animation:.25s ease-out content-slide-up;display:flex}.feedback-comment{width:100%;min-height:48px;font-family:var(--font-ui);color:var(--hud-text);resize:vertical;pointer-events:auto;background:#0000004d;border:1.5px solid #ffffff1a;border-radius:10px;outline:none;padding:10px 14px;font-size:13px;transition:border-color .2s}.feedback-comment::placeholder{color:var(--hud-text-dim)}.feedback-comment:focus{border-color:var(--theme-player)}.feedback-bottom-row{gap:var(--gap-2);align-items:center;display:flex}.feedback-category{font-family:var(--font-display);letter-spacing:.04em;color:var(--hud-text);cursor:pointer;pointer-events:auto;background:#0000004d;border:1.5px solid #ffffff1a;border-radius:8px;outline:none;flex:1;padding:8px 12px;font-size:12px;font-weight:600}.feedback-category:focus{border-color:var(--theme-player)}.feedback-category option{color:var(--hud-text);background:#0a1018}.feedback-submit{font-family:var(--font-display);letter-spacing:.08em;color:#080e16;background:var(--theme-player);cursor:pointer;white-space:nowrap;pointer-events:auto;border:none;border-radius:8px;padding:8px 20px;font-size:12px;font-weight:700;transition:all .2s}.feedback-submit:hover{transform:translateY(-1px);box-shadow:0 0 12px #4ec0d666}.feedback-thanks{text-align:center;font-family:var(--font-display);letter-spacing:.06em;color:var(--accent-success);padding:var(--gap-2) 0;font-size:14px;font-weight:700}@media (width<=500px){.feedback-header-row{align-items:flex-start;gap:var(--gap-1);flex-direction:column}}.summary-layout{align-items:flex-start;gap:var(--gap-6);flex-direction:row;justify-content:center;width:90%;max-width:860px;margin:0 auto;display:flex}.summary-history-panel{gap:var(--gap-3);flex-direction:column;flex-shrink:0;align-items:stretch;width:320px;min-height:200px;animation:.3s ease-out content-slide-up;display:flex;padding:var(--gap-4)!important}.summary-history-panel .history-title{font-family:var(--font-display);letter-spacing:.08em;color:var(--hud-text);border-bottom:1px solid var(--hud-border);padding-bottom:var(--gap-2);text-align:left;margin:0;font-size:13px;font-weight:700}.summary-history-panel .history-table{border-collapse:collapse;background:0 0;border:none;width:100%;font-size:11px}.summary-history-panel .history-table th{text-align:left;color:var(--hud-text-dim);letter-spacing:.04em;border-bottom:1px solid #ffffff1a;padding:8px 0;font-weight:600}.summary-history-panel .history-table td{color:var(--hud-text);border-bottom:1px solid #ffffff0a;padding:8px 0}@media (width<=820px){.summary-layout{flex-direction:column;align-items:center;max-width:480px}.summary-history-panel{width:100%;max-width:480px}}#infographic{z-index:100;width:100%;height:100%;display:none;position:fixed;inset:0}#infographic.is-open{display:block}#infographic-scroll{z-index:101;-webkit-overflow-scrolling:touch;background:0 0;width:100%;height:100%;display:none;position:fixed;inset:0;overflow:hidden scroll}#infographic-scroll.is-open{display:block}#infographic-scroll{scrollbar-width:none;-ms-overflow-style:none}#infographic-scroll::-webkit-scrollbar{display:none}#infographic-scroll .infographic-scroll-spacer{pointer-events:none;width:1px}#dive-overlay{z-index:102;pointer-events:none;opacity:0;background:#0a1428;width:100%;height:100%;transition:opacity .18s;display:none;position:fixed;inset:0}#dive-overlay.is-open{display:block}.infographic-panel{z-index:103;color:#e8eef6;-webkit-backdrop-filter:blur(8px);pointer-events:none;background:#080e16d9;border:1px solid #ffffff26;border-radius:12px;max-width:420px;padding:20px 24px;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.6;position:fixed;box-shadow:0 8px 32px #0009}@supports ((-webkit-backdrop-filter:blur(8px)) or (backdrop-filter:blur(8px))){.infographic-panel{background:#080e16b8}}.infographic-panel h2{letter-spacing:.02em;color:#ffa000;margin:0 0 12px;font-size:18px;font-weight:600}.infographic-panel p{color:#c4d0e0;margin:10px 0;font-size:14px}.infographic-panel p:first-of-type{margin-top:0}.infographic-panel p:last-of-type{margin-bottom:0}.infographic-scroll-hint{z-index:107;letter-spacing:.08em;color:#e8eef680;pointer-events:none;opacity:1;text-transform:uppercase;text-align:right;font-family:Inter,system-ui,-apple-system,sans-serif;font-size:12px;transition:opacity .3s;position:fixed;bottom:24px;right:28px}.infographic-back-btn{z-index:107;pointer-events:auto;cursor:pointer;letter-spacing:.1em;text-transform:uppercase;color:#e8eef6;-webkit-backdrop-filter:blur(8px);background:#080e16b8;border:1px solid #ffa00073;border-radius:8px;padding:9px 18px;font-family:Inter,system-ui,-apple-system,sans-serif;font-size:12px;font-weight:600;transition:opacity .3s,background .16s,border-color .16s;position:fixed;top:20px;left:50%;transform:translate(-50%)}.infographic-back-btn:hover{background:#141e2cd9;border-color:#ffa000e6}.infographic-back-btn.hidden{opacity:0;pointer-events:none}.infographic-scroll-hint.hidden{opacity:0}.infographic-scroll-hint:before{content:"↑";margin-bottom:4px;font-size:18px;animation:2s ease-in-out infinite float-pulse;display:block}@keyframes float-pulse{0%,to{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}.infographic-copy{z-index:105;pointer-events:none;opacity:0;text-shadow:0 2px 10px #020810d9;scrollbar-width:thin;scrollbar-color:#ffffff38 transparent;width:min(30vw,400px);max-height:62vh;padding-right:8px;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;position:fixed;top:50%;right:110px;overflow-y:auto;transform:translateY(-50%)}.infographic-copy::-webkit-scrollbar{width:5px}.infographic-copy::-webkit-scrollbar-thumb{background:#ffffff38;border-radius:3px}.infographic-copy h2{letter-spacing:.01em;color:#f2f6fb;margin:0 0 14px;font-size:30px;font-weight:700}.infographic-copy p{color:#cbd8e8;margin:0 0 14px;font-size:18px;line-height:1.65}.infographic-copy.hidden{display:none}.infographic-depthhud{z-index:106;pointer-events:none;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;position:fixed;bottom:20px;left:22px}.infographic-depthhud.hidden{display:none}.depth-meter{width:30px;height:150px;margin-bottom:10px;position:relative}.depth-track{background:#ffa0008c;width:2px;position:absolute;top:0;bottom:0;left:12px}.depth-tick{background:#ffa00073;width:6px;height:1px;position:absolute;left:7px}.depth-tick.major{background:#ffa000b3;width:11px;left:2px}.depth-marker{background:#ffa0004d;border-radius:50%;width:5px;height:5px;transition:background .25s,box-shadow .25s;position:absolute;left:17px;transform:translateY(50%)}.depth-marker.active{background:#ffd27a;box-shadow:0 0 7px #ffb240e6}.depth-needle{filter:drop-shadow(0 0 3px #ffb240b3);border-top:4px solid #0000;border-bottom:4px solid #0000;border-right:8px solid #ffd27a;width:0;height:0;position:absolute;left:20px;transform:translateY(50%)}.depth-readout{font-variant-numeric:tabular-nums;letter-spacing:.06em;color:#ffd79b;margin-bottom:3px;font-size:13px;font-weight:600}.depth-title{letter-spacing:.16em;text-transform:uppercase;color:#e8eef68c;font-size:10px}.infographic-letterbox{z-index:106;pointer-events:none;background:#02060c;height:7vh;transition:transform .7s cubic-bezier(.22,1,.36,1);position:fixed;left:0;right:0;transform:scaleY(0)}.infographic-letterbox--top{transform-origin:top;top:0}.infographic-letterbox--bottom{transform-origin:bottom;bottom:0}.infographic-letterbox.is-open{transform:scaleY(1)}