:root {
  --ink:#1c2421;
  --muted:#69716d;
  --paper:#f5f1e8;
  --paper-light:#fffdf7;
  --jade:#1d5c50;
  --jade-dark:#123f37;
  --jade-pale:#dce9e2;
  --red:#b74934;
  --gold:#c28d3d;
  --line:#4d4b44;
  --soft-line:rgba(28,36,33,.14);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Serif SC","Songti SC","STSong",Georgia,serif}
button{font:inherit}
a{color:inherit}

.app-shell{isolation:isolate;min-height:100vh;overflow:hidden;padding:0 4.6vw 36px;position:relative}
.paper-texture{background-image:radial-gradient(rgba(18,64,55,.1) .5px,transparent .7px),radial-gradient(rgba(150,104,60,.08) .45px,transparent .7px);background-position:0 0,7px 9px;background-size:14px 14px,19px 19px;inset:0;mix-blend-mode:multiply;opacity:.42;pointer-events:none;position:fixed;z-index:-1}
.topbar{align-items:center;border-bottom:1px solid var(--soft-line);display:flex;justify-content:space-between;margin:0 auto;max-width:1380px;min-height:78px}
.brand{align-items:center;color:var(--ink);display:flex;gap:11px;text-decoration:none}
.brand-seal{border:1px solid var(--red);border-radius:50%;color:var(--red);display:grid;font-size:20px;height:36px;line-height:1;place-items:center;width:36px}
.brand strong,.brand small{display:block}.brand strong{font-size:15px;letter-spacing:.1em}.brand small{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.17em;margin-top:3px}
.topbar-links{display:flex;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;gap:18px}.topbar-links a{color:var(--muted);text-decoration:none}.topbar-links a:hover,.topbar-links a:focus-visible{color:var(--jade);text-decoration:underline;text-underline-offset:5px}
.scoreboard{align-items:center;color:var(--muted);display:flex;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;gap:12px}.scoreboard b{color:var(--jade);font-size:14px}.scoreboard i{background:var(--soft-line);height:14px;width:1px}

.intro-strip{align-items:end;display:flex;gap:60px;justify-content:space-between;margin:0 auto;max-width:1260px;padding:46px 0 36px}.eyebrow{color:var(--red);font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;font-weight:700;letter-spacing:.17em;margin:0 0 9px}.intro-strip h1{font-size:clamp(32px,4.5vw,56px);font-weight:500;letter-spacing:-.06em;line-height:1.12;margin:0}.intro-strip h1 em{color:var(--jade);font-style:normal}.intro-strip>p{color:#59615d;font-size:13px;line-height:1.85;margin:0;max-width:430px}

.trainer-layout{align-items:start;display:grid;gap:clamp(28px,5vw,76px);grid-template-columns:minmax(300px,360px) minmax(550px,680px);justify-content:center;margin:0 auto;max-width:1260px}
.library-panel{background:rgba(255,255,255,.28);border:1px solid var(--soft-line);padding:22px}
.library-heading{align-items:baseline;border-bottom:1px solid var(--soft-line);display:flex;justify-content:space-between;padding-bottom:13px}.library-heading span{font-size:20px}.library-heading strong{color:var(--gold);font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;letter-spacing:.11em}
.mobile-practice-tip{display:none}
.module-group{margin-top:17px}.module-group h2{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.15em;margin:0 0 8px}.module-list{display:grid;gap:6px;grid-template-columns:repeat(2,minmax(0,1fr))}.module-list button{align-items:center;background:rgba(255,253,247,.55);border:1px solid var(--soft-line);color:#555e5a;cursor:pointer;display:flex;gap:8px;min-height:38px;padding:7px 8px;text-align:left;transition:background .16s,border-color .16s,color .16s}.module-list button>span{border:1px solid rgba(183,73,52,.35);border-radius:50%;color:var(--red);display:grid;font-size:9px;height:21px;place-items:center;width:21px}.module-list button strong{font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;font-weight:600}.module-list button em{color:var(--gold);font-family:ui-sans-serif,system-ui,sans-serif;font-size:8px;font-style:normal;margin-left:auto}.module-list button:hover{border-color:var(--jade);color:var(--jade)}.module-list button.active{background:var(--jade);border-color:var(--jade);color:#fff}.module-list button.active>span{border-color:rgba(255,255,255,.55);color:#fff}.module-list button.active em{color:#f1d39f}
.active-module-card{border-left:2px solid var(--gold);margin-top:20px;padding:3px 0 3px 13px}.active-module-card span{color:var(--muted);display:block;font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.11em}.active-module-card strong{color:var(--jade-dark);display:block;font-size:16px;margin:4px 0}.active-module-card p{color:#69716d;font-size:11px;line-height:1.6;margin:0}
.life-picker{border-top:1px solid var(--soft-line);margin-top:17px;padding-top:15px}.life-picker>div:first-child{align-items:baseline;display:flex;justify-content:space-between}.life-picker span{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.1em}.life-picker strong{color:var(--red);font-size:18px}.life-grid{display:grid;gap:4px;grid-template-columns:repeat(6,1fr);margin-top:8px}.life-grid button{background:transparent;border:1px solid var(--soft-line);color:#626a66;cursor:pointer;font-size:11px;padding:5px 0}.life-grid button:hover,.life-grid button.active{background:var(--red);border-color:var(--red);color:#fff}
.level-card{background:rgba(255,255,255,.42);border-left:2px solid var(--gold);margin-top:18px;padding:11px 13px}.level-card>div:first-child{align-items:baseline;display:flex;justify-content:space-between}.level-card span,.level-card small{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.07em}.level-card strong{color:var(--jade-dark);font-size:12px}.level-card small{display:block}.level-track{background:rgba(29,92,80,.11);height:3px;margin:8px 0 6px;overflow:hidden}.level-track i{background:var(--gold);display:block;height:100%;transition:width .2s ease}
.practice-duration{border-top:1px solid var(--soft-line);margin-top:15px;padding-top:13px}.practice-duration>div:first-child{align-items:baseline;display:flex;justify-content:space-between}.practice-duration span{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.08em}.practice-duration strong{color:var(--red);font-family:ui-sans-serif,system-ui,sans-serif;font-size:12px}.practice-duration>div:last-child{display:grid;gap:4px;grid-template-columns:repeat(4,1fr);margin-top:8px}.practice-duration button{background:transparent;border:1px solid var(--soft-line);color:var(--muted);cursor:pointer;font-family:ui-sans-serif,system-ui,sans-serif;font-size:8px;padding:6px 2px}.practice-duration button:hover,.practice-duration button.active{background:var(--jade);border-color:var(--jade);color:#fff}
.reset-button{background:none;border:0;border-bottom:1px solid rgba(105,113,109,.35);color:#7b817e;cursor:pointer;font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;margin-top:13px;padding:2px 0}.reset-button:hover{color:var(--red)}

.board-stage{min-width:0;text-align:center}.grid-chart{aspect-ratio:1;background:var(--paper-light);border:3px solid #292823;border-radius:17px;box-shadow:0 18px 42px rgba(36,30,21,.14);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);margin:0 auto;max-width:660px;overflow:hidden;position:relative;width:100%}
.center-prompt{align-content:center;background:linear-gradient(145deg,#fffef9,#f5eddc);border:1.5px solid var(--line);display:grid;grid-column:2/4;grid-row:2/4;justify-items:center;padding:22px;position:relative;text-align:center;z-index:2}.center-prompt>span{color:var(--red);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;font-weight:700;letter-spacing:.12em}.center-prompt h2{color:var(--jade-dark);font-size:clamp(21px,2.5vw,32px);font-weight:500;letter-spacing:-.03em;line-height:1.3;margin:12px 0 8px;max-width:270px}.center-prompt p{color:var(--muted);font-size:11px;line-height:1.55;margin:0;max-width:260px}.answer-guide-button{background:transparent;border:0;border-bottom:1px solid rgba(29,92,80,.38);color:var(--jade);cursor:pointer;font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;margin-top:13px;padding:3px 1px}.answer-guide-button:hover,.answer-guide-button.active{border-color:var(--red);color:var(--red)}.answer-guide-button:disabled{cursor:default;opacity:.4}.instant-feedback{font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;font-weight:650;line-height:1.5;margin-top:11px;min-height:15px}.instant-feedback.idle{color:#7a817d}.instant-feedback.correct{color:var(--jade)}.instant-feedback.wrong{color:var(--red)}.countdown{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;margin-top:10px}.countdown b{color:var(--red);font-size:12px}.restart-session{background:var(--jade);border:0;color:#fff;cursor:pointer;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;margin-top:16px;padding:9px 20px}.restart-session:hover{background:var(--jade-dark)}
.target-sequence{display:flex;gap:6px;margin-top:13px}.target-sequence b{align-items:center;background:#fff;border:1px solid var(--soft-line);color:#969b98;display:flex;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;height:27px;justify-content:center;position:relative;width:27px}.target-sequence b.current{background:var(--jade);border-color:var(--jade);color:#fff;transform:translateY(-2px)}.target-sequence b.done{background:var(--jade-pale);color:var(--jade)}.target-sequence b.done::after{content:"✓";font-size:7px;position:absolute;right:1px;top:-1px}.target-progress{color:var(--gold);font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;margin-top:13px}.target-progress b{font-size:14px}
.grid-cell{align-items:center;background:rgba(255,253,246,.88);border:0;color:var(--ink);cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:0;min-width:0;outline:1.4px solid #55534c;outline-offset:-1px;padding:10px;position:relative;text-align:center;transition:background .15s,box-shadow .15s;z-index:1}.grid-cell:hover{background:#fff;box-shadow:inset 0 0 0 2px var(--jade);z-index:3}.grid-cell:focus-visible{outline:3px solid var(--gold);outline-offset:-4px;z-index:4}.grid-cell:disabled{cursor:default;filter:saturate(.55);opacity:.72}.grid-cell:disabled:hover{box-shadow:none}.grid-cell strong{font-size:clamp(13px,1.55vw,19px);font-weight:500;line-height:1.3;max-width:100%;overflow-wrap:anywhere}.grid-cell small{color:currentColor;font-family:ui-sans-serif,system-ui,sans-serif;font-size:8px;letter-spacing:.07em;margin-top:7px;opacity:.78}.grid-cell.is-blank>span{height:1px;width:1px}.grid-cell.is-inactive{background:repeating-linear-gradient(135deg,#f2eee4,#f2eee4 7px,#e9e4d8 7px,#e9e4d8 8px);opacity:.48}.grid-cell.is-source{background:#f6e8d6;box-shadow:inset 3px 0 0 var(--red)}.grid-cell.is-source strong{color:var(--red)}.grid-cell.is-guide{cursor:default}.grid-cell.is-guide:hover{background:rgba(255,253,246,.88);box-shadow:none}.grid-cell.is-guide.is-answer-key{background:#f6e8d6;box-shadow:inset 0 0 0 3px var(--gold);color:var(--red);z-index:3}.grid-cell.is-solved{background:var(--jade);box-shadow:inset 0 0 0 2px var(--jade-dark);color:#fff;z-index:3}.grid-cell.is-wrong{background:var(--red);box-shadow:inset 0 0 0 2px #7e3225;color:#fff;z-index:3}.grid-cell.is-solved strong,.grid-cell.is-wrong strong{animation:reveal .18s ease-out both;color:#fff}.grid-cell.is-solved small,.grid-cell.is-wrong small{color:#fff}.answer-burst{align-items:center;border:2px solid rgba(255,255,255,.78);border-radius:50%;box-shadow:0 3px 10px rgba(28,36,33,.2);display:flex;font-family:ui-sans-serif,system-ui,sans-serif;font-size:18px;font-weight:800;height:30px;justify-content:center;pointer-events:none;position:absolute;right:8px;top:8px;width:30px;z-index:8}.answer-burst.correct{animation:resultCorner .52s ease-out both;background:var(--jade);color:#fff}.answer-burst.wrong{animation:resultCorner .62s ease-out both;background:var(--red);color:#fff}
@keyframes reveal{from{opacity:0;transform:scale(.78)}to{opacity:1;transform:scale(1)}}
@keyframes resultCorner{0%{opacity:0;transform:scale(.35) rotate(-12deg)}28%{opacity:1;transform:scale(1.16) rotate(0)}72%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.9)}}
.board-note{color:var(--muted);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.1em;margin-top:15px}.board-note span{background:var(--red);border-radius:50%;display:inline-block;height:5px;margin:0 7px 1px 0;width:5px}

.memory-map{border-bottom:1px solid var(--soft-line);border-top:1px solid var(--soft-line);display:grid;grid-template-columns:repeat(3,1fr);margin:52px auto 0;max-width:1260px}.memory-map>div{padding:20px 25px}.memory-map>div+div{border-left:1px solid var(--soft-line)}.memory-map span{color:var(--gold);font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px}.memory-map strong{color:var(--jade-dark);font-size:14px;margin-left:10px}.memory-map p{color:var(--muted);font-size:11px;line-height:1.6;margin:8px 0 0}
footer{color:#7d827f;font-family:ui-sans-serif,system-ui,sans-serif;font-size:9px;letter-spacing:.06em;padding:22px 0 0;text-align:center}

@media(max-width:1050px){.trainer-layout{grid-template-columns:minmax(270px,320px) minmax(470px,1fr);gap:28px}.grid-chart{max-width:590px}.intro-strip{padding-top:36px}}
@media(max-width:800px){.app-shell{padding:0 16px calc(28px + env(safe-area-inset-bottom))}.topbar{min-height:68px}.topbar-links{display:none}.scoreboard{gap:7px}.scoreboard i:last-of-type,.scoreboard span:last-child{display:none}.intro-strip{align-items:start;display:block;padding:30px 7px 24px}.intro-strip>p{margin-top:14px}.trainer-layout{display:flex;flex-direction:column;gap:22px}.library-panel{max-height:min(48vh,390px);overflow-y:auto;padding:16px;scrollbar-gutter:stable;width:100%}.mobile-practice-tip{color:var(--muted);display:block;font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;margin:10px 0 0}.module-list{grid-template-columns:repeat(3,minmax(0,1fr))}.module-list button{min-height:44px}.board-stage{scroll-margin-top:10px;width:100%}.grid-chart{border-radius:11px;max-width:650px}.memory-map{grid-template-columns:1fr;margin-top:36px}.memory-map>div{padding:14px 8px}.memory-map>div+div{border-left:0;border-top:1px solid var(--soft-line)}}
@media(max-width:520px){.app-shell{padding-left:10px;padding-right:10px}.topbar{gap:8px;min-height:60px}.brand{gap:7px}.brand-seal{font-size:17px;height:32px;width:32px}.brand strong{font-size:13px}.brand small{display:none}.scoreboard{font-size:10px}.scoreboard span:first-child,.scoreboard i:first-of-type{display:none}.intro-strip{padding:24px 5px 20px}.intro-strip h1{font-size:30px}.intro-strip>p{font-size:12px;line-height:1.7}.library-panel{max-height:340px;padding:13px}.module-list{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-chart{border-width:2px}.grid-cell{padding:5px}.grid-cell strong{font-size:12px}.grid-cell small{font-size:6px;margin-top:3px}.answer-burst{border-width:1px;font-size:13px;height:22px;right:4px;top:4px;width:22px}.center-prompt{padding:8px}.center-prompt>span{font-size:7px}.center-prompt h2{font-size:15px;margin:7px 0 5px;max-width:145px}.center-prompt p{font-size:8px;max-width:145px}.answer-guide-button{font-size:7px;margin-top:7px}.instant-feedback{font-size:7px;margin-top:6px;max-width:145px}.target-sequence{gap:3px;margin-top:7px}.target-sequence b{font-size:9px;height:21px;width:21px}.target-progress{font-size:8px;margin-top:7px}.board-note{font-size:8px;letter-spacing:.04em}}