:root{
 --ink:#162238;--muted:#667085;--soft:#f6f8fa;--cream:#fffaf0;--card:#fff;--border:#e4e8ee;
 --navy:#13243a;--teal:#147d6f;--teal-dark:#0d6358;--lime:#dff6d8;--gold:#f1b84b;--red:#c84444;
 --shadow:0 12px 30px rgba(22,34,56,.07);--radius:18px;--shell:1120px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{color:inherit}button,input,textarea,select{font:inherit}.hidden{display:none!important}.site-shell{width:min(calc(100% - 32px),var(--shell));margin-inline:auto}.site-header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.nav{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:950;letter-spacing:-.03em}.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:1000}.nav-links{display:flex;align-items:center;gap:18px;font-size:.9rem;font-weight:750}.nav-links a{text-decoration:none;color:#475467}.nav-links a:hover{color:var(--teal)}.nav-cta{background:var(--navy)!important;color:#fff!important;padding:9px 14px;border-radius:12px}.mobile-menu{display:none}.hero{padding:66px 0 38px}.hero-grid{display:grid;grid-template-columns:1.07fr .93fr;gap:44px;align-items:center}.eyebrow,.challenge-label{font-size:.72rem;font-weight:950;letter-spacing:.12em;color:var(--teal)}h1,h2,h3{line-height:1.08;letter-spacing:-.04em}h1{font-size:clamp(42px,7vw,72px);margin:.35rem 0 1rem}h2{font-size:clamp(27px,4vw,40px)}h3{font-size:1.25rem}.hero-copy{font-size:1.08rem;color:var(--muted);max-width:660px}.hero-actions,.game-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.btn-primary,.btn-secondary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:12px;padding:11px 16px;font-weight:900;border:1px solid transparent;cursor:pointer}.btn-primary{background:var(--teal);color:#fff}.btn-primary:hover{background:var(--teal-dark)}.btn-secondary{background:#fff;border-color:var(--border);color:var(--ink)}.btn-ghost{background:transparent;color:var(--muted);border-color:transparent}.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.baseline-card{padding:20px}.baseline-card h2{font-size:1.55rem;margin:.3rem 0}.typing-target{font-size:1.12rem;line-height:1.7;padding:17px;border-radius:14px;background:var(--soft);border:1px solid var(--border);margin:14px 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.typing-input{width:100%;min-height:120px;resize:vertical;border:2px solid #d5dbe3;border-radius:14px;padding:14px;font-size:1rem;line-height:1.55;outline:none}.typing-input:focus{border-color:#7dbdaf;box-shadow:0 0 0 4px rgba(20,125,111,.09)}.mini-stats,.live-stats,.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stat,.result-box{border:1px solid var(--border);border-radius:13px;padding:10px;text-align:center;background:#fff}.stat strong,.result-box strong{display:block;font-size:1.15rem}.stat span,.result-box span{font-size:.72rem;color:var(--muted);font-weight:750}.section{padding:40px 0}.section-soft{background:var(--soft)}.section-cream{background:var(--cream)}.section-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:18px}.section-head h2{margin:.25rem 0 .35rem}.section-head p{margin:0;color:var(--muted);max-width:650px}.path-grid,.feature-grid,.game-grid,.practice-grid,.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.path-card,.feature-card,.game-card,.practice-card,.lesson-card{padding:18px;border:1px solid var(--border);border-radius:16px;background:#fff;text-decoration:none;color:inherit;transition:.15s ease}.path-card:hover,.game-card:hover,.practice-card:hover,.lesson-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#b9d9d2}.path-icon,.game-icon{font-size:1.7rem}.path-card h3,.feature-card h3,.game-card h3,.practice-card h3,.lesson-card h3{margin:.6rem 0 .35rem}.path-card p,.feature-card p,.game-card p,.practice-card p,.lesson-card p{margin:0;color:var(--muted);font-size:.9rem}.progress-strip{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--navy);color:#fff;border-radius:16px;margin:16px 0}.progress-strip strong{font-size:1rem}.progress-bar{height:8px;background:rgba(255,255,255,.18);border-radius:10px;overflow:hidden;flex:1}.progress-bar>span{display:block;height:100%;background:#d8f3dc}.callout{padding:18px;border-radius:16px;background:#eff8f5;border:1px solid #cce7df}.callout strong{display:block;margin-bottom:4px}.dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.dashboard-card{padding:16px;border:1px solid var(--border);border-radius:16px}.dashboard-card strong{display:block;font-size:1.5rem}.dashboard-card span{font-size:.78rem;color:var(--muted)}.keyboard{display:flex;flex-direction:column;gap:6px;margin:16px 0}.key-row{display:flex;justify-content:center;gap:5px}.key{min-width:42px;height:42px;padding:0 8px;border-radius:9px;border:1px solid var(--border);display:grid;place-items:center;font-size:.76rem;font-weight:900;background:#fff}.key.mastered{background:#dff6d8;border-color:#abd5a2}.key.strong{background:#e6f6f2;border-color:#aedbd0}.key.watch{background:#fff2cc;border-color:#e7cd7b}.key.weak{background:#fde8e8;border-color:#e5abab}.key.unseen{background:#f3f4f6;color:#98a2b3}.finger-note{font-size:.85rem;color:var(--muted)}.page-hero{padding:42px 0 22px}.page-hero h1{font-size:clamp(36px,5vw,56px)}.page-hero p{color:var(--muted);max-width:720px}.lesson-card{cursor:pointer;text-align:center;position:relative}.lesson-card.completed{border-color:#9fd6c6;background:#f4fbf8}.lesson-card.active{border-color:var(--teal);background:#eef8f5;box-shadow:0 0 0 3px rgba(20,125,111,.10),var(--shadow);transform:translateY(-2px)}.lesson-card.active h3{color:var(--teal-dark)}.lesson-card:focus-visible{outline:3px solid rgba(20,125,111,.28);outline-offset:3px}.lesson-card .done{color:var(--teal);font-weight:900;font-size:.78rem}.lesson-stage,.practice-stage,.play-stage,.daily-stage{padding:20px;margin:18px 0}.lesson-active-mode .page-hero{display:none}.lesson-workspace{scroll-margin-top:94px}.lesson-workspace-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.lesson-workspace .lesson-stage{margin:0}.lesson-back{background:#fff}.lesson-target{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--soft);padding:16px;border-radius:14px;line-height:1.8;font-size:1.05rem}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.pill{display:inline-flex;padding:6px 10px;border-radius:99px;background:#eef5f3;color:var(--teal-dark);font-size:.75rem;font-weight:900}.mode-tabs{display:flex;gap:8px;flex-wrap:wrap}.mode-tabs button{border:1px solid var(--border);background:#fff;border-radius:999px;padding:8px 11px;cursor:pointer;font-weight:800}.mode-tabs button.active{background:var(--navy);color:#fff}.play-shell{padding:28px 0 50px}.play-stage-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.live-stats{grid-template-columns:repeat(5,minmax(80px,1fr));min-width:min(100%,520px)}.event-banner{padding:10px 12px;border-radius:12px;background:#fff4cf;border:1px solid #e7cd7b;font-weight:850;margin:12px 0}.target-wrap{position:relative}.target-hidden{filter:blur(10px);user-select:none}.feedback{min-height:28px;margin-top:10px;font-weight:850}.feedback.good{color:var(--teal)}.feedback.encourage{color:var(--navy)}.feedback.bad{color:var(--red)}.result-panel{display:none;padding:22px;margin:18px 0}.result-panel.show{display:block}.result-score{font-size:clamp(34px,6vw,54px);font-weight:1000;letter-spacing:-.05em;color:var(--navy)}.coach-box{padding:15px;border-radius:14px;background:#f3f8ff;border:1px solid #d4e2f2;margin:14px 0}.dna-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.dna-item{padding:11px;border-radius:12px;background:var(--soft)}.dna-item strong{display:block}.dna-item span{font-size:.78rem;color:var(--muted)}.history-table{width:100%;border-collapse:collapse}.history-table th,.history-table td{text-align:left;padding:10px;border-bottom:1px solid var(--border);font-size:.86rem}.history-table th{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.site-footer{background:var(--navy);color:#d8e0e8;padding:30px 0;margin-top:40px}.footer-row{display:flex;justify-content:space-between;gap:20px;align-items:center}.site-footer a{color:#fff}.feedback-form{max-width:760px}.field{display:grid;gap:6px;margin:14px 0}.field label{font-weight:850}.field input,.field textarea,.field select{border:1px solid #ccd4dd;border-radius:11px;padding:11px;background:#fff}.field textarea{min-height:130px}.tiny{font-size:.76rem;color:var(--muted)}.daily-rounds{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.daily-round{padding:14px;border-radius:14px;border:1px solid var(--border)}.daily-round.active{border-color:#7dbdaf;background:#f2fbf8}.daily-round.done{background:#eff8f5}.milestone-list{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.milestone{padding:12px;border:1px solid var(--border);border-radius:12px}.milestone.done{background:#f2fbf8;border-color:#b8ddcf}.warning{background:#fff8e5;border:1px solid #edd38d;padding:13px;border-radius:12px}.success{background:#effaf5;border:1px solid #bfe3d1;padding:13px;border-radius:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.path-grid,.feature-grid,.game-grid,.practice-grid,.lesson-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:repeat(2,1fr)}.play-stage-head{display:block}.live-stats{margin-top:12px;grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.lesson-workspace-bar{align-items:flex-start}.lesson-workspace-bar .tiny{padding-top:10px}.site-shell{width:min(calc(100% - 22px),var(--shell))}.hero{padding-top:38px}.hero-grid{gap:22px}h1{font-size:clamp(38px,12vw,58px)}.section{padding:30px 0}.section-head{display:block}.section-head .btn-secondary{margin-top:10px}.path-grid,.feature-grid,.game-grid,.practice-grid,.lesson-grid{grid-template-columns:1fr}.mini-stats,.result-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:repeat(2,1fr)}.live-stats{grid-template-columns:repeat(2,1fr)}.key{min-width:28px;height:36px;padding:0 4px;font-size:.65rem}.keyboard{overflow-x:auto;padding-bottom:5px}.key-row{min-width:470px}.footer-row{display:block}.daily-rounds{grid-template-columns:1fr}.dna-grid,.milestone-list{grid-template-columns:1fr}.typing-input{min-height:140px}.quick-hide-mobile{display:none!important}}

/* TypingKong sound + commentary system */
.audio-control-button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;color:#475467;border-radius:11px;padding:8px 10px;font-weight:850;cursor:pointer;white-space:nowrap}.audio-control-button:hover,.audio-control-button[aria-expanded="true"]{border-color:#b9d9d2;color:var(--teal-dark);background:#f7fbfa}.typingkong-audio-panel{position:fixed;top:var(--typingkong-audio-top,74px);left:var(--typingkong-audio-left,auto);right:auto;z-index:90;width:min(390px,calc(100vw - 24px));max-height:calc(100vh - 88px);max-height:calc(100dvh - 88px);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:16px;border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:0 18px 48px rgba(19,36,58,.18);display:none}.typingkong-audio-panel.show{display:block}.audio-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:12px;border-bottom:1px solid var(--border)}.audio-panel-head strong{display:block;font-size:1rem}.audio-panel-head span{display:block;margin-top:2px;color:var(--muted);font-size:.76rem}.audio-panel-close{border:0;background:transparent;color:var(--muted);font-size:1.6rem;line-height:1;cursor:pointer}.audio-switch{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:13px 0;border-bottom:1px solid var(--border);cursor:pointer}.audio-switch span{display:block}.audio-switch strong{display:block;font-size:.9rem}.audio-switch small,.audio-voice-row small{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;line-height:1.35}.audio-switch input{width:20px;height:20px;accent-color:var(--teal)}.audio-voice-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;padding-top:13px}.audio-voice-row label{grid-column:1/-1}.audio-voice-row select{min-width:0;width:100%;border:1px solid #ccd4dd;border-radius:10px;padding:9px;background:#fff}.audio-voice-row .btn-secondary{padding:9px 12px}.audio-voice-status{grid-column:1/-1;margin-top:2px;color:var(--muted);font-size:.7rem;line-height:1.35}
@media(max-width:700px){.audio-control-text{display:inline}.audio-control-button{padding:9px 11px;min-height:44px}.typingkong-audio-panel{max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);border-radius:14px}.audio-voice-row{grid-template-columns:1fr}.audio-voice-row select{font-size:16px}.audio-voice-row .btn-secondary{width:100%}}


