@import"https://fonts.googleapis.com/css2?family=Barlow:wght@500;600;700&family=Public+Sans:wght@400;500;600;700&display=swap";:root{--font-display: "Barlow", "Segoe UI", sans-serif;--font-body: "Public Sans", "Segoe UI", sans-serif;--color-bg: #081421;--color-bg-elevated: #102438;--color-panel: #112d46;--color-panel-border: #32526e;--color-text: #f4f8fc;--color-text-muted: #b3c6d8;--color-primary: #24b6d9;--color-primary-strong: #0c95bb;--color-secondary: #6db87f;--color-warning: #e5ad59;--color-error: #da5e5e;--color-chip-correct: #1d7f5f;--color-chip-incorrect: #9d4747;--color-chip-missing: #a56f23;--color-chip-extra: #6b558f;--shadow-panel: 0 20px 40px rgba(2, 10, 18, .35);--radius-panel: 16px;--radius-soft: 10px;--space-xs: .4rem;--space-sm: .75rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--transition-default: .18s ease}*{box-sizing:border-box}:root{color-scheme:dark}html,body,#root{width:100%;height:100%;min-height:100%}html,body{max-height:100dvh;background-color:var(--color-bg);overscroll-behavior-y:none;overflow:hidden}html{background:radial-gradient(circle at 10% 20%,rgba(36,182,217,.18),transparent 30%),radial-gradient(circle at 90% 10%,rgba(109,184,127,.18),transparent 35%),linear-gradient(180deg,#06111d,#0a1d2f 45%,#081421)}body{margin:0;font-family:var(--font-body);color:var(--color-text);min-height:100dvh;background:radial-gradient(circle at 10% 20%,rgba(36,182,217,.18),transparent 30%),radial-gradient(circle at 90% 10%,rgba(109,184,127,.18),transparent 35%),linear-gradient(180deg,#06111d,#0a1d2f 45%,#081421);background-repeat:no-repeat;background-size:cover}#root{min-height:100%;background:transparent;overflow:hidden}button,input,textarea{font:inherit}button{color:inherit}h1,h2,h3,p{margin:0}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.app-shell{width:min(980px,100vw - 1rem);height:100dvh;margin:0 auto;padding:.75rem 0;display:grid;grid-template-rows:auto auto auto 1fr;gap:.65rem;overflow:hidden}.app-shell.app-shell-session{grid-template-rows:auto auto 1fr}.view-shell{min-height:0;height:100%;display:flex}.view-island{min-height:0;height:100%;border-radius:var(--radius-panel);border:1px solid var(--color-panel-border);background:linear-gradient(165deg,#112d46f0,#102438f2);box-shadow:var(--shadow-panel);overflow:hidden}.view-island.view-island-session{border-color:#6696b599}.app-header{position:relative;display:grid;gap:.4rem;padding:.95rem 1rem;border:1px solid rgba(95,153,187,.35);border-radius:var(--radius-panel);background:linear-gradient(150deg,#102438f0,#0d1e2ecc);box-shadow:var(--shadow-panel);overflow:hidden}.app-header:after{content:"";position:absolute;inset:auto -40px -70px auto;width:140px;height:140px;background:radial-gradient(circle,rgba(36,182,217,.35),transparent 70%)}.kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--color-secondary);font-size:.72rem;font-weight:700}.app-header h1{font-family:var(--font-display);font-size:clamp(1.55rem,5vw,2.1rem);letter-spacing:.03em;line-height:1.1}.subtitle{color:var(--color-text-muted);font-size:.94rem}.experience-switch{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:.35rem;margin-top:.25rem;background:#081b2ab3;border:1px solid rgba(93,137,167,.44);border-radius:999px;padding:.25rem}.experience-button{border:none;border-radius:999px;background:transparent;color:var(--color-text-muted);font-weight:700;letter-spacing:.04em;padding:.45rem .55rem;cursor:pointer;transition:background var(--transition-default),color var(--transition-default)}.experience-button.active{background:linear-gradient(150deg,#24b6d94d,#0c95bb6b);color:var(--color-text)}.panel{display:grid;grid-auto-rows:min-content;gap:.7rem;width:100%;height:100%;min-height:0;padding:.95rem;border-radius:0;border:none;background:transparent;box-shadow:none;overflow:hidden}.panel h2{font-family:var(--font-display);font-size:1.3rem;line-height:1.1}.panel-copy{color:var(--color-text-muted);line-height:1.35;font-size:.9rem}.field-label{font-weight:600;font-size:.88rem}.text-input,.manual-input{width:100%;border:1px solid rgba(101,148,180,.6);border-radius:var(--radius-soft);padding:.7rem .8rem;color:var(--color-text);background:#07162399;transition:border-color var(--transition-default),box-shadow var(--transition-default)}.text-input{text-transform:uppercase;letter-spacing:.05em}.text-input:focus,.manual-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #24b6d933}.mode-picker{border:1px solid rgba(101,148,180,.5);border-radius:var(--radius-soft);padding:.65rem;display:grid;gap:.5rem}.mode-picker legend{font-size:.84rem;color:var(--color-text-muted);padding:0 .3rem}.mode-option{display:flex;align-items:center;gap:.55rem;font-size:.9rem}.mode-option input{accent-color:var(--color-primary)}.challenge-toggle{display:flex;align-items:flex-start;gap:.55rem;border:1px solid rgba(101,148,180,.45);border-radius:var(--radius-soft);padding:.6rem;font-size:.88rem}.challenge-toggle input{margin-top:.17rem;accent-color:var(--color-primary)}.support-note,.support-banner{border-radius:var(--radius-soft);border:1px solid rgba(229,173,89,.65);background:#e5ad5926;color:#ffdcab;padding:.65rem .8rem;font-size:.84rem}.button-row{display:flex;gap:.6rem;flex-wrap:wrap}.button{border:none;border-radius:var(--radius-soft);padding:.65rem .85rem;cursor:pointer;font-weight:600;transition:transform .13s cubic-bezier(.2,.9,.3,1),opacity .13s ease,background .13s ease,border-color .13s ease}.button:hover{transform:translateY(-1px) scale(1.01)}.button:disabled{opacity:.55;cursor:not-allowed;transform:none}.button-primary{background:linear-gradient(150deg,var(--color-primary),var(--color-primary-strong));color:#022030}.button-secondary{background:linear-gradient(150deg,#2a4b63,#253f54);color:var(--color-text)}.button-ghost{border:1px solid rgba(126,164,189,.62);background:transparent;color:var(--color-text-muted)}.target-block,.hint-block,.transcript,.error-block,.unknown-block,.challenge-insights{border:1px solid rgba(99,147,178,.38);border-radius:var(--radius-soft);background:#06142080;padding:.75rem}.target-text{margin-top:.22rem;font-family:var(--font-display);font-size:clamp(1.1rem,4vw,1.45rem);letter-spacing:.07em}.overline{text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-muted);font-size:.68rem;font-weight:700}.voice-capture,.manual-capture{display:grid;gap:.6rem}.record-button{width:fit-content;min-width:165px;border:none;border-radius:999px;padding:.7rem 1rem;cursor:pointer;font-weight:700;letter-spacing:.04em;background:linear-gradient(150deg,#7ec0d9,#3fa4c3);color:#022030;transition:transform var(--transition-default),box-shadow var(--transition-default)}.record-button.recording{background:linear-gradient(140deg,#df7b66,#d35454);color:#fff3ed;box-shadow:0 0 #da5e5e8c;animation:pulse 1.2s ease-in-out infinite}.transcript{min-height:58px;color:var(--color-text-muted);line-height:1.35;font-size:.9rem;overflow:hidden}.result-title{font-family:var(--font-display)}.result-title.success{color:#8ee1bf}.result-title.partial{color:#f3ca8b}.result-title.fail{color:#e08a8a}.stats-grid,.challenge-status-grid,.challenge-insights-grid{display:grid;gap:.6rem;grid-template-columns:repeat(3,minmax(0,1fr))}.stat-card{display:grid;gap:.12rem;border-radius:var(--radius-soft);padding:.62rem;border:1px solid rgba(116,159,187,.4);background:#06142094}.stat-value{font-family:var(--font-display);font-size:1.12rem}.stat-label{color:var(--color-text-muted);font-size:.73rem;text-transform:uppercase;letter-spacing:.08em}.comparison-grid{display:grid;gap:.6rem}.chip-row{display:flex;flex-wrap:wrap;gap:.32rem;margin-top:.3rem}.chip{display:inline-flex;align-items:center;justify-content:center;min-width:1.65rem;padding:.22rem .38rem;border-radius:8px;font-weight:700;letter-spacing:.02em;font-size:.84rem}.chip-correct{background:#1d7f5f73;border:1px solid rgba(109,184,151,.85)}.chip-incorrect{background:#9d474773;border:1px solid rgba(221,128,128,.85)}.chip-missing{background:#a56f2373;border:1px solid rgba(229,173,89,.9)}.chip-extra{background:#6b558f7a;border:1px solid rgba(165,139,202,.9)}.error-block,.unknown-block{font-size:.85rem}.error-block h3,.unknown-block h3,.challenge-insights h3{font-size:.92rem;font-family:var(--font-display);margin-bottom:.42rem}.error-block ul,.challenge-insights ul{margin:0;padding-left:1.05rem;display:grid;gap:.35rem;color:var(--color-text-muted);max-height:none;overflow:visible}.error-block li,.unknown-block p{color:var(--color-text-muted)}.error-banner{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.62rem .82rem;border-radius:var(--radius-soft);border:1px solid rgba(218,94,94,.72);background:#da5e5e38;font-size:.86rem}.error-dismiss{border:none;background:transparent;color:#ffd8d8;cursor:pointer;font-weight:700}.challenge-run{position:relative}.challenge-requesting{grid-template-rows:auto auto 1fr auto}.challenge-flag{margin:0;padding:.35rem .55rem;border-radius:999px;width:fit-content;border:1px solid rgba(36,182,217,.55);background:#24b6d933;font-size:.76rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.permission-screen{min-height:0;height:100%;display:grid;align-content:center}.permission-shell{display:grid;justify-items:center;gap:.45rem;border:1px solid rgba(117,164,191,.5);border-radius:var(--radius-soft);background:linear-gradient(150deg,#0c2234eb,#081a28f2);padding:1rem .9rem}.permission-spinner{width:48px;height:48px;border-radius:50%;border:3px solid rgba(126,190,217,.2);border-top-color:#7ebed9f2;animation:permissionSpin .8s linear infinite}.permission-title{margin:0;font-family:var(--font-display);font-size:.98rem;text-transform:uppercase;letter-spacing:.06em}.permission-copy{margin:0;color:var(--color-text-muted);font-size:.85rem;text-align:center;line-height:1.35}.arming-shell{position:relative;border:1px solid rgba(223,123,102,.58);border-radius:var(--radius-soft);background:radial-gradient(circle at 50% 35%,#da5e5e3d,#091925d9);padding:1rem .85rem;display:grid;justify-items:center;gap:.35rem;overflow:hidden}.arming-button{position:relative;z-index:1;width:88px;height:88px;border-radius:50%;border:none;font-family:var(--font-display);font-size:1.2rem;letter-spacing:.06em;color:#ffdedd;background:radial-gradient(circle,#f26d6d,#bf4040 68%,#8f2222);box-shadow:0 0 18px #f26d6d59}.arming-button:before,.arming-button:after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(242,140,125,.45);pointer-events:none;animation:armingWave 1.8s cubic-bezier(.16,.82,.38,1) infinite}.arming-button:after{animation-delay:.9s}.arming-title{position:relative;z-index:1;font-family:var(--font-display);font-size:1.02rem;letter-spacing:.04em;text-transform:uppercase}.arming-copy{position:relative;z-index:1;color:#ffd4d4;font-size:.86rem;font-weight:700}.countdown-wrap{display:grid;justify-items:center;align-items:center;gap:.28rem;padding:.7rem;border:1px solid rgba(125,165,189,.42);border-radius:var(--radius-soft);background:#0717258a}.countdown-value{font-family:var(--font-display);font-size:clamp(2.4rem,9vw,3.6rem);line-height:1;color:#81d9ea;text-shadow:0 0 20px rgba(36,182,217,.55);animation:relayCountdown .65s ease both}.countdown-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.73rem}.relay-shell{position:relative;border:1px solid rgba(113,159,187,.5);border-radius:var(--radius-soft);background:linear-gradient(180deg,#03101be6,#061826f2),repeating-linear-gradient(0deg,rgba(120,168,195,.08) 0px,rgba(120,168,195,.08) 1px,transparent 1px,transparent 3px);overflow:hidden;padding:.7rem}.relay-scanline{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(104,219,245,.14),transparent);transform:translateY(-100%);animation:relayScan 2.6s linear infinite}.relay-ledger{display:grid;gap:.28rem;margin-bottom:.58rem}.relay-target{color:#d2e6f4;font-weight:600;letter-spacing:.05em;font-size:.9rem}.relay-cells{display:flex;flex-wrap:wrap;gap:.28rem}.relay-cell{min-width:1.5rem;height:1.6rem;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;font-weight:700;letter-spacing:.02em;border:1px solid rgba(114,162,190,.45);background:#0e2334b8;color:#bfd7e8;font-size:.83rem;transition:transform .12s ease,border-color .12s ease,background .12s ease,color .12s ease}.relay-match{border-color:#6db897eb;background:#1d7f5f8f;color:#dbf5eb;box-shadow:0 0 8px #6db89773}.relay-fail{border-color:#e28282e6;background:#9d47478f;color:#ffe2e2;animation:relayGlitch .52s ease}.relay-pending{opacity:.68}.relay-transcript{border-style:dashed}.relay-hint-block{border:1px solid rgba(99,147,178,.38);border-radius:var(--radius-soft);background:#06142075;padding:.55rem .65rem;display:grid;gap:.35rem}.relay-hint-row{display:flex;align-items:center;justify-content:space-between;gap:.55rem}.relay-hint-row .overline{margin:0}.relay-hint-button{padding:.4rem .6rem;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase}.relay-hint-output{margin:0;color:var(--color-text-muted);font-size:.84rem;line-height:1.3}.challenge-result{grid-template-rows:auto 1fr auto}.challenge-result-main{min-height:0;overflow:auto;display:grid;gap:.6rem;padding-right:.1rem;-webkit-overflow-scrolling:touch}.challenge-transcript{border:1px solid rgba(99,147,178,.38);border-radius:var(--radius-soft);background:#06142075;padding:.62rem;display:grid;gap:.38rem}.challenge-transcript-text{margin:0;color:var(--color-text-muted);font-size:.82rem;line-height:1.35;word-break:break-word}.challenge-token-log{display:flex;flex-wrap:wrap;gap:.32rem}.challenge-token-entry{display:inline-flex;align-items:center;gap:.36rem;border:1px solid rgba(94,141,169,.54);border-radius:.58rem;background:#0b22328f;padding:.24rem .4rem;min-height:1.68rem}.challenge-token-letter{min-width:1.3rem;height:1.3rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.38rem;border:1px solid rgba(116,165,193,.46);background:#102a3eb3;color:#dff1fc;font-size:.76rem;font-weight:700;text-align:center;line-height:1;flex:0 0 auto}.challenge-token-letter-empty{border-style:dashed;background:#0e1c2a8f;color:transparent}.challenge-token-text{font-size:.8rem;color:#d7e8f5;font-weight:600;letter-spacing:.01em}.token-correct{border-color:#6db897c2;background:#1d7f5f38}.token-correct .challenge-token-letter{border-color:#7ed3aee6;background:#20916b99}.token-valid{border-color:#e6b96bb8;background:#a6722133}.token-valid .challenge-token-letter{border-color:#ecc27bf2;background:#ab782794;color:#fff4dd}.token-invalid{border-color:#b07a7ab8;background:#78464633}.token-invalid .challenge-token-text{color:#efd2d2}.challenge-token-legend{display:flex;flex-wrap:wrap;gap:.28rem}.challenge-token-legend-item{display:inline-flex;align-items:center;border:1px solid rgba(94,141,169,.54);border-radius:999px;padding:.2rem .46rem;font-size:.67rem;text-transform:uppercase;letter-spacing:.06em;color:#d7e8f5;font-weight:700}@keyframes revealDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{box-shadow:0 0 #da5e5e8c}to{box-shadow:0 0 0 12px #da5e5e00}}@keyframes relayScan{0%{transform:translateY(-110%)}to{transform:translateY(110%)}}@keyframes relayGlitch{0%{transform:translate(0)}30%{transform:translate(1px)}65%{transform:translate(-1px)}to{transform:translate(0)}}@keyframes relayCountdown{0%{transform:scale(.86);opacity:.5}to{transform:scale(1);opacity:1}}@keyframes armingWave{0%{transform:scale(1);opacity:.6}to{transform:scale(1.7);opacity:0}}@keyframes permissionSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:760px){.app-shell{width:100vw;padding:.5rem}.stats-grid,.challenge-status-grid,.challenge-insights-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.button{flex:1 1 auto}}