:root{--bg:#f8f7f0;--surface:#fff;--surface-2:#f0f3ed;--text:#143b31;--muted:#64756f;--border:#d7dfd8;--green:#1d6b54;--green-dark:#123c31;--green-soft:#dff0e8;--lime:#b8d84f;--sound:#e4eef5;--word:#e8f2df;--sentence:#f5eadc;--verb:#eee7f7;--question:#f5e6ea;--shadow:0 18px 50px rgba(22,61,51,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(29,107,84,.26);outline-offset:2px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.skip-link{position:absolute;left:-999px;top:0;background:var(--text);color:#fff;padding:10px;z-index:100}.skip-link:focus{left:8px;top:8px}.app-shell{width:min(1200px,100%);margin:0 auto;min-height:100vh}
.topbar{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 22px;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:11px;border:0;background:transparent;padding:0;cursor:pointer;text-align:left}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:var(--green-soft);font-size:24px}.brand strong{display:block;font-size:18px;letter-spacing:-.02em}.brand small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.topbar-actions{display:flex;align-items:center;gap:8px}.course-pill,.stat-pill{min-height:44px;border:1px solid var(--border);background:var(--surface);border-radius:14px;display:flex;align-items:center;gap:8px;padding:0 13px;font-size:13px}.icon-btn{width:44px;height:44px;border:1px solid var(--border);background:var(--surface);border-radius:14px;cursor:pointer}
.primary-nav{display:flex;gap:6px;padding:9px 22px;border-bottom:1px solid var(--border);background:var(--bg);position:sticky;top:76px;z-index:25}.nav-item{min-height:46px;padding:0 16px;display:flex;align-items:center;gap:8px;border:0;border-radius:13px;background:transparent;cursor:pointer;color:var(--muted)}.nav-item b{font-weight:800}.nav-item.active{background:var(--green-soft);color:var(--green-dark)}
main{padding:0 22px 52px}.view{display:none}.view.active{display:block}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(42px,6vw,72px);line-height:.98;letter-spacing:-.055em;margin-bottom:21px}h1 em{font-style:normal;color:var(--green)}h2{letter-spacing:-.04em}.eyebrow{display:inline-block;font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--green);margin-bottom:9px}.primary-btn,.secondary-btn{min-height:48px;padding:0 18px;border-radius:14px;font-weight:850;cursor:pointer}.primary-btn{border:1px solid var(--green-dark);background:var(--green-dark);color:#fff}.secondary-btn{border:1px solid var(--border);background:var(--surface);color:var(--text)}.text-btn{border:0;background:transparent;color:var(--green);font-weight:850;cursor:pointer}
.welcome-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(450px,1.08fr);gap:36px;align-items:center;padding:54px 0 42px}.welcome-copy p{color:var(--muted);font-size:18px;line-height:1.65;max-width:620px}.welcome-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.beginner-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:29px}.beginner-steps>div{min-width:0;border-top:1px solid var(--border);padding-top:13px;display:flex;gap:9px}.beginner-steps>div>span{width:25px;height:25px;flex:0 0 auto;display:grid;place-items:center;border-radius:999px;background:var(--green-soft);font-size:11px;font-weight:900}.beginner-steps p{margin:0!important;font-size:13px!important;line-height:1.35!important}.beginner-steps strong,.beginner-steps small{display:block}.beginner-steps small{color:var(--muted);margin-top:3px}
.translator-panel{min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:28px;padding:22px;box-shadow:var(--shadow)}.translator-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}.translator-heading .eyebrow{margin-bottom:4px}.translator-heading h2{font-size:31px;margin:0}.translator-badge{padding:7px 10px;border-radius:999px;background:var(--green-soft);color:var(--green-dark);font-size:11px;font-weight:850;white-space:nowrap}.translation-form{display:grid;gap:9px}.translator-input-wrap{min-height:62px;display:flex;align-items:center;gap:10px;padding:0 16px;border:1px solid var(--border);background:var(--bg);border-radius:17px}.translator-input-wrap>span[aria-hidden]{color:var(--green);font-weight:900}.translator-input-wrap input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:18px}.translation-controls{display:grid;grid-template-columns:minmax(0,1fr) 48px auto;gap:8px}.translation-controls select{min-width:0;min-height:48px;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:14px;padding:0 12px}.swap-btn{width:48px;min-height:48px;border:1px solid var(--border);border-radius:14px;background:var(--surface);cursor:pointer;font-size:20px}.translate-btn{min-width:110px}.translation-result{margin-top:14px;min-height:155px;padding:15px;border:1px solid var(--border);background:var(--surface-2);border-radius:18px}.translation-empty,.translation-loading,.translation-error{min-height:123px;display:grid;place-items:center;align-content:center;text-align:center;color:var(--muted)}.translation-empty span{font-size:26px}.translation-empty p,.translation-loading p,.translation-error p{margin:7px 0 0;line-height:1.45}.translation-loading span{width:24px;height:24px;border:3px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.translation-meta{font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}.translation-pair{display:grid;grid-template-columns:1fr 28px 1fr;gap:9px;align-items:center}.translation-side{position:relative;min-width:0;padding:12px 42px 12px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--border)}.translation-side.target{background:var(--green-soft)}.translation-side small{display:block;color:var(--muted);font-size:10px;margin-bottom:3px}.translation-side strong{display:block;font-size:clamp(19px,3vw,26px);letter-spacing:-.035em;overflow-wrap:anywhere}.translation-arrow{text-align:center;color:var(--green);font-weight:900;font-size:18px}.audio-dot{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:1px solid var(--border);border-radius:10px;background:var(--surface);cursor:pointer}.translation-pattern-hint{width:100%;margin-top:9px;min-height:53px;display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;text-align:left;border:1px solid var(--border);border-radius:14px;background:var(--surface);padding:8px 11px;cursor:pointer}.translation-pattern-hint small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em}.translation-pattern-hint strong{display:block;margin-top:2px;font-size:14px}.translation-alternatives{margin-top:9px}.translation-alternatives small{color:var(--muted)}.translation-alternatives div{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.translation-alternatives span{padding:5px 8px;background:var(--surface);border:1px solid var(--border);border-radius:999px;font-size:12px}.translator-note{display:block;margin-top:9px;color:var(--muted);line-height:1.4}
.home-section{margin:16px 0 46px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:17px}.section-heading.compact{align-items:center}.section-heading h2{margin:0;font-size:31px}.section-heading p{margin:6px 0 0;color:var(--muted)}.starter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.starter-card{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:17px;cursor:pointer;text-align:left;min-height:172px;display:flex;flex-direction:column}.starter-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.starter-number{font-size:11px;font-weight:900;color:var(--muted)}.starter-card h3{font-size:21px;margin:18px 0 6px}.starter-card p{color:var(--muted);font-size:14px;line-height:1.45}.starter-card .mini-progress{margin-top:auto}.family-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.family-card{min-height:145px;border:1px solid var(--border);background:var(--surface);border-radius:19px;padding:15px;text-align:left;cursor:pointer}.family-card span{font-size:24px}.family-card strong{display:block;font-size:18px;margin:13px 0 4px}.family-card small{display:block;color:var(--muted);line-height:1.35}.family-card b{display:block;margin-top:12px;font-size:11px;color:var(--green)}.lens-row{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.lens-card{min-height:112px;text-align:left;border:1px solid var(--border);background:var(--surface);border-radius:17px;padding:14px;cursor:pointer}.lens-card span{display:block;font-size:20px;margin-bottom:12px}.lens-card strong{display:block}.lens-card small{display:block;color:var(--muted);line-height:1.35;margin-top:4px}.lens-card.active{border-color:var(--green);background:var(--green-soft);box-shadow:0 0 0 3px rgba(29,107,84,.08)}
.page-intro{padding:50px 0 22px}.page-intro h1{font-size:clamp(40px,5.4vw,64px);max-width:900px}.page-intro p{font-size:17px;line-height:1.6;color:var(--muted);max-width:760px}.family-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 25px}.family-tab{min-height:42px;padding:0 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface);cursor:pointer;font-weight:800}.family-tab.active{background:var(--green-dark);color:#fff;border-color:var(--green-dark)}.meaning-filter{margin:10px 0 29px}.compact-lenses .lens-card{min-height:76px;display:flex;align-items:center;gap:9px}.compact-lenses .lens-card span{margin:0}.library-section{margin-bottom:42px}.search-bar{display:grid;grid-template-columns:minmax(0,1fr) 180px 170px;gap:9px;margin-bottom:10px}.search-box{min-height:51px;display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:0 14px}.search-box input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:16px}.search-bar select,.practice-toolbar select{min-height:51px;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:14px;padding:0 12px}.quick-filter-row{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:17px}.chip{min-height:37px;padding:0 12px;border:1px solid var(--border);background:var(--surface);border-radius:999px;cursor:pointer;color:var(--muted);font-weight:750}.chip.active{background:var(--green-dark);border-color:var(--green-dark);color:#fff}.pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.pattern-card{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:17px;min-height:246px;display:flex;flex-direction:column}.pattern-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.mini-badge{display:inline-flex;align-items:center;min-height:27px;padding:0 9px;border-radius:999px;font-size:9px;letter-spacing:.07em;font-weight:900}.mini-badge.visual{background:var(--word);color:#355a2d}.mini-badge.sound{background:var(--sound);color:#2a596d}.mini-badge.writing{background:var(--sentence);color:#704a2d}.pattern-card h3{font-size:20px;margin:16px 0 7px}.pattern-card .rule{font-size:14px;line-height:1.45;color:var(--muted);min-height:42px}.pattern-card .unlock{font-size:12px;color:var(--green);font-weight:800;margin:4px 0 12px}.lens-tags{display:flex;gap:5px;flex-wrap:wrap;margin:5px 0 11px}.lens-tag{padding:3px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:9px;font-weight:900}.skill-dots{display:flex;gap:5px;align-items:center;margin:2px 0 12px}.skill-dot{width:18px;height:18px;border-radius:999px;border:1px solid var(--border);display:grid;place-items:center;font-size:9px;color:var(--muted);background:var(--bg)}.skill-dot.on{background:var(--green-dark);border-color:var(--green-dark);color:#fff}.mini-progress{height:7px;background:var(--surface-2);border-radius:999px;overflow:hidden}.mini-progress span{display:block;height:100%;background:var(--green);border-radius:inherit}.pattern-card-actions{margin-top:auto;display:flex;gap:7px}.card-btn{flex:1;min-height:40px;border:1px solid var(--border);background:var(--surface);border-radius:11px;font-weight:800;cursor:pointer}.card-btn.primary{background:var(--green-soft);color:var(--green-dark)}.empty-state{text-align:center;padding:45px 20px;border:1px dashed var(--border);border-radius:18px;color:var(--muted)}
.practice-toolbar{display:grid;grid-template-columns:90px minmax(0,560px);align-items:center;gap:10px;margin:7px 0 18px}.practice-mode-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-bottom:16px}.mode-card{min-height:112px;border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:14px;text-align:left;cursor:pointer}.mode-card span,.mode-card strong,.mode-card small{display:block}.mode-card span{font-size:23px;margin-bottom:11px}.mode-card small{color:var(--muted);margin-top:3px}.mode-card.active{background:var(--green-soft);border-color:#bdd8ca}.practice-stage{min-height:350px;border:1px solid var(--border);background:var(--surface);border-radius:24px;padding:26px;box-shadow:var(--shadow)}.practice-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.practice-head h2{font-size:28px;margin:5px 0 4px}.practice-head p{color:var(--muted);line-height:1.45}.practice-score{flex:0 0 auto;font-size:12px;font-weight:900;color:var(--muted)}.prompt-box{margin:20px 0;padding:19px;border-radius:17px;background:var(--surface-2)}.prompt-label{display:block;font-size:10px;font-weight:900;letter-spacing:.09em;color:var(--muted);margin-bottom:7px}.prompt-box strong{font-size:clamp(24px,4vw,39px);letter-spacing:-.03em}.answer-form{display:flex;gap:8px}.answer-form input{flex:1;min-width:0;min-height:50px;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:13px;padding:0 14px;font-size:16px}.feedback{margin-top:13px;min-height:48px;padding:12px 14px;border-radius:13px;background:var(--surface-2);color:var(--muted)}.feedback.correct{background:#e5f3e7;color:#2e6338}.feedback.incorrect{background:#f8e8e4;color:#824435}.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:16px}.choice-btn{min-height:82px;border:1px solid var(--border);background:var(--bg);border-radius:15px;padding:13px;cursor:pointer;font-size:17px;font-weight:800}.choice-btn.correct{border-color:#69a970;background:#e5f3e7}.choice-btn.incorrect{border-color:#bd7868;background:#f8e8e4}.big-listen{width:100%;min-height:108px;border:1px solid var(--border);background:var(--surface-2);border-radius:17px;cursor:pointer;font-size:22px;font-weight:850}.tick-list{display:grid;gap:8px;margin:16px 0}.tick-item{display:flex;align-items:center;gap:11px;min-height:52px;border:1px solid var(--border);background:var(--bg);border-radius:13px;padding:10px 12px}.tick-item input{width:20px;height:20px;accent-color:var(--green)}.practice-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.mic-btn{min-height:48px;padding:0 17px;border:1px solid var(--green-dark);background:var(--green-dark);color:#fff;border-radius:13px;cursor:pointer;font-weight:850}.practice-footer{margin-top:19px;padding-top:15px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px}.practice-footer small{color:var(--muted)}.skip-btn{min-height:42px;padding:0 14px;border:1px solid var(--border);background:var(--bg);border-radius:12px;cursor:pointer;font-weight:800}
.dna-overview{display:grid;grid-template-columns:240px 1fr;gap:28px;align-items:center}.dna-ring{width:220px;height:220px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--green) 0deg,var(--surface-2) 0deg);position:relative}.dna-ring:after{content:"";position:absolute;inset:25px;border-radius:50%;background:var(--bg)}.dna-ring div{position:relative;z-index:2;text-align:center}.dna-ring strong{display:block;font-size:45px;letter-spacing:-.05em}.dna-ring span{color:var(--muted);font-size:12px}.skill-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.skill-stat{border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:14px}.skill-stat span{font-size:20px}.skill-stat strong{display:block;font-size:24px;margin:7px 0 2px}.skill-stat small{color:var(--muted)}.dna-section{margin:38px 0}.dna-map{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.dna-family{position:relative;border:1px solid var(--border);background:var(--surface);border-radius:19px;padding:14px}.dna-family h3{margin:0 0 12px;font-size:16px}.dna-nodes{display:grid;gap:7px}.dna-node{position:relative;width:100%;text-align:left;min-height:44px;border:1px solid var(--border);background:var(--bg);border-radius:12px;padding:8px 10px;cursor:pointer}.dna-node strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dna-node small{color:var(--muted);font-size:10px}.dna-node:before{content:"";position:absolute;left:-8px;top:50%;width:7px;border-top:1px solid var(--border)}.coverage-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.coverage-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px}.coverage-card strong{font-size:16px}.coverage-bar{height:8px;background:var(--surface-2);border-radius:999px;margin:12px 0 6px;overflow:hidden}.coverage-bar span{display:block;height:100%;background:var(--green);border-radius:inherit}.coverage-card small{color:var(--muted)}.next-best{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:28px 0;background:var(--green-dark);color:#fff;border-radius:23px;padding:23px}.next-best .eyebrow{color:#b9e1d2}.next-best h2{margin:0 0 5px}.next-best p{margin:0;color:#cbdad4}.next-best .primary-btn{background:#fff;color:var(--green-dark);border-color:#fff;flex:0 0 auto}
.pattern-dialog{width:min(760px,calc(100% - 22px));border:0;border-radius:26px;padding:0;background:var(--surface);color:var(--text);box-shadow:0 32px 90px rgba(0,0,0,.25)}.pattern-dialog::backdrop{background:rgba(13,32,27,.56);backdrop-filter:blur(3px)}.dialog-inner{padding:25px;position:relative}.dialog-close{position:absolute;right:15px;top:15px;width:42px;height:42px;border:1px solid var(--border);background:var(--bg);border-radius:12px;cursor:pointer;font-size:23px;z-index:2}.dialog-hero{padding-right:50px}.dialog-hero h2{font-size:clamp(31px,6vw,53px);margin:16px 0 9px;letter-spacing:-.055em}.dialog-hero p{color:var(--muted);line-height:1.6}.pattern-transform{margin:17px 0;border:1px solid var(--border);background:var(--surface-2);border-radius:18px;padding:16px}.pattern-transform-label{font-size:10px;font-weight:900;letter-spacing:.08em;color:var(--muted);margin-bottom:9px}.transform-example{display:grid;grid-template-columns:1fr 32px 1fr auto;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid var(--border)}.transform-example:last-child{border-bottom:0}.transform-example .arrow{text-align:center;color:var(--green);font-weight:900}.transform-word{font-size:18px;font-weight:800;overflow-wrap:anywhere}.transform-word mark{background:transparent;color:var(--green);font-weight:950;text-decoration:underline;text-decoration-color:var(--lime);text-decoration-thickness:3px;text-underline-offset:3px}.small-audio{width:38px;height:38px;border:1px solid var(--border);background:var(--surface);border-radius:10px;cursor:pointer}.unlock-panel{margin:17px 0;padding:15px;border-radius:17px;background:var(--green-soft)}.unlock-panel h3{margin:0 0 6px}.unlock-panel p{margin:0;color:var(--green-dark);line-height:1.5}.skill-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin:17px 0}.skill-button{min-height:62px;border:1px solid var(--border);background:var(--bg);border-radius:13px;cursor:pointer;padding:8px;text-align:center}.skill-button span,.skill-button strong{display:block}.skill-button span{font-size:18px;margin-bottom:4px}.skill-button strong{font-size:11px}.skill-button.done{background:var(--green-dark);color:#fff;border-color:var(--green-dark)}.related-section{margin-top:19px}.related-section h3{font-size:16px}.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.related-card{min-height:58px;border:1px solid var(--border);background:var(--surface);border-radius:13px;padding:9px 11px;text-align:left;cursor:pointer}.related-card strong{display:block;font-size:13px}.related-card small{color:var(--muted)}.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,20px);background:var(--green-dark);color:#fff;padding:11px 15px;border-radius:12px;opacity:0;pointer-events:none;transition:.2s ease;z-index:70;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%,0)}
body.dark{--bg:#10241f;--surface:#17312a;--surface-2:#1e3b33;--text:#eef8f4;--muted:#a8bbb3;--border:#315047;--green:#77c8aa;--green-dark:#0b1916;--green-soft:#234b3f;--word:#284838;--sound:#234451;--sentence:#4b3b2c;--verb:#3b334d;--question:#49313a;--shadow:0 18px 50px rgba(0,0,0,.2)}body.dark .dna-ring:after{background:var(--bg)}
@media(hover:hover) and (pointer:fine){.starter-card:hover,.family-card:hover,.pattern-card:hover,.lens-card:hover,.mode-card:hover,.dna-node:hover,.related-card:hover{transform:translateY(-2px);border-color:#b7c8be}}
@media(max-width:980px){.welcome-grid{grid-template-columns:1fr;padding-top:40px}.translator-panel{max-width:760px}.family-grid{grid-template-columns:repeat(3,1fr)}.starter-grid{grid-template-columns:repeat(2,1fr)}.pattern-grid{grid-template-columns:repeat(2,1fr)}.skill-summary{grid-template-columns:repeat(3,1fr)}.dna-map{grid-template-columns:repeat(3,1fr)}.coverage-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.app-shell{padding-bottom:78px}.topbar{min-height:67px;padding:10px 14px}.brand small{display:none}.course-pill{display:none}.primary-nav{position:fixed;left:0;right:0;top:auto;bottom:0;z-index:50;justify-content:space-around;padding:7px;background:var(--surface);border-top:1px solid var(--border);border-bottom:0;box-shadow:0 -8px 24px rgba(0,0,0,.05)}.nav-item{flex:1;min-width:0;min-height:58px;padding:6px 2px;flex-direction:column;gap:2px;font-size:11px}main{padding:0 14px 32px}.welcome-grid{padding:28px 0 30px;gap:20px}h1{font-size:43px}.welcome-copy p,.page-intro p{font-size:16px}.beginner-steps{grid-template-columns:1fr}.beginner-steps>div{border-top:0;border-left:1px solid var(--border);padding:2px 0 2px 12px}.translator-panel{padding:15px;border-radius:20px}.translator-heading h2{font-size:25px}.translator-badge{display:none}.translation-controls{grid-template-columns:1fr 48px}.translate-btn{grid-column:1/-1;width:100%}.translation-pair{grid-template-columns:1fr}.translation-arrow{transform:rotate(90deg)}.section-heading{align-items:flex-start;flex-direction:column}.starter-grid,.family-grid,.pattern-grid{grid-template-columns:1fr}.family-card{min-height:112px}.lens-row{grid-template-columns:repeat(2,1fr)}.lens-row .lens-card:last-child{grid-column:1/-1}.search-bar{grid-template-columns:1fr}.practice-toolbar{grid-template-columns:1fr;gap:6px}.practice-mode-grid{grid-template-columns:repeat(2,1fr)}.practice-mode-grid .mode-card:last-child{grid-column:1/-1}.practice-stage{padding:17px}.practice-head{flex-direction:column}.answer-form{flex-direction:column}.choice-grid{grid-template-columns:1fr}.practice-footer{align-items:flex-start;flex-direction:column}.skip-btn{width:100%}.dna-overview{grid-template-columns:1fr;justify-items:center}.skill-summary{width:100%;grid-template-columns:repeat(2,1fr)}.dna-map{grid-template-columns:1fr}.coverage-grid{grid-template-columns:repeat(2,1fr)}.coverage-card:last-child{grid-column:1/-1}.next-best{align-items:flex-start;flex-direction:column}.skill-strip{grid-template-columns:repeat(2,1fr)}.skill-strip .skill-button:last-child{grid-column:1/-1}.related-grid{grid-template-columns:1fr}.transform-example{grid-template-columns:1fr 24px 1fr auto;font-size:13px}.transform-word{font-size:15px}.dialog-inner{padding:20px 14px}}
@media(max-width:390px){.brand strong{font-size:16px}.stat-pill{display:none}h1{font-size:38px}.lens-row{grid-template-columns:1fr 1fr}}

/* Learning Engine v4 */
.translator-dna{margin-top:14px;padding:14px;border:1px solid var(--border);border-radius:16px;background:var(--surface-2)}
.translator-dna-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.translator-dna-head strong{display:block;font-size:15px}.translator-dna-head small{color:var(--muted)}
.translator-dna-rule{margin:0;color:var(--muted);line-height:1.5;font-size:13px}
.translator-dna-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:11px}
.translator-dna-card{border:1px solid var(--border);background:var(--surface);border-radius:13px;padding:11px;min-width:0}
.translator-dna-card small{display:block;color:var(--muted);font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;margin-bottom:5px}
.translator-dna-card strong{display:block;font-size:14px;overflow-wrap:anywhere}
.translator-related{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.translator-related button{border:1px solid var(--border);background:var(--surface);border-radius:999px;min-height:34px;padding:0 10px;cursor:pointer;font-size:12px;font-weight:750}
.translator-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.translator-actions .secondary-btn,.translator-actions .primary-btn{min-height:40px;font-size:13px}
.reading-guide{display:flex;gap:3px;align-items:center;flex-wrap:wrap}
.reading-guide span{padding:2px 5px;border-radius:7px;background:var(--surface-2)}
.reading-guide span.stressed{background:var(--green-soft);color:var(--green-dark);font-weight:950;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}

.sentence-dna-shell{display:grid;grid-template-columns:280px 1fr;gap:12px}
.sentence-frame-list{display:grid;gap:7px;align-content:start}
.sentence-frame-button{width:100%;min-height:66px;text-align:left;border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:10px 12px;cursor:pointer}
.sentence-frame-button strong,.sentence-frame-button small{display:block}.sentence-frame-button small{color:var(--muted);margin-top:3px}
.sentence-frame-button.active{background:var(--green-soft);border-color:#bdd8ca}
.sentence-dna-stage{border:1px solid var(--border);background:var(--surface);border-radius:21px;padding:20px;min-height:300px}
.sentence-dna-stage h3{font-size:26px;margin:4px 0 8px}.sentence-dna-stage>p{color:var(--muted);line-height:1.5}
.sentence-formula{display:grid;gap:8px;margin:18px 0;padding:15px;border-radius:16px;background:var(--surface-2)}
.sentence-line{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.sentence-token{display:inline-flex;align-items:center;min-height:34px;padding:0 10px;border-radius:10px;border:1px solid var(--border);background:var(--surface);font-weight:850}
.sentence-token.fixed{background:var(--green-soft);color:var(--green-dark)}
.sentence-token.slot{border-style:dashed;color:var(--muted)}
.sentence-example{display:grid;grid-template-columns:1fr 36px 1fr;gap:9px;align-items:center;margin:12px 0}
.sentence-example>div{border:1px solid var(--border);background:var(--bg);border-radius:14px;padding:13px}
.sentence-example small{display:block;color:var(--muted);margin-bottom:5px}.sentence-example strong{font-size:18px;overflow-wrap:anywhere}
.sentence-example .arrow{text-align:center;border:0;background:transparent;padding:0;color:var(--green);font-weight:950}
.sentence-stage-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}

.smart-review-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:17px;margin:6px 0 18px}
.smart-review-bar>div>strong{display:block;font-size:22px;letter-spacing:-.03em}.smart-review-bar small{display:block;color:var(--muted);margin-top:4px}
.smart-review-bar .eyebrow{margin-bottom:4px}
.review-status{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.review-pill{display:inline-flex;align-items:center;min-height:31px;padding:0 10px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:11px;font-weight:800}

.pronunciation-coach{margin-top:18px;border:1px solid var(--border);background:var(--surface-2);border-radius:18px;padding:16px}
.pronunciation-target{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.pronunciation-target small{display:block;color:var(--muted);margin-bottom:5px}.pronunciation-target strong{font-size:clamp(25px,4vw,38px);letter-spacing:-.035em}
.pronunciation-result{margin-top:13px;padding:13px;border-radius:14px;background:var(--surface);border:1px solid var(--border)}
.pronunciation-result.empty{color:var(--muted)}
.pronunciation-score-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.pronunciation-score-row strong{font-size:25px}
.pronunciation-meter{height:10px;background:var(--surface-2);border-radius:999px;overflow:hidden;margin:8px 0}.pronunciation-meter span{display:block;height:100%;background:var(--green);border-radius:inherit}
.pronunciation-transcript{font-size:13px;color:var(--muted);line-height:1.5}.pronunciation-transcript b{color:var(--text)}
.speech-tip{margin-top:8px;font-size:12px;color:var(--muted);line-height:1.45}

.dna-intelligence-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:24px 0 12px}
.dna-metric{border:1px solid var(--border);background:var(--surface);border-radius:17px;padding:14px}
.dna-metric span{font-size:20px}.dna-metric strong{display:block;font-size:27px;margin:7px 0 2px;letter-spacing:-.04em}.dna-metric small{color:var(--muted);line-height:1.3}
.dna-health-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0 32px}
.dna-health-card{border:1px solid var(--border);background:var(--surface);border-radius:19px;padding:17px;min-height:150px}
.dna-health-card h3{margin:0 0 5px}.dna-health-card p{color:var(--muted);line-height:1.5;margin-bottom:12px}
.health-stat-row{display:flex;gap:8px;flex-wrap:wrap}.health-stat{flex:1;min-width:110px;background:var(--surface-2);border-radius:13px;padding:10px}
.health-stat strong,.health-stat small{display:block}.health-stat strong{font-size:20px}.health-stat small{color:var(--muted);margin-top:2px}

@media(max-width:980px){
  .sentence-dna-shell{grid-template-columns:1fr}.sentence-frame-list{grid-template-columns:repeat(3,1fr)}
  .dna-intelligence-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:680px){
  .translator-dna-grid{grid-template-columns:1fr}.translator-dna-head{flex-direction:column}
  .sentence-frame-list{grid-template-columns:1fr 1fr}.sentence-example{grid-template-columns:1fr}.sentence-example .arrow{transform:rotate(90deg)}
  .smart-review-bar{align-items:flex-start;flex-direction:column}.smart-review-bar .primary-btn{width:100%}
  .pronunciation-target{flex-direction:column}.dna-intelligence-grid{grid-template-columns:repeat(2,1fr)}.dna-health-grid{grid-template-columns:1fr}
}
@media(max-width:390px){.sentence-frame-list{grid-template-columns:1fr}.dna-intelligence-grid{grid-template-columns:1fr 1fr}}


/* Learning Platform v5 */
.intelligence-tags{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0 2px}
.intelligence-tags span{display:inline-flex;align-items:center;min-height:25px;padding:0 8px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);font-size:9px;font-weight:850}
.translator-intelligence{margin:8px 0 12px}.intelligence-note{margin:10px 0 0;color:var(--muted);font-size:10px;line-height:1.45}
.lexical-warning{margin-top:11px;padding:12px;border:1px solid #d7b56d;border-radius:14px;background:#fbf2dc}.lexical-warning strong{display:block;font-size:12px}.lexical-warning p{margin:4px 0 0;font-size:12px;line-height:1.45;color:#725b27}
body.dark .lexical-warning{background:#4c4024;border-color:#796a3b}body.dark .lexical-warning p{color:#e8d59d}
.morphology-card{grid-column:1/-1}.morphology-row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.morphology-row span{padding:8px;border-radius:10px;background:var(--surface-2);font-size:11px}.morphology-row b{display:block;color:var(--muted);font-size:9px;margin-bottom:3px}

.course-progress-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:5px 0 23px;padding:22px;border-radius:23px;background:var(--green-dark);color:#fff}
.course-progress-hero .eyebrow{color:#b9e1d2}.course-progress-hero h2{font-size:30px;margin:0 0 7px}.course-progress-hero p{margin:0;color:#cbdad4;line-height:1.5}
.course-hero-actions{display:flex;align-items:center;gap:13px;flex:0 0 auto}.course-hero-actions>div{text-align:center}.course-hero-actions strong,.course-hero-actions small{display:block}.course-hero-actions strong{font-size:27px}.course-hero-actions small{color:#cbdad4;font-size:10px}.course-progress-hero .primary-btn{background:#fff;color:var(--green-dark);border-color:#fff}
.course-level-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.course-level-tab{min-width:110px;min-height:54px;border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:8px 12px;cursor:pointer;text-align:left}.course-level-tab strong,.course-level-tab span{display:block}.course-level-tab strong{font-size:16px}.course-level-tab span{color:var(--muted);font-size:11px;margin-top:2px}.course-level-tab.active{background:var(--green-soft);border-color:#b7d4c4}.course-level-tab:disabled{opacity:.45;cursor:not-allowed}
.course-level-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:18px;margin-bottom:13px}.course-level-summary h2{font-size:25px;margin:0 0 6px}.course-level-summary p{margin:0;color:var(--muted);line-height:1.45}.course-level-ring{flex:0 0 auto;width:105px;height:105px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--surface-2);border:10px solid var(--green-soft)}.course-level-ring strong,.course-level-ring small{display:block}.course-level-ring strong{font-size:23px}.course-level-ring small{font-size:9px;color:var(--muted)}
.course-unit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-bottom:42px}.course-unit-card{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:17px;min-height:270px}.course-unit-card.locked{opacity:.58}.course-unit-card.complete{border-color:#a9cdb9}.course-unit-top{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.06em}.course-unit-card h3{font-size:21px;margin:14px 0 6px}.course-unit-card>p{color:var(--muted);line-height:1.45;min-height:42px}.course-pattern-chips{display:flex;gap:5px;flex-wrap:wrap;margin:12px 0}.course-pattern-chips button,.course-pattern-chips span{border:1px solid var(--border);background:var(--surface-2);border-radius:999px;padding:5px 8px;font-size:9px;color:var(--muted)}.course-pattern-chips button{cursor:pointer}.course-unit-progress{height:9px;border-radius:999px;background:var(--surface-2);overflow:hidden;margin:15px 0 10px}.course-unit-progress span{display:block;height:100%;background:var(--green);border-radius:inherit}.course-unit-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.course-unit-meta small{color:var(--muted)}.course-unit-meta .primary-btn,.course-unit-meta .secondary-btn{min-height:41px;font-size:12px}

.lesson-session-panel{margin:0 0 14px;padding:14px 16px;border:1px solid var(--border);border-radius:18px;background:var(--surface)}.lesson-session-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.lesson-session-panel strong,.lesson-session-panel small{display:block}.lesson-session-panel strong{font-size:18px}.lesson-session-panel small{color:var(--muted);margin-top:3px}.session-progress{height:9px;margin-top:11px;border-radius:999px;background:var(--surface-2);overflow:hidden}.session-progress span{display:block;height:100%;background:var(--green);border-radius:inherit}
.session-summary{text-align:left;max-width:760px;margin:0 auto;padding:8px}.session-summary h2{font-size:clamp(35px,6vw,58px);margin:5px 0 8px}.session-summary>p{color:var(--muted);font-size:16px;line-height:1.55}.session-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.session-summary-grid article{padding:15px;border:1px solid var(--border);background:var(--surface-2);border-radius:15px}.session-summary-grid strong,.session-summary-grid small{display:block}.session-summary-grid strong{font-size:26px}.session-summary-grid small{color:var(--muted)}.session-mistakes{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:15px 0}.session-mistakes>small{width:100%;font-weight:900;color:var(--muted);letter-spacing:.07em}.session-mistakes span{padding:6px 9px;border-radius:999px;background:var(--surface-2);font-size:11px}.session-win{padding:12px;border-radius:13px;background:var(--green-soft);margin:15px 0}.session-summary-actions{display:flex;gap:8px;flex-wrap:wrap}

.speech-word-grid{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.speech-word{border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:8px 10px;cursor:pointer;text-align:left}.speech-word strong,.speech-word small{display:block}.speech-word small{font-size:9px;color:var(--muted);margin-top:2px}.speech-word.good{border-color:#9cc4aa}.speech-word.warn{border-color:#d3b36c}.speech-word.bad{border-color:#c58b7d}.word-focus-result{padding:10px;border-radius:12px;background:var(--green-soft);margin-bottom:10px}.word-focus-result strong,.word-focus-result small{display:block}.word-focus-result small{margin-top:3px;color:var(--green-dark)}
.weak-sound-list{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.weak-sound-list>small{width:100%;color:var(--muted);font-weight:850}.weak-sound-list span{padding:5px 8px;border-radius:999px;background:var(--surface-2);font-size:10px}

.dna-command-center{margin:18px 0 40px}.command-grid{display:grid;grid-template-columns:2fr 1fr;gap:10px}.command-primary,.command-card{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:18px}.command-primary{grid-row:span 2;background:var(--green-dark);color:#fff}.command-primary .eyebrow{color:#b9e1d2}.command-primary h3{font-size:30px;margin:3px 0 7px}.command-primary p{color:#cbdad4;line-height:1.55}.command-primary .primary-btn{background:#fff;color:var(--green-dark);border-color:#fff}.command-badges{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0}.command-badges span{padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.1);font-size:10px}.command-card h3{margin:3px 0 8px;font-size:20px}.command-card p{color:var(--muted);line-height:1.45}.muted-mini{font-size:11px!important;color:var(--muted)!important}
.weekly-bars{height:130px;display:grid;grid-template-columns:repeat(7,1fr);gap:5px;align-items:end;margin-top:12px}.weekly-day{text-align:center}.weekly-day>div{height:85px;display:flex;align-items:end;justify-content:center;background:var(--surface-2);border-radius:7px;overflow:hidden}.weekly-day>div span{width:100%;background:var(--green);border-radius:7px 7px 0 0}.weekly-day small,.weekly-day b{display:block;font-size:9px}.weekly-day small{color:var(--muted);margin-top:4px}.weekly-day b{margin-top:2px}
.review-calendar-row{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:11px 0}.review-calendar-row>div{padding:8px 3px;border-radius:10px;background:var(--surface-2);text-align:center}.review-calendar-row>div.has-due{background:var(--green-soft)}.review-calendar-row strong,.review-calendar-row small{display:block}.review-calendar-row strong{font-size:16px}.review-calendar-row small{font-size:8px;color:var(--muted)}

@media(max-width:980px){
  .course-unit-grid{grid-template-columns:1fr}.command-grid{grid-template-columns:1fr 1fr}.command-primary{grid-column:1/-1;grid-row:auto}.morphology-row{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:680px){
  .primary-nav .nav-item{font-size:10px}.course-progress-hero,.course-level-summary{align-items:flex-start;flex-direction:column}.course-hero-actions{width:100%;justify-content:space-between}.course-hero-actions .primary-btn{flex:1}.course-level-ring{width:90px;height:90px}.course-unit-meta{align-items:flex-start;flex-direction:column}.course-unit-meta .primary-btn,.course-unit-meta .secondary-btn{width:100%}
  .session-summary-grid{grid-template-columns:1fr}.command-grid{grid-template-columns:1fr}.command-primary{grid-column:auto}.morphology-row{grid-template-columns:repeat(2,1fr)}.review-calendar-row{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:390px){.course-level-tab{min-width:88px}.morphology-row{grid-template-columns:1fr}.weekly-bars{gap:3px}}


/* Everyday 100 + Game Mode v6 */
.everyday-preview-status{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 12px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.everyday-preview-status strong{font-size:14px}.everyday-preview-status small{color:var(--muted);text-align:right}
.everyday-preview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.everyday-preview-card{border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:13px;min-width:0}
.everyday-preview-card span,.everyday-preview-card strong,.everyday-preview-card b,.everyday-preview-card small{display:block}
.everyday-preview-card span{font-size:9px;color:var(--muted);font-weight:900}.everyday-preview-card strong{font-size:16px;margin-top:6px}.everyday-preview-card b{font-size:15px;color:var(--green);margin-top:3px}.everyday-preview-card small{font-size:9px;color:var(--muted);margin-top:7px}

.everyday-game-tabs{display:flex;gap:7px;margin:6px 0 18px;padding:5px;border:1px solid var(--border);background:var(--surface);border-radius:16px;width:max-content;max-width:100%}
.everyday-game-tabs button{border:0;background:transparent;color:var(--muted);border-radius:11px;min-height:42px;padding:0 15px;font-weight:850;cursor:pointer}
.everyday-game-tabs button.active{background:var(--green-dark);color:#fff}

.everyday-learn-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:8px 0 15px}
.everyday-learn-head h2{font-size:30px;margin:2px 0 6px}.everyday-learn-head p{max-width:720px;margin:0;color:var(--muted);line-height:1.55}
.everyday-known-ring{flex:0 0 auto;width:94px;height:94px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--green-soft);border:8px solid var(--surface)}
.everyday-known-ring strong,.everyday-known-ring small{display:block}.everyday-known-ring strong{font-size:25px}.everyday-known-ring small{font-size:9px;color:var(--muted)}
.everyday-tools{display:grid;grid-template-columns:minmax(230px,340px) 1fr;gap:10px;align-items:start;margin-bottom:13px}
.everyday-category-row{display:flex;gap:6px;flex-wrap:wrap}.everyday-category-row button,.game-review-filters button{border:1px solid var(--border);background:var(--surface);color:var(--muted);border-radius:999px;min-height:38px;padding:0 11px;font-size:10px;font-weight:850;cursor:pointer}
.everyday-category-row button.active,.game-review-filters button.active{background:var(--green-soft);color:var(--green-dark);border-color:#aacaba}
.everyday-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.everyday-card{border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:15px;min-width:0}
.everyday-card.known{border-color:#9cc4aa}.everyday-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:9px;font-weight:850}
.everyday-card h3{font-size:23px;margin:12px 0 5px;letter-spacing:-.025em}
.everyday-spanish{display:flex;align-items:center;justify-content:space-between;gap:10px}.everyday-spanish strong{font-size:20px;color:var(--green)}.everyday-spanish button{width:40px;height:40px;border:1px solid var(--border);background:var(--surface-2);border-radius:11px;cursor:pointer}
.everyday-example{margin:13px 0;padding:11px;background:var(--surface-2);border-radius:13px}.everyday-example small{display:block;font-size:8px;color:var(--muted);font-weight:900;letter-spacing:.07em}.everyday-example p{margin:5px 0 0;font-size:12px;line-height:1.5}
.everyday-card details{border-top:1px solid var(--border);padding-top:9px}.everyday-card summary{cursor:pointer;color:var(--muted);font-size:11px;font-weight:800}.everyday-card details p{font-size:11px;line-height:1.5;color:var(--muted);margin:8px 0}.everyday-card details b{color:var(--text)}
.everyday-known-btn{margin-top:10px;min-height:38px;border:1px solid var(--border);background:var(--surface-2);border-radius:11px;padding:0 11px;font-weight:800;cursor:pointer}.everyday-card.known .everyday-known-btn{background:var(--green-soft);color:var(--green-dark)}
.everyday-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px 0 38px}.everyday-pagination button{min-height:42px;border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:0 13px;font-weight:800;cursor:pointer}.everyday-pagination button:disabled{opacity:.4;cursor:not-allowed}.everyday-pagination span{color:var(--muted);font-size:11px}

.game-intro-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px;border-radius:22px;background:var(--green-dark);color:#fff;margin-bottom:14px}
.game-intro-card h2{font-size:29px;margin:3px 0 7px}.game-intro-card p{max-width:720px;color:#d2e1db;margin:0;line-height:1.55}.game-intro-card .eyebrow{color:#b9e1d2}
.game-pass-badge{flex:0 0 auto;width:100px;height:100px;border-radius:50%;background:#fff;color:var(--green-dark);display:grid;place-items:center;text-align:center}.game-pass-badge strong,.game-pass-badge small{display:block}.game-pass-badge strong{font-size:31px}.game-pass-badge small{font-size:9px}
.game-level-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.game-level-card{border:1px solid var(--border);background:var(--surface);border-radius:19px;padding:17px}.game-level-card.locked{opacity:.5}.game-level-card.passed{border-color:#8fbd9f}.game-level-top{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.07em}.game-level-card h3{font-size:22px;margin:13px 0 5px}.game-level-card>p{color:var(--muted);line-height:1.45;min-height:42px}.game-level-stats{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.game-level-stats span{padding:7px 9px;background:var(--surface-2);border-radius:10px;font-size:9px;color:var(--muted)}.game-level-stats b{color:var(--text)}.game-best{display:block;color:var(--muted);margin:8px 0 11px}.game-level-card .primary-btn,.game-level-card .secondary-btn{width:100%}.game-rule-note{color:var(--muted);font-size:11px;line-height:1.5;margin:15px 0 36px}

.game-session-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:10px}.game-session-head h2{font-size:31px;margin:2px 0 5px}.game-session-head p{margin:0;color:var(--muted)}
.game-session-score{flex:0 0 auto;text-align:center;padding:10px 14px;border:1px solid var(--border);background:var(--surface);border-radius:14px}.game-session-score strong,.game-session-score small{display:block}.game-session-score strong{font-size:23px}.game-session-score small{color:var(--muted);font-size:9px}
.game-progress-track{height:10px;background:var(--surface-2);border-radius:999px;overflow:hidden;margin-bottom:14px}.game-progress-track span{display:block;height:100%;background:var(--green);border-radius:inherit}
.game-question-card{border:1px solid var(--border);background:var(--surface);border-radius:22px;padding:20px}.game-question-label{font-size:9px;color:var(--muted);font-weight:900;letter-spacing:.08em}.game-question-card h3{font-size:clamp(27px,5vw,43px);margin:10px 0 18px;letter-spacing:-.04em}.game-audio-prompt{min-height:40px;border:1px solid var(--border);background:var(--surface-2);border-radius:11px;padding:0 12px;cursor:pointer;margin:-7px 0 14px}
.game-answer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.game-answer-grid button{min-height:74px;border:1px solid var(--border);background:var(--surface-2);border-radius:15px;padding:11px;text-align:left;display:flex;align-items:center;gap:10px;cursor:pointer;color:var(--text)}.game-answer-grid button span{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:var(--surface);border:1px solid var(--border);font-size:10px}.game-answer-grid button strong{font-size:14px}.game-answer-grid button.selected{border:2px solid var(--green);background:var(--green-soft)}.game-hidden-note{margin:12px 0 0;color:var(--muted);font-size:10px}
.game-question-nav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:9px;align-items:start;margin:12px 0 34px}.game-dot-row{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}.game-dot-row button{height:28px;border:1px solid var(--border);background:var(--surface);border-radius:7px;font-size:8px;color:var(--muted);cursor:pointer}.game-dot-row button.answered{background:var(--surface-2);color:var(--text);font-weight:850}.game-dot-row button.current{outline:2px solid var(--green);outline-offset:1px}.game-message{grid-column:1/-1;color:#9f3d31;font-weight:800;font-size:12px;min-height:18px}

.game-result-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;border-radius:23px;padding:23px;color:#fff}.game-result-hero.passed{background:#245f45}.game-result-hero.failed{background:#754036}.game-result-hero .eyebrow{color:#d8e8e0}.game-result-hero h2{font-size:54px;margin:2px 0}.game-result-hero p{margin:0;max-width:650px;color:#f2f3f1}.game-result-mark{flex:0 0 auto;width:110px;height:110px;border-radius:50%;background:#fff;color:#173d31;display:grid;place-items:center;text-align:center}.game-result-mark strong,.game-result-mark small{display:block}.game-result-mark strong{font-size:28px}.game-result-mark small{font-size:9px}
.game-result-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 30px}.game-review-filters{display:flex;gap:7px;flex-wrap:wrap;margin:11px 0}
.game-review-list{display:grid;gap:8px;margin-bottom:45px}.game-review-card{display:grid;grid-template-columns:52px 1fr;gap:12px;border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:13px}.game-review-card.correct{border-left:7px solid #2e7d32;background:#f2faf5}.game-review-card.wrong{border-left:7px solid #c44536;background:#fff4f1}body.dark .game-review-card.correct{background:#173b2b}body.dark .game-review-card.wrong{background:#422823}.game-review-number{display:flex;flex-direction:column;align-items:center;gap:4px}.game-review-number strong{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--surface-2)}.game-review-card.correct .game-review-number span{color:#2e7d32;font-size:22px}.game-review-card.wrong .game-review-number span{color:#c44536;font-size:24px}.game-review-card small{color:var(--muted);font-size:9px;font-weight:850}.game-review-card h3{margin:3px 0 8px;font-size:17px}.game-review-card p{margin:4px 0;font-size:12px}.game-explanation{margin-top:9px;padding:9px;border-radius:10px;background:var(--surface-2);color:var(--muted);font-size:11px;line-height:1.45}

@media(max-width:980px){
  .everyday-preview-grid{grid-template-columns:repeat(2,1fr)}.everyday-tools{grid-template-columns:1fr}.game-level-grid{grid-template-columns:1fr}.game-question-nav{grid-template-columns:1fr 1fr}.game-dot-row{grid-column:1/-1;grid-row:1}.game-question-nav>.primary-btn,.game-question-nav>.secondary-btn{width:100%}
}
@media(max-width:680px){
  .everyday-preview-status,.everyday-learn-head,.game-intro-card,.game-session-head,.game-result-hero{align-items:flex-start;flex-direction:column}.everyday-preview-status small{text-align:left}.everyday-preview-grid,.everyday-grid,.game-answer-grid{grid-template-columns:1fr}.everyday-known-ring,.game-pass-badge,.game-result-mark{width:82px;height:82px}.everyday-game-tabs{width:100%}.everyday-game-tabs button{flex:1;padding:0 7px}.everyday-pagination{flex-wrap:wrap}.everyday-pagination span{order:-1;width:100%;text-align:center}.game-dot-row{grid-template-columns:repeat(8,1fr)}.game-question-card{padding:15px}.game-review-card{grid-template-columns:42px 1fr}
}
@media(max-width:390px){.everyday-preview-grid{grid-template-columns:1fr}.game-dot-row{grid-template-columns:repeat(5,1fr)}}

.meaning-traps{margin:0 0 42px;border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:14px}.meaning-traps summary{cursor:pointer;font-weight:850;color:var(--text)}.meaning-trap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.meaning-trap-grid article{padding:11px;border-radius:13px;background:var(--surface-2)}.meaning-trap-grid small,.meaning-trap-grid strong{display:block}.meaning-trap-grid small{color:var(--muted);font-size:9px}.meaning-trap-grid strong{font-size:15px;margin:4px 0}.meaning-trap-grid p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}
@media(max-width:680px){.meaning-trap-grid{grid-template-columns:1fr}}


/* Tutor + Daily 5 + Vocabulary 100/500/1000 v7 */
.vocab-tier-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 8px}
.vocab-tier-tabs button{min-height:65px;border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:9px 11px;text-align:left;cursor:pointer;color:var(--text)}
.vocab-tier-tabs button strong,.vocab-tier-tabs button small{display:block}.vocab-tier-tabs button strong{font-size:20px}.vocab-tier-tabs button small{margin-top:2px;color:var(--muted);font-size:10px}
.vocab-tier-tabs button.active{background:var(--green-soft);border-color:#a8c9b7}.vocab-tier-note{margin:0 0 13px;color:var(--muted);font-size:10px;line-height:1.5}

.daily-five-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px;border-radius:22px;background:var(--green-dark);color:#fff}
.daily-five-card .eyebrow{color:#b9e1d2}.daily-five-card h2{margin:3px 0 7px;font-size:28px}.daily-five-card p{margin:0;color:#d2e1db;line-height:1.5;max-width:720px}.daily-five-card .primary-btn{background:#fff;color:var(--green-dark);border-color:#fff;flex:0 0 auto}

.tutor-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:6px 0 18px;padding:5px;border:1px solid var(--border);background:var(--surface);border-radius:16px;width:max-content;max-width:100%}
.tutor-tabs button{border:0;background:transparent;color:var(--muted);border-radius:11px;min-height:42px;padding:0 15px;font-weight:850;cursor:pointer}.tutor-tabs button.active{background:var(--green-dark);color:#fff}

.daily-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px;border:1px solid var(--border);background:var(--surface);border-radius:21px;margin-bottom:12px}
.daily-hero h2{font-size:30px;margin:3px 0 6px}.daily-hero p{margin:0;color:var(--muted);line-height:1.5}
.daily-progress-ring{flex:0 0 auto;width:95px;height:95px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--green-soft);border:8px solid var(--surface-2)}
.daily-progress-ring strong,.daily-progress-ring small{display:block}.daily-progress-ring strong{font-size:24px}.daily-progress-ring small{font-size:9px;color:var(--muted)}
.daily-step-list{display:grid;gap:8px;margin-bottom:38px}.daily-step{display:grid;grid-template-columns:48px 1fr;gap:12px;border:1px solid var(--border);background:var(--surface);border-radius:17px;padding:14px}.daily-step.done{border-color:#9bc5aa;background:var(--green-soft)}
.daily-check{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-weight:950}.daily-step.done .daily-check{background:var(--green);color:#fff}
.daily-step h3{margin:1px 0 5px;font-size:18px}.daily-step p{margin:0;color:var(--muted);line-height:1.5}.daily-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.daily-actions .secondary-btn{min-height:39px;font-size:11px}.daily-actions .text-btn{min-height:39px}

.conversation-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:12px;margin-bottom:42px}.conversation-side,.conversation-main{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:17px;min-width:0}
.conversation-side h2{font-size:25px;margin:4px 0 6px}.conversation-side>p{color:var(--muted);line-height:1.45}.conversation-boundary{margin:14px 0 9px;padding:12px;background:var(--surface-2);border-radius:13px}.conversation-boundary strong,.conversation-boundary small{display:block}.conversation-boundary strong{font-size:24px}.conversation-boundary small{color:var(--muted);font-size:9px}
.readiness-bar{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden;margin:9px 0 5px}.readiness-bar span{display:block;height:100%;background:var(--green);border-radius:inherit}
.conversation-side>small{display:block;color:var(--muted);line-height:1.45;margin-bottom:12px}.conversation-side .secondary-btn{width:100%;font-size:11px}
.conversation-note{padding:10px 11px;border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:10px;line-height:1.45;margin-bottom:12px}
.chat-stream{display:grid;gap:8px;max-height:520px;overflow:auto;padding-right:3px}.chat-bubble{max-width:85%;padding:11px 13px;border-radius:15px;background:var(--surface-2)}.chat-bubble.learner{margin-left:auto;background:var(--green-soft)}.chat-bubble.coach{background:#eef0f6}.dark .chat-bubble.coach{background:#282c38}
.chat-bubble strong{display:block;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.chat-bubble p{margin:4px 0 0;font-size:15px}.chat-bubble small{display:block;color:var(--muted);margin-top:5px;font-size:10px}
.conversation-form{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:13px}.conversation-form input{width:100%;min-height:48px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:13px;padding:0 13px;font-size:16px}.conversation-form .primary-btn{min-height:48px}
.conversation-support{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.conversation-support button{border:1px solid var(--border);background:var(--surface-2);color:var(--muted);border-radius:999px;min-height:34px;padding:0 10px;font-size:9px;font-weight:800;cursor:pointer}
.conversation-feedback{margin-top:8px;color:var(--muted);font-size:11px;line-height:1.5}.conversation-feedback strong{color:var(--text)}.conversation-complete{margin-top:14px;padding:15px;border-radius:15px;background:var(--green-soft)}.conversation-complete strong{font-size:18px}.conversation-complete p{color:var(--green-dark)}

.scenario-heading h2{font-size:30px;margin:3px 0 5px}.scenario-heading p{color:var(--muted);line-height:1.5;max-width:760px}.scenario-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0 42px}
.scenario-card{display:grid;grid-template-columns:48px 1fr;gap:10px;border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:14px}.scenario-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;background:var(--surface-2);font-size:22px}.scenario-level{font-size:8px;color:var(--muted);font-weight:900;letter-spacing:.07em}.scenario-card h3{margin:3px 0 4px;font-size:18px}.scenario-card p{margin:0 0 9px;color:var(--muted);font-size:11px;line-height:1.4}.scenario-card small{display:block;color:var(--muted);font-size:9px;margin:5px 0 9px}.scenario-card .primary-btn{width:100%;min-height:39px;font-size:10px}

@media(max-width:980px){
  .conversation-layout{grid-template-columns:1fr}.scenario-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .vocab-tier-tabs{grid-template-columns:1fr}.daily-five-card,.daily-hero{align-items:flex-start;flex-direction:column}.daily-five-card .primary-btn{width:100%}.tutor-tabs{width:100%}.tutor-tabs button{flex:1;padding:0 7px}.daily-progress-ring{width:82px;height:82px}.conversation-form{grid-template-columns:1fr}.conversation-form .primary-btn{width:100%}.chat-bubble{max-width:96%}.scenario-grid{grid-template-columns:1fr}
}


/* Mobile focus + Daily 5 priority v8 */
.mobile-more-trigger,.mobile-more-menu{display:none}
@media(max-width:680px){
  .primary-nav .nav-item.mobile-hide{display:none}
  .primary-nav .mobile-more-trigger{display:flex}
  .primary-nav{gap:3px;justify-content:stretch}
  .primary-nav .nav-item{flex:1;font-size:10px;min-height:60px}
  .primary-nav .nav-item span{font-size:16px;line-height:1}
  .mobile-more-menu{position:fixed;left:12px;right:12px;bottom:77px;z-index:65;padding:8px;border:1px solid var(--border);border-radius:18px;background:var(--surface);box-shadow:0 18px 48px rgba(0,0,0,.18)}
  .mobile-more-menu:not([hidden]){display:grid;gap:6px}
  .mobile-more-menu button{display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;column-gap:9px;align-items:center;width:100%;min-height:58px;padding:8px 10px;border:0;border-radius:13px;background:var(--surface-2);color:var(--text);text-align:left}
  .mobile-more-menu button>span{grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--surface);font-size:18px}
  .mobile-more-menu strong{font-size:13px}.mobile-more-menu small{font-size:9px;color:var(--muted)}
  .daily-five-home{margin-top:0}
  .daily-five-card{padding:17px;border-radius:18px}
  .daily-five-card h2{font-size:24px}
  .daily-five-card .primary-btn{min-height:50px}
  .beginner-steps{display:none}
  .welcome-grid{padding-bottom:15px}
  .home-section{margin-top:24px}
}


/* Tutor correction + mobile game polish v8 */
.tutor-correction{margin-top:8px;padding:12px;border:1px solid #d9bf7a;border-radius:13px;background:#fbf5e7;color:var(--text)}
.tutor-correction>strong{display:block;font-size:13px}.tutor-correction p{margin:5px 0;color:#6d5b2f;line-height:1.45}.tutor-correction .secondary-btn{margin-top:8px;min-height:39px;font-size:10px}
body.dark .tutor-correction{background:#463d27;border-color:#75663c}body.dark .tutor-correction p{color:#dfcf9f}
.game-answer-grid button{transition:transform .12s ease,border-color .12s ease,background .12s ease}
.game-answer-grid button.selected{transform:scale(.992)}
@media(max-width:680px){
  .game-session-head h2{font-size:25px}
  .game-question-card h3{font-size:31px}
  .game-answer-grid button{min-height:68px}
  .game-question-nav{margin-bottom:20px}
  .game-hidden-note{line-height:1.45}
  .conversation-note{font-size:9px}
}


/* Beginner success loop v9 */
.daily-focus-hero{display:grid;gap:10px;margin-bottom:12px;padding:18px;border:1px solid var(--border);border-radius:20px;background:var(--surface)}
.daily-focus-hero h2{margin:3px 0 5px;font-size:28px}.daily-focus-hero p{margin:0;color:var(--muted);line-height:1.5}
.daily-progress-mini{height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden}.daily-progress-mini span{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width .25s ease}
.daily-focus-card{max-width:760px;margin:0 auto 36px;padding:22px;border:1px solid var(--border);border-radius:22px;background:var(--surface);box-shadow:0 10px 28px rgba(0,0,0,.04)}
.daily-focus-card h2{margin:6px 0 8px;font-size:34px;line-height:1.15}.daily-focus-card>p{color:var(--muted);line-height:1.55}
.daily-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}
.daily-choice-grid button{min-height:58px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);color:var(--text);font-weight:850;font-size:14px;text-align:left;cursor:pointer}
.daily-choice-grid button:hover,.daily-choice-grid button:focus-visible{border-color:#8bb79e;background:var(--green-soft)}
.daily-link-pair{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:16px 0;padding:18px;border-radius:16px;background:var(--green-soft);text-align:center}
.daily-link-pair strong{font-size:25px}.daily-link-pair span{font-size:22px;color:var(--green-dark)}
.daily-example-line,.daily-scenario-prompt{display:grid;gap:4px;margin-top:14px;padding:12px;border-radius:13px;background:var(--surface-2)}
.daily-example-line small,.daily-scenario-prompt small{color:var(--muted);font-size:9px}.daily-example-line span,.daily-scenario-prompt strong{font-size:14px}
.daily-feedback,.daily-carry{max-width:760px;margin:0 auto 10px;padding:10px 12px;border-radius:12px;background:var(--green-soft);color:var(--green-dark);font-size:11px;line-height:1.45}
.daily-complete-card{max-width:760px;margin:0 auto 38px;padding:24px;border-radius:22px;background:var(--green-dark);color:#fff}
.daily-complete-card .eyebrow{color:#b9e1d2}.daily-complete-card h2{font-size:32px;margin:5px 0 10px}.daily-complete-card p{color:#d9e6e1;line-height:1.6}.daily-complete-card strong{color:#fff}
.vocab-quality-chip{display:inline-flex;margin:0 0 8px;padding:4px 8px;border-radius:999px;background:var(--green-soft);color:var(--green-dark);font-size:8px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.tutor-change{padding:1px 3px;border-radius:4px;background:#fff2b8;color:#473b16}
body.dark .tutor-change{background:#6a5a24;color:#fff4c7}
@media(max-width:680px){
  .daily-focus-hero{padding:14px}.daily-focus-card{padding:17px;border-radius:18px}.daily-focus-card h2{font-size:28px}
  .daily-choice-grid{grid-template-columns:1fr}.daily-choice-grid button{min-height:54px}
  .daily-link-pair{grid-template-columns:1fr;gap:4px}.daily-link-pair strong{font-size:22px}.daily-link-pair span{transform:rotate(90deg)}
  .daily-complete-card{padding:19px}.daily-complete-card h2{font-size:27px}
}


/* Simple first-run home v10 */
.simple-home-hero{min-height:500px;display:grid;place-items:center;padding:68px 0 48px;text-align:center}
.simple-home-copy{width:min(820px,100%);margin:0 auto}
.simple-home-copy h1{max-width:780px;margin:0 auto 20px;font-size:clamp(44px,7vw,76px);line-height:.98}
.simple-home-copy>p{max-width:690px;margin:0 auto;color:var(--muted);font-size:19px;line-height:1.6}
.simple-home-start{min-height:58px;margin-top:25px;padding:0 26px;font-size:16px}
.simple-start-note{display:block;margin-top:9px;color:var(--muted);font-size:11px}
.simple-dna-example{display:grid;grid-template-columns:auto auto auto;justify-content:center;align-items:center;gap:12px;width:max-content;max-width:100%;margin:34px auto 0;padding:15px 19px;border:1px solid var(--border);border-radius:17px;background:var(--surface)}
.simple-dna-example>span,.simple-dna-example>strong{font-size:25px;letter-spacing:-.035em}.simple-dna-example>b{color:var(--green);font-size:20px}
.simple-dna-example small{grid-column:1/-1;color:var(--muted);font-size:10px;line-height:1.4}

.simple-how,.simple-next,.simple-translator{width:min(920px,100%);margin:0 auto 54px}
.simple-section-heading{text-align:center;margin-bottom:17px}.simple-section-heading h2{margin:0;font-size:34px}.simple-section-heading p{max-width:650px;margin:7px auto 0;color:var(--muted);line-height:1.55}
.simple-how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.simple-how-grid article{display:grid;grid-template-columns:38px 1fr;gap:11px;align-items:start;padding:17px;border:1px solid var(--border);border-radius:17px;background:var(--surface)}
.simple-how-grid article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--green-soft);color:var(--green-dark);font-weight:950}
.simple-how-grid strong,.simple-how-grid small{display:block}.simple-how-grid strong{font-size:15px}.simple-how-grid small{margin-top:5px;color:var(--muted);font-size:11px;line-height:1.45}

.simple-path-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.simple-path-card{min-width:0;min-height:116px;display:grid;grid-template-columns:38px 1fr;gap:9px;align-content:center;align-items:center;padding:14px;border:1px solid var(--border);border-radius:17px;background:var(--surface);color:var(--text);text-align:left;text-decoration:none;cursor:pointer}
.simple-path-card>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:var(--surface-2);font-size:18px}
.simple-path-card strong,.simple-path-card small{display:block}.simple-path-card strong{font-size:14px}.simple-path-card small{margin-top:4px;color:var(--muted);font-size:10px;line-height:1.4}
.simple-path-card:hover,.simple-path-card:focus-visible{border-color:#9ebfac;background:var(--green-soft)}
.simple-path-card.learn{background:var(--green-dark);border-color:var(--green-dark);color:#fff}.simple-path-card.learn>span{background:rgba(255,255,255,.14)}.simple-path-card.learn small{color:#d4e4de}

.simple-translator{scroll-margin-top:150px}.simple-translator-panel{width:min(760px,100%);margin:0 auto;border-radius:20px;padding:16px;box-shadow:none}
.simple-translator-panel .translation-result{min-height:112px}.simple-translator-panel .translation-empty,.simple-translator-panel .translation-loading,.simple-translator-panel .translation-error{min-height:80px}
.simple-translator-panel .translator-input-wrap{min-height:56px}

@media(max-width:900px){
  .simple-path-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .simple-home-hero{min-height:auto;padding:42px 0 34px}
  .simple-home-copy h1{font-size:43px;line-height:1.02;margin-bottom:16px}
  .simple-home-copy>p{font-size:16px;line-height:1.55}
  .simple-home-start{width:100%;min-height:56px}
  .simple-dna-example{grid-template-columns:1fr auto 1fr;width:100%;padding:13px 12px;gap:7px}
  .simple-dna-example>span,.simple-dna-example>strong{font-size:20px;overflow-wrap:anywhere}
  .simple-how,.simple-next,.simple-translator{margin-bottom:38px}
  .simple-section-heading{text-align:left}.simple-section-heading h2{font-size:28px}.simple-section-heading p{margin-left:0}
  .simple-how-grid{grid-template-columns:1fr}.simple-how-grid article{padding:14px}
  .simple-path-grid{grid-template-columns:1fr 1fr}.simple-path-card{min-height:105px;padding:12px}
  .simple-translator-panel{padding:12px}.simple-translator-panel .translation-controls{grid-template-columns:1fr 44px}.simple-translator-panel .translate-btn{grid-column:1/-1;width:100%}
}
@media(max-width:390px){
  .simple-home-copy h1{font-size:38px}
  .simple-path-grid{grid-template-columns:1fr}.simple-path-card{min-height:82px}
}


/* Simple, learner-first practice v11 */
.practice-simple-head{margin-bottom:14px}.practice-simple-head h2{font-size:30px;margin:0 0 6px}.practice-simple-head p{max-width:820px;margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.practice-task{margin:18px 0 12px;padding:20px;border-radius:18px;background:var(--surface-2)}
.practice-task>span{display:block;margin-bottom:6px;color:var(--green);font-size:10px;font-weight:900;letter-spacing:.1em}
.practice-task h3{margin:0 0 8px;font-size:clamp(24px,4vw,36px);letter-spacing:-.035em;line-height:1.08}
.practice-task>strong{display:block;margin-top:10px;font-size:clamp(25px,4vw,38px);letter-spacing:-.03em}
.practice-task p{margin:7px 0 0;color:var(--muted);line-height:1.5}
.practice-help-wrap{margin:10px 0 16px}
.practice-help-button{min-height:40px;padding:0 13px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--green-dark);font-weight:850;cursor:pointer}
.practice-help-panel{margin-top:8px;padding:13px 14px;border:1px solid #b9cdbf;border-radius:13px;background:var(--green-soft);color:var(--green-dark)}
.practice-help-panel strong{display:block;font-size:14px}.practice-help-panel p{margin:5px 0;line-height:1.5}.practice-help-panel small{display:block;margin-top:7px;color:var(--muted)}
.practice-footer.simple{justify-content:flex-end;border-top:0;padding-top:4px;margin-top:12px}
.pronunciation-coach.simplified{margin-top:10px}.pronunciation-coach.simplified .reading-guide{font-size:20px;margin-bottom:8px}
.practice-stage .feedback[hidden]{display:none}
@media(max-width:680px){
  .practice-simple-head h2{font-size:25px}
  .practice-task{padding:15px;margin-top:14px}
  .practice-task h3{font-size:25px}
  .practice-task>strong{font-size:27px}
  .practice-help-button{width:100%;text-align:left}
  .answer-form{flex-direction:column}.answer-form .primary-btn{width:100%}
  .practice-footer.simple .skip-btn{width:100%}
}


/* Translation trust + one-screen Practice v12 */
.translation-context-note{margin-top:8px;padding:8px 10px;border-radius:11px;background:var(--surface);border:1px solid var(--border);color:var(--muted);font-size:10px;line-height:1.45}
button.audio-playing,[data-speak].audio-playing,[data-speak-slow].audio-playing,[data-tutor-speak].audio-playing,[data-everyday-speak].audio-playing{border-color:var(--green)!important;background:var(--green-soft)!important;color:var(--green-dark)!important;cursor:progress!important;box-shadow:0 0 0 3px rgba(29,107,84,.10)}
button:active{transform:translateY(1px)}

.practice-intro{padding:16px 0 6px}.practice-intro .eyebrow{display:none}.practice-intro h1{font-size:30px;margin:0 0 4px}.practice-intro p{margin:0;font-size:12px;line-height:1.4}
.smart-review-bar{padding:9px 11px;margin:4px 0 7px;border-radius:13px}.smart-review-bar>div>strong{font-size:15px}.smart-review-bar small{font-size:10px;margin-top:2px}.smart-review-bar .eyebrow{display:none}.smart-review-bar .primary-btn{min-height:38px;padding:0 13px}
.practice-toolbar{grid-template-columns:58px minmax(0,380px);gap:7px;margin:4px 0 7px}.practice-toolbar label{font-size:11px}.practice-toolbar select{min-height:39px;padding:0 10px;border-radius:11px;font-size:12px}
.practice-mode-grid{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;padding-bottom:1px}
.practice-mode-grid .mode-card{flex:1 1 0;min-width:102px;min-height:46px;padding:7px 9px;border-radius:11px;text-align:center;white-space:nowrap}
.practice-mode-grid .mode-card span,.practice-mode-grid .mode-card strong{display:inline}.practice-mode-grid .mode-card span{font-size:14px;margin:0 4px 0 0}.practice-mode-grid .mode-card strong{font-size:11px}.practice-mode-grid .mode-card small{display:none}
.practice-stage{min-height:0;padding:14px 16px;border-radius:17px;box-shadow:none;scroll-margin-top:148px}
.practice-simple-head{margin-bottom:7px}.practice-simple-head h2{font-size:22px;margin:0 0 2px}.practice-simple-head p{font-size:11px;line-height:1.35}
.practice-task{margin:7px 0 6px;padding:11px 13px;border-radius:13px}.practice-task>span{font-size:8px;margin-bottom:3px}.practice-task h3{font-size:21px;margin-bottom:4px}.practice-task>strong{margin-top:5px;font-size:25px}.practice-task p{margin-top:4px;font-size:11px}
.practice-help-wrap{position:relative;margin:5px 0 7px}.practice-help-button{min-height:34px;padding:0 10px;border-radius:10px;font-size:11px}
.practice-help-panel{position:absolute;left:0;top:39px;z-index:45;width:min(430px,calc(100vw - 60px));margin:0;padding:11px 12px;box-shadow:0 16px 40px rgba(18,60,49,.18)}
.practice-help-panel p{font-size:12px}.practice-help-panel small{font-size:10px}
.answer-form input{min-height:44px}.answer-form .primary-btn{min-height:44px}.practice-actions{margin-top:7px}.practice-actions .secondary-btn,.practice-actions .mic-btn{min-height:40px}
.tick-list{gap:5px;margin:7px 0}.tick-item{min-height:43px;padding:7px 10px}.tick-item input{width:18px;height:18px}
.choice-grid{gap:7px;margin-top:8px}.choice-btn{min-height:58px;padding:10px;font-size:15px}.big-listen{min-height:66px;font-size:17px}
.feedback{margin-top:8px;min-height:0;padding:9px 11px;font-size:11px}.practice-footer.simple{margin-top:6px;padding-top:0}.skip-btn{min-height:36px;font-size:11px}

@media(max-width:680px){
  .practice-intro{padding:10px 0 3px}.practice-intro h1{font-size:25px}.practice-intro p{font-size:11px}
  .practice-toolbar{grid-template-columns:1fr;margin-top:3px}.practice-toolbar label{display:none}.practice-toolbar select{min-height:37px}
  .practice-mode-grid .mode-card{min-width:90px;min-height:43px}
  .practice-stage{padding:12px;scroll-margin-top:76px}
  .practice-simple-head h2{font-size:20px}.practice-task{padding:10px}.practice-task h3{font-size:19px}.practice-task>strong{font-size:23px}
  .practice-help-panel{position:fixed;left:10px;right:10px;bottom:86px;top:auto;width:auto;max-height:42vh;overflow:auto}
  .choice-grid{grid-template-columns:1fr}.choice-btn{min-height:52px}
}


/* Pattern teaching clarity v13 */
.pattern-dialog{max-height:min(88vh,780px);overflow:auto}
.simple-pattern-hero{padding-right:50px;margin-bottom:10px}.simple-pattern-hero h2{margin-bottom:0}
.pattern-teaching-card{padding:16px;border:1px solid var(--border);border-radius:18px;background:var(--green-soft)}
.pattern-teaching-card .eyebrow{margin-bottom:5px}.pattern-teaching-card h3{margin:0 0 8px;font-size:22px}.pattern-meaning{margin:0;color:var(--text);font-size:15px;line-height:1.55}
.worked-example{margin-top:12px;padding:12px 13px;border-radius:13px;background:var(--surface)}
.worked-example small{display:block;font-size:9px;font-weight:900;letter-spacing:.08em;color:var(--muted)}
.worked-example strong{display:block;margin-top:3px;font-size:21px;line-height:1.25}.worked-example p{margin:5px 0 0;color:var(--muted);line-height:1.45;font-size:12px}
.pattern-teaching-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.pattern-teaching-actions .primary-btn,.pattern-hear-main{min-height:42px}
.pattern-why,.pattern-caution{margin:10px 0 0;font-size:11px;line-height:1.45}.pattern-caution{color:var(--muted)}
.pattern-example-section{margin-top:15px}.pattern-example-section>h3,.pattern-skill-section>h3{margin:0 0 4px;font-size:16px}.pattern-example-section>p{margin:0 0 7px;color:var(--muted);font-size:11px}
.pattern-example-list{border:1px solid var(--border);border-radius:15px;background:var(--surface-2);padding:5px 12px}
.teaching-example-row{display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) auto;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--border)}
.teaching-example-row:last-child{border-bottom:0}.teaching-example-row>div{min-width:0}.teaching-example-row small{display:block;font-size:8px;color:var(--muted);font-weight:900;letter-spacing:.06em}.teaching-example-row strong,.teaching-example-row span{font-size:14px;overflow-wrap:anywhere}.teaching-example-row .arrow{color:var(--green);font-weight:900}
.teaching-example-row.sound{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) auto}.teaching-example-row.sound span{color:var(--muted);font-size:12px}
.teaching-example-row .small-audio{width:auto;min-width:58px;padding:0 9px;font-size:11px}.pattern-skill-section{margin-top:14px}.pattern-skill-section .skill-strip{margin:8px 0 0}
@media(max-width:680px){
  .pattern-dialog{width:calc(100% - 12px);max-height:calc(100vh - 86px);border-radius:20px}
  .dialog-inner{padding:16px}.simple-pattern-hero h2{font-size:32px;margin-top:10px}
  .pattern-teaching-card{padding:13px}.pattern-teaching-card h3{font-size:19px}.pattern-meaning{font-size:14px}
  .worked-example strong{font-size:19px}.pattern-teaching-actions{display:grid;grid-template-columns:1fr}.pattern-teaching-actions>*{width:100%}
  .teaching-example-row,.teaching-example-row.sound{grid-template-columns:1fr auto}.teaching-example-row .arrow{display:none}.teaching-example-row>div:nth-of-type(2){grid-column:1/2}.teaching-example-row .small-audio{grid-column:2;grid-row:1/3}
  .pattern-skill-section .skill-strip{grid-template-columns:repeat(5,1fr);gap:4px}.pattern-skill-section .skill-button{min-height:54px;padding:5px}.pattern-skill-section .skill-button strong{font-size:9px}
}


/* Learner-first Pattern Library v14 */
.library-intro-simple{max-width:820px;padding-bottom:14px}
.library-intro-simple h1{max-width:760px}
.library-intro-simple p{max-width:720px}

.pattern-next-card{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:4px 0 28px;padding:22px 24px;border:1px solid #b9d5c8;border-radius:22px;background:linear-gradient(135deg,var(--green-soft),var(--surface))}
.pattern-next-copy{min-width:0;max-width:760px}.pattern-next-copy .eyebrow{margin-bottom:7px}.pattern-next-copy h2{margin:8px 0 7px;font-size:32px;letter-spacing:-.04em}.pattern-next-copy>p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.pattern-kind{display:inline-flex;align-items:center;min-height:27px;padding:0 9px;border-radius:999px;background:var(--surface);border:1px solid var(--border);color:var(--green-dark);font-size:9px;font-weight:900;letter-spacing:.035em}
.pattern-next-example{display:inline-grid;gap:2px;margin-top:12px;padding:9px 11px;border-radius:12px;background:var(--surface)}
.pattern-next-example small{font-size:8px;font-weight:900;letter-spacing:.08em;color:var(--muted)}.pattern-next-example strong{font-size:15px}
.pattern-next-status{display:block;margin-top:9px;color:var(--muted);font-weight:800}
.pattern-next-actions{display:grid;gap:8px;flex:0 0 180px}.pattern-next-actions button{width:100%}

.library-section-simple{margin-top:0}.library-simple-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:12px}
.library-simple-heading h2{margin:2px 0 4px;font-size:30px}.library-simple-heading p{margin:0;color:var(--muted);font-size:11px}
.pattern-search-simple{display:flex;align-items:center;gap:10px;min-height:52px;margin-bottom:10px;padding:0 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.pattern-search-simple>span[aria-hidden]{color:var(--green);font-weight:900}.pattern-search-simple input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:15px}
.library-filter-row{margin:0 0 14px;gap:6px}.library-filter-row .chip{min-height:36px;padding:0 11px;font-size:10px}.library-filter-row .chip.active{background:var(--green-dark);color:#fff;border-color:var(--green-dark)}

.pattern-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pattern-card.learner-pattern-card{min-height:250px;padding:17px;border-radius:18px;box-shadow:none}
.learner-pattern-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pattern-status{color:var(--muted);font-size:9px;font-weight:850;white-space:nowrap}
.learner-pattern-card h3{margin:15px 0 7px;font-size:24px;line-height:1.08;letter-spacing:-.035em}
.pattern-card-teaching{margin:0;color:var(--muted);font-size:12px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pattern-card-example{margin-top:12px;padding:10px 11px;border-radius:12px;background:var(--surface-2)}
.pattern-card-example small{display:block;font-size:8px;font-weight:900;letter-spacing:.08em;color:var(--muted)}.pattern-card-example strong{display:block;margin-top:3px;font-size:14px;line-height:1.35;overflow-wrap:anywhere}
.pattern-card-progress{height:5px;margin-top:12px;border-radius:999px;background:var(--surface-2);overflow:hidden}.pattern-card-progress span{display:block;height:100%;border-radius:inherit;background:var(--green)}
.pattern-card-actions.learner-actions{display:grid;grid-template-columns:1.2fr .8fr;gap:7px;margin-top:auto;padding-top:13px}
.pattern-card-actions.learner-actions .card-btn{min-height:42px}.pattern-card-actions.learner-actions .card-btn.primary{background:var(--green-dark);border-color:var(--green-dark);color:#fff}
.pattern-card-actions.learner-actions .card-btn:not(.primary){background:var(--surface)}
.pattern-card.learner-pattern-card:hover{border-color:#abc8b9;transform:none}

body.dark .pattern-next-card{border-color:var(--border);background:linear-gradient(135deg,var(--green-soft),var(--surface))}
body.dark .pattern-kind{background:var(--surface-2)}

@media(max-width:980px){
  .pattern-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .library-intro-simple{padding-top:26px}
  .library-intro-simple h1{font-size:36px}
  .pattern-next-card{align-items:stretch;flex-direction:column;margin-bottom:20px;padding:17px}
  .pattern-next-copy h2{font-size:27px}.pattern-next-actions{grid-template-columns:1fr 1fr;flex-basis:auto}
  .library-simple-heading h2{font-size:25px}
  .library-filter-row{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}.library-filter-row .chip{flex:0 0 auto}
  .pattern-grid{grid-template-columns:1fr;gap:9px}
  .pattern-card.learner-pattern-card{min-height:0;padding:15px}
  .learner-pattern-card h3{font-size:22px;margin-top:12px}
  .pattern-card-teaching{-webkit-line-clamp:2}
  .pattern-card-actions.learner-actions{grid-template-columns:1fr 1fr}
}
@media(max-width:390px){
  .pattern-next-actions{grid-template-columns:1fr}
  .pattern-card-actions.learner-actions{grid-template-columns:1fr}
}


/* Adaptive Pattern Mastery + outcome-first progress v15 */
.pattern-journey-card{margin-top:12px;padding:14px 15px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.pattern-journey-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.pattern-journey-head h3{margin:2px 0 0;font-size:17px}.pattern-journey-head>strong{font-size:18px;color:var(--green-dark)}
.pattern-journey-progress{height:6px;margin:10px 0;border-radius:999px;background:var(--surface-2);overflow:hidden}.pattern-journey-progress span{display:block;height:100%;border-radius:inherit;background:var(--green)}
.pattern-journey-steps{display:flex;gap:5px;flex-wrap:wrap}.pattern-journey-steps span{padding:4px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:8px;font-weight:850}
.pattern-journey-steps span.done{background:var(--green-soft);color:var(--green-dark)}.pattern-journey-steps span.current{border:1px solid #a8c6b7;background:var(--surface);color:var(--green-dark)}
.pattern-next-step{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:11px;border-top:1px solid var(--border)}.pattern-next-step p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}.pattern-next-step .primary-btn{flex:0 0 auto;min-height:40px}

.dna-outcome-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:14px;margin:0 0 22px}
.dna-outcome-copy,.dna-outcome-next{border:1px solid var(--border);border-radius:22px;background:var(--surface);padding:20px}
.dna-outcome-copy h2{margin:3px 0 5px;font-size:31px;letter-spacing:-.04em}.dna-outcome-copy>p{margin:0;color:var(--muted);font-size:12px}
.dna-outcome-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:16px}.dna-outcome-grid article{padding:12px;border-radius:13px;background:var(--surface-2)}.dna-outcome-grid strong{display:block;font-size:24px}.dna-outcome-grid small{display:block;margin-top:2px;color:var(--muted);font-size:9px;line-height:1.3}
.dna-outcome-next{display:flex;flex-direction:column;justify-content:center;background:var(--green-dark);color:#fff}.dna-outcome-next>small{font-size:9px;font-weight:900;letter-spacing:.09em;color:#b9d7cc}.dna-outcome-next>strong{margin-top:5px;font-size:21px}.dna-outcome-next p{margin:6px 0 13px;color:#d6e6e0;font-size:11px;line-height:1.5}.dna-outcome-next .primary-btn{background:#fff;color:var(--green-dark);border-color:#fff}
.dna-detail-progress{margin-top:8px}.dna-command-center{margin-top:28px}

.simple-conversation .conversation-side{align-self:start}.conversation-pattern-focus{display:grid;gap:3px;margin:14px 0;padding:11px;border-radius:13px;background:var(--green-soft);color:var(--green-dark)}
.conversation-pattern-focus small{font-size:8px;font-weight:900;letter-spacing:.08em}.conversation-pattern-focus strong{font-size:14px}.conversation-pattern-focus span{font-size:10px;line-height:1.4;color:var(--muted)}
.simple-conversation .conversation-note{padding:9px 11px;font-size:10px}.simple-conversation .conversation-side>.secondary-btn{margin-top:12px}
.scenario-card .scenario-level,.scenario-card .readiness-bar{display:none}

@media(max-width:900px){
  .dna-outcome-hero{grid-template-columns:1fr}.dna-outcome-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .pattern-journey-steps{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.pattern-journey-steps span{flex:0 0 auto}
  .pattern-next-step{align-items:stretch;flex-direction:column}.pattern-next-step .primary-btn{width:100%}
  .dna-outcome-copy,.dna-outcome-next{padding:16px;border-radius:18px}.dna-outcome-copy h2{font-size:26px}.dna-outcome-grid{gap:6px}.dna-outcome-grid article{padding:10px}
  .conversation-pattern-focus{margin:10px 0}
}


/* Quality, mobile and install polish v16 */
html{-webkit-text-size-adjust:100%;scroll-padding-bottom:96px}
body{overscroll-behavior-y:contain}
button,a,input,select{touch-action:manipulation}
.pronunciation-advice{margin-top:10px;padding:10px 11px;border-radius:12px;background:var(--green-soft);color:var(--green-dark)}
.pronunciation-advice>small{display:block;margin-bottom:5px;font-size:8px;font-weight:900;letter-spacing:.08em}.pronunciation-advice p{margin:4px 0;font-size:11px;line-height:1.45}
.pronunciation-caveat{display:block;margin-top:8px;color:var(--muted);font-size:9px;line-height:1.4}
.choice-grid.four-choice{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-progress-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:12px;margin:28px 0;padding:18px;border:1px solid var(--border);border-radius:20px;background:var(--surface)}
.profile-tools-copy h2{margin:3px 0 6px;font-size:25px}.profile-tools-copy>p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.daily-goal-line{display:flex;align-items:center;gap:8px;margin-top:13px}.daily-goal-line>span{width:42px;height:7px;border-radius:999px;background:var(--surface-2)}.daily-goal-line>span.done{background:var(--green)}.daily-goal-line strong{font-size:11px}
.profile-tool-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;align-content:center}.profile-tool-actions .primary-btn,.profile-tool-actions .secondary-btn,.profile-tool-actions .text-btn{min-height:44px}
.profile-tool-actions>small{grid-column:1/-1;color:var(--muted);font-size:9px;line-height:1.4}.installed-note{display:grid;place-items:center;min-height:44px;border-radius:12px;background:var(--green-soft);color:var(--green-dark);font-size:10px;font-weight:850}

@media(max-width:680px){
  .app-shell{min-height:100dvh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .topbar{min-height:58px;padding:7px 12px}.brand-mark{width:38px;height:38px;border-radius:12px}.brand strong{font-size:16px}.topbar-actions{gap:5px}.icon-btn{width:42px;height:42px}.stat-pill{min-height:42px;padding:0 10px}
  .primary-nav{padding:5px 5px max(5px,env(safe-area-inset-bottom));min-height:calc(66px + env(safe-area-inset-bottom))}
  .primary-nav .nav-item{min-height:54px}
  .mobile-more-menu{bottom:calc(70px + env(safe-area-inset-bottom))}
  main{padding:0 12px calc(20px + env(safe-area-inset-bottom))}
  input,select,textarea{font-size:16px!important}
  .practice-stage{scroll-margin-top:66px}
  .practice-help-panel{bottom:calc(76px + env(safe-area-inset-bottom))}
  .choice-grid.four-choice{grid-template-columns:1fr 1fr}
  .choice-grid.four-choice .choice-btn{min-height:58px}
  .app-progress-tools{grid-template-columns:1fr;margin:20px 0;padding:14px;border-radius:17px}
  .profile-tool-actions{grid-template-columns:1fr 1fr}
  .pattern-dialog{max-height:calc(100dvh - 76px)}
}
@media(max-width:420px){
  .choice-grid.four-choice{grid-template-columns:1fr}
  .profile-tool-actions{grid-template-columns:1fr}
  .profile-tool-actions>small{grid-column:1}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* Full-platform learner simplicity v17 */
.dna-capabilities-section{margin:0 0 20px}
.section-heading.compact{margin-bottom:10px}.section-heading.compact h2{margin:0;font-size:28px}
.dna-capability-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.dna-capability{display:grid;grid-template-columns:40px 1fr;gap:10px;min-height:145px;padding:14px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.dna-capability.ready{border-color:#a9cbbb;background:var(--green-soft)}.dna-capability-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--surface);font-size:20px}
.dna-capability small{font-size:8px;font-weight:900;letter-spacing:.08em;color:var(--green-dark)}.dna-capability h3{margin:3px 0 5px;font-size:16px}.dna-capability p{margin:0;color:var(--muted);font-size:10px;line-height:1.45}
.dna-capability-progress{height:5px;margin-top:11px;border-radius:999px;background:var(--surface-2);overflow:hidden}.dna-capability-progress span{display:block;height:100%;border-radius:inherit;background:var(--green)}
.dna-more-details{margin:20px 0 28px;border:1px solid var(--border);border-radius:18px;background:var(--surface);overflow:hidden}
.dna-more-details>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:58px;padding:0 16px;cursor:pointer;font-weight:900;list-style:none}.dna-more-details>summary::-webkit-details-marker{display:none}
.dna-more-details>summary::after{content:'＋';font-size:18px;color:var(--green)}.dna-more-details[open]>summary::after{content:'−'}
.dna-more-details>summary small{margin-left:auto;color:var(--muted);font-size:9px;font-weight:600}.dna-details-inner{padding:0 16px 18px;border-top:1px solid var(--border)}
.dna-details-inner .dna-detail-progress{margin-top:18px}
.lesson-session-head small{line-height:1.4}

@media(max-width:980px){
  .dna-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .dna-capabilities-section{margin-bottom:15px}.section-heading.compact h2{font-size:24px}
  .dna-capability-grid{grid-template-columns:1fr 1fr;gap:7px}
  .dna-capability{grid-template-columns:34px 1fr;gap:8px;min-height:132px;padding:11px}.dna-capability-icon{width:32px;height:32px;font-size:17px}
  .dna-capability h3{font-size:14px}.dna-capability p{font-size:9px}
  .dna-more-details>summary{align-items:flex-start;flex-direction:column;justify-content:center;gap:2px;padding:10px 14px;position:relative}.dna-more-details>summary::after{position:absolute;right:14px;top:50%;transform:translateY(-50%)}
  .dna-more-details>summary small{margin-left:0;padding-right:30px}.dna-details-inner{padding:0 11px 14px}
}
@media(max-width:390px){
  .dna-capability-grid{grid-template-columns:1fr}
  .dna-capability{min-height:0}
}


.translation-senses{margin-top:9px;padding:11px;border:1px solid var(--border);border-radius:13px;background:var(--surface)}
.translation-senses>small{display:block;margin-bottom:7px;color:var(--green);font-size:8px;font-weight:900;letter-spacing:.08em}
.translation-senses>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.translation-senses span{display:grid;gap:2px;padding:8px 9px;border-radius:10px;background:var(--surface-2)}
.translation-senses b{color:var(--muted);font-size:9px;font-weight:700;line-height:1.35}.translation-senses strong{font-size:13px}
.simple-start-note b{color:var(--green-dark)}
body.dark .simple-start-note b{color:var(--green)}
@media(max-width:680px){.translation-senses>div{grid-template-columns:1fr}}


.account-dialog{width:min(520px,calc(100% - 24px));max-height:min(88vh,720px);padding:0;border:1px solid var(--border);border-radius:22px;background:var(--surface);color:var(--text);box-shadow:0 24px 80px rgba(0,0,0,.28)}
.account-dialog::backdrop{background:rgba(10,28,23,.42);backdrop-filter:blur(3px)}
.account-dialog-inner{position:relative;padding:22px}.account-dialog-inner>.dialog-close{position:absolute;right:12px;top:12px;z-index:2}
.account-dialog-head{padding-right:38px}.account-dialog-head h2{margin:3px 0 7px;font-size:29px}.account-dialog-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.account-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:16px 0 11px;padding:4px;border-radius:13px;background:var(--surface-2)}
.account-tabs button{min-height:41px;border:0;border-radius:10px;background:transparent;font-weight:850;cursor:pointer}.account-tabs button.active{background:var(--surface);color:var(--green-dark)}
.account-form{display:grid;gap:9px}.account-form label{display:grid;gap:5px;color:var(--muted);font-size:10px;font-weight:850}.account-form input{min-height:48px;padding:0 12px;border:1px solid var(--border);border-radius:12px;background:var(--bg);color:var(--text);font-size:16px}.account-form .primary-btn{margin-top:3px}
.account-message{min-height:18px;margin:8px 0 0;color:var(--muted);font-size:10px;line-height:1.4}
.account-status-card{display:grid;gap:4px;margin:15px 0;padding:13px;border-radius:13px;background:var(--green-soft);color:var(--green-dark)}.account-status-card strong{font-size:14px}.account-status-card small{font-size:10px;line-height:1.4}
.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.account-actions .danger{grid-column:1/-1;color:#9b3030}
@media(max-width:520px){.account-dialog{width:calc(100% - 12px);max-height:calc(100dvh - 84px)}.account-dialog-inner{padding:18px 14px}.account-dialog-head h2{font-size:25px}.account-actions{grid-template-columns:1fr}}


/* LanguageDNA visual system v17.1 — pattern-first, accessible and mobile-first */
:root{
  --bg:#f6f9fa;--surface:#fff;--surface-2:#edf5f5;--text:#193847;--muted:#526975;
  --border:#d9e6e8;--green:#096d75;--green-dark:#123d4a;--green-soft:#ddf4ed;
  --lime:#9ff1cf;--sound:#e8edff;--word:#dff5ed;--sentence:#ffefe2;
  --verb:#efeaff;--question:#ffe7ed;--shadow:0 16px 46px rgba(17,58,70,.07)
}
body.dark{
  --bg:#0e202b;--surface:#172f3b;--surface-2:#233f4a;--text:#effbff;--muted:#bed3dd;
  --border:#365462;--green:#80e5d2;--green-dark:#123d4a;--green-soft:#234b4a;
  --word:#234e43;--sound:#303d5a;--sentence:#584437;--verb:#433b5c;--question:#5c3645;
  --shadow:0 16px 46px rgba(0,0,0,.24)
}
html{scroll-padding-top:112px}
body{background:var(--bg)}
a{color:var(--green)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #ec9365;outline-offset:3px}
.topbar{border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--surface) 94%,transparent)}
.brand-mark{background:var(--green-dark);border-radius:13px;box-shadow:0 5px 16px rgba(18,61,74,.14)}
.brand-mark img{display:block;width:31px;height:31px}
.brand strong{font-size:19px;letter-spacing:-.045em}
.brand small{font-size:11px;letter-spacing:.01em}
.primary-nav{background:var(--surface);border-bottom-color:var(--border)}
.nav-item{font-weight:650;transition:background-color .18s ease,color .18s ease}
.nav-item.active{background:var(--green-soft);color:#145a5d}
body.dark .nav-item.active{color:var(--text)}
.primary-btn{background:var(--green-dark);border-color:var(--green-dark);box-shadow:0 6px 16px rgba(18,61,74,.13)}
.primary-btn:hover{filter:brightness(1.1)}
.secondary-btn:hover,.card-btn:hover{border-color:var(--green)}
.chip{font-size:12px}
.eyebrow{color:var(--green);letter-spacing:.105em}
.view h1{line-height:1.055}
.page-intro{padding-top:36px}
.page-intro h1{font-size:clamp(35px,5vw,56px);letter-spacing:-.055em}
.page-intro p{font-size:15px;line-height:1.55}
.simple-home-hero{
  min-height:0;max-width:1140px;margin:22px auto 23px;padding:clamp(26px,5vw,56px);
  display:grid;grid-template-columns:minmax(0,1.22fr) minmax(275px,.78fr);align-items:center;gap:clamp(24px,4vw,64px);
  border:1px solid #d3e8e7;border-radius:30px;text-align:left;
  background:radial-gradient(circle at 100% 0%,rgba(133,201,240,.31),transparent 42%),linear-gradient(120deg,#e5f8f0,#e6f4fa 67%,#f3efff);
  box-shadow:0 14px 50px rgba(21,70,79,.055)
}
body.dark .simple-home-hero{border-color:var(--border);background:radial-gradient(circle at 100% 0%,rgba(97,183,203,.22),transparent 40%),linear-gradient(130deg,#183e42,#1b3449)}
.simple-home-copy{width:auto;margin:0;min-width:0}
.simple-home-copy .eyebrow{margin-bottom:13px}
.simple-home-copy h1{margin:0 0 18px;max-width:665px;font-size:clamp(38px,5.4vw,66px);letter-spacing:-.064em;line-height:1.035}
.hero-period{color:#ee8e67}
.simple-home-copy>p{margin:0;max-width:490px;font-size:clamp(15px,1.7vw,18px);color:var(--muted);line-height:1.5}
.simple-home-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:26px}
.simple-home-actions .primary-btn,.simple-home-actions .secondary-btn{min-height:54px;margin:0;display:inline-flex;gap:13px;align-items:center;justify-content:center;padding:0 20px;border-radius:14px;font-size:14px}
.simple-home-start span,.simple-home-explore span{font-size:19px;line-height:1}
.simple-home-explore{border-color:#b8d4d8;background:rgba(255,255,255,.8);color:#184958}
body.dark .simple-home-explore{background:var(--surface);color:var(--text)}
.simple-start-note{font-size:12px;margin-top:14px;line-height:1.5}
.simple-start-note b{color:#145c60}
.simple-dna-example{
  position:relative;display:block;width:100%;max-width:100%;margin:0;padding:25px 22px;
  border:1px solid rgba(156,198,206,.85);border-radius:23px;background:rgba(255,255,255,.88);
  text-align:left;box-shadow:0 18px 35px rgba(21,70,79,.085)
}
body.dark .simple-dna-example{background:var(--surface);border-color:var(--border)}
.example-kicker{display:block;font-size:10px;font-weight:850;letter-spacing:.12em;color:var(--green);margin-bottom:20px}
.example-words{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.example-words>div{grid-column:1/-1;min-width:0;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.example-words>div:last-child{background:var(--green-soft)}
.example-words small{display:block;font-size:10px;letter-spacing:.08em;font-weight:800;color:var(--muted);margin-bottom:5px}
.example-words span,.example-words strong{display:block;font-size:clamp(23px,2.6vw,33px);line-height:1.15;letter-spacing:-.04em;overflow-wrap:anywhere}
.example-words> b{grid-column:1/-1;text-align:center;font-size:20px;color:var(--green);line-height:.8}
.example-bridge{display:flex;gap:9px;align-items:center;margin-top:18px;color:var(--muted);font-size:12px;line-height:1.5}
.example-bridge span:first-child{flex:0 0 auto;color:#cd744f;font-size:19px}
.home-patterns,.simple-how,.simple-next,.simple-translator{width:min(1050px,100%);margin:0 auto 34px}
.home-patterns-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:0 0 15px}
.home-patterns-heading .eyebrow{margin-bottom:6px}
.home-patterns-heading h2{margin:0;font-size:clamp(25px,3.2vw,36px);letter-spacing:-.045em}
.home-patterns-all{min-height:44px;display:inline-flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--green);font-weight:850;cursor:pointer;white-space:nowrap}
.home-patterns-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.home-pattern-card{
  display:flex;flex-direction:column;align-items:stretch;min-width:0;min-height:209px;padding:20px;
  border:1px solid var(--border);border-radius:21px;background:var(--surface);
  text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  box-shadow:0 6px 24px rgba(19,60,73,.035)
}
.home-pattern-card:hover,.home-pattern-card:focus-visible{transform:translateY(-3px);border-color:var(--green);box-shadow:0 12px 24px rgba(19,60,73,.09)}
.home-pattern-card.words{background:linear-gradient(160deg,var(--word),var(--surface) 65%)}
.home-pattern-card.sounds{background:linear-gradient(160deg,var(--sound),var(--surface) 65%)}
.home-pattern-card.sentences{background:linear-gradient(160deg,var(--sentence),var(--surface) 65%)}
.home-pattern-category{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:900;letter-spacing:.09em;color:var(--muted)}
.home-pattern-symbol{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--surface);color:var(--green);font-size:14px;letter-spacing:0}
.home-pattern-arrow{margin-left:auto;color:var(--green);font-size:19px}
.home-pattern-card>strong{display:block;margin:15px 0 5px;font-size:clamp(20px,2.5vw,27px);letter-spacing:-.04em;line-height:1.15}
.home-pattern-card>strong span{color:var(--green)}
.home-pattern-sample{font-size:13px;color:var(--muted);line-height:1.5}
.home-pattern-sample b{margin:0 4px;color:var(--green)}
.home-pattern-link{margin-top:auto;padding-top:19px;color:var(--green);font-size:12px;font-weight:850}
.home-pattern-link span{margin-left:4px}
.home-how-disclosure{border:1px solid var(--border);border-radius:18px;background:var(--surface);overflow:hidden}
.home-how-disclosure>summary{display:flex;align-items:center;gap:14px;justify-content:space-between;min-height:76px;padding:15px 20px;cursor:pointer;list-style:none}
.home-how-disclosure>summary::-webkit-details-marker{display:none}
.home-how-disclosure>summary span{display:block}
.home-how-disclosure>summary .eyebrow{font-size:9px;margin-bottom:3px}
.home-how-disclosure>summary strong{font-size:20px;letter-spacing:-.025em}
.home-how-disclosure>summary small{margin-left:auto;color:var(--muted);font-size:12px}
.home-how-disclosure>summary::after{content:'＋';color:var(--green);font-size:24px}
.home-how-disclosure[open]>summary::after{content:'−'}
.home-how-disclosure .simple-section-heading{padding:16px 18px 0}
.home-how-disclosure .simple-how-grid{padding:0 18px 18px}
.home-how-disclosure .simple-section-heading h2{font-size:22px}
.simple-next{padding-top:2px}
.simple-next .simple-section-heading h2,.simple-translator .simple-section-heading h2{font-size:clamp(25px,3vw,30px)}
.simple-path-card{min-height:100px}
.simple-path-card strong{font-size:15px}
.pattern-card.learner-pattern-card,.simple-path-card,.translator-panel{box-shadow:0 6px 22px rgba(17,57,73,.035)}
.pattern-search-simple:focus-within,.translator-input-wrap:focus-within{border-color:var(--green);box-shadow:0 0 0 3px rgba(10,130,128,.12)}
.library-intro-simple{padding-top:30px;padding-bottom:9px}
.library-intro-simple h1{max-width:800px;font-size:clamp(33px,4.4vw,51px)}
.pattern-next-card{border-color:var(--border)}
body.dark .pattern-next-card{border-color:var(--border)}
@media(max-width:950px){
  .simple-home-hero{grid-template-columns:minmax(0,1fr) minmax(255px,.85fr);padding:32px 28px;gap:23px}
  .simple-home-copy h1{font-size:clamp(35px,5vw,51px)}
  .simple-home-actions .primary-btn,.simple-home-actions .secondary-btn{padding:0 14px;font-size:13px}
}
@media(max-width:750px){
  .simple-home-hero{grid-template-columns:1fr;gap:21px}
  .simple-dna-example{max-width:100%;padding:18px}
  .example-words{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px}
  .example-words>div,.example-words>div:last-child{grid-column:auto}
  .example-words>b{grid-column:auto;transform:none;font-size:20px}
  .example-words>div{padding:11px 9px}
  .example-words span,.example-words strong{font-size:clamp(17px,3.7vw,26px)}
  .home-patterns-grid{gap:8px}
  .home-pattern-card{padding:14px;min-height:180px}
  .home-pattern-card>strong{font-size:20px}
}
@media(max-width:680px){
  .app-shell{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
  .topbar{min-height:60px;padding:7px 14px}
  .brand-mark{width:39px;height:39px}
  .brand-mark img{width:29px;height:29px}
  .brand strong{font-size:17px}
  .stat-pill{display:none}
  .primary-nav{padding:6px 5px max(7px,env(safe-area-inset-bottom));min-height:calc(67px + env(safe-area-inset-bottom));gap:3px}
  .primary-nav .nav-item{min-width:0;min-height:53px;font-size:10.5px;gap:5px;padding:6px 2px;border-radius:12px}
  .primary-nav .nav-item span{font-size:20px}
  .primary-nav .nav-item.active{background:var(--green-soft);color:#12626a}
  body.dark .primary-nav .nav-item.active{color:var(--text)}
  .mobile-more-menu{bottom:calc(74px + env(safe-area-inset-bottom))}
  main{padding:0 14px calc(28px + env(safe-area-inset-bottom))}
  .simple-home-hero{margin:13px auto 25px;padding:23px 20px 20px;border-radius:24px;gap:17px}
  .simple-home-copy .eyebrow{font-size:10px;margin-bottom:10px}
  .simple-home-copy h1{font-size:clamp(35px,9.6vw,46px);line-height:1.045;margin-bottom:12px}
  .simple-home-copy>p{font-size:15px;line-height:1.42}
  .simple-home-actions{display:grid;grid-template-columns:1fr;gap:8px;margin-top:18px}
  .simple-home-actions .primary-btn,.simple-home-actions .secondary-btn{width:100%;min-height:49px;padding:0 14px;font-size:14px}
  .simple-home-explore{border-color:#abd4d2}
  .simple-start-note{margin-top:11px;font-size:11px}
  .simple-dna-example{padding:13px 14px;border-radius:17px;box-shadow:none}
  .example-kicker{font-size:9px;margin-bottom:8px}
  .example-words small{font-size:8px;margin-bottom:3px}
  .example-words>div{padding:9px 10px}
  .example-words span,.example-words strong{font-size:clamp(15px,4.3vw,21px)}
  .example-bridge{font-size:10px;margin-top:9px}
  .home-patterns,.simple-how,.simple-next,.simple-translator{margin-bottom:28px}
  .home-patterns-heading{align-items:center;margin-bottom:10px}
  .home-patterns-heading .eyebrow{font-size:9px;margin-bottom:4px}
  .home-patterns-heading h2{font-size:27px}
  .home-patterns-all{font-size:11px;padding:0}
  .home-patterns-grid{grid-template-columns:1fr;gap:8px}
  .home-pattern-card{min-height:0;display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:14px 16px;border-radius:16px}
  .home-pattern-category{grid-column:1/-1;font-size:9px}
  .home-pattern-symbol{width:26px;height:26px}
  .home-pattern-card>strong{grid-column:1/-1;margin:6px 0 0;font-size:22px}
  .home-pattern-sample{grid-column:1;font-size:12px;min-width:0;overflow-wrap:anywhere}
  .home-pattern-link{grid-column:2;margin:0;padding:0;align-self:end;font-size:10px;white-space:nowrap}
  .home-how-disclosure>summary{padding:12px 15px;min-height:68px}
  .home-how-disclosure>summary strong{font-size:17px}
  .home-how-disclosure>summary small{font-size:10px}
  .home-how-disclosure .simple-how-grid{padding:0 12px 13px;grid-template-columns:1fr}
  .home-how-disclosure .simple-how-grid article{padding:10px}
  .simple-next .simple-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .simple-path-card{min-height:92px;padding:11px;grid-template-columns:28px 1fr;gap:6px}
  .simple-path-card>span{width:28px;height:28px;font-size:16px}
  .simple-path-card strong{font-size:12px}
  .simple-path-card small{font-size:10px}
  .page-intro{padding:24px 0 10px}
  .page-intro h1{font-size:32px;margin-bottom:9px}
  .page-intro p{font-size:13px;line-height:1.55}
  .library-intro-simple{padding-top:20px}
  .library-intro-simple h1{font-size:33px}
  .pattern-next-card{padding:15px;margin-bottom:17px;gap:12px}
  .pattern-next-copy h2{font-size:24px}
  .pattern-next-copy>p{font-size:12px}
  .library-simple-heading h2{font-size:23px}
  .pattern-card.learner-pattern-card{padding:15px}
  .pattern-card-teaching{-webkit-line-clamp:2}
  .library-filter-row .chip{min-height:42px;padding:0 14px;font-size:12px}
  .pattern-search-simple{min-height:54px}
  .pattern-next-actions button{min-height:44px}
  .practice-stage{border-radius:19px}
}
@media(max-width:390px){
  .simple-home-copy h1{font-size:35px}
  .home-patterns-heading h2{font-size:24px}
  .home-patterns-all{font-size:10px}
  .simple-next .simple-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-how-disclosure>summary small{display:none}
}
@media(prefers-reduced-motion:reduce){
  .home-pattern-card,.nav-item{transition:none}
  .home-pattern-card:hover{transform:none}
}

/* v17 tablet width guard: retain direct access to Patterns without page overflow. */
@media (min-width:681px) and (max-width:980px){
  .primary-nav{
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
    gap:3px;
    padding-left:12px;
    padding-right:12px;
    justify-content:flex-start;
    overscroll-behavior-x:contain;
  }
  .primary-nav::-webkit-scrollbar{display:none}
  .primary-nav .nav-item{
    flex:0 0 auto;
    padding:0 12px;
    gap:5px;
    font-size:12px;
    white-space:nowrap;
  }
}


/* v18: LanguageDNA Playful Discovery — original, colourful, uncluttered */
:root{
  --bg:#f8fbf8;--surface:#ffffff;--surface-2:#eff8f4;
  --text:#173b45;--muted:#4c6670;--border:#d7e7e1;
  --green:#087f69;--green-dark:#164752;--green-soft:#dcf8e8;
  --word:#e1f9df;--sound:#eae4ff;--sentence:#fff0d9;
  --verb:#eee8ff;--question:#ffe9ec;
  --ld-teal:#0c927b;--ld-teal-deep:#086753;--ld-ink:#173b45;
  --ld-lime:#c1f264;--ld-purple:#8066d8;--ld-purple-deep:#5944a8;
  --ld-coral:#ff987b;--ld-yellow:#ffdb75;--ld-blue:#79c8f7;
  --shadow:0 16px 42px rgba(18,85,78,.09)
}
body.dark{
  --bg:#112931;--surface:#1a3540;--surface-2:#254550;
  --text:#f1faf7;--muted:#b9d3d1;--border:#42616a;
  --green:#89ebc9;--green-dark:#0c544a;--green-soft:#204f48;
  --word:#254e3c;--sound:#433b66;--sentence:#544533;
  --verb:#433b60;--question:#5e3b4a;
  --ld-teal:#61e2be;--ld-teal-deep:#21705c;--ld-ink:#f1faf7;
  --ld-lime:#c1f264;--ld-purple:#b09cf8;--ld-purple-deep:#5944a8;
  --ld-coral:#ffab91;--ld-yellow:#ffe092;--ld-blue:#82d3fb;
  --shadow:0 14px 38px rgba(0,0,0,.17)
}
body{background:var(--bg);color:var(--text)}
button,select,.chip,.nav-item{transition:background-color .17s ease,border-color .17s ease,box-shadow .17s ease,transform .17s ease}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{
  outline:3px solid #a15cfa;outline-offset:3px
}
.topbar{background:var(--surface);box-shadow:0 1px 0 var(--border)}
.brand-mark{
  background:linear-gradient(135deg,#0d9984,#165b6d);border-radius:16px;
  border:2px solid rgba(255,255,255,.55);box-shadow:0 4px 0 #0a645a
}
.brand strong{font-weight:950;letter-spacing:-.05em}
.brand small{font-weight:650}
.course-pill,.stat-pill,.icon-btn{background:var(--surface);border:2px solid var(--border);border-radius:16px}
.icon-btn{box-shadow:0 3px 0 var(--border)}
.icon-btn:hover{background:var(--green-soft)}
.primary-nav{gap:8px;background:var(--surface);padding-top:11px;padding-bottom:11px}
.primary-nav .nav-item{
  border-radius:15px;min-height:47px;padding:0 12px;gap:8px;
  font-size:13px;font-weight:800;color:var(--text)
}
.primary-nav .nav-item span{
  display:inline-grid;place-items:center;flex:0 0 auto;
  width:27px;height:27px;border-radius:10px;font-size:17px;
  color:#255b65;background:#edf8fb
}
.primary-nav [data-view="library"] span{background:#e8e0ff;color:#5943ad}
.primary-nav [data-view="practice"] span{background:#e1f8e9;color:#087456}
.primary-nav [data-view="tutor"] span{background:#fff0d6;color:#885412}
.primary-nav [data-view="game"] span{background:#ffe4e0;color:#a54146}
.primary-nav [data-view="dna"] span{background:#f4e8fc;color:#7750a8}
.primary-nav [data-view="course"] span{background:#e4f4fc;color:#246b9b}
.primary-nav .nav-item.active{
  border:1px solid #a5e4cb;background:#e2f9ed;color:#0b6b53;
  box-shadow:0 3px 0 #b7e7d3
}
.primary-nav .nav-item:hover:not(.active){background:var(--surface-2);transform:translateY(-1px)}
body.dark .primary-nav .nav-item{color:var(--text)}
body.dark .primary-nav .nav-item.active{background:#24554c;color:#d2ffe9;border-color:#3c937c}
body.dark .primary-nav .nav-item span{filter:saturate(.85)}
.primary-btn,.mic-btn{
  background:#087f69;color:#fff;border:2px solid #087f69;
  border-radius:16px;box-shadow:0 5px 0 #075844;
  font-weight:900;letter-spacing:.005em
}
.primary-btn:hover,.mic-btn:hover{background:#086e5d;border-color:#086e5d;filter:none;transform:translateY(-2px);box-shadow:0 7px 0 #075844}
.primary-btn:active,.mic-btn:active{transform:translateY(3px);box-shadow:0 2px 0 #075844}
.secondary-btn{
  border:2px solid #cbdedb;background:var(--surface);color:var(--text);
  border-radius:16px;box-shadow:0 4px 0 #d3e1df;font-weight:850
}
.secondary-btn:hover{border-color:#7aaca4;background:var(--green-soft);transform:translateY(-1px)}
.secondary-btn:active{transform:translateY(2px);box-shadow:0 2px 0 #d3e1df}
body.dark .primary-btn,body.dark .mic-btn{background:#6de1bc;color:#103b31;border-color:#6de1bc;box-shadow:0 5px 0 #298d70}
body.dark .primary-btn:hover,body.dark .mic-btn:hover{background:#90ebce;color:#103b31;border-color:#90ebce;box-shadow:0 6px 0 #298d70}
body.dark .secondary-btn{background:#244a50;color:#effbf8;border-color:#4d7275;box-shadow:0 4px 0 #143038}
body.dark .secondary-btn:hover{background:#315b56}
.chip,.family-tab{border-radius:999px}
.chip.active,.family-tab.active{background:#0b7d69;border-color:#0b7d69;color:#fff;box-shadow:0 3px 0 #075a4b}
body.dark .chip.active,body.dark .family-tab.active{background:#a5efcd;color:#153b32;border-color:#a5efcd;box-shadow:none}
.eyebrow{font-weight:950;letter-spacing:.12em;color:#087665}
body.dark .eyebrow{color:#9eebc8}
.simple-home-hero{
  isolation:isolate;overflow:hidden;position:relative;
  background:linear-gradient(117deg,#e7f9e8 0%,#e2f9f8 49%,#edf0ff 100%);
  border:2px solid #d0ebe0;border-radius:32px;
  box-shadow:0 9px 0 #d8ebe4,0 17px 40px rgba(17,94,88,.065);
  margin-top:23px;margin-bottom:36px
}
.simple-home-hero:before,.simple-home-hero:after{
  content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%
}
.simple-home-hero:before{
  width:212px;height:212px;right:-94px;top:-122px;
  background:rgba(194,239,91,.62);border:12px solid rgba(255,255,255,.3)
}
.simple-home-hero:after{
  width:102px;height:102px;left:-59px;bottom:-47px;
  background:rgba(255,166,139,.3);border:11px solid rgba(255,255,255,.26)
}
body.dark .simple-home-hero{
  border-color:#376b61;
  background:linear-gradient(117deg,#194b41,#194a52 54%,#353d63);
  box-shadow:0 8px 0 #122f32,0 17px 40px rgba(0,0,0,.1)
}
body.dark .simple-home-hero:before{background:rgba(162,226,100,.17)}
body.dark .simple-home-hero:after{background:rgba(254,160,131,.16)}
.simple-home-copy .eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:#fffdf5;border:1px solid #d8eab1;padding:8px 12px;
  border-radius:999px;letter-spacing:.09em;font-size:10px
}
.simple-home-copy .eyebrow:before{content:"✦";font-size:15px;color:#c57b10}
body.dark .simple-home-copy .eyebrow{background:#294f45;border-color:#4c7667}
.simple-home-copy h1{
  font-weight:950;font-size:clamp(38px,5.1vw,63px);line-height:1.04;
  letter-spacing:-.061em;max-width:680px
}
.hero-period{color:#ff806b}
.simple-home-copy>p{color:#47656a;font-weight:650}
body.dark .simple-home-copy>p{color:#c1dedd}
.simple-home-actions .primary-btn{
  background:#087f69;border-color:#087f69;box-shadow:0 5px 0 #075844;
  min-height:57px;padding:0 23px
}
.simple-home-actions .primary-btn:hover{background:#086d5e;transform:translateY(-2px);box-shadow:0 7px 0 #075844}
.simple-home-explore{
  background:#ffdd79!important;border:2px solid #e3ac40!important;
  color:#493615!important;box-shadow:0 5px 0 #d9aa42!important;
  font-weight:900;min-height:57px!important
}
.simple-home-explore:hover{background:#ffe79f!important;transform:translateY(-2px);box-shadow:0 7px 0 #d9aa42!important}
.simple-home-explore:active{transform:translateY(3px);box-shadow:0 2px 0 #d9aa42!important}
.simple-start-note{font-size:12px;font-weight:650}
.simple-start-note b{color:#0a735e}
body.dark .simple-start-note b{color:#aef5d9}
.simple-dna-example{
  overflow:visible;background:var(--surface);border:2px solid #d2e9e2;
  box-shadow:7px 8px 0 rgba(78,137,134,.16);
  border-radius:25px;transform:rotate(1deg)
}
.simple-dna-example:before{
  content:"AHÁ! ✦";position:absolute;top:-19px;right:16px;
  padding:8px 13px;background:#ff9c83;border:2px solid #e97362;
  color:#642f2c;border-radius:15px;font-size:12px;letter-spacing:.05em;
  font-weight:950;transform:rotate(7deg)
}
.example-kicker{font-size:10px;color:#0b7666;font-weight:950}
body.dark .example-kicker{color:#a2eed6}
.example-words>div{background:#eff7ff;border:1px solid #dcecf0;border-radius:17px}
.example-words>div:last-child{background:#dff8e9;border-color:#c3edd3}
.example-words span,.example-words strong{color:#163f4b}
.example-words>b{color:#775aca;font-size:25px}
.example-bridge{color:var(--muted)}
.example-bridge span:first-child{color:#fc7b65}
.home-patterns-heading h2{font-size:clamp(26px,3vw,35px);font-weight:950}
.home-patterns-all{
  background:#e8e1ff;border:2px solid #c9baf6;color:#543f9c;
  border-radius:13px;min-height:43px;padding:0 13px;
  font-weight:900;box-shadow:0 3px 0 #c7b8e8
}
.home-patterns-all:hover{background:#dbceff;transform:translateY(-1px)}
body.dark .home-patterns-all{background:#38305c;color:#e9dcff;border-color:#6b59aa;box-shadow:0 3px 0 #30274e}
.home-pattern-card{
  position:relative;overflow:hidden;border:2px solid var(--border);
  border-radius:22px;box-shadow:0 5px 0 #d9e9e1;
  min-height:207px
}
.home-pattern-card.words{background:linear-gradient(145deg,#e9fcdd,#ffffff 77%);border-color:#c4eab9;box-shadow:0 5px 0 #b9dfb6}
.home-pattern-card.sounds{background:linear-gradient(145deg,#ede4ff,#ffffff 77%);border-color:#d4c4f9;box-shadow:0 5px 0 #c6b8e9}
.home-pattern-card.sentences{background:linear-gradient(145deg,#fff0d9,#ffffff 77%);border-color:#f2d9ae;box-shadow:0 5px 0 #ead3a7}
.home-pattern-card:hover,.home-pattern-card:focus-visible{transform:translateY(-3px);box-shadow:0 8px 0 #bbd9d0}
.home-pattern-card.words:hover{box-shadow:0 8px 0 #b9dfb6}
.home-pattern-card.sounds:hover{box-shadow:0 8px 0 #c6b8e9}
.home-pattern-card.sentences:hover{box-shadow:0 8px 0 #ead3a7}
.home-pattern-card:active{transform:translateY(2px);box-shadow:0 2px 0 #bbd9d0}
.home-pattern-symbol{width:39px;height:39px;border-radius:13px;font-size:18px;box-shadow:0 3px 0 rgba(13,82,77,.11)}
.home-pattern-card.words .home-pattern-symbol{background:#bdeda1;color:#28652b}
.home-pattern-card.sounds .home-pattern-symbol{background:#d8c9fc;color:#5c429f}
.home-pattern-card.sentences .home-pattern-symbol{background:#ffdf9a;color:#87531e}
.home-pattern-category{font-size:10px;letter-spacing:.08em;color:#476069}
.home-pattern-card>strong{font-size:clamp(21px,2.35vw,27px);font-weight:950}
.home-pattern-card.words .home-pattern-link{color:#11714c}
.home-pattern-card.sounds .home-pattern-link{color:#5c42ad}
.home-pattern-card.sentences .home-pattern-link{color:#965118}
.home-pattern-sample{color:#455f67;font-weight:650}
.home-how-disclosure,.simple-path-card,.pattern-card.learner-pattern-card,.family-card,.mode-card,.dna-capability{
  border:2px solid var(--border);box-shadow:0 4px 0 #e0ece7
}
.home-how-disclosure{border-radius:22px}
.home-how-disclosure>summary::after{font-weight:950}
.home-how-disclosure[open]{background:var(--surface)}
.simple-path-card{border-radius:19px;min-height:108px}
.simple-path-card:hover{transform:translateY(-2px);border-color:#8bd9c1;background:#f0fff7;box-shadow:0 6px 0 #cde6d8}
.simple-path-card.learn{
  background:#0c846f;border-color:#086954;color:#fff;
  box-shadow:0 5px 0 #075642
}
.simple-path-card.learn:hover{background:#08725f;border-color:#075642}
.simple-path-card.learn small{color:#e2fbf0}
.simple-path-card:not(.learn):nth-child(2)>span{background:#eae0ff}
.simple-path-card:not(.learn):nth-child(3)>span{background:#ffebc4}
.simple-path-card:not(.learn):nth-child(4)>span{background:#deedff}
.pattern-next-card{border:2px solid #c8e5d4;background:linear-gradient(110deg,#e6faec,#f8fff9)}
body.dark .pattern-next-card{background:linear-gradient(110deg,#204b3d,#24474e)}
.pattern-card.learner-pattern-card:hover{border-color:#9dceba;box-shadow:0 6px 0 #c6e2d7}
.pattern-card-actions.learner-actions .card-btn.primary{
  background:#087f69;border:2px solid #087f69;box-shadow:0 3px 0 #085541;
  border-radius:12px;color:#fff
}
.pattern-card-actions.learner-actions .card-btn:not(.primary){
  border:2px solid var(--border);border-radius:12px;background:var(--surface)
}
.pattern-card-actions.learner-actions .card-btn:hover{transform:translateY(-1px)}
.pattern-card-example{border-radius:14px}
.pattern-card-progress,.mini-progress,.practice-progress,.pattern-journey-progress,.daily-progress-mini{height:9px;border-radius:999px}
.pattern-card-progress span,.mini-progress span,.daily-progress-mini span,.pattern-journey-progress span{
  background:linear-gradient(90deg,#16b195,#83dfa8)
}
.mini-badge.visual{background:#d9f5cb;color:#27602d}
.mini-badge.sound{background:#e4d8ff;color:#5941a6}
.mini-badge.writing{background:#ffe6bd;color:#854a18}
.mode-card:hover,.starter-card:hover,.family-card:hover,.lens-card:hover{border-color:#99dbc3;transform:translateY(-1px)}
.mode-card.active,.lens-card.active{background:#e4faeb;border-color:#98d9b7;box-shadow:0 4px 0 #b6e5cb}
.practice-stage,.daily-focus-card,.translator-panel,.account-dialog{border:2px solid var(--border);border-radius:23px}
.practice-task,.prompt-box{background:#eef8f4}
.practice-mode-grid .mode-card{border-radius:17px}
.choice-btn,.daily-choice-grid button{
  border:2px solid #cfe6df;background:var(--surface);box-shadow:0 3px 0 #d7e9df;
  border-radius:15px
}
.choice-btn:hover,.daily-choice-grid button:hover{background:#ecfff4;border-color:#93d8b2;transform:translateY(-1px)}
.choice-btn.correct{border-color:#61ae82;background:#e4f7de}
.choice-btn.incorrect{border-color:#d58b74;background:#fff0e8}
.feedback.correct{background:#e2f7e6;color:#245c3b}
.feedback.incorrect{background:#ffede5;color:#8a422d}
.big-listen{background:#ede5ff;border:2px solid #c7b3f3;color:#503c97}
.big-listen:hover{background:#e3d5ff}
.next-best{background:linear-gradient(110deg,#155866,#13796a);border-radius:24px}
.next-best .primary-btn{background:#fff;color:#155866;border:2px solid #fff;box-shadow:0 4px 0 #bbdecf}
body.dark .next-best .primary-btn{background:#fff;color:#155866;border-color:#fff;box-shadow:0 4px 0 #709785}
body.dark .home-pattern-card.words{background:linear-gradient(145deg,#285340,#1d383d 78%);border-color:#426c55;box-shadow:0 5px 0 #163d32}
body.dark .home-pattern-card.sounds{background:linear-gradient(145deg,#413963,#1e3744 78%);border-color:#625589;box-shadow:0 5px 0 #282246}
body.dark .home-pattern-card.sentences{background:linear-gradient(145deg,#544836,#203b40 78%);border-color:#80654c;box-shadow:0 5px 0 #423524}
body.dark .home-pattern-category,body.dark .home-pattern-sample{color:#e5f1ee}
body.dark .home-pattern-card>strong{color:#fff}
body.dark .home-pattern-card.words .home-pattern-link{color:#aeefc2}
body.dark .home-pattern-card.sounds .home-pattern-link{color:#d2bdff}
body.dark .home-pattern-card.sentences .home-pattern-link{color:#ffe0ac}
body.dark .home-how-disclosure,body.dark .simple-path-card,body.dark .pattern-card.learner-pattern-card,body.dark .family-card,body.dark .mode-card,body.dark .dna-capability{box-shadow:0 4px 0 #112b33}
body.dark .simple-path-card:hover{background:#29504d}
body.dark .practice-task,body.dark .prompt-box{background:var(--surface-2)}
body.dark .choice-btn,body.dark .daily-choice-grid button{background:#244550;color:var(--text);border-color:#456971;box-shadow:0 3px 0 #173339}
body.dark .choice-btn:hover,body.dark .daily-choice-grid button:hover{background:#2b5954}
body.dark .mode-card.active,body.dark .lens-card.active{background:#285549;color:#f1faf7;border-color:#63b693}
body.dark .mini-badge.visual{color:#27532f}
body.dark .mini-badge.sound{color:#3d286f}
body.dark .mini-badge.writing{color:#70421e}
body.dark .example-words>div{background:#ddecf4}
body.dark .example-words>div:last-child{background:#def7e9}
body.dark .simple-dna-example{border-color:#527c75;box-shadow:7px 8px 0 #143438}
body.dark .simple-dna-example:before{color:#642f2c}
@media (max-width:980px){
  .primary-nav .nav-item{padding:0 10px}
}
@media (max-width:680px){
  .topbar{border-bottom:1px solid var(--border)}
  .primary-nav{
    gap:3px;padding:7px 6px max(7px,env(safe-area-inset-bottom));
    background:var(--surface);box-shadow:0 -5px 22px rgba(13,70,61,.11)
  }
  .primary-nav .nav-item{gap:3px;padding:5px 2px;min-height:56px;font-size:10px;border:1px solid transparent}
  .primary-nav .nav-item span{width:28px;height:28px;font-size:18px;border-radius:10px}
  .primary-nav .nav-item.active{border-color:#a9e1c6;box-shadow:none}
  .mobile-more-menu{border:2px solid var(--border);border-radius:20px;box-shadow:0 12px 38px rgba(12,56,62,.17)}
  .mobile-more-menu button{min-height:60px;border-radius:13px}
  .simple-home-hero{padding:22px 16px 20px;border-radius:25px;margin-top:14px;margin-bottom:31px;box-shadow:0 6px 0 #d8ebe4}
  .simple-home-copy .eyebrow{font-size:9px;padding:7px 10px}
  .simple-home-copy h1{font-size:clamp(34px,9.4vw,45px);line-height:1.08}
  .simple-home-copy>p{font-size:15px}
  .simple-home-actions{grid-template-columns:1fr;gap:12px}
  .simple-home-actions .primary-btn,.simple-home-explore{min-height:52px!important}
  .simple-dna-example{margin-top:8px;padding:17px 13px 14px;transform:none;box-shadow:4px 5px 0 rgba(78,137,134,.16)}
  .simple-dna-example:before{top:-13px;right:12px;padding:5px 9px;font-size:10px}
  .example-words span,.example-words strong{font-size:clamp(15px,4.1vw,20px)}
  .home-patterns-heading{flex-wrap:wrap;align-items:center;gap:7px}
  .home-patterns-heading h2{font-size:clamp(23px,6.5vw,28px)}
  .home-patterns-all{min-height:41px;padding:0 10px;font-size:11px}
  .home-pattern-card{border-radius:17px;min-height:0;padding:13px 14px}
  .home-pattern-symbol{width:28px;height:28px;font-size:14px;border-radius:10px}
  .home-pattern-card>strong{font-size:22px}
  .home-pattern-link{font-size:11px}
  .simple-path-card{min-height:92px}
  .secondary-btn,.primary-btn,.card-btn{min-height:44px}
  .pattern-card.learner-pattern-card{border-radius:18px}
  .page-intro h1{font-size:clamp(31px,7.6vw,38px)}
  .choice-btn,.daily-choice-grid button{min-height:53px}
}
@media(max-width:350px){
  .home-patterns-heading h2{font-size:23px}
  .home-patterns-all{font-size:10px}
  .home-pattern-link{font-size:10px}
  .simple-home-copy h1{font-size:33px}
}
@media(prefers-reduced-motion:reduce){
  button,.nav-item,.home-pattern-card,.simple-path-card{transition:none!important}
  button:hover,.nav-item:hover,.home-pattern-card:hover,.simple-path-card:hover{transform:none!important}
}


/* Colour code the real pattern families, not arbitrary card position. */
.learner-pattern-card[data-pattern-type]{position:relative;overflow:hidden}
.learner-pattern-card[data-pattern-type]::before{content:"";position:absolute;inset:0 0 auto;height:6px;pointer-events:none}
.learner-pattern-card[data-pattern-type="visual"]::before{background:#91da75}
.learner-pattern-card[data-pattern-type="sound"]::before{background:#a892f1}
.learner-pattern-card[data-pattern-type="writing"]::before{background:#ffc46c}
.learner-pattern-card[data-pattern-type="visual"]{border-color:#cee8c5}
.learner-pattern-card[data-pattern-type="sound"]{border-color:#dacff2}
.learner-pattern-card[data-pattern-type="writing"]{border-color:#eedcbd}
.learner-pattern-card[data-pattern-type="visual"] .pattern-kind{background:#e0f8d8;border-color:#bee5b2;color:#27682f}
.learner-pattern-card[data-pattern-type="sound"] .pattern-kind{background:#eee7ff;border-color:#d5c8fc;color:#5840a2}
.learner-pattern-card[data-pattern-type="writing"] .pattern-kind{background:#fff0d7;border-color:#f3d8a7;color:#81501e}
body.dark .learner-pattern-card[data-pattern-type="visual"],
body.dark .learner-pattern-card[data-pattern-type="sound"],
body.dark .learner-pattern-card[data-pattern-type="writing"]{border-color:var(--border)}
body.dark .learner-pattern-card[data-pattern-type="visual"] .pattern-kind{background:#345d41;color:#e6ffe1;border-color:#457e53}
body.dark .learner-pattern-card[data-pattern-type="sound"] .pattern-kind{background:#483c6a;color:#f1e9ff;border-color:#706293}
body.dark .learner-pattern-card[data-pattern-type="writing"] .pattern-kind{background:#665134;color:#fff0d5;border-color:#91704d}



/* v18.1 — Whole-site LanguageDNA Playful Discovery system.
   Shared visual language for Course, Patterns, Practice, Tutor, Game, My Spanish
   and overlays, retaining user-friendly contrast and touch targets. */
:root{
  --ld-card-edge:#d7e7e1;--ld-card-floor:#dcebe5;
  --ld-card-accent:#0c927b;--ld-tint-mint:#e7f9ed;
  --ld-tint-lavender:#efe9ff;--ld-tint-gold:#fff1d8;
  --ld-tint-sky:#e5f5ff;--ld-tint-peach:#ffebe2;
  --ld-btn-shadow:#075844
}
body.dark{
  --ld-card-edge:#42616a;--ld-card-floor:#132d35;
  --ld-card-accent:#89ebc9;--ld-tint-mint:#244f40;
  --ld-tint-lavender:#3b365f;--ld-tint-gold:#50442f;
  --ld-tint-sky:#284757;--ld-tint-peach:#553c38;
  --ld-btn-shadow:#298d70
}
main .view{animation:ld-view-in .22s ease-out both}
@keyframes ld-view-in{from{opacity:.65;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.view .page-intro .eyebrow{
  display:inline-flex;align-items:center;min-height:28px;
  padding:4px 11px;border-radius:999px;border:1px solid #c9ead7;
  color:#087665;background:var(--ld-tint-mint);font-size:10px
}
body.dark .view .page-intro .eyebrow{border-color:#467e66;color:#cbffe6}
.view .page-intro h1{font-weight:950;letter-spacing:-.055em;color:var(--text)}
.view .page-intro p{max-width:730px;color:var(--muted);line-height:1.65}
:is(.section-heading,.simple-section-heading,.library-simple-heading) h2{font-weight:950;letter-spacing:-.045em}
:is(.course-level-summary,.course-unit-card,.mode-card,.practice-stage,.daily-hero,.scenario-card,
    .game-level-card,.game-question-card,.everyday-card,.dna-capability,.dna-metric,.dna-health-card,
    .command-card,.coverage-card,.dna-family,.translator-panel,.lesson-session-panel,
    .smart-review-bar,.session-summary,.conversation-side,.conversation-main,.conversation-panel,
    .daily-focus-card,.daily-complete-card,.app-progress-tools,.dna-outcome-copy,.dna-outcome-next){
  border:2px solid var(--ld-card-edge);
  border-radius:21px;background:var(--surface);
  box-shadow:0 4px 0 var(--ld-card-floor)
}
:is(.course-unit-card,.scenario-card,.game-level-card,.everyday-card,.dna-capability,.dna-metric,.coverage-card){
  min-width:0;overflow-wrap:anywhere
}
:is(.course-level-summary,.course-unit-card,.mode-card,.daily-hero,.scenario-card,.game-level-card,
    .game-question-card,.everyday-card,.dna-capability,.dna-metric,.dna-health-card,.command-card,
    .practice-stage,.translator-panel,.lesson-session-panel,.dna-outcome-copy,.dna-outcome-next) h2,
:is(.course-unit-card,.scenario-card,.game-level-card,.everyday-card,.command-card,.daily-focus-card) h3{
  letter-spacing:-.035em;font-weight:900
}
:is(.course-progress-hero,.game-intro-card,.game-result-hero.passed,.command-primary,.next-best){
  color:#fff;
  border:2px solid #0b6d5a;
  background:linear-gradient(120deg,#0d8b73,#126878 84%);
  border-radius:25px;
  box-shadow:0 6px 0 #0b5a50
}
:is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) :is(h2,h3,strong){color:#fff}
:is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) :is(p,small){color:#e8fff5}
:is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) .eyebrow{color:#d0ffad}
:is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) .primary-btn{
  background:#fff;border-color:#fff;color:#0b5a50;
  box-shadow:0 4px 0 #c5e3d1
}
:is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) .primary-btn:hover{
  background:#e5ffed;border-color:#e5ffed;box-shadow:0 6px 0 #c5e3d1
}
body.dark :is(.course-progress-hero,.game-intro-card,.game-result-hero.passed,.command-primary,.next-best){
  background:linear-gradient(125deg,#18594d,#205275);border-color:#3f8578;box-shadow:0 6px 0 #0f3438
}
body.dark :is(.course-progress-hero,.game-intro-card,.command-primary,.next-best) .primary-btn{
  background:#e9fff1;color:#0a5947;border-color:#e9fff1;box-shadow:0 4px 0 #8db9a3
}
/* Course */
.course-level-tabs{gap:10px}
.course-level-tab{
  border:2px solid var(--ld-card-edge);border-radius:17px;
  background:var(--surface);box-shadow:0 4px 0 var(--ld-card-floor);
  font-weight:850
}
.course-level-tab.active{background:var(--ld-tint-mint);border-color:#72cda7;box-shadow:0 4px 0 #a8ddc4}
.course-level-tab:hover:not(:disabled){transform:translateY(-2px);border-color:#71c6a6}
.course-level-tab:disabled,.course-unit-card.locked,.game-level-card.locked{opacity:.65}
.course-level-summary{background:linear-gradient(115deg,var(--ld-tint-sky),var(--surface))}
.course-level-ring{border:7px solid #a7e4c3;color:var(--text)}
.course-unit-card{position:relative;overflow:hidden}
.course-unit-card::before{
  content:"";height:6px;position:absolute;inset:0 0 auto;
  background:linear-gradient(90deg,#0caa89,#bbef68)
}
.course-unit-card:nth-child(3n + 2)::before{background:linear-gradient(90deg,#9a78ef,#73c8f7)}
.course-unit-card:nth-child(3n)::before{background:linear-gradient(90deg,#ffaf75,#ffdf86)}
.course-unit-card.complete{border-color:#87ccaa;background:linear-gradient(165deg,var(--ld-tint-mint),var(--surface) 45%)}
.course-unit-top{margin-top:7px}
.course-unit-progress,.session-progress,.game-progress-track,.course-progress-track{
  min-height:8px;background:var(--surface-2);border-radius:999px;overflow:hidden
}
.course-unit-progress span,.session-progress span,.game-progress-track span{
  background:linear-gradient(90deg,#0da68a,#b4ed77);border-radius:inherit
}
.course-pattern-chips :is(span,button),.game-level-stats span,.review-pill,.health-stat,.command-badges span{
  border:1px solid var(--border);border-radius:12px;background:var(--ld-tint-sky);
  color:var(--text);font-weight:750
}
.course-pattern-chips button:hover{background:var(--ld-tint-mint)}
/* Practice */
.smart-review-bar{
  background:linear-gradient(115deg,var(--ld-tint-mint),var(--surface) 75%);
  border-color:#acdcca;padding:18px
}
.smart-review-bar strong{font-weight:950}
.practice-toolbar select,#practicePatternSelect,.translation-controls select{
  min-height:47px;border:2px solid var(--ld-card-edge);border-radius:13px;
  background:var(--surface);color:var(--text);font-weight:750
}
.practice-mode-grid{gap:9px}
.practice-mode-grid .mode-card{
  position:relative;border:2px solid var(--ld-card-edge);
  border-radius:18px;box-shadow:0 4px 0 var(--ld-card-floor);
  background:var(--surface)
}
.practice-mode-grid .mode-card:hover:not(:disabled){border-color:#7ac7a8;transform:translateY(-2px)}
.practice-mode-grid .mode-card.active{
  background:var(--ld-tint-mint);border-color:#74c8a5;
  box-shadow:0 4px 0 #a3dec0
}
.practice-mode-grid .mode-card:nth-child(2).active{background:var(--ld-tint-peach);border-color:#f2bbac;box-shadow:0 4px 0 #f0c9ba}
.practice-mode-grid .mode-card:nth-child(3).active{background:var(--ld-tint-lavender);border-color:#c5b4ee;box-shadow:0 4px 0 #d5c9ec}
.practice-mode-grid .mode-card:nth-child(4).active{background:var(--ld-tint-sky);border-color:#b3d7f2;box-shadow:0 4px 0 #c5e0f0}
.practice-mode-grid .mode-card:nth-child(5).active{background:var(--ld-tint-gold);border-color:#e5c482;box-shadow:0 4px 0 #ead9b6}
.practice-mode-grid .mode-card strong{font-weight:950}
.practice-stage{
  border-radius:25px;box-shadow:0 5px 0 var(--ld-card-floor),0 13px 30px rgba(15,90,76,.04)
}
.practice-head .eyebrow,.game-question-label{color:var(--green)}
.prompt-box,.practice-task{border:1px solid var(--border);border-radius:20px;background:var(--ld-tint-sky)}
.prompt-label{color:var(--green);font-weight:900}
.choice-btn,.daily-choice-grid button,.game-answer-grid button{
  border:2px solid var(--ld-card-edge);border-radius:17px;
  background:var(--surface);box-shadow:0 4px 0 var(--ld-card-floor);
  color:var(--text);font-weight:850
}
.choice-btn:hover:not(:disabled),.daily-choice-grid button:hover:not(:disabled),.game-answer-grid button:hover:not(:disabled){
  border-color:#81cdaa;background:var(--ld-tint-mint);transform:translateY(-2px)
}
:is(.choice-btn,.daily-choice-grid button,.game-answer-grid button):active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--ld-card-floor)}
.choice-btn.correct{background:#daf5e3;border-color:#61ad82;color:#195c3c}
.choice-btn.incorrect{background:#ffe7de;border-color:#e59a80;color:#7b3325}
.feedback.correct,.daily-feedback.correct{border-radius:17px;background:#def6e6;color:#185c3b}
.feedback.incorrect,.daily-feedback.incorrect{border-radius:17px;background:#ffe8df;color:#7f3a2b}
body.dark .choice-btn.correct{background:#285641;color:#e4ffeb;border-color:#66b88b}
body.dark .choice-btn.incorrect{background:#603d36;color:#ffe6de;border-color:#d98b79}
/* Daily 5, conversation coach and scenarios */
.tutor-tabs,.everyday-game-tabs,.vocab-tier-tabs{
  display:flex;flex-wrap:wrap;gap:7px;padding:6px;border:2px solid var(--ld-card-edge);
  border-radius:19px;background:var(--surface-2);margin-bottom:18px
}
.tutor-tabs button,.everyday-game-tabs button,.vocab-tier-tabs button{
  min-height:47px;padding:9px 15px;cursor:pointer;border:2px solid transparent;
  border-radius:14px;background:transparent;color:var(--text);
  font-size:13px;font-weight:850;box-shadow:none
}
.tutor-tabs button:hover,.everyday-game-tabs button:hover,.vocab-tier-tabs button:hover{background:var(--ld-tint-sky)}
.tutor-tabs button.active,.everyday-game-tabs button.active,.vocab-tier-tabs button.active{
  background:#087f69;border-color:#087f69;color:#fff;box-shadow:0 3px 0 #075844
}
body.dark .tutor-tabs button.active,body.dark .everyday-game-tabs button.active,body.dark .vocab-tier-tabs button.active{
  background:#77e3bd;border-color:#77e3bd;color:#143a34;box-shadow:0 3px 0 #277d63
}
.daily-hero{background:linear-gradient(110deg,var(--ld-tint-mint),var(--surface) 85%)}
.daily-progress-ring{background:var(--ld-tint-mint);border-color:#a1e2bb}
.daily-step{border:2px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:0 3px 0 var(--ld-card-floor)}
.daily-step.done{background:var(--ld-tint-mint);border-color:#a2dcc1}
.daily-check{background:var(--ld-tint-lavender);color:#5941a6}
.done .daily-check{background:#087f69;color:#fff}
.daily-focus-hero{background:linear-gradient(120deg,var(--ld-tint-mint),var(--ld-tint-sky));border-radius:21px}
.daily-focus-card,.daily-complete-card{overflow:hidden}
.daily-link-pair,.daily-example-line,.daily-carry{border:1px solid var(--border);border-radius:16px;background:var(--ld-tint-mint)}
.daily-scenario-prompt{background:var(--ld-tint-lavender);border-radius:16px}
.daily-actions :is(button,a),.conversation-support button,.conversation-form button{min-height:44px}
.conversation-support button,.scenario-card .secondary-btn{border:2px solid var(--ld-card-edge);border-radius:13px;background:var(--surface);box-shadow:0 3px 0 var(--ld-card-floor)}
.conversation-support button:hover{background:var(--ld-tint-mint)}
.scenario-card{box-shadow:0 4px 0 var(--ld-card-floor)}
.scenario-card:nth-child(4n+1) .scenario-icon{background:var(--ld-tint-mint)}
.scenario-card:nth-child(4n+2) .scenario-icon{background:var(--ld-tint-lavender)}
.scenario-card:nth-child(4n+3) .scenario-icon{background:var(--ld-tint-gold)}
.scenario-card:nth-child(4n) .scenario-icon{background:var(--ld-tint-sky)}
.scenario-icon{width:48px;height:48px;border-radius:16px}
.scenario-card h3{font-weight:950}
.scenario-card:hover{border-color:#8cd7b6;box-shadow:0 5px 0 #d0e8d8}
body.dark .scenario-card:hover{box-shadow:0 5px 0 #153738}
/* Vocabulary & Game */
.everyday-preview-card,.everyday-card{
  border:2px solid var(--ld-card-edge);border-radius:18px;
  background:var(--surface);box-shadow:0 4px 0 var(--ld-card-floor)
}
.everyday-card.known{border-color:#8bceac;background:linear-gradient(140deg,var(--ld-tint-mint),var(--surface) 62%)}
.everyday-card summary,.everyday-pagination button,.everyday-known-btn{
  min-height:44px;cursor:pointer
}
.everyday-pagination button,.everyday-known-btn,.game-review-filters button{
  border:2px solid var(--ld-card-edge);border-radius:13px;
  background:var(--surface);color:var(--text);box-shadow:0 3px 0 var(--ld-card-floor)
}
.everyday-pagination button:hover,.everyday-known-btn:hover,.game-review-filters button:hover{background:var(--ld-tint-mint)}
.game-intro-card{border-radius:25px}
.game-pass-badge{border:6px solid #aef5b5;box-shadow:0 4px 0 #075844}
.game-level-grid{gap:12px}
.game-level-card{position:relative;overflow:hidden}
.game-level-card:not(.locked):before{
  content:"";position:absolute;inset:0 0 auto;height:6px;
  background:linear-gradient(90deg,#f8bb72,#ffe18b)
}
.game-level-card.passed{border-color:#8ccb9e;background:linear-gradient(135deg,var(--ld-tint-mint),var(--surface) 56%)}
.game-level-card:not(.locked):hover{border-color:#8bd9b1;transform:translateY(-1px)}
.game-level-card .secondary-btn{min-height:45px}
.game-session-head{border:2px solid var(--border);border-radius:20px;background:var(--ld-tint-sky);padding:14px}
.game-session-score{background:var(--ld-tint-mint);border:2px solid #9eddbb;border-radius:16px}
.game-question-card{background:var(--surface);border-radius:25px}
.game-question-label{display:inline-flex;align-items:center;min-height:29px;padding:4px 10px;border-radius:999px;background:var(--ld-tint-lavender);color:#5b45a7;font-weight:900}
.game-audio-prompt{min-height:46px;border:2px solid #cbbaf2;border-radius:14px;background:var(--ld-tint-lavender);color:var(--text);font-weight:850}
.game-answer-grid button{min-height:77px;background:var(--surface);text-align:left}
.game-answer-grid button span{border-radius:12px;border-color:#bcd7cf;background:var(--ld-tint-sky);font-weight:900}
.game-answer-grid button.selected{
  background:var(--ld-tint-mint);border-color:#0a9978;
  box-shadow:0 4px 0 #9ed9bc
}
.game-dot-row button{border:2px solid var(--ld-card-edge);border-radius:10px;background:var(--surface);color:var(--text)}
.game-dot-row button.answered{background:var(--ld-tint-lavender);border-color:#c6b6f3}
.game-dot-row button.current{background:#087f69;border-color:#087f69;color:#fff}
.game-result-hero.failed{
  border:2px solid #bd7665;background:linear-gradient(120deg,#ab5b58,#805365);
  box-shadow:0 6px 0 #70413f
}
.game-result-mark{border:6px solid #c9f4bd;box-shadow:0 4px 0 rgba(0,0,0,.14)}
.game-review-card{
  border:2px solid var(--ld-card-edge);border-radius:18px;
  background:var(--surface);box-shadow:0 3px 0 var(--ld-card-floor)
}
.game-review-card.correct{border-color:#88c6a0;background:var(--ld-tint-mint)}
.game-review-card.wrong{border-color:#e1a68f;background:var(--ld-tint-peach)}
.game-review-filters button.active{background:#087f69;border-color:#087f69;color:#fff}
body.dark .game-question-label{color:#e8dfff}
body.dark .game-review-card.correct{background:#254e3f;border-color:#518b70}
body.dark .game-review-card.wrong{background:#503933;border-color:#a87969}
/* My Spanish — meaningful wins are first, details remain optional */
.dna-outcome-copy{background:linear-gradient(120deg,var(--ld-tint-mint),var(--surface) 74%)}
.dna-outcome-next{background:linear-gradient(130deg,var(--ld-tint-lavender),var(--surface) 76%)}
.dna-outcome-copy h2{font-weight:950}
.dna-capability{position:relative;overflow:hidden}
.dna-capability:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:#9ddd9c}
.dna-capability:nth-child(4n+2):before{background:#a891ed}
.dna-capability:nth-child(4n+3):before{background:#f4bd75}
.dna-capability:nth-child(4n):before{background:#87cbf3}
.dna-capability.ready{border-color:#87cfa7;background:var(--ld-tint-mint)}
.dna-capability-icon{border-radius:15px;background:var(--ld-tint-sky)}
.dna-capability:nth-child(4n+2) .dna-capability-icon{background:var(--ld-tint-lavender)}
.dna-capability:nth-child(4n+3) .dna-capability-icon{background:var(--ld-tint-gold)}
.dna-capability:nth-child(4n) .dna-capability-icon{background:var(--ld-tint-peach)}
.dna-capability-progress span,.daily-goal-line>span,.review-calendar-row .done{
  background:linear-gradient(90deg,#0a9f82,#abed78)
}
.dna-more-details{
  border:2px solid var(--ld-card-edge);border-radius:22px;
  box-shadow:0 4px 0 var(--ld-card-floor);background:var(--surface)
}
.dna-more-details>summary{min-height:65px}
.dna-more-details>summary::after{color:#7455c2}
.dna-details-inner{border-top:2px solid var(--border)}
.dna-metric:nth-child(4n+1){background:linear-gradient(140deg,var(--ld-tint-mint),var(--surface) 72%)}
.dna-metric:nth-child(4n+2){background:linear-gradient(140deg,var(--ld-tint-lavender),var(--surface) 72%)}
.dna-metric:nth-child(4n+3){background:linear-gradient(140deg,var(--ld-tint-gold),var(--surface) 72%)}
.dna-metric:nth-child(4n){background:linear-gradient(140deg,var(--ld-tint-sky),var(--surface) 72%)}
.dna-metric strong{font-weight:950}
.dna-health-card{background:var(--surface)}
.dna-map{border:2px solid var(--ld-card-edge);background:var(--surface);border-radius:22px;padding:14px}
.dna-node,.coverage-card{border:2px solid var(--ld-card-edge);border-radius:14px;background:var(--surface)}
.dna-node:hover,.coverage-card:hover{border-color:#81ceae;background:var(--ld-tint-mint)}
.app-progress-tools{background:linear-gradient(120deg,var(--ld-tint-sky),var(--surface) 65%);border-radius:22px}
.profile-tool-actions>button{min-height:44px}
.profile-tool-actions small{line-height:1.5}
.dna-ring{border-color:#8fddb7}
.command-card:not(.command-primary):nth-child(2){background:linear-gradient(140deg,var(--ld-tint-sky),var(--surface) 68%)}
.command-card:not(.command-primary):nth-child(3){background:linear-gradient(140deg,var(--ld-tint-gold),var(--surface) 68%)}
.command-card:not(.command-primary):nth-child(4){background:linear-gradient(140deg,var(--ld-tint-lavender),var(--surface) 68%)}
/* Translator, dialogs, feedback and ubiquitous smaller controls */
.translator-panel{background:var(--surface);border:2px solid var(--ld-card-edge);box-shadow:0 4px 0 var(--ld-card-floor)}
.translator-badge{background:var(--ld-tint-lavender);color:#5e479e;border:1px solid #d4c7f3}
.translator-input-wrap,.pattern-search-simple,.dictionary-search{
  border:2px solid var(--ld-card-edge);border-radius:16px;background:var(--surface);
  box-shadow:0 3px 0 var(--ld-card-floor)
}
.translator-input-wrap:focus-within,.pattern-search-simple:focus-within{
  border-color:#74bda4;box-shadow:0 0 0 3px #def7e9
}
.translation-result{border:2px solid var(--ld-card-edge);border-radius:19px;background:var(--ld-tint-sky)}
.translation-senses{border:2px solid var(--ld-card-edge);border-radius:17px}
.translation-senses>div span{background:var(--ld-tint-mint)}
.swap-btn,.dialog-close,.skill-button,.related-card,.sentence-frame-button,.translator-related button{
  border:2px solid var(--ld-card-edge);background:var(--surface);color:var(--text);
  border-radius:14px;box-shadow:0 3px 0 var(--ld-card-floor)
}
:is(.swap-btn,.dialog-close,.skill-button,.related-card,.sentence-frame-button,.translator-related button):hover{
  background:var(--ld-tint-mint);border-color:#84caaf;transform:translateY(-1px)
}
.skill-button.done{background:#087f69;color:#fff;border-color:#087f69;box-shadow:0 3px 0 #075844}
.pattern-dialog,.account-dialog{
  border:2px solid var(--ld-card-edge);border-radius:25px;
  background:var(--surface);box-shadow:0 30px 90px rgba(7,47,40,.26)
}
.pattern-dialog::backdrop,.account-dialog::backdrop{background:rgba(12,48,56,.52)}
.dialog-hero .eyebrow,.account-dialog-head .eyebrow{color:var(--green)}
.pattern-transform{border:2px solid var(--ld-card-edge);background:var(--ld-tint-sky);border-radius:19px}
.account-tabs{background:var(--surface-2);border:2px solid var(--ld-card-edge);border-radius:16px}
.account-tabs button.active{background:var(--ld-tint-mint);color:var(--text);border:1px solid #96d5b7}
.account-status-card{background:var(--ld-tint-mint);color:var(--text);border:1px solid var(--ld-card-edge)}
.account-form input{border:2px solid var(--ld-card-edge);border-radius:13px;background:var(--surface)}
.account-form input:focus{border-color:#81caae}
.toast{
  background:#164e4d;color:#fff;border:2px solid #0a7669;
  border-radius:15px;box-shadow:0 5px 0 #0c3836,0 15px 24px rgba(0,0,0,.16)
}
body.dark :is(.translator-badge,.game-question-label){color:#f0eaff;border-color:#6d6096}
body.dark :is(.translator-input-wrap,.pattern-search-simple):focus-within{box-shadow:0 0 0 3px #2a6656}
body.dark .practice-mode-grid .mode-card.active{box-shadow:0 4px 0 #183c33}
body.dark .practice-mode-grid .mode-card:nth-child(2).active,
body.dark .practice-mode-grid .mode-card:nth-child(3).active,
body.dark .practice-mode-grid .mode-card:nth-child(4).active,
body.dark .practice-mode-grid .mode-card:nth-child(5).active{box-shadow:0 4px 0 #183c33}
body.dark .practice-mode-grid .mode-card:hover:not(:disabled),
body.dark .scenario-card:hover{border-color:#73ba9e}
body.dark .course-unit-card.complete{border-color:#548c70}
body.dark .translator-input-wrap,body.dark .pattern-search-simple{background:var(--surface)}
/* Phone friendliness: keep fun in the colour, not extra scrolling/controls. */
@media(max-width:680px){
  main .view{animation:none}
  .view .page-intro .eyebrow{font-size:9px;min-height:26px}
  .view .page-intro h1{line-height:1.08}
  .course-progress-hero,.game-intro-card{padding:16px;border-radius:20px}
  .course-progress-hero h2,.game-intro-card h2{font-size:clamp(24px,6.5vw,30px)}
  .course-level-tabs{gap:8px}
  .course-level-tab{min-height:52px}
  .course-level-summary,.course-unit-card,.daily-hero,.game-question-card,.practice-stage{padding:15px;border-radius:19px}
  .course-unit-card h3,.game-level-card h3{font-size:20px}
  .smart-review-bar{padding:13px}
  .practice-mode-grid{gap:6px}
  .practice-mode-grid .mode-card{border-radius:15px;min-height:90px}
  .practice-mode-grid .mode-card strong{font-size:12px}
  .tutor-tabs,.everyday-game-tabs,.vocab-tier-tabs{
    gap:4px;padding:4px;border-radius:16px
  }
  .tutor-tabs button,.everyday-game-tabs button,.vocab-tier-tabs button{
    min-height:44px;padding:7px 10px;font-size:12px
  }
  .daily-hero{gap:12px}
  .scenario-grid,.game-level-grid{gap:9px}
  .scenario-card,.game-level-card,.everyday-card{padding:13px;border-radius:18px}
  .scenario-card h3{font-size:17px}
  .game-answer-grid button{min-height:70px;border-radius:14px;padding:10px}
  .game-question-card h3{font-size:clamp(24px,6.7vw,33px)}
  .dna-capability-grid{gap:9px}
  .dna-capability{padding:11px;border-radius:16px}
  .dna-metric,.dna-health-card{padding:12px;border-radius:17px}
  .account-dialog{max-height:calc(100dvh - 70px)}
  .toast{max-width:calc(100vw - 28px);bottom:calc(85px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){
  main .view{animation:none}
  :is(.course-level-tab,.practice-mode-grid .mode-card,.scenario-card,.game-level-card):hover{transform:none}
}


/* The suggested next pattern shares the same clear surface language as the library. */
.pattern-next-card{
  border:2px solid #b4dec6;border-radius:22px;
  background:linear-gradient(125deg,var(--ld-tint-mint),var(--surface) 83%);
  box-shadow:0 5px 0 var(--ld-card-floor)
}
body.dark .pattern-next-card{border-color:#508276;background:linear-gradient(125deg,#254d42,var(--surface) 80%)}


/* Responsive Practice width fix: dropdown option text must not dictate page width. */
.practice-toolbar{min-width:0;max-width:100%}
.practice-toolbar select,#practicePatternSelect{
  display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;
  text-overflow:ellipsis
}
.practice-mode-grid{min-width:0;max-width:100%}
@media(max-width:680px){
  .practice-toolbar{display:grid;grid-template-columns:minmax(0,1fr)}
  .practice-mode-grid{
    width:100%;max-width:100%;min-width:0;
    overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin
  }
  .practice-mode-grid .mode-card{flex:0 0 auto}
}


/* v19 — Five Small Wins: calm, accessible, no-pressure learning journey */
.daily-journey-steps{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;
  margin:0 0 16px;padding:0;list-style:none
}
.daily-journey-steps li{
  display:flex;align-items:center;justify-content:center;gap:8px;
  min-width:0;min-height:50px;padding:9px 7px;
  border:2px solid var(--ld-card-edge);border-radius:15px;
  background:var(--surface);color:var(--muted);
  font-weight:800
}
.daily-journey-steps li span{
  flex:0 0 27px;display:grid;place-items:center;width:27px;height:27px;
  border-radius:10px;background:var(--surface-2);color:var(--muted);
  font-size:13px;font-weight:950
}
.daily-journey-steps li small{font-size:12px;font-weight:850;line-height:1.3}
.daily-journey-steps li.current{border-color:#8dd8b5;background:var(--ld-tint-mint);color:var(--text)}
.daily-journey-steps li.current span{background:#087f69;color:#fff}
.daily-journey-steps li.complete{border-color:#9ddd9d;background:var(--ld-tint-mint);color:var(--text)}
.daily-journey-steps li.complete span{background:#b8eb9c;color:#19502f}
.daily-focus-hero{margin-bottom:11px}
.daily-focus-hero h2{letter-spacing:-.045em;font-weight:950}
.daily-help-row{margin-top:13px;text-align:left}
.daily-help-row .text-btn{
  min-height:44px;padding:8px 11px;border-radius:12px;
  color:#5b4399;font-weight:850
}
.daily-help-row .text-btn:hover{background:var(--ld-tint-lavender)}
body.dark .daily-help-row .text-btn{color:#d8c6ff}
.daily-celebration{
  overflow:hidden;position:relative;padding:25px;
  border:2px solid #a1dcbc;border-radius:25px;
  background:linear-gradient(126deg,#e0fae8,#fff9e9 68%,#f5edff);
  box-shadow:0 6px 0 #c9e8d7
}
.daily-celebration-spark{
  display:grid;place-items:center;width:62px;height:62px;
  margin-bottom:14px;border:2px solid #e7c464;
  border-radius:22px;background:#ffe18a;color:#754d18;
  font-size:36px;font-weight:950;transform:rotate(-5deg)
}
.daily-celebration h2{margin:8px 0;font-size:clamp(27px,5vw,42px);font-weight:950;letter-spacing:-.05em}
.daily-celebration>p{max-width:660px;line-height:1.6;color:#4b6260}
.daily-won-word{
  display:flex;align-items:center;flex-wrap:wrap;gap:12px;
  margin:18px 0;padding:17px;border:2px solid #c9e6cf;
  border-radius:17px;background:rgba(255,255,255,.9)
}
.daily-won-word small{flex-basis:100%;font-size:10px;font-weight:900;letter-spacing:.1em;color:#47665b}
.daily-won-word strong{font-size:clamp(20px,3.5vw,28px);color:#174d45;letter-spacing:-.035em}
.daily-won-word strong span{color:#805ebf}
.daily-won-word button{margin-left:auto}
.daily-celebration-note{font-weight:750}
.daily-end-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.daily-end-actions button{min-height:49px}
.home-learning-journey[hidden]{display:none!important}
.home-learning-journey{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  width:min(1050px,100%);margin:0 auto 28px;padding:14px 17px;
  border:2px solid #c9e8d5;border-radius:18px;
  background:var(--ld-tint-mint)
}
.home-journey-copy{display:flex;gap:12px;align-items:center;min-width:0}
.home-journey-copy>div{display:grid;gap:3px}
.home-journey-copy strong{font-weight:950;font-size:16px;color:var(--text)}
.home-journey-copy small{font-weight:650;color:var(--muted);line-height:1.4}
.home-journey-star{
  flex:0 0 42px;display:grid;place-items:center;
  width:42px;height:42px;border-radius:13px;
  background:#ffdf84;color:#75511f;font-size:22px
}
.home-learning-journey button{white-space:nowrap;min-height:44px}
.journey-wins{margin:12px 0 24px}
.journey-wins .section-heading p{margin-top:5px;color:var(--muted);line-height:1.4}
.journey-milestones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.journey-milestone{
  display:flex;align-items:center;gap:10px;min-width:0;
  padding:14px 11px;border:2px solid var(--ld-card-edge);border-radius:17px;
  background:var(--surface);box-shadow:0 3px 0 var(--ld-card-floor)
}
.journey-milestone-icon{
  flex:0 0 40px;display:grid;place-items:center;
  width:40px;height:40px;border-radius:13px;
  background:var(--ld-tint-sky);font-size:20px;color:var(--muted)
}
.journey-milestone:nth-child(4n+2) .journey-milestone-icon{background:var(--ld-tint-lavender)}
.journey-milestone:nth-child(4n+3) .journey-milestone-icon{background:var(--ld-tint-gold)}
.journey-milestone:nth-child(4n) .journey-milestone-icon{background:var(--ld-tint-peach)}
.journey-milestone>div{display:grid;gap:5px;min-width:0}
.journey-milestone strong{font-size:13px;font-weight:950;line-height:1.25}
.journey-milestone small{font-size:10px;color:var(--muted);line-height:1.4}
.journey-milestone.earned{border-color:#8fcfae;background:linear-gradient(135deg,var(--ld-tint-mint),var(--surface))}
.journey-milestone.earned .journey-milestone-icon{background:#c1f264}
.journey-milestone.upcoming{opacity:.72}
body.dark .daily-celebration{
  background:linear-gradient(130deg,#244c42,#2c4850 70%,#393756);
  border-color:#49876a;box-shadow:0 5px 0 #153b39
}
body.dark .daily-celebration>p{color:#d0e8df}
body.dark .daily-won-word{background:#1a3540;border-color:#4e786a}
body.dark .daily-won-word :is(strong,small){color:#effdf4}
body.dark .daily-journey-steps li.complete span{background:#416f48;color:#eaffeb}
body.dark .daily-journey-steps li.current span{background:#7bdfc2;color:#153b32}
body.dark .daily-help-row .text-btn:hover{background:#39365c}
@media(max-width:780px){
  .journey-milestones{grid-template-columns:repeat(2,minmax(0,1fr))}
  .daily-journey-steps{gap:5px}
  .daily-journey-steps li{gap:5px;padding:7px 4px}
  .daily-journey-steps li small{font-size:11px}
}
@media(max-width:680px){
  .daily-journey-steps{gap:4px;margin-bottom:12px}
  .daily-journey-steps li{flex-direction:column;gap:5px;min-height:65px;padding:7px 2px;border-radius:12px}
  .daily-journey-steps li span{width:24px;height:24px;flex-basis:24px;border-radius:8px}
  .daily-journey-steps li small{font-size:9px;line-height:1.15}
  .daily-celebration{padding:18px 15px;border-radius:20px}
  .daily-celebration-spark{width:49px;height:49px;border-radius:16px;font-size:28px}
  .daily-celebration h2{font-size:30px}
  .daily-won-word{padding:13px;gap:10px}
  .daily-won-word button{margin:0;width:100%}
  .daily-end-actions{display:grid;grid-template-columns:1fr;gap:9px}
  .daily-end-actions button{width:100%}
  .home-learning-journey{align-items:stretch;flex-direction:column;padding:13px}
  .home-learning-journey button{width:100%}
  .journey-milestones{gap:8px}
  .journey-milestone{padding:10px 8px;gap:7px}
  .journey-milestone-icon{width:32px;height:32px;flex-basis:32px;border-radius:11px;font-size:17px}
  .journey-milestone strong{font-size:12px}
  .journey-milestone small{font-size:9px}
}
@media(max-width:350px){
 .journey-milestones{grid-template-columns:1fr}
 .daily-journey-steps li small{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.daily-celebration-spark{transform:none}}


/* v20 — Two simple paths: Discover Patterns / Play Pattern Quest */
.home-two-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:12px}
.simple-home-actions.home-two-paths .secondary-btn,.simple-home-actions.home-two-paths .primary-btn{
  display:flex;justify-content:space-between;min-width:0;min-height:73px;width:100%;
  padding:14px 18px;border-radius:21px;line-height:1.2;font-weight:950;
  font-size:clamp(14px,1.5vw,17px);white-space:normal;text-align:left
}
.home-two-paths button span:first-child{font-size:25px}
.home-two-paths .simple-home-explore{
  background:#ffde79!important;color:#4e3712!important;
  border:2px solid #e4b64e!important;box-shadow:0 5px 0 #d9aa42!important
}
.home-two-paths .home-play-button{
  background:#7354ca;border:2px solid #5d43a7;
  color:#fff;box-shadow:0 5px 0 #4e387f;
}
.home-two-paths .home-play-button:hover{background:#6243b4;box-shadow:0 7px 0 #4e387f;transform:translateY(-2px)}
.home-two-paths .home-play-button:active{transform:translateY(3px);box-shadow:0 2px 0 #4e387f}
body.dark .home-two-paths .home-play-button{background:#8765db;color:#fff;border-color:#7455bf;box-shadow:0 5px 0 #49357f}
.home-small-start{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:17px;color:var(--muted);font-size:13px;font-weight:700}
.home-small-start button{border:0;background:transparent;color:#087362;font-weight:950;cursor:pointer;min-height:44px;padding:5px 8px;border-radius:10px;font-size:13px}
.home-small-start button:hover{background:var(--green-soft);text-decoration:underline}
body.dark .home-small-start button{color:#98f4d1}
.pattern-quest{scroll-margin-top:95px;margin:0 0 34px}
.quest-intro{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 20px;
  padding:26px 28px;margin-bottom:16px;border:2px solid #b6e4ce;border-radius:26px;
  background:linear-gradient(117deg,#e4fae8,#e8f6ff 75%,#f4ebff);
  box-shadow:0 6px 0 #d7ebe3}
.quest-intro .quest-eyebrow,.quest-intro h2,.quest-intro>p{grid-column:1}
.quest-eyebrow{font-size:10px;color:#087665;font-weight:950;letter-spacing:.12em}
.quest-intro h2{margin:5px 0;font-size:clamp(26px,3.8vw,39px);font-weight:950;letter-spacing:-.05em}
.quest-intro>p{max-width:600px;margin:3px 0 0;color:#486570;line-height:1.55}
.quest-total{grid-column:2;grid-row:1 / 4;align-self:center;display:grid;justify-items:center;gap:5px;
  min-width:149px;padding:13px 18px;background:#fff;border:2px solid #c7dfd6;border-radius:19px;box-shadow:0 4px 0 #d6e9dc}
.quest-total>span{font-size:34px}
.quest-total strong{font-weight:950;font-size:18px;color:#175943}
.quest-total small{font-size:10px;color:#60726c;font-weight:750}
.quest-world-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.quest-world{
  display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:9px;min-width:0;
  min-height:225px;padding:18px;border:2px solid #cfe3d7;border-radius:22px;cursor:pointer;
  box-shadow:0 5px 0 #d3e6d6;color:#173b45;transition:transform .16s ease,box-shadow .16s ease
}
.quest-world-words{background:linear-gradient(150deg,#e3f8d7,#fbfffa 73%);border-color:#b9e5a7;box-shadow:0 5px 0 #b8dbab}
.quest-world-sounds{background:linear-gradient(150deg,#eee4ff,#fdfaff 73%);border-color:#d1bff2;box-shadow:0 5px 0 #c9b9e8}
.quest-world-sentences{background:linear-gradient(150deg,#fff0d8,#fffdf7 73%);border-color:#f0d49c;box-shadow:0 5px 0 #e9d4a7}
.quest-world:hover{transform:translateY(-3px);box-shadow:0 8px 0 #b6d8c4}
.quest-world:active{transform:translateY(2px);box-shadow:0 2px 0 #b6d8c4}
.quest-world-icon{font-size:37px;display:grid;place-items:center;width:68px;height:62px;border-radius:20px;
  background:rgba(255,255,255,.72);border:1px solid rgba(20,100,74,.1)}
.quest-world-copy{display:flex;flex-direction:column;gap:7px;flex:1}
.quest-world-kicker{font-size:9px;letter-spacing:.1em;font-weight:950;color:#516d6e}
.quest-world-copy strong{font-size:clamp(20px,2.3vw,27px);letter-spacing:-.04em;font-weight:950;line-height:1.12}
.quest-world-copy small{font-size:13px;color:#536d69;line-height:1.45;min-height:38px}
.quest-world-status{margin-top:auto;padding-top:8px;font-size:12px;font-weight:950;color:#126f51}
.quest-world-sounds .quest-world-status{color:#6447ae}
.quest-world-sentences .quest-world-status{color:#8a581b}
.quest-footer-note{font-size:12px;color:var(--muted);margin:14px 0 0}
.quest-play{border:2px solid #c3e5d2;border-radius:25px;padding:22px;
  box-shadow:0 5px 0 #d3e8da;background:linear-gradient(180deg,#f2fdf3,#fff 35%)}
.quest-play-sounds{border-color:#dac9f1;background:linear-gradient(180deg,#f8f3ff,#fff 35%);box-shadow:0 5px 0 #e7dbf5}
.quest-play-sentences{border-color:#efd4a7;background:linear-gradient(180deg,#fff7ea,#fff 35%);box-shadow:0 5px 0 #efe4cc}
.quest-play-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.quest-back{min-height:45px;border:2px solid var(--border);border-radius:13px;background:var(--surface);padding:8px 13px;color:var(--text);font-weight:850;cursor:pointer}
.quest-count{font-size:11px;letter-spacing:.06em;font-weight:950;color:var(--muted)}
.quest-stars-earned{display:flex;justify-content:center;gap:13px;margin:16px 0 10px;font-size:26px}
.quest-stars-earned span{display:inline-block;animation:quest-pop .22s ease-out}
.quest-play-progress{height:12px;overflow:hidden;border-radius:999px;background:#deece7}
.quest-play-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1caa85,#a2e16f);transition:width .28s ease}
.quest-question{text-align:center;padding:24px 12px 14px}
.quest-question h3{margin:7px 0 12px;font-size:clamp(22px,3vw,31px);letter-spacing:-.04em;line-height:1.15;font-weight:950}
.quest-prompt{font-size:clamp(27px,4.2vw,42px);font-weight:950;letter-spacing:-.045em;line-height:1.18;overflow-wrap:anywhere}
.quest-subprompt{color:var(--muted);font-size:13px;margin-top:9px}
.quest-listen{margin:13px auto 0;min-height:45px}
.quest-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;max-width:800px;margin:10px auto}
.quest-answer{min-width:0;min-height:80px;display:flex;align-items:center;gap:12px;text-align:left;
  border:2px solid #d6e5de;border-radius:18px;padding:13px 15px;background:var(--surface);color:var(--text);
  box-shadow:0 4px 0 #dae9e0;cursor:pointer}
.quest-answer strong{font-size:clamp(15px,1.7vw,19px);font-weight:850;overflow-wrap:anywhere}
.quest-answer:hover:not(:disabled){border-color:#9cd9ac;background:#effdeb;transform:translateY(-2px)}
.quest-answer:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 #dae9e0}
.quest-answer:disabled{cursor:default;opacity:.6}
.quest-answer.is-correct,.quest-answer.is-correct:disabled{opacity:1;background:#dff8e0;border-color:#83c993;color:#195839}
.quest-option-letter{flex:0 0 34px;display:grid;place-items:center;width:34px;height:34px;border-radius:11px;
  background:#e9e2ff;color:#654aab;font-size:14px;font-weight:950}
.quest-hint-actions,.quest-bottom-actions,.quest-victory-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:18px}
.quest-hint-actions .secondary-btn{min-height:45px}
.quest-pattern-link{border:0;background:transparent;color:var(--green);font-weight:900;cursor:pointer;min-height:45px;padding:9px 12px}
.quest-pattern-link:hover{text-decoration:underline}
.quest-feedback{display:grid;gap:5px;padding:16px;margin-top:15px;border:2px solid #d2c1f3;border-radius:17px;
  background:#f2ebff;color:#553d8d;font-size:14px;line-height:1.5}
.quest-feedback strong{font-size:16px}
.quest-feedback-win{background:#e4f8e6;border-color:#a4dab2;color:#245839}
.quest-bottom-actions .primary-btn{min-height:52px}
.quest-no-pressure{color:var(--muted);font-size:12px;margin:17px 0 0}
.quest-victory{position:relative;display:grid;justify-items:center;text-align:center;gap:12px;
  padding:36px 22px;border:2px solid #a4ddb6;border-radius:25px;background:linear-gradient(120deg,#dffbe5,#fff6d7 64%,#efe5ff);
  box-shadow:0 6px 0 #d3e5d0}
.quest-victory-icon{font-size:60px;animation:quest-pop .3s ease-out}
.quest-victory h2{font-size:clamp(30px,5vw,46px);margin:0;letter-spacing:-.05em}
.quest-victory p{max-width:570px;color:#3f6161;line-height:1.55;margin:0}
.quest-victory-stars{font-size:clamp(28px,4vw,40px);letter-spacing:.07em}
.quest-victory small{font-size:12px;color:#5d6d66}
.quest-mini-progress{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:17px;
  border:2px solid #d0e7d7;border-radius:20px;background:var(--ld-tint-mint);margin:13px 0 24px}
.quest-mini-progress>span{font-size:28px}
.quest-mini-progress>div{display:grid;gap:4px;flex:1;min-width:150px}
.quest-mini-progress strong{font-size:16px;font-weight:950}
.quest-mini-progress small{font-size:12px;color:var(--muted)}
.quest-mini-progress button{min-height:44px}
@keyframes quest-pop{from{transform:scale(.8)}to{transform:scale(1)}}
body.dark .quest-intro{background:linear-gradient(120deg,#244e43,#25465a 70%,#3b3b60);border-color:#4a8270;box-shadow:0 6px 0 #143431}
body.dark .quest-intro>p,body.dark .quest-footer-note{color:#d1e1df}
body.dark .quest-total{background:#1c3b45;border-color:#4c6a65;box-shadow:0 4px 0 #14313a}
body.dark .quest-total strong{color:#ebfbef}
body.dark .quest-total small{color:#c1d5d0}
body.dark .quest-world{color:var(--text)}
body.dark .quest-world-words{background:linear-gradient(150deg,#275440,#1b3440);border-color:#548061;box-shadow:0 5px 0 #173b2e}
body.dark .quest-world-sounds{background:linear-gradient(150deg,#473d6a,#1b3440);border-color:#716194;box-shadow:0 5px 0 #2f2950}
body.dark .quest-world-sentences{background:linear-gradient(150deg,#574734,#1b3440);border-color:#806b48;box-shadow:0 5px 0 #3b3024}
body.dark .quest-world-copy small,body.dark .quest-world-kicker{color:#d2e3df}
body.dark .quest-world-words .quest-world-status{color:#a4efb4}
body.dark .quest-world-sounds .quest-world-status{color:#d6c3ff}
body.dark .quest-world-sentences .quest-world-status{color:#ffe3ae}
body.dark .quest-play{background:linear-gradient(180deg,#244b3d,#1a3540 40%);border-color:#558b6d;box-shadow:0 5px 0 #132e32}
body.dark .quest-play-sounds{background:linear-gradient(180deg,#373758,#1a3540 40%)}
body.dark .quest-play-sentences{background:linear-gradient(180deg,#4c4134,#1a3540 40%)}
body.dark .quest-play-progress{background:#3c5a5b}
body.dark .quest-answer{background:#244650;color:#edf9f5;border-color:#486b6c;box-shadow:0 4px 0 #163339}
body.dark .quest-answer:hover:not(:disabled){background:#285747;border-color:#78bc94}
body.dark .quest-answer.is-correct,body.dark .quest-answer.is-correct:disabled{background:#315a40;color:#e3ffe7;border-color:#84c49b}
body.dark .quest-feedback{background:#413b62;color:#f0e9ff;border-color:#73619f}
body.dark .quest-feedback-win{background:#294c3e;color:#e5ffee;border-color:#6ba17a}
body.dark .quest-victory{background:linear-gradient(120deg,#244d3f,#4f4a2d,#363453);border-color:#508c6d;box-shadow:0 6px 0 #15382f}
body.dark .quest-victory p,body.dark .quest-victory small{color:#e1eeda}
body.dark .quest-eyebrow{color:#a6f3d1}
@media(max-width:900px){
 .quest-intro{padding:21px}
 .quest-world-grid{gap:9px}
 .quest-world{padding:14px;min-height:225px}
}
@media(max-width:680px){
 .home-two-paths{grid-template-columns:1fr;gap:10px}
 .simple-home-actions.home-two-paths .secondary-btn,.simple-home-actions.home-two-paths .primary-btn{min-height:59px;padding:11px 15px;font-size:16px;border-radius:17px}
 .home-two-paths button span:first-child{font-size:22px}
 .home-small-start{margin-top:11px;font-size:12px}
 .pattern-quest{scroll-margin-top:14px;margin-bottom:23px}
 .quest-intro{grid-template-columns:1fr;gap:6px;padding:17px;border-radius:20px;margin-bottom:13px}
 .quest-intro .quest-eyebrow,.quest-intro h2,.quest-intro>p{grid-column:1}
 .quest-intro h2{font-size:29px}
 .quest-intro>p{font-size:13px}
 .quest-total{grid-column:1;grid-row:auto;justify-items:start;display:flex;flex-wrap:wrap;gap:7px;min-width:0;padding:8px 12px;margin-top:7px}
 .quest-total>span{font-size:23px}
 .quest-total strong{font-size:15px}
 .quest-total small{flex-basis:100%;font-size:10px}
 .quest-world-grid{grid-template-columns:1fr;gap:10px}
 .quest-world{display:grid;grid-template-columns:59px minmax(0,1fr);min-height:0;padding:13px;border-radius:17px;gap:10px}
 .quest-world-icon{font-size:30px;width:56px;height:57px;border-radius:15px}
 .quest-world-copy{gap:4px}
 .quest-world-copy strong{font-size:21px}
 .quest-world-copy small{min-height:0;font-size:12px}
 .quest-world-status{padding-top:5px;font-size:11px}
 .quest-play{padding:14px;border-radius:19px}
 .quest-count{font-size:10px}
 .quest-stars-earned{font-size:21px;gap:11px;margin:11px 0}
 .quest-question{padding:17px 5px 8px}
 .quest-question h3{font-size:22px}
 .quest-prompt{font-size:29px}
 .quest-choices{grid-template-columns:1fr;gap:9px}
 .quest-answer{min-height:59px;padding:10px 12px;border-radius:14px}
 .quest-answer strong{font-size:15px}
 .quest-option-letter{width:30px;height:30px;flex-basis:30px}
 .quest-hint-actions,.quest-bottom-actions{margin-top:10px;gap:4px}
 .quest-hint-actions button{flex:1}
 .quest-victory{padding:24px 15px;border-radius:19px}
 .quest-victory-stars{font-size:26px}
 .quest-victory-actions{display:grid;grid-template-columns:1fr;width:100%}
 .quest-victory-actions button{min-height:49px}
 .quest-mini-progress{padding:12px;gap:9px}
 .quest-mini-progress button{width:100%}
}
@media(prefers-reduced-motion:reduce){
 .quest-world,.quest-answer,.quest-victory-icon,.quest-stars-earned span,.quest-play-progress span{animation:none!important;transition:none!important}
 .quest-world:hover,.quest-answer:hover{transform:none!important}
}



/* v21 — rewarding pattern discoveries and kid-friendly, progressive teaching */
.simple-pattern-hero{padding-bottom:10px}
.simple-pattern-hero h2{max-width:680px;font-size:clamp(27px,4.2vw,42px);font-weight:950;line-height:1.13;letter-spacing:-.05em}
.pattern-original-name{margin:8px 0 0;font-size:12px;font-weight:700;color:var(--muted)}
.pattern-teaching-card{padding:22px;border-radius:23px;border:2px solid #b8e5cf;background:linear-gradient(135deg,var(--ld-tint-mint),var(--surface) 85%)}
.pattern-teaching-card .eyebrow{color:#16745c}
.pattern-teaching-card .pattern-meaning{font-size:clamp(17px,2.5vw,21px);font-weight:680;line-height:1.55;color:var(--text);margin:8px 0 17px}
.pattern-teaching-card .worked-example{border:2px solid #cce5d9;border-radius:19px;background:var(--surface);padding:17px}
.pattern-teaching-card .worked-example small{font-size:10px;font-weight:950;letter-spacing:.1em}
.pattern-teaching-card .worked-example strong{display:block;margin:8px 0 5px;font-size:clamp(21px,3.5vw,29px);line-height:1.25;letter-spacing:-.035em;overflow-wrap:anywhere}
.pattern-teaching-card .worked-example p{font-size:14px;line-height:1.55;color:var(--muted)}
.pattern-teaching-steps{margin:15px 0 5px}
.pattern-teaching-steps h4{font-size:17px;font-weight:950;letter-spacing:-.02em;margin:0 0 12px}
.pattern-teaching-steps ol{list-style:none;counter-reset:teaching;display:grid;gap:9px;padding:0;margin:0}
.pattern-teaching-steps li{
  display:flex;align-items:flex-start;gap:12px;min-height:51px;
  padding:12px 14px;border:2px solid var(--ld-card-edge);border-radius:15px;
  background:var(--surface);font-size:14px;font-weight:700;line-height:1.5
}
.pattern-teaching-steps li:before{
  counter-increment:teaching;content:counter(teaching);
  display:grid;place-items:center;flex:0 0 29px;
  width:29px;height:29px;border-radius:10px;
  background:#d8cfff;color:#593f9a;font-weight:950
}
.pattern-teaching-steps li:last-child{border-color:#a5d9bb;background:var(--ld-tint-mint)}
.pattern-teaching-steps li:last-child:before{background:#b6ebc4;color:#235a38}
.pattern-caution{background:var(--ld-tint-gold);border:1px solid #e9d39e;padding:12px 14px;border-radius:13px;font-size:12px;line-height:1.55}
.pattern-mini-check{margin:15px 0 12px;padding:20px;border:2px solid #d4c8f1;border-radius:21px;background:linear-gradient(145deg,var(--ld-tint-lavender),var(--surface) 82%)}
.pattern-mini-check h4{font-size:clamp(18px,3vw,23px);line-height:1.3;font-weight:950;letter-spacing:-.025em;margin:8px 0 14px}
.pattern-mini-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.pattern-mini-choices button{
  min-height:56px;padding:10px;border:2px solid #d4c8ee;
  border-radius:15px;background:var(--surface);color:var(--text);
  font-size:15px;font-weight:850;cursor:pointer;
  box-shadow:0 4px 0 var(--ld-card-floor)
}
.pattern-mini-choices button:hover:not(:disabled){border-color:#ad97e3;background:var(--ld-tint-lavender);transform:translateY(-1px)}
.pattern-mini-choices button.correct{background:#dbf5df;border-color:#79bd8b;color:#1e5b31}
.pattern-mini-choices button.incorrect{background:#ffede6;border-color:#e2a591;color:#85432e}
.pattern-mini-choices button:disabled{cursor:default}
.pattern-mini-feedback{min-height:0;margin:12px 0 0;font-size:13px;font-weight:800;line-height:1.5}
.pattern-mini-feedback:empty{display:none}
.pattern-mini-feedback.is-correct{color:#236844}
.pattern-mini-feedback.is-try{color:#7e568a}
.pattern-easy-actions{margin:14px 0 18px}
.pattern-easy-actions .primary-btn{min-height:52px;max-width:100%}
.pattern-journey-details{border:2px solid var(--ld-card-edge);border-radius:19px;background:var(--surface);overflow:hidden;margin:14px 0 20px}
.pattern-journey-details>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;min-height:72px;padding:13px 17px;list-style:none}
.pattern-journey-details>summary::-webkit-details-marker{display:none}
.pattern-journey-details>summary>span:first-child{display:grid;gap:5px}
.pattern-journey-details>summary strong{font-size:15px;font-weight:900}
.pattern-journey-details>summary>span:last-child{font-size:23px;color:var(--green)}
.pattern-journey-details[open]>summary>span:last-child{transform:rotate(180deg)}
.pattern-journey-details .pattern-journey-card{margin:0 12px 12px;box-shadow:none}
.quest-reward-icon{font-size:34px;line-height:1;animation:quest-pop .25s ease-out}
.quest-word-connection{display:block;font-size:clamp(18px,3vw,24px);font-weight:950;letter-spacing:-.03em;color:#1f5941}
.quest-feedback-win{border-radius:18px;box-shadow:0 4px 0 #cce8d7}
.quest-earned-badge{
  display:flex;align-items:center;gap:14px;
  padding:14px 21px;border:2px solid #d8c5f5;border-radius:19px;
  background:#f3edff;box-shadow:0 4px 0 #e1d7f3
}
.quest-earned-badge>span{font-size:35px}
.quest-earned-badge>div{display:grid;gap:5px;text-align:left}
.quest-earned-badge strong{font-weight:950;color:#573d98}
.quest-earned-badge small{color:#685d85;font-size:12px}
body.dark .pattern-teaching-card{border-color:#467e62}
body.dark .pattern-teaching-steps li:last-child{background:#294e3f}
body.dark .pattern-caution{background:#504432;color:#faf0d8;border-color:#7c684d}
body.dark .pattern-mini-check{border-color:#63538d}
body.dark .pattern-mini-choices button{background:#25434f;color:#f2f9f5;border-color:#5a5680}
body.dark .pattern-mini-choices button.correct{background:#295944;color:#e5ffeb;border-color:#81c99d}
body.dark .pattern-mini-choices button.incorrect{background:#5c413b;color:#ffebe5;border-color:#c28a77}
body.dark .pattern-mini-feedback.is-correct{color:#b7f3d0}
body.dark .pattern-mini-feedback.is-try{color:#ecd7ff}
body.dark .quest-word-connection{color:#d9ffe3}
body.dark .quest-earned-badge{background:#3a3456;border-color:#695e95;box-shadow:0 4px 0 #2b2944}
body.dark .quest-earned-badge strong,body.dark .quest-earned-badge small{color:#f4ebff}
@media(max-width:680px){
  .simple-pattern-hero{padding-bottom:5px}
  .simple-pattern-hero h2{font-size:clamp(25px,7vw,33px)}
  .pattern-teaching-card{padding:14px;border-radius:18px}
  .pattern-teaching-card .pattern-meaning{font-size:16px}
  .pattern-teaching-card .worked-example{padding:13px}
  .pattern-teaching-steps h4{font-size:16px}
  .pattern-teaching-steps li{padding:10px;font-size:13px}
  .pattern-mini-check{padding:13px;border-radius:17px}
  .pattern-mini-choices{grid-template-columns:1fr;gap:9px}
  .pattern-mini-choices button{min-height:50px;text-align:left;padding:10px 14px}
  .pattern-easy-actions .primary-btn{width:100%}
  .pattern-journey-details>summary{padding:13px;min-height:65px}
  .quest-reward-icon{font-size:29px}
  .quest-word-connection{font-size:19px}
  .quest-earned-badge{padding:11px 15px}
}
@media(prefers-reduced-motion:reduce){.quest-reward-icon{animation:none!important}}



/* v22 — Pattern Quest Adventure Map: original, child-friendly, accessible. */
.quest-map{position:relative;isolation:isolate;overflow:hidden;margin:5px 0 6px;padding:28px 20px 23px;
  border:2px solid #b9e5d0;border-radius:28px;
  background:radial-gradient(circle at 6% 18%,#e9fae3 0,#e9fae3 9%,transparent 11%),
    radial-gradient(circle at 92% 88%,#efe6ff 0,#efe6ff 12%,transparent 14%),
    linear-gradient(135deg,#f1fff6,#f3f9ff 57%,#fff9ee);
  box-shadow:0 6px 0 #d5ece0}
.quest-map:before,.quest-map:after{position:absolute;pointer-events:none;font-size:33px;opacity:.9}
.quest-map:before{content:"✦";color:#99db81;top:7px;left:21px}
.quest-map:after{content:"✧";color:#be9af0;right:21px;bottom:5px}
.quest-map-trail{position:absolute;inset:75px 10% 33%;z-index:-1;pointer-events:none;
  border:9px dashed #b0daca;border-left-color:transparent;border-bottom-color:#d3beef;
  transform:rotate(-7deg);border-radius:40%}
.quest-map .quest-world-grid{position:relative;z-index:1;gap:18px}
.quest-map-stop{min-width:0;display:flex;flex-direction:column;gap:9px}
.quest-map-stop:nth-child(2){transform:translateY(18px)}
.quest-map-stop:nth-child(3){transform:translateY(-7px)}
.quest-map-stop .quest-world{width:100%;flex:1}
.quest-map .quest-world{min-height:235px;border-width:3px;box-shadow:0 7px 0 #c9dfd3}
.quest-map .quest-world:hover{box-shadow:0 10px 0 #c9dfd3}
.quest-learn-link{align-self:center;min-height:46px;padding:8px 11px;
  background:var(--surface);border:2px solid #d1e7dc;border-radius:14px;
  color:#08765e;box-shadow:0 3px 0 #d9eadd;cursor:pointer;
  font-weight:850;font-size:12px}
.quest-learn-link:hover{background:#e4faeb;border-color:#8bd3b3}
.quest-map-mystery{position:relative;display:flex;align-items:center;gap:15px;
  max-width:700px;min-height:105px;margin:39px auto 1px;
  padding:15px 17px;border-radius:22px;border:3px solid #c1b4e4;
  background:linear-gradient(115deg,#f2eaff,#fffbf0);
  box-shadow:0 6px 0 #d9d0e9}
.quest-map-mystery.locked{filter:saturate(.65);background:#f2f5f2;border-color:#d4dfdc}
.quest-mystery-icon{width:65px;height:65px;flex:0 0 65px;display:grid;place-items:center;
  border-radius:20px;border:2px solid #d8c8ed;background:#fff;font-size:32px}
.quest-mystery-copy{display:grid;gap:5px;flex:1;min-width:0}
.quest-mystery-copy strong{font-size:23px;letter-spacing:-.035em;font-weight:950;color:#443d75}
.quest-mystery-copy small{font-size:12px;line-height:1.5;color:#625c70}
.quest-mystery-button{white-space:normal;min-height:49px}
.quest-mystery-button:disabled{opacity:.78;background:#9ba5ad;color:#fff;
  border-color:#9ba5ad;box-shadow:0 4px 0 #78838b;cursor:not-allowed}
.quest-mode-switch{display:flex;justify-content:center;margin:5px 0 15px}
.quest-mode-switch button,.quest-listen-mode{min-height:46px;
  padding:10px 14px;border:2px solid #d0c2ec;border-radius:14px;
  color:#62449f;background:#f1eaff;font-weight:850;cursor:pointer;
  box-shadow:0 3px 0 #d8ceef}
.quest-mode-switch button:hover,.quest-listen-mode:hover{background:#e9dfff}
.quest-listen-tools{display:flex;justify-content:center;align-items:center;
  flex-wrap:wrap;gap:9px;margin:10px auto}
.quest-listen-tools .quest-listen{margin:0}
.quest-listen-mode{min-height:45px}
.quest-builder{max-width:760px;margin:12px auto}
.quest-built{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px;
  min-height:81px;padding:15px;border:3px dashed #b9c6ee;border-radius:17px;
  background:#f9f6ff;color:#635b80;font-weight:750}
.quest-built span{padding:11px 18px;border:2px solid #c1b0ee;border-radius:13px;
  background:#fff;color:#543a93;font-weight:950;font-size:19px}
.quest-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;margin:16px 0}
.quest-tiles button{min-height:62px;padding:10px;border:2px solid #bdaae9;
  border-radius:16px;background:#eae2ff;color:#4e3784;
  box-shadow:0 4px 0 #c6b6e8;font-size:17px;font-weight:950;cursor:pointer}
.quest-tiles button:hover:not(:disabled){background:#ddd2fc;transform:translateY(-2px)}
.quest-tiles button:disabled{opacity:.35;cursor:default}
.quest-builder-tools{display:flex;justify-content:space-between;gap:9px}
.quest-builder-tools button{min-height:47px}
.quest-map button:focus-visible,.quest-builder button:focus-visible,.quest-listen-mode:focus-visible{
  outline:3px solid #905bdf;outline-offset:3px}
body.dark .quest-map{background:linear-gradient(135deg,#19483c,#233f53 55%,#3d3c56);
  border-color:#528b73;box-shadow:0 6px 0 #102f2d}
body.dark .quest-map-trail{border-color:#4e8b74;border-bottom-color:#716196;border-left-color:transparent}
body.dark .quest-map .quest-world{box-shadow:0 6px 0 #173a33}
body.dark .quest-learn-link{background:#284d49;color:#d5ffec;border-color:#518778;box-shadow:0 3px 0 #193c39}
body.dark .quest-map-mystery{background:linear-gradient(110deg,#3e375e,#534d3a);
  border-color:#72619a;box-shadow:0 6px 0 #2c2945}
body.dark .quest-map-mystery.locked{background:#2b4045;border-color:#4b686b}
body.dark .quest-mystery-icon{background:#29454f;border-color:#6a6186}
body.dark .quest-mystery-copy strong{color:#f0e4ff}
body.dark .quest-mystery-copy small{color:#dfd5e9}
body.dark .quest-mode-switch button,body.dark .quest-listen-mode{background:#473b66;
  border-color:#73649b;color:#f4edff;box-shadow:0 3px 0 #312b4a}
body.dark .quest-built{background:#2e3954;border-color:#78649a;color:#e4d9fb}
body.dark .quest-built span{background:#463b66;border-color:#8470ab;color:#f9f0ff}
body.dark .quest-tiles button{background:#483c66;border-color:#806aa6;color:#f4eaff;box-shadow:0 4px 0 #292943}
@media(max-width:900px){
  .quest-map{padding:22px 13px}
  .quest-map .quest-world-grid{gap:12px}
  .quest-map-mystery{margin-top:35px}
  .quest-learn-link{font-size:11px}
}
@media(max-width:680px){
  .quest-map{padding:15px 12px 20px;border-radius:20px}
  .quest-map-trail{inset:65px 14px 70px;border-width:7px;transform:rotate(8deg)}
  .quest-map .quest-world-grid{gap:13px}
  .quest-map-stop:nth-child(2),.quest-map-stop:nth-child(3){transform:none}
  .quest-map-stop{gap:4px}
  .quest-map .quest-world{min-height:0;border-width:2px}
  .quest-learn-link{align-self:flex-end;min-height:44px;margin:0 4px 4px;padding:6px 12px}
  .quest-map-mystery{margin-top:20px;padding:13px;flex-wrap:wrap;gap:10px;border-radius:17px}
  .quest-mystery-icon{width:48px;height:48px;flex-basis:48px;font-size:25px;border-radius:14px}
  .quest-mystery-copy strong{font-size:19px}
  .quest-mystery-button{width:100%;min-height:47px}
  .quest-mode-switch button{width:100%}
  .quest-listen-tools{display:grid;grid-template-columns:1fr;gap:9px}
  .quest-listen-tools button{width:100%}
  .quest-built{min-height:66px;padding:10px;font-size:13px}
  .quest-built span{padding:10px 12px;font-size:17px}
  .quest-tiles{gap:6px}
  .quest-tiles button{min-height:54px;padding:7px 4px;font-size:14px;overflow-wrap:anywhere}
  .quest-builder-tools{display:grid;grid-template-columns:1fr 1fr}
  .quest-builder-tools button{font-size:12px;padding:8px 5px}
}
@media(prefers-reduced-motion:reduce){
  .quest-map-stop,.quest-tiles button{animation:none!important;transition:none!important;transform:none!important}
}


/* Xabi: LanguageDNA original hybrid learning mascot. */
.quest-friend{display:flex;align-items:center;gap:12px;margin:0 0 12px;max-width:100%}
.quest-friend-face{position:relative;display:grid;place-items:center;flex:0 0 58px;width:58px;height:58px;
  border:3px solid #e3ae51;border-radius:22px 23px 19px 24px;
  background:linear-gradient(145deg,#ffe88b,#ffbe72);color:#f99735;font-size:30px;
  box-shadow:0 4px 0 #dfb766;transform:rotate(-6deg)}
.quest-friend-eyes{position:absolute;top:16px;left:13px;right:12px;
  color:#5e4c31;font-size:20px;letter-spacing:10px;line-height:1;font-weight:950;transform:rotate(6deg)}
.quest-friend-speech{display:inline-flex;align-items:center;min-height:45px;padding:10px 13px;
  border:2px solid #d0e6d2;border-radius:17px 17px 17px 6px;
  background:var(--surface);color:var(--text);font-size:14px;font-weight:900}
.quest-friend-victory{justify-content:center}
.quest-friend-victory .quest-friend-face{width:65px;height:65px;flex-basis:65px}
body.dark .quest-friend-face{border-color:#dba957;box-shadow:0 4px 0 #9a742e}
body.dark .quest-friend-speech{background:#29474a;border-color:#52766b;color:#f1fff7}
@media(max-width:680px){
  .quest-friend{gap:9px;margin-bottom:10px}
  .quest-friend-face{width:47px;height:47px;flex-basis:47px;border-radius:17px;font-size:25px}
  .quest-friend-eyes{top:13px;left:9px;font-size:17px}
  .quest-friend-speech{font-size:12px;padding:8px 10px}
}
@media(prefers-reduced-motion:reduce){.quest-friend-face{transform:none}}



/* v23 — One-screen Pattern Quest: all answers visible, no manual Next required. */
[data-view-panel="game"].quest-focused > .page-intro,
[data-view-panel="game"].quest-focused > .everyday-game-tabs,
[data-view-panel="game"].quest-focused > #everydayLearnPanel,
[data-view-panel="game"].quest-focused > #gameModePanel{
  display:none!important
}
[data-view-panel="game"].quest-focused #patternQuest{
  width:100%;max-width:760px;margin:8px auto 16px
}
.quest-focused .quest-play{
  position:relative;display:flex;flex-direction:column;
  padding:17px 20px;gap:0;min-width:0;
  min-height:min(710px,calc(100dvh - 177px));
}
.quest-focused .quest-play-header{margin-bottom:4px}
.quest-focused .quest-stars-earned{margin:5px 0 6px;gap:11px;font-size:23px}
.quest-focused .quest-play-progress{height:9px;flex:0 0 9px}
.quest-focused .quest-question{padding:13px 8px 7px}
.quest-focused .quest-question h3{font-size:clamp(19px,2.7vw,26px);margin:4px 0 6px}
.quest-focused .quest-prompt{font-size:clamp(24px,4vw,34px);line-height:1.1}
.quest-focused .quest-choices{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;width:100%;max-width:none;margin:10px 0 4px
}
.quest-focused .quest-answer{
  min-width:0;min-height:74px;padding:9px 12px;gap:9px;
  border-radius:15px
}
.quest-focused .quest-answer strong{font-size:clamp(13px,1.7vw,17px);line-height:1.2}
.quest-focused .quest-answer.is-incorrect,
.quest-focused .quest-answer.is-incorrect:disabled{
  border-color:#e58373;background:#fff0e9;color:#8e3d2b;
  opacity:1;box-shadow:0 3px 0 #e6b6a8
}
.quest-focused .quest-hint-actions{margin:9px 0 0;gap:8px}
.quest-focused .quest-hint-actions button{min-height:43px}
.quest-focused .quest-no-pressure{margin:7px 0 0;font-size:11px}
.quest-focused .quest-feedback:not(.quest-feedback-win){
  padding:10px 12px;margin:8px 0 0;font-size:12px
}
.quest-focused .quest-feedback:not(.quest-feedback-win) strong{font-size:13px}
.quest-focused .quest-feedback-win{
  display:none!important; /* The transient, fixed success cue replaces the tall block. */
}
.quest-focused .quest-bottom-actions{
  position:relative;margin:6px 0 0
}
.quest-focused .quest-bottom-actions [data-quest-next]{
  width:auto;min-height:35px;padding:5px 10px;font-size:11px;
  border-radius:10px;margin-left:auto;box-shadow:none;
  opacity:.78
}
.quest-answer-flash{
  position:fixed;top:calc(78px + env(safe-area-inset-top));left:50%;
  z-index:60;transform:translateX(-50%);pointer-events:none;
  width:max-content;max-width:calc(100vw - 28px);
  padding:13px 19px;border:2px solid #73b78e;border-radius:17px;
  background:#e5ffe9;color:#205d3b;box-shadow:0 9px 28px rgba(13,58,36,.21);
  text-align:center;font-size:15px;line-height:1.35;font-weight:950;
  animation:quest-feedback-pop .18s ease-out both
}
.quest-answer-flash.retry{
  border-color:#e5a48b;background:#fff2e9;color:#8f432e
}
@keyframes quest-feedback-pop{
  from{opacity:0;transform:translate(-50%,-8px)}
  to{opacity:1;transform:translate(-50%,0)}
}
body.dark .quest-answer-flash.success{
  background:#285b42;color:#dcffe6;border-color:#78c28f
}
body.dark .quest-answer-flash.retry{
  background:#5f3e38;color:#ffe7df;border-color:#c98c79
}
body.dark .quest-focused .quest-answer.is-incorrect,
body.dark .quest-focused .quest-answer.is-incorrect:disabled{
  background:#5b3a35;color:#ffebe1;border-color:#b77968;opacity:1
}
@media(max-width:680px){
  [data-view-panel="game"].quest-focused #patternQuest{margin:3px auto 7px}
  .quest-focused .quest-play{
    min-height:calc(100dvh - 167px - env(safe-area-inset-bottom));
    padding:10px 12px 9px;border-radius:17px;
    justify-content:space-between
  }
  .quest-focused .quest-play-header{margin:0}
  .quest-focused .quest-back{
    min-height:36px;padding:6px 9px;font-size:12px
  }
  .quest-focused .quest-count{font-size:10px}
  .quest-focused .quest-stars-earned{font-size:19px;margin:5px 0;gap:8px}
  .quest-focused .quest-play-progress{height:7px;flex:0 0 7px}
  .quest-focused .quest-question{padding:7px 2px 5px}
  .quest-focused .quest-question h3{font-size:clamp(17px,5vw,22px);margin:3px 0 5px}
  .quest-focused .quest-question .quest-eyebrow{font-size:9px}
  .quest-focused .quest-prompt{font-size:clamp(22px,7vw,29px)}
  .quest-focused .quest-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:7px 0 4px}
  .quest-focused .quest-answer{min-height:61px;padding:7px;gap:6px;border-radius:13px}
  .quest-focused .quest-answer strong{font-size:clamp(12px,3.8vw,14px);overflow-wrap:anywhere}
  .quest-focused .quest-option-letter{
    flex-basis:24px;width:24px;height:27px;border-radius:8px;font-size:11px
  }
  .quest-focused .quest-hint-actions{margin:6px 0 0;gap:3px}
  .quest-focused .quest-hint-actions button{min-height:40px;padding:6px 8px;font-size:11px}
  .quest-focused .quest-no-pressure{font-size:10px;margin:5px 0 0}
  .quest-focused .quest-listen-tools{display:flex;flex-wrap:wrap;gap:5px;margin:7px auto}
  .quest-focused .quest-listen-tools button{width:auto;flex:1;min-height:40px;padding:6px 8px;font-size:11px}
  .quest-focused .quest-subprompt{font-size:11px;margin:4px 0 0}
  .quest-focused .quest-mode-switch{margin:0 0 5px}
  .quest-focused .quest-mode-switch button{min-height:38px;padding:5px 8px;font-size:11px}
  .quest-focused .quest-builder{margin:5px 0}
  .quest-focused .quest-built{min-height:47px;padding:6px;font-size:11px}
  .quest-focused .quest-built span{padding:5px 7px;font-size:13px}
  .quest-focused .quest-tiles{margin:7px 0;gap:5px}
  .quest-focused .quest-tiles button{min-height:42px;font-size:13px;padding:6px 2px}
  .quest-focused .quest-builder-tools button{min-height:39px;font-size:11px}
  .quest-focused .quest-bottom-actions{margin:4px 0 0}
  .quest-focused .quest-bottom-actions [data-quest-next]{min-height:33px}
  .quest-answer-flash{
    top:calc(72px + env(safe-area-inset-top));
    max-width:calc(100vw - 30px);padding:9px 14px;font-size:13px
  }
}
@media(max-width:370px) and (max-height:750px){
  .quest-focused .quest-play{min-height:calc(100dvh - 156px - env(safe-area-inset-bottom));padding:8px 10px}
  .quest-focused .quest-answer{min-height:56px;padding:5px}
  .quest-focused .quest-question h3{font-size:17px}
  .quest-focused .quest-stars-earned{font-size:17px}
}
@media(prefers-reduced-motion:reduce){
  .quest-answer-flash{animation:none}
}


/* v24 — Beginner-first clarity, readable choices and adaptable pace. */
.home-more-tools{margin:22px 0;border:2px solid var(--ld-card-edge);
  border-radius:21px;background:var(--surface);box-shadow:0 4px 0 var(--ld-card-floor)}
.home-more-tools>summary{display:flex;justify-content:space-between;align-items:center;gap:10px;
  cursor:pointer;list-style:none;min-height:61px;padding:13px 18px;
  font-size:16px;font-weight:900;color:var(--text)}
.home-more-tools>summary::-webkit-details-marker{display:none}
.home-more-tools>summary small{font-size:12px;font-weight:650;color:var(--muted);line-height:1.4}
.home-more-tools[open]>summary{border-bottom:2px solid var(--border);background:var(--ld-tint-mint)}
.home-more-tools .simple-next{padding:16px;margin:0}
.home-more-tools .simple-next .simple-section-heading h2{font-size:22px}
.library-beginner-start{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:13px 15px;margin:15px 0;border:2px solid #b1dcca;border-radius:18px;
  background:var(--ld-tint-mint)}
.library-beginner-start>span{font-size:25px}
.library-beginner-start>div{display:grid;gap:5px;flex:1;min-width:170px}
.library-beginner-start strong{font-size:15px;font-weight:900}
.library-beginner-start small{font-size:13px;line-height:1.5;color:var(--muted)}
.library-beginner-start button{min-height:46px}
.pattern-more-examples{margin-top:17px;border:2px solid var(--ld-card-edge);border-radius:17px;
  background:var(--surface);overflow:hidden}
.pattern-more-examples>summary{display:flex;justify-content:space-between;align-items:center;
  gap:9px;padding:15px;cursor:pointer;list-style:none;min-height:51px}
.pattern-more-examples>summary::-webkit-details-marker{display:none}
.pattern-more-examples>summary strong{font-size:15px;font-weight:900}
.pattern-more-examples>summary span{font-size:12px;font-weight:700;color:var(--green)}
.pattern-more-examples[open]>summary{border-bottom:1px solid var(--border)}
.pattern-more-examples>p,.pattern-more-examples .pattern-example-list{margin:12px}
.pattern-read-check{margin:14px 0 0;min-height:46px}
.pattern-read-check:disabled{opacity:.75}
.quest-play-header-controls{display:flex;gap:10px;align-items:center;justify-content:flex-end;min-width:0}
.quest-pace-button{min-height:43px;border:2px solid #c4cfe1;border-radius:13px;
  padding:7px 11px;background:var(--surface);color:var(--text);
  font-size:13px;font-weight:850;cursor:pointer;white-space:nowrap}
.quest-pace-button:hover,.quest-pace-button:focus-visible{background:var(--ld-tint-lavender);border-color:#a48bcc}
.quest-answer-flash{display:flex;flex-direction:column;gap:5px;
  width:min(490px,calc(100vw - 25px));white-space:normal}
.quest-answer-flash strong{font-size:15px;line-height:1.25}
.quest-answer-flash small{font-size:13px;line-height:1.4;font-weight:700}
.quest-answer-flash em{font-size:12px;font-style:normal;font-weight:800}
.quest-focused .quest-answer strong{font-size:clamp(14px,1.9vw,17px)}
.quest-focused .quest-count{font-size:12px;letter-spacing:0}
.quest-focused .quest-question .quest-eyebrow{font-size:12px}
.quest-focused.quest-paced-manual .quest-feedback-win{display:grid!important;
  padding:14px;margin:8px 0 0;font-size:13px}
.quest-focused.quest-paced-manual .quest-feedback-win .quest-friend{display:none}
.quest-focused.quest-paced-manual .quest-feedback-win .quest-reward-icon{font-size:20px}
body.dark .library-beginner-start{border-color:#567c69}
body.dark .pattern-more-examples{border-color:var(--ld-card-edge)}
@media(max-width:680px){
  .home-more-tools>summary{align-items:flex-start;flex-direction:column;gap:4px;padding:12px 14px}
  .home-more-tools>summary small{font-size:13px}
  .home-more-tools .simple-next{padding:12px}
  .library-beginner-start{padding:12px;gap:9px}
  .library-beginner-start button{width:100%}
  .pattern-more-examples>summary{padding:12px;flex-wrap:wrap}
  .pattern-more-examples>summary span{font-size:13px}
  .quest-focused .quest-play-header{gap:6px}
  .quest-play-header-controls{gap:6px;min-width:0}
  .quest-pace-button{min-height:42px;font-size:12px;padding:6px 8px}
  .quest-focused .quest-count{font-size:11px;white-space:normal}
  .quest-focused .quest-question .quest-eyebrow{font-size:11px}
  .quest-focused .quest-answer strong{font-size:14px;line-height:1.2}
  .quest-answer-flash{top:calc(69px + env(safe-area-inset-top));padding:9px 11px}
  .quest-answer-flash strong{font-size:14px}
  .quest-answer-flash small{font-size:13px}
  .primary-nav .nav-item{font-size:12px;line-height:1.2}
  .primary-nav .nav-item span{font-size:19px}
  .quest-focused .quest-hint-actions button{font-size:12px}
  .quest-focused .quest-no-pressure{font-size:12px}
  .quest-focused .quest-mode-switch button{font-size:12px}
}
@media(max-width:350px){
  .quest-pace-button{font-size:11px;padding:6px}
  .quest-focused .quest-count{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
  .quest-answer-flash{animation:none}
}

/* Beginner learning: explain each missed answer in words, not only colours. */
.feedback-teaching{line-height:1.55;padding:16px 18px;font-size:15px}
.feedback-teaching>strong{display:block;font-size:17px;margin-bottom:8px}
.feedback-teaching p{margin:8px 0}
.feedback-teaching p:last-child{margin-bottom:0}
.tick-item.tick-example-correct{border-color:#80aa85}
.tick-item.tick-example-wrong{border-color:#c58a7d}
.tick-item .tick-explanation{margin-left:auto;font-size:12px;line-height:1.35;font-weight:800;white-space:normal}
.choice-btn.answer-revealed{border:2px solid #478762;outline:0}
@media(max-width:520px){.tick-item{flex-wrap:wrap}.tick-item .tick-explanation{width:100%;margin-left:30px}.feedback-teaching{font-size:14px}}


/* LanguageDNA mascot: lightweight original hybrid character, used consistently from Home to adventures. */
.mascot-brand-mark{padding:0;overflow:hidden;border:1px solid #d3e9e6;background:#eefbf9;border-radius:15px;box-shadow:0 2px 8px rgba(13,91,82,.12);flex:0 0 auto}
.mascot-brand-mark img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;border-radius:inherit}
.mascot-showcase{min-width:0;width:100%;display:flex;flex-direction:column;gap:11px;align-items:stretch}
.mascot-home-intro{display:grid;grid-template-columns:minmax(110px,44%) minmax(0,1fr);align-items:center;gap:6px;min-height:238px;overflow:hidden;background:linear-gradient(112deg,#fef8e8,#e8f8ff);border:2px solid rgba(255,255,255,.75);border-radius:23px;box-shadow:0 5px 0 rgba(17,94,88,.09)}
.mascot-home-art{display:block;align-self:stretch;width:100%;height:262px;object-fit:cover;object-position:center top;border-radius:21px 0 0 21px}
.mascot-home-greeting{display:grid;align-content:center;gap:8px;padding:15px 12px 15px 2px;text-align:left}
.mascot-home-greeting span{font-size:10px;font-weight:950;letter-spacing:.09em;color:#0b776b}
.mascot-home-greeting strong{font-size:clamp(20px,2.4vw,29px);line-height:1.08;letter-spacing:-.04em;color:#1c4b51}
.mascot-home-greeting small{font-size:13px;line-height:1.5;font-weight:650;color:#426470}
.mascot-showcase .simple-dna-example{position:relative;width:100%;max-width:100%;margin:2px 0 0;transform:none;box-shadow:0 4px 0 rgba(78,137,134,.13)}
.mascot-showcase .simple-dna-example:before{top:-13px;right:12px}
.mascot-showcase .example-words{max-width:100%}
.mascot-showcase .example-words>div{min-width:0}
.mascot-showcase .example-words span,.mascot-showcase .example-words strong{overflow-wrap:anywhere}
.quest-friend-face{padding:0!important;overflow:hidden;background:#fff!important;box-shadow:0 4px 0 #a5cfc4!important}
.quest-friend-face img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;border-radius:inherit}
.feedback-teaching{position:relative;padding-left:72px}
.feedback-teaching:before{content:"";position:absolute;left:13px;top:15px;width:42px;height:42px;border:2px solid #fff;border-radius:15px;background:#fff url("assets/mascot/xabi-face.webp") center/cover no-repeat;box-shadow:0 2px 0 rgba(31,80,75,.11)}
body.dark .mascot-home-intro{background:linear-gradient(112deg,#254a4c,#253f5c);border-color:#427b75}
body.dark .mascot-home-greeting span{color:#a9f2d7}
body.dark .mascot-home-greeting strong{color:#f6f9fc}
body.dark .mascot-home-greeting small{color:#d4e5e9}
body.dark .mascot-brand-mark{border-color:#658b83;background:#213c3e;box-shadow:0 2px 8px rgba(0,0,0,.23)}
@media(max-width:760px){
  .mascot-home-intro{min-height:210px}
  .mascot-home-art{height:235px}
  .mascot-home-greeting{padding:12px 10px 12px 2px}
  .mascot-home-greeting strong{font-size:22px}
  .mascot-showcase .simple-dna-example{padding:13px 11px;gap:7px}
}
@media(max-width:390px){
  .mascot-home-intro{grid-template-columns:minmax(95px,40%) minmax(0,1fr);min-height:190px}
  .mascot-home-art{height:216px}
  .mascot-home-greeting small{font-size:12px}
  .mascot-home-greeting strong{font-size:19px}
  .mascot-showcase .example-words strong,.mascot-showcase .example-words span{font-size:clamp(13px,4vw,18px)}
  .feedback-teaching{padding-left:59px}
  .feedback-teaching:before{left:9px;width:33px;height:33px}
}

.mascot-journey-avatar{flex:0 0 56px;display:block;width:56px;height:56px;border-radius:18px;object-fit:cover;border:2px solid #fbfcff;box-shadow:0 3px 0 rgba(22,91,78,.13)}
@media(max-width:390px){.mascot-journey-avatar{width:48px;height:48px;flex-basis:48px}}

/* The mini mascot stays visible in the one-screen adventure without adding a new row. */
.quest-answer-flash.success{padding-left:58px;min-height:59px;text-align:left}
.quest-flash-mascot{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:35px;height:35px;border-radius:12px;object-fit:cover;border:2px solid rgba(255,255,255,.9)}
@media(max-width:390px){.quest-answer-flash.success{padding-left:49px}.quest-flash-mascot{left:8px;width:31px;height:31px}}

/* Xabi: consistent character treatment for playful lessons and achievements. */
.mascot-home-art{object-fit:contain;object-position:center bottom;filter:drop-shadow(0 4px 5px rgba(16,65,85,.12))}
.mascot-brand-mark img,.mascot-journey-avatar,.quest-friend-face img,.quest-flash-mascot{object-position:center center}
.xabi-summary-heading{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.xabi-summary-heading img{width:68px;height:68px;object-fit:cover;border-radius:20px;border:2px solid #bceadd;background:#fff}
.xabi-summary-heading .eyebrow{font-size:12px;letter-spacing:.075em}
@media(max-width:390px){.xabi-summary-heading img{width:56px;height:56px}}


/* Xabi's evidence-based English–Spanish cognate discovery on the home page. */
.xabi-word-fact{
  margin:0 0 30px;padding:clamp(17px,2.6vw,28px);border:2px solid #c8e5db;
  border-radius:26px;background:linear-gradient(130deg,#fffdf4,#f2fbff 75%);
  box-shadow:0 5px 0 rgba(26,102,91,.09);color:#1b4650;min-width:0;
}
.xabi-word-fact-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,230px);align-items:center;gap:24px}
.xabi-word-fact-title{display:flex;align-items:center;gap:13px;min-width:0}
.xabi-word-fact-title img{width:64px;height:64px;flex:0 0 64px;object-fit:cover;border:2px solid #fff;border-radius:21px;background:#fff;box-shadow:0 3px 0 #c9e3db}
.xabi-word-fact-kicker{display:block;color:#0c7164;font-size:11px;letter-spacing:.085em;font-weight:950;margin-bottom:5px}
.xabi-word-fact-title h2{font-size:clamp(23px,3.2vw,34px);line-height:1.14;letter-spacing:-.035em;margin:0;color:#214653}
.xabi-word-fact-copy>p{margin:13px 0 0;color:#395d65;line-height:1.55;font-weight:600;font-size:clamp(14px,1.55vw,16px)}
.xabi-word-fact-copy>p strong{color:#0f655b;font-weight:950}
.xabi-word-fact-number{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:17px 12px;background:#e3f5eb;border:2px solid #c4e4d5;border-radius:22px;text-align:center}
.xabi-word-fact-number strong{font-size:clamp(37px,4.4vw,58px);line-height:1;letter-spacing:-.065em;color:#166c5f;font-weight:950;white-space:nowrap}
.xabi-word-fact-number strong span{font-size:.57em;vertical-align:top}
.xabi-word-fact-number small{font-size:13px;line-height:1.35;color:#275f57;font-weight:850;margin-top:6px}
.xabi-word-fact-prompt{font-size:15px;color:#254d5a;margin:0 0 11px;line-height:1.5}
.xabi-word-fact-prompt strong{color:#096f64}
.xabi-word-fact-discovery{margin-top:22px}
.xabi-word-fact-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.xabi-word-reveal{min-width:0;background:#fff;border:2px solid #d7e9e8;border-radius:18px;overflow:hidden;transition:border-color .16s ease,box-shadow .16s ease}
.xabi-word-reveal[open]{border-color:#78cbbb;box-shadow:0 3px 0 #cde8e3}
.xabi-word-reveal summary{display:flex;flex-direction:column;align-items:flex-start;gap:5px;cursor:pointer;padding:14px 15px;list-style:none;min-height:108px}
.xabi-word-reveal summary::-webkit-details-marker{display:none}
.xabi-word-reveal summary:focus-visible{outline:3px solid #146e79;outline-offset:-4px;border-radius:16px}
.xabi-word-reveal-lang{font-size:10px;font-weight:900;letter-spacing:.09em;color:#386879}
.xabi-word-reveal summary>strong,.xabi-word-reveal-answer>strong{font-size:clamp(22px,2.8vw,30px);line-height:1.15;letter-spacing:-.035em;overflow-wrap:anywhere}
.xabi-word-reveal summary>strong{color:#243f66}
.xabi-word-reveal-hint{font-size:12px;font-weight:800;color:#187968;margin-top:auto}
.xabi-word-reveal-open,.xabi-word-reveal[open] .xabi-word-reveal-closed{display:none}
.xabi-word-reveal[open] .xabi-word-reveal-open{display:inline}
.xabi-word-reveal-answer{display:grid;gap:6px;background:#e9faf3;border-top:2px dashed #c5e5da;padding:13px 15px 16px}
.xabi-word-reveal-answer strong{color:#176454}
.xabi-word-reveal-answer small{font-size:12px;line-height:1.45;color:#375d57}
.xabi-word-fact-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:13px 20px;margin-top:17px}
.xabi-word-fact-cta{white-space:normal;line-height:1.4;text-align:center;font-weight:900}
.xabi-word-fact-note{flex:1 1 255px;min-width:0;color:#49686d;font-size:11px;line-height:1.5}
.xabi-word-fact-note a{color:#145e75;text-decoration:underline;text-underline-offset:2px}
.xabi-word-fact-note a:focus-visible{outline:3px solid #116f80;outline-offset:3px;border-radius:2px}
body.dark .xabi-word-fact{background:linear-gradient(135deg,#203a40,#233a50);border-color:#4e7770;color:#e8f7f9}
body.dark .xabi-word-fact-title h2{color:#f3fffc}
body.dark .xabi-word-fact-kicker{color:#a3eace}
body.dark .xabi-word-fact-copy>p,body.dark .xabi-word-fact-prompt{color:#d9ebec}
body.dark .xabi-word-fact-copy>p strong,body.dark .xabi-word-fact-prompt strong{color:#9de6d3}
body.dark .xabi-word-fact-number{background:#234e49;border-color:#477e70}
body.dark .xabi-word-fact-number strong,body.dark .xabi-word-fact-number small{color:#baf4d8}
body.dark .xabi-word-reveal{background:#203c47;border-color:#426b75}
body.dark .xabi-word-reveal[open]{border-color:#75beaa}
body.dark .xabi-word-reveal-lang{color:#bddfe2}
body.dark .xabi-word-reveal summary>strong{color:#eff7ff}
body.dark .xabi-word-reveal-hint{color:#a3e6d3}
body.dark .xabi-word-reveal-answer{background:#245047;border-color:#507e74}
body.dark .xabi-word-reveal-answer strong{color:#c1f3d2}
body.dark .xabi-word-reveal-answer small{color:#e3f1e9}
body.dark .xabi-word-fact-note{color:#c5d8dd}
body.dark .xabi-word-fact-note a{color:#a2dafb}
@media(max-width:670px){
  .xabi-word-fact{padding:17px 15px;border-radius:22px;margin-bottom:25px}
  .xabi-word-fact-top{grid-template-columns:minmax(0,1fr);gap:14px}
  .xabi-word-fact-title{gap:10px}
  .xabi-word-fact-title img{width:52px;height:52px;flex-basis:52px;border-radius:17px}
  .xabi-word-fact-title h2{font-size:clamp(21px,5.6vw,28px)}
  .xabi-word-fact-number{flex-direction:row;gap:12px;justify-content:space-evenly;padding:11px 12px}
  .xabi-word-fact-number strong{font-size:clamp(35px,9vw,47px)}
  .xabi-word-fact-number small{text-align:left;margin:0}
  .xabi-word-fact-tiles{grid-template-columns:1fr;gap:9px}
  .xabi-word-reveal summary{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:10px 14px}
  .xabi-word-reveal summary .xabi-word-reveal-lang{grid-column:1/-1}
  .xabi-word-reveal summary>strong{font-size:23px}
  .xabi-word-reveal-hint{align-self:center;text-align:right;font-size:11px}
  .xabi-word-reveal-answer{padding:11px 14px}
  .xabi-word-reveal-answer strong{font-size:25px}
  .xabi-word-fact-discovery{margin-top:15px}
  .xabi-word-fact-bottom{margin-top:15px}
  .xabi-word-fact-cta{width:100%}
}
@media(max-width:345px){
  .xabi-word-fact-number strong{font-size:34px}
  .xabi-word-fact-number small{font-size:11px}
}