/* Learn teaching system */
.learn-section{min-height:calc(100vh - 110px)}
.lesson-intro-row{margin-bottom:14px}
.finger-guide{margin:16px 0 18px;padding:16px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(180deg,#fbfefd 0%,#f5faf8 100%)}
.finger-guide-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:12px}
.finger-guide-head h3{margin:.2rem 0 0;font-size:1.05rem}
.next-finger-guide{min-width:280px;max-width:480px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #cfe2dd;color:var(--navy);font-weight:900;font-size:.88rem;line-height:1.35}
.home-position-guide{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.home-position-guide span{padding:7px 10px;border-radius:999px;background:#fff;border:1px solid var(--border);font-size:.76rem;color:var(--muted)}
.home-position-guide strong{color:var(--navy)}
.learn-keyboard{display:flex;flex-direction:column;gap:6px;overflow-x:auto;padding:4px 0 8px}
.learn-key-row{display:flex;justify-content:center;gap:5px;min-width:690px}
.learn-key{position:relative;min-width:43px;height:42px;padding:0 7px;border:1px solid #cfd8e3;border-radius:9px;background:#fff;color:var(--navy);display:grid;place-items:center;font:900 .72rem/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 1px 0 rgba(19,36,58,.05);transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease,background .12s ease}
.learn-key.shift-key{min-width:76px}.learn-key.space-key{width:280px}
.learn-key.focus-key{border-color:#8fc8bb;box-shadow:inset 0 0 0 1px rgba(20,125,111,.08)}
.learn-key.next-key{border-color:var(--teal);box-shadow:0 0 0 3px rgba(20,125,111,.18);transform:translateY(-2px);font-size:.8rem}
.learn-key.home-bump::after{content:"";position:absolute;width:12px;height:2px;border-radius:3px;background:currentColor;bottom:4px;opacity:.45}
.learn-key.finger-lp,.finger-chip.finger-lp i{background:#f5eefc}.learn-key.finger-lr,.finger-chip.finger-lr i{background:#eef3fd}.learn-key.finger-lm,.finger-chip.finger-lm i{background:#eaf8fb}.learn-key.finger-li,.finger-chip.finger-li i{background:#e9f8f2}.learn-key.finger-ri,.finger-chip.finger-ri i{background:#f0f9e9}.learn-key.finger-rm,.finger-chip.finger-rm i{background:#fff8df}.learn-key.finger-rr,.finger-chip.finger-rr i{background:#fff0e7}.learn-key.finger-rp,.finger-chip.finger-rp i{background:#fcecef}.learn-key.finger-thumb,.finger-chip.finger-thumb i{background:#f0f2f5}
.learn-key.next-key{background:#fff}
.finger-legend{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:8px}
.finger-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:999px;border:1px solid transparent;color:var(--muted);font-size:.68rem;font-weight:800}
.finger-chip i{width:9px;height:9px;border-radius:50%;border:1px solid rgba(19,36,58,.12)}
.finger-chip.active{border-color:var(--teal);background:#fff;color:var(--teal-dark)}
.lesson-target-wrap{margin-top:14px}.lesson-target-label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:7px}.lesson-target{white-space:pre-wrap;word-break:normal}
.target-char{border-radius:3px}.target-char.typed-correct{color:#546375;background:#edf8f4}.target-char.typed-error{color:#9f2f2f;background:#fff0f0;text-decoration:underline}.target-char.current-char{box-shadow:inset 0 -2px 0 var(--teal);background:#fff8d9}
.lesson-metrics-row{margin-top:10px;justify-content:space-between}
.lesson-result{margin-top:18px;padding:18px;border:1px solid #b9ddd3;border-radius:16px;background:#f3fbf8}
.lesson-result h3{margin:.25rem 0 .35rem}.lesson-result p{margin:.2rem 0 0;color:var(--muted);max-width:780px}
.lesson-result-stats{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr));gap:9px;margin:14px 0}
.lesson-result-stats>div{padding:12px;border-radius:12px;background:#fff;border:1px solid #d9ebe6;text-align:center}.lesson-result-stats strong{display:block;font-size:1.25rem}.lesson-result-stats span{font-size:.7rem;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.lesson-result-actions{display:flex;gap:9px;flex-wrap:wrap}.lesson-result-actions .btn-primary,.lesson-result-actions .btn-secondary{text-decoration:none}
@media(max-width:700px){.finger-guide{padding:13px}.finger-guide-head{display:block}.next-finger-guide{min-width:0;max-width:none;margin-top:10px}.learn-key-row{min-width:590px}.learn-key{min-width:36px;height:38px;padding:0 5px;font-size:.64rem}.learn-key.shift-key{min-width:65px}.learn-key.space-key{width:240px}.lesson-result-stats{grid-template-columns:repeat(3,1fr)}.lesson-result-actions{display:grid}.lesson-result-actions>*{width:100%;text-align:center}}
/* TypingKong reward system */
.lesson-card.mastered{border-color:#83cbb9;background:#eef9f5}.lesson-card.perfect{border-color:#e0c46f;background:#fff9e8}.lesson-card.mastered .done{color:var(--teal-dark)}.lesson-card.perfect .done{color:#8b6b00}
.reward-panel{margin:16px 0;padding:16px;border:1px solid #cfe2dc;border-radius:15px;background:#fbfefd}.reward-panel.compact{padding:12px;margin:12px 0}.reward-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px}.reward-head>div{display:grid;gap:2px}.reward-head strong{font-size:1.55rem;color:var(--navy)}.reward-head>span{font-size:.78rem;color:var(--muted);font-weight:800}.reward-chip-row{display:flex;gap:7px;flex-wrap:wrap}.reward-chip{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;border:1px solid #d8e4e0;background:#fff;font-size:.75rem;font-weight:850;color:var(--ink)}.reward-chip.mastered{background:#edf8f4;border-color:#b9ddcf}.reward-chip.perfect{background:#fff7dc;border-color:#e5cf83}.reward-chip.achievement{background:#f2f5ff;border-color:#cfd8f4}.reward-chip.rank{background:#eef3f9;border-color:#cbd8e6}.reward-chip.record{background:#fff4e7;border-color:#ebcda7}.reward-chip.gotd{background:#fff8d9;border-color:#e6d282}.reward-rank-row{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;gap:10px;align-items:center;margin-top:13px;font-size:.76rem;font-weight:850}.reward-rank-row .progress-bar{background:#dfe8e5}.reward-rank-row .progress-bar>span{background:var(--teal)}
.reward-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.reward-summary-card{padding:18px;border:1px solid var(--border);border-radius:16px;background:#fff}.reward-summary-card>span{font-size:1.5rem}.reward-summary-card strong{display:block;font-size:1.65rem;margin-top:6px}.reward-summary-card small{color:var(--muted);font-weight:750}.mastery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.mastery-card{padding:15px;border:1px solid var(--border);border-radius:15px;background:#fff;color:inherit;text-decoration:none}.mastery-card.complete{background:#f7fbfa;border-color:#cfe1dc}.mastery-card.mastered{background:#eef9f5;border-color:#9fd4c5}.mastery-card.perfect{background:#fff9e8;border-color:#e2cb7e}.mastery-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}.mastery-icon{font-size:1.35rem}.mastery-status{font-size:.72rem;font-weight:900}.mastery-card strong{display:block}.mastery-card small{display:block;margin-top:5px;color:var(--muted)}.achievement-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.achievement-card{display:flex;gap:12px;padding:15px;border:1px solid var(--border);border-radius:15px;background:#fff;opacity:.7}.achievement-card.earned{opacity:1;border-color:#b9ddcf;background:#f4fbf8}.achievement-icon{font-size:1.5rem;min-width:28px}.achievement-card p{margin:4px 0;color:var(--muted);font-size:.84rem}.achievement-card small{font-weight:850;color:var(--teal-dark)}.key-reward-list{margin-top:16px}.key-reward-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:9px}.rank-next{margin:-7px 0 16px;text-align:right}.reward-rank-main{margin-bottom:8px}
@media(max-width:700px){.reward-head{align-items:flex-start}.reward-rank-row{grid-template-columns:1fr}.reward-summary-grid,.mastery-grid,.achievement-grid{grid-template-columns:1fr}.rank-next{text-align:left}.reward-chip{white-space:normal}.reward-head strong{font-size:1.35rem}}

/* TypingKong engagement, progression, boss, duel and journey systems */
.engagement-home{background:#fff}.engagement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.engage-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:18px;text-decoration:none;color:inherit}.engage-card.primary{background:linear-gradient(135deg,#13243a 0%,#1d3654 100%);color:#fff;border-color:#13243a}.engage-card.primary em,.engage-card.primary small{color:#dbe5ee}.engage-card span:nth-child(2){min-width:0}.engage-card small{display:block;font-size:.69rem;letter-spacing:.09em;font-weight:900;color:var(--teal);font-style:normal}.engage-card strong{display:block;margin-top:3px;font-size:1.18rem}.engage-card em{display:block;margin-top:4px;color:var(--muted);font-size:.8rem;font-style:normal}.engage-icon{font-size:2rem;line-height:1}.quick-play-wrap{margin-top:18px}.section-mini-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.section-mini-head strong{font-size:1.15rem}.quick-play-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.quick-play-card{padding:13px;border:1px solid var(--border);border-radius:14px;text-decoration:none;background:#fff;min-width:0}.quick-play-card>span{font-size:1.35rem}.quick-play-card strong,.quick-play-card small{display:block}.quick-play-card strong{margin-top:5px;font-size:.82rem;line-height:1.15}.quick-play-card small{margin-top:4px;color:var(--muted);font-size:.68rem}.quick-play-card:hover{border-color:#9fd4c5;box-shadow:var(--shadow);transform:translateY(-1px)}
.engagement-lower-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.engage-panel{padding:17px}.engage-panel h3{margin:.35rem 0}.engage-panel p{color:var(--muted);font-size:.84rem}.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.panel-title strong{display:block}.goal-list{display:grid;gap:7px;margin:12px 0}.goal-row{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:8px 9px;border-radius:11px;background:var(--soft);border:1px solid transparent}.goal-row.done{background:#eef9f5;border-color:#c8e4dc}.goal-row strong,.goal-row small{display:block}.goal-row strong{font-size:.78rem}.goal-row small{font-size:.67rem;color:var(--muted)}.compact-btn{padding:8px 11px;font-size:.78rem}.compact-success{margin-top:10px;padding:9px}.season-goals{display:grid;gap:5px}.season-goals span,.season-goals a{font-size:.75rem;color:var(--muted)}.season-goals span.done{color:var(--teal-dark);font-weight:800}.comeback-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:15px;margin-bottom:14px;background:#fff8e6;border-color:#ead292}.comeback-card strong,.comeback-card small{display:block}.comeback-card small{color:var(--muted);margin-top:3px}.game-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.hub-feature{padding:16px;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-decoration:none}.hub-feature strong,.hub-feature small{display:block}.hub-feature small{margin-top:5px;color:var(--muted);font-size:.72rem}.game-level-foot{margin-top:11px;padding-top:9px;border-top:1px solid var(--border);font-size:.7rem;color:var(--teal-dark);font-weight:850}.engagement-progress-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px}.engagement-progress-grid .engage-panel{min-height:190px}.engagement-progress-grid p{font-size:.78rem}.daily-engagement{margin-top:12px;display:grid;gap:8px}.daily-goal-mini,.rebuild-card{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:#fff}.daily-goal-mini strong{margin-right:auto}.daily-goal-mini span,.daily-goal-mini em,.rebuild-card span{font-size:.75rem;color:var(--muted)}.rebuild-card{background:#f4f0ff;border-color:#d8cdf5}.rebuild-card strong{color:#5b3f96}
.level-badge{display:inline-flex;margin-top:6px;padding:5px 8px;border-radius:999px;background:#eef5f3;color:var(--teal-dark);font-size:.7rem;font-weight:900}.level-result{display:grid;gap:3px;margin:12px 0;padding:13px;border-radius:13px;background:#eef9f5;border:1px solid #b9ddcf}.level-result strong{color:var(--teal-dark)}.level-result span{font-size:.78rem;color:var(--muted)}.near-miss{display:grid;grid-template-columns:1fr auto;gap:5px 12px;align-items:center;margin:14px 0;padding:14px;border-radius:14px;background:#fff8de;border:1px solid #e4cf7d}.near-miss strong{grid-column:1}.near-miss span{grid-column:1;color:#6e5c1a;font-size:.82rem}.near-miss .btn-primary{grid-column:2;grid-row:1/3}.next-recommendation{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:15px 0;padding:14px;border-radius:14px;background:#f2f8ff;border:1px solid #d3e2f2}.next-recommendation strong,.next-recommendation small{display:block}.next-recommendation small{margin-top:4px;color:var(--muted);font-size:.78rem}
.ghost-viz{padding:12px 14px;margin:12px 0;border-radius:14px;background:#f4f0ff;border:1px solid #d8cdf5}.ghost-line{display:grid;grid-template-columns:72px 1fr 42px;gap:9px;align-items:center;margin:6px 0;font-size:.72rem;font-weight:900}.ghost-track{height:10px;border-radius:999px;background:#e5e0f1;overflow:hidden}.ghost-track i{display:block;height:100%;width:0;border-radius:999px;background:var(--teal);transition:width .15s linear}.ghost-line:nth-child(2) .ghost-track i{background:#8268b3}.ghost-viz small{display:block;margin-top:7px;color:#62567c}.duel-incoming{padding:12px 14px;margin:12px 0;border-radius:13px;background:#eef3f9;border:1px solid #cbd8e6}.duel-verdict{display:grid;gap:3px;padding:13px;border-radius:13px;margin:12px 0}.duel-verdict.win{background:#eef9f5;border:1px solid #b9ddcf}.duel-verdict.miss{background:#fff8e6;border:1px solid #ead292}.duel-verdict span{font-size:.8rem;color:var(--muted)}.duel-box{margin:16px 0;padding:16px;border:1px solid #cbd8e6;border-radius:15px;background:#f8fbff}.duel-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}.duel-head strong,.duel-head small{display:block}.duel-head small{margin-top:4px;color:var(--muted);font-size:.75rem}.duel-create-row{display:grid;grid-template-columns:minmax(160px,1fr) auto auto;gap:9px;align-items:end}.duel-create-row label{font-size:.72rem;font-weight:850}.duel-create-row input,.share-link-input{width:100%;border:1px solid #ccd4dd;border-radius:10px;padding:9px;background:#fff}.share-link-input{margin-top:9px}.audio-nickname-row{padding:13px 0;border-bottom:1px solid var(--border)}.audio-nickname-row label strong,.audio-nickname-row label small{display:block}.audio-nickname-row label small{margin-top:2px;color:var(--muted);font-size:.72rem}.audio-nickname-row input{margin-top:8px;width:100%;border:1px solid #ccd4dd;border-radius:10px;padding:9px;background:#fff}
@media(max-width:1000px){.quick-play-grid{grid-template-columns:repeat(3,1fr)}.engagement-lower-grid,.game-hub-grid{grid-template-columns:1fr}.engagement-progress-grid{grid-template-columns:repeat(2,1fr)}.hub-feature{grid-template-columns:auto 1fr auto}}
@media(max-width:700px){.engagement-grid{grid-template-columns:1fr}.engage-card,.comeback-card,.hub-feature{grid-template-columns:auto 1fr}.engage-card>.btn-primary,.engage-card>.btn-secondary,.comeback-card>.btn-primary,.hub-feature>.btn-primary,.hub-feature>.btn-secondary{grid-column:1/-1;width:100%}.quick-play-grid{grid-template-columns:repeat(2,1fr)}.engagement-progress-grid{grid-template-columns:1fr}.near-miss{grid-template-columns:1fr}.near-miss .btn-primary{grid-column:1;grid-row:auto;width:100%}.next-recommendation{display:grid}.duel-create-row{grid-template-columns:1fr}.duel-create-row .btn-primary,.duel-create-row .btn-secondary{width:100%}.ghost-line{grid-template-columns:64px 1fr 36px}.panel-title{display:grid}.engagement-lower-grid{grid-template-columns:1fr}}
.game-progress-panel{margin-top:14px;padding:18px}.game-progress-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.game-progress-mini{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--soft)}.game-progress-mini>span:first-child{font-size:1.25rem}.game-progress-mini strong,.game-progress-mini small{display:block}.game-progress-mini strong{font-size:.78rem}.game-progress-mini small{font-size:.67rem;color:var(--muted);margin-top:2px}.game-progress-mini a{font-size:.7rem;font-weight:900;color:var(--teal-dark);text-decoration:none}
@media(max-width:900px){.game-progress-mini-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.game-progress-mini-grid{grid-template-columns:1fr}}
.home-rebuild{margin-bottom:14px;text-decoration:none;color:inherit}.home-rebuild>span:nth-child(2){flex:1}.home-rebuild .btn-secondary{white-space:nowrap}
@media(max-width:700px){.home-rebuild{align-items:flex-start}.home-rebuild .btn-secondary{width:100%}}

/* ===== Share / Feedback / Compete layer (v1-16) ===== */
.share-panel{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(19,36,58,.55);backdrop-filter:blur(3px)}
.share-panel.hidden{display:none}
.share-panel-card{width:min(520px,100%);padding:18px;box-shadow:0 24px 60px rgba(22,34,56,.25)}
.share-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:12px;border-bottom:1px solid var(--border)}
.share-panel-head strong{display:block;font-size:1.05rem}
.share-panel-note{display:block;margin-top:2px;color:var(--muted);font-size:.78rem}
.share-panel-close{border:0;background:transparent;color:var(--muted);font-size:1.7rem;line-height:1;cursor:pointer}
.share-textarea{width:100%;margin:14px 0 10px;padding:12px;border:1px solid var(--border);border-radius:12px;font:inherit;font-size:.92rem;line-height:1.45;resize:vertical;background:var(--soft);color:var(--ink)}
.share-actions{display:flex;gap:8px;flex-wrap:wrap}
.friend-challenge{margin-top:18px;padding:18px;display:grid;gap:12px;background:linear-gradient(135deg,#f8fbff,#fff)}
.friend-challenge strong{display:block;margin:4px 0 2px}
.friend-challenge small{color:var(--muted)}
.friend-challenge-row{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:9px;align-items:center}
.friend-challenge-row select{padding:11px 12px;border:1px solid var(--border);border-radius:12px;font:inherit;font-weight:800;background:#fff;color:var(--ink)}
.duel-stake-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:12px 0}
.duel-stake{border:1.5px solid #cbd8e6;background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-weight:900;font-size:.85rem;color:var(--navy);cursor:pointer;transition:background .15s,border-color .15s}
.duel-stake.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.duel-stake:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.duel-stake-row .tiny{flex-basis:100%;color:var(--muted)}
.duel-record-card .duel-record-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.duel-record-card .duel-record-head small{color:var(--muted);font-weight:700}
.duel-record-list{list-style:none;margin:10px 0 12px;padding:0;display:grid;gap:6px}
.duel-record-list li{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;font-size:.82rem;padding:7px 10px;border-radius:10px;background:var(--soft)}
.duel-record-list li>span:first-child{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;font-weight:900;color:#fff;background:var(--muted)}
.duel-record-list li.won>span:first-child{background:var(--teal)}
.duel-record-list li.lost>span:first-child{background:var(--red)}
.duel-record-list li>span:last-child{color:var(--muted);font-weight:700;white-space:nowrap}
.rivalry-panel{padding:18px;margin-top:16px}
.rivalry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:12px}
.record-box{padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--soft);display:grid;gap:4px}
.record-box strong{font-size:1.3rem;line-height:1.1}
.record-box span{color:var(--muted);font-size:.76rem;font-weight:700}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.rating-field{border:0;padding:0;margin:14px 0}
.rating-field legend{font-weight:850;font-size:.9rem;margin-bottom:8px}
.rating-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.rating-opt{position:relative;cursor:pointer}
.rating-opt input{position:absolute;opacity:0;inset:0}
.rating-opt span{display:grid;place-items:center;gap:4px;padding:12px 6px;border:1.5px solid var(--border);border-radius:14px;background:#fff;font-size:1.5rem;transition:border-color .15s,background .15s}
.rating-opt small{font-size:.66rem;font-weight:800;color:var(--muted)}
.rating-opt input:checked+span{border-color:var(--teal);background:var(--lime)}
.rating-opt input:focus-visible+span{outline:3px solid var(--gold);outline-offset:2px}
@media (max-width:640px){.friend-challenge-row,.duel-create-row,.field-grid{grid-template-columns:1fr}.rating-opt span{padding:10px 4px;font-size:1.25rem}.duel-record-list li{grid-template-columns:28px 1fr}.duel-record-list li>span:last-child{grid-column:2;white-space:normal}}
@media (prefers-reduced-motion:reduce){.share-panel{backdrop-filter:none}.duel-stake,.rating-opt span{transition:none}}

/* ===== Goal rows clickable + fold when complete (v1-17) ===== */
a.goal-row.link{text-decoration:none;color:inherit;cursor:pointer;transition:border-color .15s,background .15s}
a.goal-row.link:hover,a.goal-row.link:focus-visible{border-color:var(--teal);background:#eef9f5}
a.goal-row.link:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.goal-go{font-size:.72rem;font-weight:900;color:var(--teal);white-space:nowrap}
.goal-row.done .goal-go{color:var(--muted)}
.goal-done-line{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 6px;padding:10px 12px;border-radius:11px;background:#eef9f5;border:1px solid #c8e4dc;font-size:.82rem;font-weight:800}
.goal-done-line span:last-child{color:var(--teal)}
.season-goals a.season-goal-link{text-decoration:none;color:inherit;border-radius:8px;padding:2px 4px;margin:-2px -4px}
.season-goals a.season-goal-link b{color:var(--teal);font-weight:900}
.season-goals a.season-goal-link:hover,.season-goals a.season-goal-link:focus-visible{background:#eef9f5;color:var(--teal-dark)}
@media (prefers-reduced-motion:reduce){a.goal-row.link{transition:none}}

/* ===== Cleaner homepage (v1-18) ===== */
.hero{padding:58px 0 30px}
.progress-strip{flex-wrap:wrap;row-gap:6px;font-size:.9rem}
.progress-strip.hidden{display:none}
.progress-strip .strip-dna{color:#c9d6e2;font-size:.8rem;font-weight:700}
.progress-strip a{margin-left:auto;color:#9de1d4;font-weight:900;text-decoration:none;white-space:nowrap}
.engagement-home{padding-top:6px}
.home-banner{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;margin-bottom:14px;border-radius:14px;border:1px solid var(--border);text-decoration:none;color:inherit}
.home-banner>span:first-child{font-size:1.4rem}
.home-banner strong{display:block;font-size:.92rem}
.home-banner small{display:block;color:var(--muted);font-size:.76rem;margin-top:2px}
.home-banner.comeback{background:#fff8e6;border-color:#ead292}
.home-banner.rebuild{background:#f4f0ff;border-color:#d8cdf5}
.home-banner.rebuild strong{color:#5b3f96}
.home-row{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:stretch}
.home-row .engage-card{min-height:0}
.goals-compact{padding:14px 16px;min-height:0}
.goals-compact .goal-list{margin:10px 0 0;gap:6px}
.goals-compact .goal-row{padding:7px 9px}
.goals-compact .compact-btn{margin-top:10px}
.goals-compact .goal-done-line{margin:10px 0 0}
.quick-play-wrap{margin-top:16px}
.section-mini-head a.tiny{font-weight:900;color:var(--teal);text-decoration:none}
.quick-play-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.ritual-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ritual-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:16px;text-decoration:none;color:inherit;min-width:0}
.ritual-card .ritual-icon{font-size:1.5rem}
.ritual-card small{display:block;font-size:.66rem;font-weight:900;letter-spacing:.06em;color:var(--teal-dark)}
.ritual-card strong{display:block;margin-top:3px;font-size:.92rem;line-height:1.2}
.ritual-card em{display:block;font-style:normal;color:var(--muted);font-size:.76rem;margin-top:3px}
.ritual-card .btn-secondary{padding:9px 13px;font-size:.8rem;white-space:nowrap}
.ritual-card.done{background:#f3faf7;border-color:#c8e4dc}
.ritual-card:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
#pathsSection.hidden,#ritualSection.hidden{display:none}
@media(max-width:1000px){.home-row{grid-template-columns:1fr}.quick-play-grid.four{grid-template-columns:repeat(2,1fr)}.ritual-grid{grid-template-columns:1fr}}
@media(max-width:700px){.hero{padding-top:34px}.ritual-card{grid-template-columns:auto 1fr}.ritual-card .btn-secondary{grid-column:2}}
@media (prefers-reduced-motion:reduce){.ritual-card:hover{transform:none}}

/* ===== Header XP pill + accuracy chips (v1-20) ===== */
.xp-pill{position:relative;display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 8px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--navy);text-decoration:none;font-weight:900;font-size:.82rem;line-height:1;white-space:nowrap}
.xp-pill:hover,.xp-pill:focus-visible{border-color:var(--teal);box-shadow:0 0 0 3px rgba(20,125,111,.12)}
.xp-pill:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.xp-pill-icon{font-size:.95rem}
.xp-pill-num{font-variant-numeric:tabular-nums}
.xp-pill-unit{font-size:.62rem;color:var(--muted);letter-spacing:.06em}
.xp-pill-bar{display:block;width:44px;height:5px;border-radius:5px;background:#dfe8e5;overflow:hidden}
.xp-pill-bar>span{display:block;height:100%;background:var(--teal);border-radius:5px;transition:width .5s ease}
.xp-flyer{position:absolute;left:50%;top:-4px;transform:translateX(-50%);color:var(--teal);font-weight:900;font-size:.8rem;pointer-events:none;animation:xpFly 1.3s ease-out forwards}
@keyframes xpFly{0%{opacity:0;transform:translate(-50%,6px)}15%{opacity:1}100%{opacity:0;transform:translate(-50%,-22px)}}
.xp-pill.rank-up{animation:xpRank 1.2s ease}
@keyframes xpRank{0%{box-shadow:0 0 0 0 rgba(241,184,75,.7);border-color:var(--gold)}60%{box-shadow:0 0 0 12px rgba(241,184,75,0)}100%{box-shadow:0 0 0 0 rgba(241,184,75,0)}}
.reward-chip.acc-clean{background:#eaf7f3;color:var(--teal-dark);border-color:#bfe3d8}
.reward-chip.acc-watch{background:#fff8e6;color:#8a6510;border-color:#ead292}
.reward-chip.acc-rebuild{background:#fdeeee;color:#8f2f2f;border-color:#f0c4c4}
@media(max-width:700px){.nav-links a.xp-pill{display:inline-flex;padding:5px 8px 5px 7px;font-size:.76rem}.xp-pill-bar{width:30px}.xp-pill-unit{display:none}}
@media (prefers-reduced-motion:reduce){.xp-flyer{animation:none;opacity:1}.xp-pill.rank-up{animation:none;border-color:var(--gold)}.xp-pill-bar>span{transition:none}}

/* ===== Player feedback card (v1-21) ===== */
.feedback-cta-section{padding-top:8px}
.feedback-cta{text-align:center;padding:28px 22px}
.feedback-cta h2{margin:.35rem 0 .4rem;font-size:clamp(1.5rem,3.6vw,2.1rem)}
.feedback-cta p{max-width:620px;margin:0 auto 16px;color:var(--muted)}
@media(max-width:700px){.feedback-cta{padding:22px 16px}}

/* ===== Prove It hero + ladder (v1-22) ===== */
.prove-hero{padding:48px 0 26px}
.prove-hero .hero-copy{margin:0 auto 18px;max-width:620px}
.prove-hero .eyebrow,.prove-hero h1,.prove-hero .hero-copy{text-align:center}
.prove-hero h1{margin:.3rem 0 .6rem}
.prove-card{max-width:820px;margin:0 auto;padding:22px}
.prove-target{font-size:1.25rem;line-height:1.75;margin:0 0 12px;padding:18px 20px}
.prove-input{min-height:110px;font-size:1.15rem;border-color:var(--navy)}
.prove-input::placeholder{color:#7a8a9b;font-weight:800}
.prove-input:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(20,125,111,.14)}
.prove-stats{display:grid;grid-template-columns:repeat(3,1fr) auto;gap:10px;align-items:stretch;margin-top:12px}
.prove-stats .stat{border:1px solid var(--border);border-radius:14px;padding:12px;background:var(--soft);display:grid;gap:2px;text-align:center}
.prove-stats .stat strong{font-size:1.5rem;font-variant-numeric:tabular-nums}
.prove-stats .stat span{font-size:.72rem;color:var(--muted);font-weight:800}
.prove-stats .btn-primary{align-self:center}
.prove-stats .btn-primary.hidden{display:none}
.prove-hero .hero-actions{justify-content:center;margin-top:16px}
.prove-hero .progress-strip{max-width:820px;margin:16px auto 0}
.prove-verdict{margin-top:16px;padding:18px;border-radius:16px;background:linear-gradient(135deg,#13243a 0%,#1d3654 100%);color:#fff;text-align:left}
.prove-verdict.hidden{display:none}
.verdict-head{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.verdict-icon{font-size:2rem;line-height:1}
.verdict-head .challenge-label{color:#9de1d4}
.verdict-line{display:block;font-size:clamp(1.15rem,2.6vw,1.5rem);line-height:1.25;margin:2px 0 4px}
.verdict-head small{display:block;color:#c9d6e2;font-size:.82rem}
.verdict-rec{margin:14px 0 0;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.verdict-rec>span{display:block;font-size:.66rem;letter-spacing:.08em;font-weight:900;color:#9de1d4}
.verdict-rec>strong{display:block;font-size:1.02rem;margin-top:2px}
.verdict-rec small{display:block;margin-top:6px;color:#c9d6e2;font-size:.8rem}
.verdict-rec small a{color:#9de1d4;font-weight:900;text-decoration:none}
.verdict-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.verdict-actions .btn-ghost{color:#c9d6e2}
.verdict-actions .btn-ghost:hover{color:#fff}
.prove-verdict .reward-panel{margin-top:14px;background:#fff;color:var(--ink);border-radius:12px;padding:12px}
.prove-ladder{margin-top:16px;padding:16px 18px;color:var(--ink)}
.prove-ladder-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.prove-ladder-head small{color:var(--muted);font-weight:700}
.prove-rungs{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.prove-rungs li{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:9px 11px;border-radius:12px;border:1px solid var(--border);background:var(--soft)}
.prove-rungs li strong{display:block;font-size:.9rem}
.prove-rungs li small{display:block;color:var(--muted);font-size:.72rem}
.prove-rungs li em{font-style:normal;font-size:.72rem;font-weight:900;color:var(--muted)}
.prove-rungs .rung-icon{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--border);font-size:1rem}
.prove-rungs li.done{background:#eef9f5;border-color:#c8e4dc}
.prove-rungs li.done .rung-icon{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:900}
.prove-rungs li.current{background:#fff;border-color:var(--navy);box-shadow:var(--shadow)}
.prove-rungs li.locked{opacity:.75}
@media(max-width:700px){.prove-hero{padding-top:30px}.prove-card{padding:16px}.prove-target{font-size:1.05rem;padding:14px}.prove-stats{grid-template-columns:repeat(3,1fr)}.prove-stats .btn-primary{grid-column:1/-1}.verdict-actions .btn-primary,.verdict-actions .btn-secondary{flex:1 1 100%}.prove-rungs li{grid-template-columns:34px 1fr}.prove-rungs li .btn-primary,.prove-rungs li em{grid-column:2}}

/* ===== Hero paths + verdict reason (v1-24) ===== */
.hero-paths{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.hero-paths .btn-secondary{min-width:190px}
.verdict-reason{margin:6px 0 0;color:#dbe5ee;font-size:.88rem;line-height:1.45}
@media(max-width:700px){.hero-paths{flex-direction:column}.hero-paths .btn-secondary{width:100%}}

/* ===== Prove it line (v1-25) ===== */
.prove-line{text-align:center;font-size:clamp(1.6rem,4.2vw,2.4rem);font-weight:900;letter-spacing:-.01em;color:var(--teal-dark);margin:-.2rem 0 .35rem}
.prove-hero .hero-copy{margin-top:0}

/* ===== Returning-player home (v1-27) ===== */
.return-hero{padding:40px 0 22px}
.return-hero .eyebrow,.return-hero h1{text-align:center}
.return-hero h1{font-size:clamp(34px,5.4vw,54px);margin:.3rem 0 .9rem}
.return-hero .progress-strip{max-width:820px;margin:0 auto 16px}
.progress-strip .strip-last{color:#c9d6e2;font-size:.82rem}
.retest-section{padding-top:0}
.retest-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:16px 18px;max-width:820px;margin:0 auto}
.retest-card small{display:block;font-size:.66rem;font-weight:900;letter-spacing:.06em;color:var(--teal-dark)}
.retest-card strong{display:block;margin-top:3px;font-size:1rem}
.retest-card em{display:block;font-style:normal;color:var(--muted);font-size:.8rem;margin-top:3px}
.retest-card.hidden,#heroFirst.hidden,#heroReturn.hidden,#retestSection.hidden,.prove-card.hidden{display:none}
#homeLadder .prove-ladder{max-width:820px;margin:0 auto 14px}
#testSlotReturn .prove-card{margin-top:14px}
@media(max-width:700px){.retest-card{grid-template-columns:auto 1fr}.retest-card .btn-secondary{grid-column:2}}

/* ===== Test steps (v1-28) ===== */
.prove-step{display:flex;align-items:center;gap:9px;font-size:.86rem;font-weight:800;color:var(--navy);margin:0 0 8px}
.prove-step+.prove-target{margin-top:0}
.prove-target+.prove-step{margin-top:12px}
.prove-step-num{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;font-size:.72rem;font-weight:900}

/* ===== Even rhythm, one column, one dark block (v1-29) ===== */
.section{padding:28px 0}
.engagement-home{padding-top:0}
.retest-section{padding:0}
.retest-section .site-shell:empty{display:none}
#ritualSection{padding-top:0}
.return-hero{padding:44px 0 24px}
.return-hero h1{margin:.3rem 0 .5rem}
.return-stats{text-align:center;color:var(--muted);font-size:.95rem;margin:0 auto 18px;max-width:820px}
.return-stats strong{color:var(--ink)}
.return-stats a{color:var(--teal);font-weight:900;text-decoration:none;white-space:nowrap}
.return-hero .hero-paths{margin-top:0}
.home-row{gap:14px;margin-bottom:28px}
.quick-play-wrap{margin-top:0;margin-bottom:0}
.quick-play-card{border:0;background:var(--soft);box-shadow:none}
.quick-play-card:hover{background:#eaf1ef;box-shadow:none;transform:none}
.quick-play-card:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.ritual-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;overflow:hidden}
.ritual-row .ritual-card{border:0;border-radius:0;box-shadow:none;background:transparent;padding:18px;border-right:1px solid var(--border)}
.ritual-row .ritual-card:last-child{border-right:0}
.ritual-row .ritual-card:hover{transform:none;box-shadow:none;background:var(--soft)}
.ritual-row .ritual-card.done{background:#f3faf7}
.ritual-row .retest-tile{font:inherit;text-align:left;cursor:pointer;color:inherit}
.ritual-row .ritual-card{grid-template-columns:auto 1fr;grid-template-rows:auto auto;row-gap:10px}
.ritual-row .ritual-card>.btn-secondary{grid-column:1/-1;justify-self:start}
#homeLadder .prove-ladder{max-width:none;margin:0 0 28px}
#testSlotReturn .prove-card{max-width:none;margin:0 0 28px}
.prove-card{max-width:none}
@media(max-width:1000px){.ritual-row{grid-template-columns:repeat(2,1fr)}.ritual-row .ritual-card:nth-child(2n){border-right:0}.ritual-row .ritual-card:nth-child(-n+2){border-bottom:1px solid var(--border)}}
@media(max-width:700px){.section{padding:22px 0}.ritual-row{grid-template-columns:1fr}.ritual-row .ritual-card{border-right:0;border-bottom:1px solid var(--border)}.ritual-row .ritual-card:last-child{border-bottom:0}.return-stats{font-size:.88rem}}

/* =====================================================================
   Clean theme (v1-29) — Itlence design language
   Soft off-white page, white cards with a thin border and a light shadow,
   one brand colour (teal) for borders, buttons and emphasis. No dark fills.
   ===================================================================== */
:root{--bg:#f7f8f6;--surface:#fff;--accent:#e8f2ed;--brand:var(--teal);--brand-dark:var(--teal-dark);--border:#dfe5df;--soft:#f3f6f4;--shadow:0 10px 26px rgba(22,34,56,.06)}
body{background:var(--bg)}
.site-header{background:rgba(247,248,246,.94);border-bottom-color:rgba(223,229,223,.85)}
.brand-mark{background:var(--brand)}
.nav-cta{background:var(--brand)!important}
.nav-cta:hover{background:var(--brand-dark)!important}
.card{background:var(--surface);border-color:var(--border);box-shadow:var(--shadow)}
.section-soft,.section-cream{background:transparent}
.site-footer{background:transparent;color:var(--muted);border-top:1px solid var(--border)}
.site-footer a,.site-footer strong{color:var(--ink)}
/* rank strip (Learn / Practice / Games) — light accent, not navy */
.progress-strip{background:var(--accent);color:var(--ink);border:1px solid #cfe2dd}
.progress-strip a{color:var(--brand)}
.progress-strip .progress-bar{background:#cfe2dd}
.progress-strip .progress-bar span,.progress-bar span{background:var(--brand)}
/* Continue card — white with a brand border (Itlence continue-main) */
.engage-card.primary{background:var(--surface);color:var(--ink);border:1.5px solid var(--brand)}
.engage-card.primary small{color:var(--brand)}
.engage-card.primary em{color:var(--muted)}
/* verdict card — white with a brand border */
.prove-verdict{background:var(--surface);color:var(--ink);border:1.5px solid var(--brand)}
.verdict-head .challenge-label,.verdict-rec>span{color:var(--brand)}
.verdict-head small,.verdict-reason,.verdict-rec small{color:var(--muted)}
.verdict-rec{background:var(--accent);border-color:#cfe2dd}
.verdict-rec small a{color:var(--brand)}
.verdict-actions .btn-ghost{color:var(--muted)}
.verdict-actions .btn-ghost:hover{color:var(--ink)}
.prove-verdict .reward-panel{border:1px solid var(--border);box-shadow:none}
.prove-input{border-color:var(--border)}
.prove-input:focus{border-color:var(--brand)}
.prove-step,.prove-step-num{color:var(--ink)}
.prove-step-num{background:var(--accent);color:var(--brand-dark);border:1px solid #cfe2dd}
.prove-line{color:var(--brand)}
/* selected chips / tabs */
.mode-tabs button.active,.duel-stake.on{background:var(--brand);border-color:var(--brand);color:#fff}
.prove-rungs li.current{border-color:var(--brand)}
.result-score{color:var(--ink)}
/* mobile hero paths grid on the return hero keep their white */
.hero-paths .btn-secondary{background:var(--surface)}
/* header pill */
.xp-pill{color:var(--ink);background:var(--surface)}
/* home banners keep their warm tints */

/* ===== Continue + Goals: even and matching (v1-31) ===== */
.home-row{grid-template-columns:1fr 1fr;align-items:stretch}
.home-row>.card{border:1px solid var(--border);box-shadow:var(--shadow);padding:16px 18px;min-height:0;display:flex;flex-direction:column}
.home-row .engage-card.primary{display:flex;flex-direction:column;align-items:flex-start;gap:0;border:1px solid var(--border);background:var(--surface)}
.home-row .engage-card.primary .engage-icon{font-size:1.15rem;line-height:1;margin:0 0 6px}
.home-row .engage-card.primary>span:nth-child(2){display:block;flex:1}
.home-row .engage-card.primary small{display:block;font-size:.66rem;font-weight:900;letter-spacing:.08em;color:var(--teal-dark);margin:0 0 4px}
.home-row .engage-card.primary strong{display:block;font-size:1.05rem;line-height:1.25;margin:0 0 4px}
.home-row .engage-card.primary em{display:block;font-style:normal;color:var(--muted);font-size:.8rem}
.home-row .engage-card.primary>.btn-primary{margin-top:12px;padding:9px 14px;font-size:.85rem}
.home-row .goals-compact .panel-title strong{font-size:1.05rem;margin-top:4px}
.home-row .goals-compact .goal-list,.home-row .goals-compact .goal-done-line{flex:1 0 auto}
.home-row .goals-compact .compact-btn{align-self:flex-start;margin-top:12px;padding:9px 14px;font-size:.85rem}
.home-row .goals-compact .eyebrow{color:var(--teal-dark)}
@media(max-width:1000px){.home-row{grid-template-columns:1fr}}

/* ===== Test analysis (v1-32) ===== */
.verdict-analysis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}
.va-item{padding:10px 12px;border-radius:12px;background:var(--soft);border:1px solid var(--border);display:grid;gap:2px;min-width:0}
.va-item strong{font-size:1.05rem;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.va-item span{font-size:.7rem;font-weight:800;color:var(--muted)}
@media(max-width:900px){.verdict-analysis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.verdict-analysis{grid-template-columns:repeat(2,1fr)}}

/* ===== Recommendation is the link (v1-33) ===== */
a.verdict-rec{display:block;text-decoration:none;color:inherit;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
a.verdict-rec:hover,a.verdict-rec:focus-visible{border-color:var(--brand);background:#dff0e9;box-shadow:var(--shadow)}
a.verdict-rec:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
a.verdict-rec>strong{color:var(--brand-dark)}
.verdict-rec-arrow{font-weight:900;color:var(--brand)}
a.verdict-rec:hover .verdict-rec-arrow{transform:translateX(3px);display:inline-block}
@media (prefers-reduced-motion:reduce){a.verdict-rec{transition:none}a.verdict-rec:hover .verdict-rec-arrow{transform:none}}

/* Merge-preserved TypingKong brand and accessible mobile navigation */
.brand-image{min-width:0}.brand-logo{display:block;width:auto;height:38px;max-width:255px;object-fit:contain}.mobile-nav-toggle{display:none;border:1px solid var(--border);background:#fff;color:var(--navy);border-radius:11px;padding:8px 11px;gap:7px;align-items:center;font-weight:900;cursor:pointer}
@media(max-width:700px){.nav{position:relative;gap:10px}.brand-logo{height:32px;max-width:200px}.mobile-nav-toggle{display:inline-flex;margin-left:auto}.nav-links{display:none;position:absolute;top:calc(100% + 8px);right:0;z-index:60;width:min(92vw,320px);padding:12px;flex-direction:column;align-items:stretch;gap:6px;background:#fff;border:1px solid var(--border);border-radius:15px;box-shadow:0 18px 42px rgba(19,36,58,.16)}.nav-links.mobile-open{display:flex}.nav-links a,.nav-links button{display:flex;width:100%;justify-content:flex-start}.nav-cta{text-align:center;justify-content:center!important}}
/* TypingKong earned-moment celebrations */
.tk-celebrate-canvas{position:fixed;inset:0;z-index:80;pointer-events:none;width:100vw;height:100vh}
.tk-celebrate-card-wrap{position:fixed;z-index:81;top:82px;left:50%;transform:translateX(-50%);width:min(92vw,580px);pointer-events:none;animation:tkCelebrateCardIn .28s ease-out both}
.tk-celebrate-card{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:17px 18px 24px;border-radius:18px;border:1px solid rgba(255,255,255,.45);background:linear-gradient(135deg,#13243a,#174d58);color:#fff;box-shadow:0 22px 60px rgba(19,36,58,.24)}
.tk-celebrate-card-wrap.tier-2 .tk-celebrate-card{background:#fff;color:var(--ink);border-color:var(--border);box-shadow:var(--shadow)}
.tk-celebrate-icon{font-size:2rem;line-height:1}.tk-celebrate-copy{display:grid;gap:2px}.tk-celebrate-eyebrow{font-size:.68rem;font-weight:950;letter-spacing:.12em;color:#9de1d4}.tier-2 .tk-celebrate-eyebrow{color:var(--teal)}
.tk-celebrate-copy strong{font-size:1.2rem;line-height:1.15}.tk-celebrate-copy small{color:#dce9ec;font-size:.8rem}.tier-2 .tk-celebrate-copy small{color:var(--muted)}
.tk-celebrate-share{pointer-events:auto;border:1px solid rgba(255,255,255,.45);background:#fff;color:var(--navy);border-radius:11px;padding:9px 12px;font-weight:900;cursor:pointer}.tk-celebrate-share:hover{transform:translateY(-1px)}
.tk-celebrate-dismiss{position:absolute;left:18px;bottom:7px;font-size:.65rem;opacity:.72}.tk-celebrate-headline{transform-origin:center;animation:tkCelebrateHeadline .48s cubic-bezier(.18,.89,.32,1.28)}.tk-celebrate-headline-big{animation-duration:.62s}
@keyframes tkCelebrateHeadline{0%{transform:scale(.92);opacity:.65}60%{transform:scale(1.06)}100%{transform:scale(1);opacity:1}}
@keyframes tkCelebrateCardIn{0%{opacity:0;transform:translate(-50%,-10px) scale(.97)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(max-width:620px){.tk-celebrate-card-wrap{top:74px;width:min(94vw,520px)}.tk-celebrate-card{grid-template-columns:auto 1fr;padding:14px 14px 25px}.tk-celebrate-share{grid-column:1/-1;width:100%}.tk-celebrate-copy strong{font-size:1.05rem}}
@media(prefers-reduced-motion:reduce){.tk-celebrate-card-wrap,.tk-celebrate-headline,.tk-celebrate-headline-big{animation:none}}


/* TypingKong optional personalization */
.home-personal-greeting{display:inline-flex;align-items:center;gap:8px;margin:.1rem 0 .55rem;padding:8px 12px;border:1px solid #bfe1d8;border-radius:999px;background:#eef9f5;color:var(--teal-dark);font-weight:850;font-size:.88rem}
.audio-name-actions{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.audio-name-actions input{margin-top:8px}.audio-name-actions .btn-secondary{margin-top:8px;white-space:nowrap}
@media(max-width:600px){.audio-name-actions{grid-template-columns:1fr;display:grid}.audio-name-actions .btn-secondary{width:100%;margin-top:0}.home-personal-greeting{border-radius:14px}}

body.name-prompt-open{overflow:hidden}
@media(max-width:700px){.nav-links.mobile-open a,.nav-links.mobile-open button{display:flex}}

/* ===== XP pill lives in the header shell, visible on phones (v1-42) ===== */
.nav>.xp-pill{margin-left:auto}
.nav>.xp-pill+.nav-links{margin-left:0}
@media(max-width:700px){.nav>.xp-pill{margin-left:auto;order:2}.mobile-nav-toggle{margin-left:8px;order:3}.nav-links{order:4}}

/* ===== v1-43: audio beside the pill, collapsed duel box, ladder reveal, finish-early ===== */
.nav>.audio-control-button{margin-left:8px}
.nav>.xp-pill+.audio-control-button+.nav-links{margin-left:0}
@media(max-width:700px){.nav>.audio-control-button{order:2;margin-left:8px;padding:8px 9px}.nav>.audio-control-button .audio-control-text{display:none}.nav>.xp-pill{order:1;margin-left:auto}.mobile-nav-toggle{order:3}}
.duel-box.collapsed .duel-body{display:none}
.duel-box.collapsed{padding:10px 12px;background:transparent;border-style:dashed}
.duel-expand{width:100%}
.prove-rungs li.locked-count{opacity:.8;background:transparent;border-style:dashed}
.prove-stats .btn-secondary{align-self:center}
.prove-stats .btn-secondary.hidden{display:none}
.nav>.brand{order:0}.nav>.xp-pill{order:1;margin-left:auto}.nav>.audio-control-button{order:2}.nav>.mobile-nav-toggle{order:3}.nav>.nav-links{order:4;margin-left:0}

/* ===== v1-44: header order fixed — brand · links · pill · Audio · Start Typing; empty home sections collapse ===== */
.nav>.brand{order:0}.nav>.nav-links{order:1;margin-left:auto}.nav>.xp-pill{order:2;margin-left:0}.nav>.audio-control-button{order:3;margin-left:0}.nav>.mobile-nav-toggle{order:4}.nav>.nav-cta{order:5;margin-left:4px}
.nav>.nav-links{gap:16px}
@media(max-width:700px){.nav>.xp-pill{order:1;margin-left:auto}.nav>.audio-control-button{order:2}.nav>.mobile-nav-toggle{order:3;margin-left:6px}.nav>.nav-cta{display:none}.nav>.nav-links{order:9;margin-left:0}}
section.hidden,.engagement-home.hidden,#ritualSection.hidden,#retestSection.hidden{display:none}
.nav>.nav-cta{text-decoration:none}