@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Saira+Condensed:wght@500;600;700&display=swap";*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0;padding:0}body{overscroll-behavior:none;background:#14171a}.kh-root{--kh-bg:#14171a;--kh-bg-lift:#1d242b;--kh-line:#2a3037;--kh-ink:#dfe5e9;--kh-muted:#727d85;--kh-hold:#36c5b0;--kh-alert:#f2a33c;--kh-engage:#e5484d;--kh-cease:#6ea8fe;--kh-display:"Saira Condensed", "Arial Narrow", Impact, sans-serif;--kh-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;background:radial-gradient(120% 70% at 50% 0%, var(--kh-bg-lift) 0%, var(--kh-bg) 62%);height:100dvh;color:var(--kh-ink);font-family:var(--kh-mono);-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;flex-direction:column;font-size:14px;display:flex;overflow:hidden}.kh-sr{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.kh-header{padding:calc(10px + env(safe-area-inset-top)) max(16px, env(safe-area-inset-left)) 8px max(16px, env(safe-area-inset-right));border-bottom:1px solid var(--kh-line);justify-content:space-between;align-items:center;gap:12px;display:flex}.kh-logo{fill:currentColor;width:auto;height:clamp(20px,4.6vw,26px);color:var(--kh-ink);flex:none;display:block}.kh-tag{letter-spacing:.08em;color:var(--kh-muted);white-space:nowrap;font-size:11px}.kh-strip{width:100%;max-width:760px;padding:8px max(16px, env(safe-area-inset-left)) 0 max(16px, env(safe-area-inset-right));margin:0 auto}.kh-strip-row{letter-spacing:.1em;color:var(--kh-muted);justify-content:space-between;gap:8px;font-size:11px;display:flex}.kh-strip-row strong{color:var(--kh-ink);font-weight:700}.kh-pips{flex-wrap:wrap;justify-content:center;gap:4px;margin-top:7px;display:flex}.kh-pip{border:1px solid var(--kh-line);background:0 0;width:7px;height:7px}.kh-pip--correct{background:var(--kh-hold);border-color:var(--kh-hold)}.kh-pip--fatal,.kh-pip--missed{background:var(--kh-engage);border-color:var(--kh-engage)}.kh-pip--premature,.kh-pip--complacent{background:var(--kh-alert);border-color:var(--kh-alert)}.kh-pip--minor{background:var(--kh-muted);border-color:var(--kh-muted)}.kh-pip--armed{border-color:var(--kh-alert);animation:1s linear infinite alternate kh-pip-blink}@keyframes kh-pip-blink{0%{opacity:.5;box-shadow:0 0 #0000}to{opacity:1;box-shadow:0 0 5px #f2a33c99}}.kh-stage{flex:1;justify-content:center;align-items:center;min-height:0;padding:8px 12px;display:flex}.kh-frame{aspect-ratio:1;border:1px solid var(--kh-line);background:radial-gradient(75% 75% at 50% 45%,#dfe5e90a,#0000 70%),repeating-linear-gradient(0deg,#0000 0 23px,#dfe5e908 23px 24px),repeating-linear-gradient(90deg,#0000 0 23px,#dfe5e908 23px 24px),linear-gradient(#161b20,#14171a);width:clamp(220px,min(80vw,44vh),340px);position:relative}.kh-frame:after{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#0000001a 0 1px,#0000 1px 3px);position:absolute;inset:0}.kh-corner{z-index:4;border:2px solid #aeb9c2;width:15px;height:15px;position:absolute}.kh-corner--tl{border-bottom:0;border-right:0;top:-1px;left:-1px}.kh-corner--tr{border-bottom:0;border-left:0;top:-1px;right:-1px}.kh-corner--bl{border-top:0;border-right:0;bottom:-1px;left:-1px}.kh-corner--br{border-top:0;border-left:0;bottom:-1px;right:-1px}.kh-ms{letter-spacing:.1em;color:var(--kh-muted);z-index:4;font-size:10px;position:absolute;top:7px;right:9px}.kh-reticle{z-index:1;width:88%;height:88%;position:absolute;top:6%;left:6%}.kh-reticle circle,.kh-reticle line{fill:none}.kh-ring-ticks{stroke:#3a424b;stroke-width:3.5px;stroke-dasharray:.42 1.58}.kh-ring-spin{stroke:#4a545e;stroke-width:1.5px;stroke-dasharray:6 4.5 1 4.5;opacity:.55;transform-origin:100px 100px;animation:26s linear infinite kh-rotate}@keyframes kh-rotate{to{transform:rotate(360deg)}}.kh-ring-track{stroke:var(--kh-line);stroke-width:5px;opacity:.55}.kh-ring-progress{stroke:var(--kh-alert);stroke-width:5px;filter:drop-shadow(0 0 5px #f2a33c8c);transition:stroke .12s linear,opacity .25s linear}.kh-ring-progress.is-critical{stroke:var(--kh-engage);filter:drop-shadow(0 0 7px #e5484db3)}.kh-frame[data-phase=waiting] .kh-ring-progress{opacity:.12}.kh-ring-cardinals line{stroke:#8d99a3;stroke-width:2px}.kh-silhouette{z-index:2;fill:#444d55;stroke:#57626c;stroke-width:1.5px;width:54%;transition:opacity .12s linear;animation:.16s ease-out kh-rise;position:absolute;bottom:9%;left:23%}@keyframes kh-rise{0%{opacity:0;transform:translateY(10%)}to{opacity:1;transform:none}}.kh-frame[data-phase=feedback] .kh-silhouette,.kh-frame[data-phase=feedback] .kh-cue{opacity:.22}.kh-cue{z-index:3;letter-spacing:.08em;text-align:center;background:#101316e0;border:1px solid #39414a;justify-content:center;align-items:center;gap:8px;width:max-content;max-width:86%;padding:5px 12px;font-size:clamp(12px,3.6vw,15px);font-weight:600;transition:opacity .12s linear;display:inline-flex;position:absolute;bottom:27%;left:50%;transform:translate(-50%);box-shadow:0 2px 10px #0006}.kh-cue-glyph{color:#9aa6b0;font-weight:400}.kh-scan{z-index:2;letter-spacing:.28em;color:var(--kh-muted);justify-content:center;align-items:center;font-size:11px;display:flex;position:absolute;inset:0}.kh-scan-dots{animation:1.2s steps(2,end) infinite kh-blink}@keyframes kh-blink{50%{opacity:0}}.kh-falsestart{z-index:6;color:var(--kh-engage);letter-spacing:.12em;white-space:nowrap;background:#e5484d1a;border:1px solid #e5484d99;padding:4px 10px;font-size:11px;font-weight:700;animation:.12s ease-out kh-pop;position:absolute;top:10%;left:50%;transform:translate(-50%)}.kh-flash{z-index:5;text-align:center;background:radial-gradient(60% 50%,#0a0c0ed9,#0a0c0e4d 75%,#0000);flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:12%;animation:.14s ease-out kh-pop;display:flex;position:absolute;inset:0}.kh-flash--correct{--fc:var(--kh-hold)}.kh-flash--fatal,.kh-flash--missed{--fc:var(--kh-engage)}.kh-flash--premature,.kh-flash--complacent{--fc:var(--kh-alert)}.kh-flash--minor{--fc:#9aa6b0}.kh-flash-label{font-family:var(--kh-display);letter-spacing:.1em;color:var(--fc);font-size:clamp(15px,4.2vw,22px);font-weight:700}.kh-flash-delta{color:var(--fc);text-shadow:0 0 16px color-mix(in srgb, var(--fc) 55%, transparent);font-size:clamp(22px,7vw,34px);font-weight:700}@keyframes kh-pop{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.kh-controls{width:100%;max-width:760px;padding:10px max(12px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));grid-template-columns:1fr 1fr;gap:10px;margin:0 auto;display:grid}.kh-btn{--c:var(--kh-muted);border:1px solid color-mix(in srgb, var(--c) 45%, var(--kh-line));background:linear-gradient(180deg, color-mix(in srgb, var(--c) 10%, transparent), color-mix(in srgb, var(--c) 3%, transparent)), #181d22;min-height:62px;color:var(--kh-ink);font-family:var(--kh-mono);text-align:left;cursor:pointer;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;align-items:center;gap:10px;padding:8px 10px 8px 14px;display:flex;position:relative}.kh-btn:before{content:"";background:var(--c);width:3px;position:absolute;top:0;bottom:0;left:0}.kh-btn:active{background:linear-gradient(180deg, color-mix(in srgb, var(--c) 24%, transparent), color-mix(in srgb, var(--c) 10%, transparent)), #181d22;transform:translateY(1px)}.kh-btn[data-cat=hold]{--c:var(--kh-hold)}.kh-btn[data-cat=alert]{--c:var(--kh-alert)}.kh-btn[data-cat=engage]{--c:var(--kh-engage)}.kh-btn[data-cat=cease]{--c:var(--kh-cease)}.kh-btn-key{border:1px solid color-mix(in srgb, var(--c) 70%, transparent);width:26px;height:26px;color:var(--c);font-family:var(--kh-mono);flex:none;place-items:center;font-size:13px;font-weight:700;display:grid}.kh-btn-text{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.kh-btn-name{font-family:var(--kh-display);letter-spacing:.09em;font-size:clamp(14px,3.9vw,17px);font-weight:700;line-height:1.1}.kh-btn-action{letter-spacing:.06em;color:var(--kh-muted);text-transform:uppercase;font-size:10px}.kh-panel-wrap{min-height:0;padding:16px max(16px, env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));flex:1;display:flex;overflow-y:auto}.kh-panel{border:1px solid var(--kh-line);clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);background:linear-gradient(#181d23,#15191d);width:100%;max-width:600px;margin:auto;padding:clamp(18px,4.5vw,32px)}.kh-panel-kicker{letter-spacing:.3em;color:var(--kh-alert);margin:0 0 6px;font-size:11px}.kh-panel-kicker:before{content:"▸ "}.kh-panel-title{font-family:var(--kh-display);letter-spacing:.06em;text-wrap:balance;margin:0 0 12px;font-size:clamp(26px,6.5vw,40px);font-weight:700;line-height:1.02}.kh-panel-copy{color:#aab4bc;text-wrap:pretty;margin:0 0 16px;font-size:12.5px;line-height:1.65}.kh-legend{border-top:1px solid var(--kh-line);margin:0 0 16px;padding:0;list-style:none}.kh-legend-row{--c:var(--kh-muted);border-bottom:1px solid var(--kh-line);grid-template-columns:30px 104px 1fr;align-items:start;gap:10px;padding:9px 0;display:grid}.kh-legend-row[data-cat=hold]{--c:var(--kh-hold)}.kh-legend-row[data-cat=alert]{--c:var(--kh-alert)}.kh-legend-row[data-cat=engage]{--c:var(--kh-engage)}.kh-legend-row[data-cat=cease]{--c:var(--kh-cease)}.kh-legend-key{border:1px solid color-mix(in srgb, var(--c) 70%, transparent);width:24px;height:24px;color:var(--c);font-family:var(--kh-mono);place-items:center;font-size:12px;font-weight:700;display:grid}.kh-legend-name{font-family:var(--kh-display);letter-spacing:.08em;color:var(--c);padding-top:3px;font-size:16px;font-weight:600}.kh-legend-desc{color:var(--kh-muted);padding-top:4px;font-size:11px;line-height:1.55}.kh-panel-note{color:var(--kh-muted);margin:0 0 18px;font-size:11px;line-height:1.6}.kh-panel-note--tight{margin:-6px 0 14px}.kh-panel-note kbd{font-family:var(--kh-mono);border:1px solid var(--kh-line);color:var(--kh-ink);padding:0 4px}.kh-panel-best{letter-spacing:.14em;color:var(--kh-alert);margin:0 0 14px;font-size:11px}.kh-cta{border:1px solid var(--kh-alert);background:color-mix(in srgb, var(--kh-alert) 9%, transparent);width:100%;min-height:52px;color:var(--kh-alert);font-family:var(--kh-display);letter-spacing:.16em;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));padding:13px 24px;font-size:19px;font-weight:700;display:block}.kh-cta:hover,.kh-cta:active{background:color-mix(in srgb, var(--kh-alert) 18%, transparent)}.kh-panel--debrief{max-width:640px}.kh-scoreline{justify-content:space-between;align-items:flex-end;gap:16px;margin:4px 0 16px;display:flex}.kh-scoreline-label{letter-spacing:.22em;color:var(--kh-muted);font-size:10px;display:block}.kh-scoreline-value{font-family:var(--kh-display);letter-spacing:.02em;font-size:clamp(46px,13vw,72px);font-weight:700;line-height:.95}.kh-scoreline-best{text-align:right;padding-bottom:6px;font-size:15px;font-weight:700}.kh-record{letter-spacing:.14em;color:var(--kh-alert);margin-top:3px;font-size:10px;font-weight:700;animation:.55s steps(2,end) .8s 2 backwards kh-blink;display:block}.kh-stamp{--sc:var(--kh-ink);border:2px solid var(--sc);color:var(--sc);background:color-mix(in srgb, var(--sc) 6%, transparent);transform-origin:0;flex-direction:column;gap:3px;margin:0 0 18px;padding:8px 16px 9px;animation:.26s cubic-bezier(.16,1,.3,1) .55s backwards kh-stamp-in;display:inline-flex;transform:rotate(-2deg)}.kh-stamp--elite{--sc:var(--kh-alert)}.kh-stamp--good{--sc:var(--kh-hold)}.kh-stamp--pass{--sc:var(--kh-ink)}.kh-stamp--retrain{--sc:#b08a52}.kh-stamp--fail{--sc:var(--kh-engage)}.kh-stamp-label{font-family:var(--kh-display);letter-spacing:.12em;font-size:clamp(18px,5vw,24px);font-weight:700;line-height:1}.kh-stamp-sub{letter-spacing:.16em;opacity:.85;font-size:9.5px}@keyframes kh-stamp-in{0%{opacity:0;transform:rotate(-2deg)scale(1.45)}}.kh-seq{align-items:center;gap:10px;margin:0 0 16px;display:flex}.kh-seq-label{letter-spacing:.16em;color:var(--kh-muted);flex:none;font-size:9.5px}.kh-seq-pips{flex-wrap:wrap;gap:4px;display:flex}.kh-stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 16px;display:grid}.kh-stat{border:1px solid var(--kh-line);background:#14181c;padding:9px 10px;animation:.22s cubic-bezier(.16,1,.3,1) backwards kh-row-in}.kh-stat:first-child{animation-delay:40ms}.kh-stat:nth-child(2){animation-delay:90ms}.kh-stat:nth-child(3){animation-delay:.14s}.kh-stat:nth-child(4){animation-delay:.19s}.kh-stat:nth-child(5){animation-delay:.24s}.kh-stat:nth-child(6){animation-delay:.29s}@keyframes kh-row-in{0%{opacity:0;transform:translateY(7px)}}.kh-stat dt{letter-spacing:.12em;color:var(--kh-muted);margin-bottom:4px;font-size:9.5px}.kh-stat dd{font-family:var(--kh-display);margin:0;font-size:23px;font-weight:700;line-height:1}.kh-stat[data-bad] dd{color:var(--kh-engage)}.kh-achievements{border-top:1px solid var(--kh-line);margin:0 0 14px;padding:0;list-style:none}.kh-ach{border-bottom:1px solid var(--kh-line);opacity:.6;align-items:center;gap:10px;padding:8px 0;animation:.22s cubic-bezier(.16,1,.3,1) backwards kh-ach-in;display:flex}.kh-ach:first-child{animation-delay:.36s}.kh-ach:nth-child(2){animation-delay:.42s}.kh-ach:nth-child(3){animation-delay:.48s}.kh-ach:nth-child(4){animation-delay:.54s}@keyframes kh-ach-in{0%{opacity:0;transform:translateY(7px)}}.kh-ach[data-unlocked]{opacity:1}.kh-ach[data-unlocked] .kh-ach-mark{animation:.3s cubic-bezier(.16,1,.3,1) .62s backwards kh-mark-pop}@keyframes kh-mark-pop{0%{opacity:0;transform:scale(1.6)}}.kh-ach-mark{color:var(--kh-muted);flex:none;font-size:14px}.kh-ach[data-unlocked] .kh-ach-mark{color:var(--kh-alert)}.kh-ach-body{flex-direction:column;flex:1;gap:1px;min-width:0;display:flex}.kh-ach-name{font-family:var(--kh-display);letter-spacing:.09em;font-size:15px;font-weight:600}.kh-ach-detail{color:var(--kh-muted);font-size:10.5px}.kh-btn:focus-visible,.kh-cta:focus-visible{outline:2px solid var(--c,var(--kh-alert));outline-offset:3px}@media (width>=540px){.kh-controls{grid-template-columns:repeat(4,1fr)}.kh-btn{min-height:58px}}@media (width>=768px){.kh-frame{width:clamp(240px,min(60vw,48vh),340px)}.kh-stage{padding:16px}}@media (width<=460px){.kh-stats{grid-template-columns:repeat(2,1fr)}}@media (prefers-reduced-motion:reduce){.kh-ring-spin,.kh-silhouette,.kh-flash,.kh-falsestart,.kh-scan-dots,.kh-pip--armed,.kh-stat,.kh-ach,.kh-ach[data-unlocked] .kh-ach-mark,.kh-stamp,.kh-record{animation:none}}