:root{--sky-light: #e8f6fd;--sky: #12aae1;--sky-dark: #0e8fbd;--navy: #0a2f4e;--navy-dark: #071f34;--yellow: #ffd13f;--yellow-soft: #fff9dc;--slate-25: #fcfdfe;--slate-50: #f8fafc;--slate-100: #f1f5f9;--slate-200: #e2e8f0;--slate-400: #94a3b8;--slate-500: #64748b;--slate-700: #334155;--slate-800: #1e293b;--danger: #b91c1c;--success: #047857;--bg: var(--slate-25);--surface: #ffffff;--ink: var(--slate-800);--muted: var(--slate-500);--line: var(--slate-200);--radius-sm: 10px;--radius: 16px;--radius-lg: 24px;--shadow-sm: 0 1px 2px rgba(10, 47, 78, .05), 0 4px 14px rgba(10, 47, 78, .05);--shadow: 0 18px 48px rgba(10, 47, 78, .1);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}.app{max-width:1040px;margin:0 auto;padding:28px 20px 64px}.app-header{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-bottom:18px;margin-bottom:28px;border-bottom:1px solid var(--line)}.app-header:after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:3px;background:linear-gradient(90deg,var(--yellow) 0 11%,var(--sky) 11% 36%,transparent 36%)}.brand{display:flex;align-items:center;gap:14px}.brand-home{padding:0;border:0;background:none;line-height:0;border-radius:14px;cursor:pointer}.brand-home:hover .brand-mark{opacity:.9}.brand-home:focus-visible{outline:2px solid var(--sky-dark);outline-offset:2px}.brand-mark{flex:none;width:52px;height:52px;border-radius:14px;object-fit:cover;display:block}.app-header h1{margin:0;font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--navy)}.tagline{margin:2px 0 0;color:var(--muted);font-size:15px}.status-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:#e7f7ee;border:1px solid #bfe6d0;color:var(--success);font-weight:700;font-size:14px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success)}.status-badge.warn{background:var(--yellow-soft);border-color:#f0dca0;color:#8a6a12}.status-badge.warn .status-dot{background:#d99a00}.status-badge.loading{background:var(--slate-100);border-color:var(--line);color:var(--slate-500)}.status-badge.loading .status-dot{background:var(--slate-400)}.site-disclaimer{color:var(--muted);font-size:12px;text-align:center}.top-disclaimer{margin-bottom:8px;line-height:1.25}.site-disclaimer-footer{margin-top:32px;padding-top:18px;border-top:1px solid var(--line)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm)}h2{margin:0 0 6px;font-weight:700;letter-spacing:-.01em;color:var(--navy)}h3{margin:0 0 12px;font-size:16px;font-weight:700;color:var(--navy)}.muted{color:var(--muted)}.small{font-size:13px}button{font:inherit;cursor:pointer;border-radius:var(--radius-sm);border:1px solid transparent;transition:transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}button:active{transform:translateY(1px)}button:disabled{opacity:.58;cursor:default}.primary{background:var(--sky-dark);color:#fff;padding:11px 18px;font-weight:600;min-height:44px;box-shadow:0 8px 22px #0e8fbd38}.primary:hover:not(:disabled){background:var(--navy);transform:translateY(-1px)}.big{padding:13px 24px;font-size:16px;min-height:50px}.ghost{background:#fff;border-color:var(--line);color:var(--slate-700);padding:10px 14px;font-weight:600;width:100%;min-height:44px}.ghost:hover:not(:disabled){color:var(--navy);background:var(--slate-50)}.link{background:none;border:none;color:var(--muted);text-decoration:underline;padding:8px;width:100%;font-size:13px}.link:hover{color:var(--sky-dark)}.error{background:#fdecec;border:1px solid #f3c4c4;color:var(--danger);padding:10px 14px;border-radius:var(--radius-sm);margin:12px 0;font-size:14px}.error.in-chat{margin:0 16px}.start h2{margin-bottom:4px}.start .muted{max-width:64ch}.start-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.difficulty-picker{border:0;padding:0;margin:14px 0 0}.difficulty-picker legend{margin-bottom:7px;padding:0;color:var(--navy);font-size:13px;font-weight:700}.difficulty-options{display:inline-grid;grid-template-columns:repeat(4,minmax(72px,1fr));overflow:hidden;border:1px solid var(--line);border-radius:9px;background:var(--surface)}.difficulty-options label{padding:7px 13px;border-right:1px solid var(--line);color:var(--muted);font-size:13px;font-weight:650;text-align:center;cursor:pointer}.difficulty-options label:last-child{border-right:0}.difficulty-options label.selected{background:var(--navy);color:#fff}.difficulty-options input{position:absolute;opacity:0;pointer-events:none}.difficulty-options label:focus-within{outline:2px solid var(--sky-dark);outline-offset:-2px}.difficulty-badge{display:inline-flex;align-items:center;width:fit-content;padding:3px 8px;border-radius:999px;background:var(--slate-100);color:var(--navy);font-size:11px;font-weight:750;letter-spacing:.02em;white-space:nowrap}.difficulty-badge.easy,.difficulty-badge.easier{background:#e8f6ee;color:#22633d}.difficulty-badge.hard,.difficulty-badge.harder{background:#fff0e7;color:#91471f}.scene-topline{display:flex;align-items:center;justify-content:space-between;gap:8px}.start .difficulty-help{margin:6px 0 0;font-size:12px}.shuffle{width:auto;flex:none;white-space:nowrap}.shuffle-mobile{display:none}@media (max-width: 640px){.start-head>div{width:100%}.shuffle-desktop{display:none}.shuffle-mobile{display:block;width:100%;margin-top:4px}}.scenario.skeleton{min-height:84px;border-color:var(--line);cursor:default;background:linear-gradient(100deg,var(--slate-100) 30%,var(--slate-50) 50%,var(--slate-100) 70%);background-size:200% 100%;animation:shimmer 1.2s infinite linear}.loading-status{display:flex;align-items:center;gap:10px;margin-top:18px;padding:10px 14px;border-radius:var(--radius-sm);background:var(--sky-light);color:var(--navy);font-size:14px;font-weight:500}.spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(10,47,78,.15);border-top-color:var(--sky-dark);animation:spin .8s linear infinite;flex:none}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.scenario-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:20px 0}.scenario{text-align:left;background:var(--slate-50);border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:14px;display:flex;flex-direction:column;gap:5px}.scenario:hover{border-color:#b8ddec}.scenario-label{font-weight:700;color:var(--navy);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scenario-blurb{font-size:13px;color:var(--muted)}.scenario-start{width:100%;margin-top:auto;padding:9px 12px;font-size:13px}.start-transition-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;padding:20px;background:#f8fafce6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.start-transition-card{width:min(420px,100%);padding:28px 24px 22px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);text-align:center}.start-transition-card .spinner{width:26px;height:26px;margin:0 auto 14px;display:block;border-width:3px}.start-transition-card h2{margin-bottom:6px}.start-transition-card p{margin:0 0 18px}.start-transition-card button{min-width:120px}.home{display:flex;flex-direction:column;gap:32px}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;margin-top:8px}.hero-eyebrow{margin:0 0 14px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:13px;color:var(--sky-dark)}.hero-title{margin:0 0 18px;font-weight:800;letter-spacing:-.03em;line-height:.98;font-size:clamp(40px,6vw,72px)}.hero-title .ink{display:block;color:var(--navy)}.hero-title .sky{display:block;color:var(--sky)}.hero-sub{margin:0 0 28px;max-width:46ch;font-size:clamp(16px,1.4vw,19px);color:var(--slate-700);line-height:1.5}.hero-cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.hero-cta span{display:inline-block;margin-left:2px;transition:transform .15s ease}.hero-cta:hover:not(:disabled) span{transform:translate(3px)}.hero-secondary{display:inline-flex;align-items:center;gap:8px;min-height:50px;padding:13px 20px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--navy);font-weight:600;box-shadow:var(--shadow-sm)}.hero-secondary:hover{background:var(--sky-light);border-color:var(--sky);color:var(--sky-dark)}.hero-note{color:var(--muted);font-size:14px}.hero-art{position:relative;min-height:360px;display:flex;align-items:center;justify-content:center}.hero-photo-wrap{min-height:clamp(360px,48vw,560px);justify-content:flex-end}.hero-photo{width:min(420px,100%);max-height:560px;object-fit:cover;object-position:center;border-radius:32px;box-shadow:0 28px 70px #0a20362e}.hero-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 68% 42%,rgba(18,170,225,.22),transparent 62%);z-index:0}.art-card{border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.art-card.back1,.art-card.back2{position:absolute;width:78%;height:76%;z-index:1}.art-card.back2{transform:translate(16%,-18%) rotate(5deg);background:var(--slate-50)}.art-card.back1{transform:translate(9%,-9%) rotate(2.5deg)}.art-card.front{position:relative;z-index:2;width:min(380px,94%);padding:22px}.art-badge{width:42px;height:42px;border-radius:11px;background:var(--sky);display:grid;place-items:center;margin-bottom:14px;box-shadow:0 6px 16px #12aae159}.art-eyebrow{margin:0;text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:800;color:var(--slate-400)}.art-name{margin:6px 0 0;font-size:20px;color:var(--navy)}.art-region{margin:0 0 16px;color:var(--muted);font-size:13px}.art-bubble{font-size:14px;line-height:1.4;padding:10px 13px;border-radius:13px;margin-bottom:8px}.art-bubble.them{background:var(--sky-light);color:var(--navy);border-top-left-radius:4px}.art-bubble.you{margin-left:auto;max-width:72%;background:var(--sky-dark);color:#fff;border-top-right-radius:4px}.art-divider{height:1px;background:var(--line);margin:14px 0 12px}.art-foot{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.art-foot .k{color:var(--sky-dark);font-weight:700}.how-title{text-align:center;margin-bottom:16px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.how-step .how-num{font-size:13px;font-weight:800;letter-spacing:.08em;color:var(--sky)}.how-step h3{margin:8px 0 6px}.how-step p{margin:0;color:var(--muted);font-size:14px}@media (max-width: 820px){.hero{grid-template-columns:1fr;gap:24px}.how-grid{grid-template-columns:1fr}}.chat-layout{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}.scene{position:sticky;top:20px}.scene-eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--sky-dark);font-weight:700}.scene h3{margin:6px 0 2px;font-size:19px}.scene-region{margin:0;color:var(--muted);font-size:14px}.scene-facts{list-style:none;padding:0;margin:14px 0;display:flex;flex-direction:column;gap:6px}.scene-facts li{background:var(--slate-100);padding:6px 10px;border-radius:8px;font-size:13px}.scene-impression{font-style:italic;color:var(--muted);font-size:14px}.scene-counter{font-size:12px;color:var(--muted);margin:14px 0 10px}.conversation{display:flex;flex-direction:column;padding:0;height:min(72vh,680px);position:relative}.difficulty-badge.hardest{background:#fee2e2;color:#991b1b}@media (max-width: 420px){.difficulty-options{width:100%;grid-template-columns:repeat(2,1fr)}.difficulty-options label:nth-child(2){border-right:0}.difficulty-options label:nth-child(-n+2){border-bottom:1px solid var(--line)}}.conversation-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 14px;border-bottom:1px solid var(--line);background:var(--slate-50);border-radius:var(--radius) var(--radius) 0 0}.hint-button{width:auto;padding:6px 14px;border:1px solid var(--sky-dark);border-radius:999px;background:var(--sky-dark);color:#fff;box-shadow:0 2px 7px #0e749038;font-size:12px;font-weight:750;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.hint-button:hover:not(:disabled){background:var(--navy);border-color:var(--navy);box-shadow:0 4px 10px #0e749047;transform:translateY(-1px)}.hint-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:108;display:grid;place-items:center;padding:20px;background:#f8fafceb;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.hint-card{position:relative;width:min(500px,100%);padding:28px 26px 24px;border:1px solid #b8ddec;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.hint-kicker{margin-bottom:5px;color:var(--sky-dark);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.hint-card h2{margin:0 34px 10px 0;color:var(--navy)}.hint-card p{color:var(--muted)}.hint-card>.primary{width:100%}.hint-close{position:absolute;top:13px;right:14px;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:25px;line-height:1;cursor:pointer}.hint-close:hover{background:var(--slate-100);color:var(--navy)}.read-aloud-toggle{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:650;cursor:pointer;-webkit-user-select:none;user-select:none}.read-aloud-toggle>input{position:absolute;opacity:0;pointer-events:none}.toggle-track{width:34px;height:19px;padding:2px;border-radius:999px;background:#cbd5e1;transition:background .18s ease}.toggle-track span{display:block;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0f172a40;transition:transform .18s ease}.read-aloud-toggle>input:checked+.toggle-track{background:var(--sky-dark)}.read-aloud-toggle>input:checked+.toggle-track span{transform:translate(15px)}.read-aloud-toggle>input:focus-visible+.toggle-track{outline:2px solid var(--sky);outline-offset:2px}.messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:12px}.bubble-row{display:flex}.bubble-row.missionary{justify-content:flex-end}.bubble{max-width:78%;padding:10px 14px;border-radius:14px;background:var(--sky-light)}.bubble-row.missionary .bubble{background:var(--sky-dark);color:#fff}.bubble .who{display:block;font-size:11px;font-weight:700;opacity:.7;margin-bottom:2px}.bubble p{margin:0;white-space:pre-wrap}.typing .dot{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:50%;background:var(--slate-400);animation:blink 1.2s infinite both}.typing .dot:nth-child(2){animation-delay:.2s}.typing .dot:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}.composer{display:flex;gap:10px;padding:14px;border-top:1px solid var(--line)}.composer textarea{flex:1;resize:none;font:inherit;padding:10px 12px;border:1.5px solid var(--line);border-radius:var(--radius-sm);background:var(--slate-50)}.composer textarea:focus{outline:none;border-color:var(--sky);background:#fff}.voice-button{width:auto;min-width:78px;padding:9px 12px;border:1.5px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--navy);font-weight:700;cursor:pointer}.voice-button span{margin-right:5px;color:var(--sky-dark)}.voice-button:hover:not(:disabled){border-color:var(--sky);background:var(--sky-light)}.voice-button.listening{border-color:#e78b8b;background:#fff1f1;color:var(--danger)}.voice-button.listening span{color:var(--danger);animation:voice-pulse 1s ease-in-out infinite}@keyframes voice-pulse{50%{opacity:.35}}@media (max-width: 520px){.composer{flex-wrap:wrap}.composer textarea{flex-basis:100%}.voice-button,.composer>.primary{flex:1}}.mobile-debrief{display:none}.abuse-warning-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:110;display:grid;place-items:center;padding:20px;background:#f8fafceb;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.abuse-warning-card{width:min(460px,100%);padding:26px 24px;border:1px solid #fecaca;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);text-align:center}.abuse-warning-card h2{color:var(--danger)}.abuse-warning-card p{margin:8px 0 20px}.debrief{display:flex;flex-direction:column;gap:16px}.debrief-hero{display:flex;gap:22px;align-items:center}.score-ring{flex:none;width:110px;height:110px;border-radius:50%;display:grid;place-items:center;border:6px solid var(--success);background:#e7f3ee}.score-ring.mid{border-color:var(--yellow);background:var(--yellow-soft)}.score-ring.low{border-color:var(--danger);background:#fdecec}.score-num{font-size:34px;font-weight:800;line-height:1;color:var(--navy)}.score-of{font-size:12px;color:var(--muted)}.headline{font-size:17px;margin:4px 0 10px}.hero-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--muted)}.tag{padding:4px 10px;border-radius:999px;font-weight:600}.tag.good{background:var(--sky-light);color:var(--sky-dark)}.tag.warn{background:#fdecec;color:var(--danger)}.debrief-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.stack{display:flex;flex-direction:column;gap:16px}.score-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}.score-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:600}.score-list .muted{margin:2px 0 0}.dots{display:inline-flex;gap:4px}.pip{width:10px;height:10px;border-radius:50%;background:var(--slate-200)}.pip.on{background:var(--sky)}.bullets{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}.bullets li{font-size:14px}.bullets.good li::marker{color:var(--success)}.bullets.warn li::marker{color:var(--yellow)}.reveal-list{margin:12px 0 0;display:flex;flex-direction:column;gap:10px}.reveal-list>div{display:grid;grid-template-columns:150px 1fr;gap:12px}.reveal-list dt{color:var(--muted);font-size:13px}.reveal-list dd{margin:0}.reveal-list .highlight dd{font-weight:400;color:var(--navy)}.encouragement{background:var(--sky-light);border-color:#b8ddec;font-size:15px}.debrief-actions{display:flex;justify-content:center}@media (max-width: 820px){.chat-layout{display:flex;flex-direction:column}.conversation{order:1;width:100%;height:100dvh;min-height:100svh;flex:0 0 100dvh}.conversation:focus-within{height:100dvh;min-height:100svh}.scene{order:3;position:static}.scene-debrief,.scene-quit{display:none}.mobile-debrief{order:2;display:flex;flex-direction:column;align-items:stretch;gap:5px;padding:10px 14px 4px}.mobile-quit{align-self:center}.debrief-grid{grid-template-columns:1fr}.reveal-list>div{grid-template-columns:1fr;gap:2px}}.debrief-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#f8fafceb;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:10;display:grid;place-items:center;padding:24px;border-radius:var(--radius)}.debrief-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px 22px 20px}.debrief-title{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--navy);font-size:17px}.progress{margin-top:14px;height:6px;background:var(--sky-light);border-radius:999px;overflow:hidden}.progress-bar{height:100%;width:40%;background:linear-gradient(90deg,transparent,var(--sky),transparent);animation:progress-slide 1.4s ease-in-out infinite}@keyframes progress-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}.debrief-steps{list-style:none;margin:16px 0 8px;padding:0;display:flex;flex-direction:column;gap:8px}.debrief-step{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted);transition:color .2s ease}.debrief-step .step-marker{width:18px;height:18px;flex:none;display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--line);font-size:11px;line-height:1;background:var(--surface);color:var(--muted)}.debrief-step.active{color:var(--ink);font-weight:500}.debrief-step.active .step-marker{border-color:var(--sky);color:var(--sky-dark);animation:pulse 1.2s ease-in-out infinite}.debrief-step.done{color:var(--slate-700)}.debrief-step.done .step-marker{border-color:var(--success);color:var(--success)}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.6}}.debrief-hint{margin:12px 0 0;font-size:13px;text-align:center}