:root{
  --ink:#26243a;
  --muted:#6f6a7d;
  --paper:#fffdf9;
  --cream:#fff6e8;
  --peach:#ffd9be;
  --pink:#f8c8dc;
  --mint:#cdeee3;
  --blue:#cfe7fb;
  --lav:#ded2fb;
  --gold:#f6d77a;
  --green:#2f7d62;
  --red:#a34d56;
  --line:#e6dfd6;
  --shadow:0 12px 30px rgba(52,42,68,.11);
  --radius:24px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:linear-gradient(180deg,#fffaf3 0%,#f9f5ff 100%);color:var(--ink);font-family:ui-rounded,"SF Pro Rounded","Avenir Next",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input{font:inherit}
button{color:inherit}
.app-shell{min-height:100vh}
.suite-bar{height:68px;padding:10px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid rgba(96,76,113,.12);background:rgba(255,253,249,.9);backdrop-filter:blur(14px);position:sticky;top:0;z-index:10}
.suite-home{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;min-width:150px}
.suite-home strong,.suite-home small{display:block}.suite-home small{font-size:11px;color:var(--muted)}
.suite-arrow{font-size:22px}.game-mark{font-weight:800;text-align:center}.mark-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--pink);margin-right:7px}
.tiny-btn,.back-btn,.secondary-btn{border:1px solid var(--line);background:white;border-radius:999px;padding:9px 13px;font-weight:700;cursor:pointer}
#main{width:min(980px,calc(100% - 28px));margin:0 auto;padding:34px 0 56px}
.hero{display:grid;grid-template-columns:1.35fr .9fr;gap:26px;align-items:center;min-height:520px}
.hero-copy,.hero-panel,.question-card,.results-card,.chapter-card{background:rgba(255,255,255,.88);border:1px solid rgba(94,75,107,.12);box-shadow:var(--shadow);border-radius:32px}
.hero-copy{padding:42px}.eyebrow{font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:900;color:#8a6685}.hero h1{font-size:clamp(44px,8vw,78px);line-height:.94;margin:12px 0 18px}.hero h1 .logic{color:#694d86}.hero h1 .detective{color:#c36979}.tagline{font-size:20px;line-height:1.5;color:#5f586a;max-width:630px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.primary-btn{border:0;border-radius:18px;background:var(--ink);color:white;padding:14px 20px;font-weight:900;cursor:pointer;box-shadow:0 8px 18px rgba(38,36,58,.16)}
.primary-btn:disabled{opacity:.45;cursor:not-allowed}.secondary-btn{padding:13px 17px}
.hero-panel{padding:26px;background:linear-gradient(145deg,#fff5df,#f3edff)}.case-board{background:white;border-radius:24px;padding:22px;border:1px solid var(--line)}.case-board h3{margin:0 0 12px}.case-note{padding:12px 14px;border-radius:14px;background:#fff9cf;margin:10px 0;transform:rotate(-1deg);box-shadow:0 5px 10px rgba(65,52,71,.07)}
.section-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:24px}.section-head h1{margin:4px 0 8px;font-size:36px}.section-head p{margin:0;color:var(--muted)}
.chapter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.chapter-card{padding:26px;cursor:pointer;text-align:left}.chapter-card h2{margin:4px 0 10px}.chapter-card p{color:var(--muted);line-height:1.45}.chapter-card .chapter-no{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#8c728e;font-weight:900}.chapter-card:hover{transform:translateY(-2px)}
.progress-shell{height:10px;background:#eee8e0;border-radius:999px;overflow:hidden}.progress-shell span{display:block;height:100%;background:linear-gradient(90deg,#d88ca8,#9079c7);border-radius:999px}.progress-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;color:var(--muted);font-weight:700;font-size:14px}
.question-wrap{max-width:780px;margin:0 auto}.question-card{padding:30px}.question-type{font-size:12px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:#8a6685;margin-bottom:12px}.passage{background:var(--cream);border-radius:18px;padding:20px;margin:12px 0 24px;font-size:20px;line-height:1.5}.passage p{margin:0 0 10px}.passage p:last-child{margin-bottom:0}.prompt{font-size:24px;line-height:1.3;margin:0 0 20px}.choices{display:grid;gap:12px}.choice{width:100%;text-align:left;border:2px solid var(--line);background:white;border-radius:18px;padding:16px 18px;cursor:pointer;display:flex;gap:14px;align-items:flex-start;line-height:1.4}.choice:hover{border-color:#cbbbd7}.choice.selected{border-color:#826ca0;background:#f7f1ff}.choice.correct{border-color:#72ae96;background:#ecfaf4}.choice.incorrect{border-color:#d38b93;background:#fff1f2}.choice:disabled{cursor:default}.choice-letter{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#f2edf4;font-weight:900;flex:0 0 auto}
.question-actions{display:flex;justify-content:space-between;gap:12px;margin-top:20px;align-items:center}.attempt-note{font-size:13px;color:var(--muted)}
.feedback{margin-top:20px;border-radius:18px;padding:18px 20px;line-height:1.5}.feedback.correct{background:#eaf8f2;border:1px solid #b9dfcf}.feedback.incorrect{background:#fff1f2;border:1px solid #efc2c7}.feedback h3{margin:0 0 6px}.feedback p{margin:0}.hint-box{margin-top:14px;background:#f2eefb;border-radius:16px;padding:15px 17px;color:#574d64}
.results-card{max-width:680px;margin:70px auto 0;padding:36px;text-align:center}.result-score{font-size:64px;font-weight:900;margin:10px 0}.result-meta{color:var(--muted);margin-bottom:26px}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.result-stat{padding:16px;border-radius:18px;background:#f8f4ef}.result-stat strong{display:block;font-size:24px}.result-stat small{color:var(--muted)}
.toast{position:fixed;bottom:18px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#29263b;color:white;padding:10px 16px;border-radius:999px;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}
.hidden{display:none!important}
@media(max-width:760px){
  .suite-bar{height:62px;padding:8px 12px}.suite-home{min-width:auto}.suite-home small{display:none}.game-mark{font-size:14px}.tiny-btn{padding:8px 10px;font-size:12px}
  #main{width:min(100% - 20px,680px);padding-top:22px}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:28px}.hero-panel{padding:18px}.tagline{font-size:17px}.chapter-grid{grid-template-columns:1fr}.question-card{padding:20px}.passage{font-size:18px;padding:17px}.prompt{font-size:21px}.choice{padding:14px}.question-actions{align-items:stretch;flex-direction:column}.question-actions .primary-btn,.question-actions .secondary-btn{width:100%}.result-grid{grid-template-columns:1fr}.section-head{align-items:stretch;flex-direction:column}.back-btn{align-self:flex-start}
}

/* Batch 2 */
.build-note{margin-top:22px;padding:12px 14px;border-radius:14px;background:#f8f2ff;color:var(--muted);font-size:14px;line-height:1.45}.build-note strong{color:var(--ink)}
.chapter-meta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.chapter-meta span{font-size:12px;font-weight:800;color:#675a75;background:#f5f0f8;border-radius:999px;padding:7px 9px}.locked-card{opacity:.55;cursor:default!important}.locked-card:hover{transform:none!important}
.lesson-card{max-width:760px;margin:34px auto 0;padding:36px;background:rgba(255,255,255,.9);border:1px solid rgba(94,75,107,.12);box-shadow:var(--shadow);border-radius:32px}.lesson-kicker{text-transform:uppercase;letter-spacing:.1em;font-weight:900;font-size:12px;color:#8a6685}.lesson-card h1{font-size:42px;margin:6px 0 12px}.lesson-lead{font-size:19px;line-height:1.55;color:#5f586a}.rule-example{display:grid;gap:7px;margin:24px 0;padding:22px;border-radius:20px;background:linear-gradient(145deg,#fff5df,#f3edff);font-size:21px}.rule-example strong{font-size:24px}.lesson-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lesson-grid>div{padding:17px;border:1px solid var(--line);border-radius:17px;background:white}.lesson-grid strong{display:block;margin-bottom:6px}.lesson-grid p{margin:0;color:var(--muted);line-height:1.45}.lesson-note{color:var(--muted);line-height:1.5;margin-top:20px}.question-spacer{height:18px}
.trap-card{margin:22px 0;padding:17px;border-radius:18px;background:#fff7dc;border:1px solid #eadca9;text-align:left}.trap-card span,.trap-card small{display:block;color:var(--muted)}.trap-card strong{display:block;margin:5px 0;font-size:18px}.trap-card.clean{text-align:center;background:#eef9f4;border-color:#c8e4d7}.results-note{color:var(--muted);line-height:1.5}.centered-actions{justify-content:center}
@media(max-width:760px){.lesson-card{padding:24px;margin-top:10px}.lesson-card h1{font-size:34px}.lesson-lead{font-size:17px}.lesson-grid{grid-template-columns:1fr}.rule-example{font-size:18px}.rule-example strong{font-size:21px}}


/* UX optimization pass — mobile + desktop */
html{font-size:16px;-webkit-text-size-adjust:100%}
body{min-height:100dvh}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:4px solid rgba(73,105,180,.32);outline-offset:3px}
button{touch-action:manipulation}

.suite-bar{min-height:64px;height:auto;padding-top:max(10px,env(safe-area-inset-top));}
.tiny-btn,.back-btn,.secondary-btn,.primary-btn{min-height:48px}
.tiny-btn{white-space:nowrap}
.primary-btn,.secondary-btn,.back-btn{font-size:16px}
.primary-btn{padding:14px 22px}
.secondary-btn,.back-btn{padding:12px 17px}

#main{padding-bottom:max(64px,calc(44px + env(safe-area-inset-bottom)))}
.chapter-page{max-width:1040px;margin:0 auto}
.chapter-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.chapter-card{min-height:210px;padding:22px;display:flex;flex-direction:column;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.chapter-card p{font-size:16px;margin:6px 0 8px}
.chapter-card .chapter-meta{margin-top:auto}
.chapter-card:hover{border-color:#cdbfd6;box-shadow:0 15px 32px rgba(52,42,68,.14)}
.chapter-card:active{transform:scale(.985)}
.chapter-meta span:last-child{margin-left:auto}

.lesson-card{max-width:820px}
.lesson-card .hero-actions{align-items:stretch}
.lesson-card .hero-actions button{min-height:52px}
.rule-example{line-height:1.45}
.lesson-grid>div{min-height:92px}

.question-wrap{max-width:860px}
.play-topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.case-count{display:flex;align-items:baseline;gap:6px;color:var(--muted);font-size:15px}
.case-count strong{font-size:18px;color:var(--ink)}
.question-card{padding:32px}
.question-type{font-size:13px;margin-bottom:10px}
.passage{display:grid;gap:10px;font-size:20px;line-height:1.45;padding:18px 20px;margin-bottom:22px}
.passage p{display:flex;gap:11px;align-items:flex-start;margin:0}
.clue-dot{display:grid;place-items:center;width:26px;height:26px;min-width:26px;border-radius:50%;background:white;border:1px solid #eadfcf;font-size:13px;font-weight:900;color:#725f79;margin-top:1px}
.prompt{font-size:26px;margin-bottom:8px}
.answer-help{margin:0 0 14px;color:var(--muted);font-weight:700}
.choices{gap:13px}
.choice{min-height:62px;padding:16px 18px;font-size:18px;border-width:2px;align-items:center;transition:transform .08s ease,border-color .12s ease,background .12s ease}
.choice:hover:not(:disabled){border-color:#a993ba;background:#fcf9ff}
.choice:active:not(:disabled){transform:scale(.992)}
.choice.selected{border-color:#665083;background:#f3ecff;box-shadow:0 0 0 3px rgba(102,80,131,.10)}
.choice.correct{border-color:#4f9477;background:#e8f8f0}
.choice.incorrect{border-color:#bd6871;background:#fff0f1}
.choice:disabled:not(.correct){opacity:.7}
.choice-letter{width:34px;height:34px;min-width:34px;font-size:16px}
.choice-text{flex:1}
.question-actions{display:grid;grid-template-columns:auto 1fr auto;gap:12px;margin-top:22px;align-items:center}
.hint-btn{justify-self:start}
.attempt-note{text-align:center;font-weight:800}
.check-btn{min-width:190px}
.feedback{font-size:17px;padding:17px 19px}
.feedback h3{font-size:20px}
.resolved-character-feedback{float:right;width:68px;height:68px;margin:-7px -5px 3px 10px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.resolved-character-image{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.hint-box{font-size:16px}
.hint-box strong{display:block;margin-bottom:4px}
.hint-box p{margin:0}
.result-title{font-size:36px;margin:8px 0 0}
.result-score span{font-size:.45em;color:var(--muted);vertical-align:middle}
.results-actions button{min-width:150px}

@media(max-width:900px){
  .chapter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .suite-bar{gap:8px;padding-left:10px;padding-right:10px}
  .suite-home strong{font-size:14px}
  .game-mark{display:none}
  #main{width:min(100% - 16px,680px);padding-top:14px}
  .hero{gap:14px}
  .hero-copy{padding:24px}
  .hero h1{font-size:clamp(44px,14vw,64px)}
  .hero-panel{display:none}
  .hero-actions{display:grid;grid-template-columns:1fr}
  .hero-actions button{width:100%;min-height:54px}
  .build-note{text-align:center}

  .chapter-grid{grid-template-columns:1fr;gap:12px}
  .chapter-card{min-height:0;padding:19px}
  .chapter-card h2{font-size:22px;margin:4px 0 7px}
  .chapter-card p{font-size:15px;margin:0 0 8px}
  .chapter-meta{margin:8px 0 0}
  .chapter-meta span{font-size:11px}
  .section-head h1{font-size:32px}

  .lesson-card{padding:20px;border-radius:24px;margin-top:4px}
  .lesson-card h1{font-size:32px}
  .lesson-lead{font-size:17px}
  .lesson-card .hero-actions{grid-template-columns:1fr}
  .rule-example{padding:17px;margin:18px 0;font-size:17px}
  .rule-example strong{font-size:20px}
  .lesson-grid{gap:9px}
  .lesson-grid>div{min-height:0;padding:14px}

  .question-wrap{width:100%}
  .play-topbar{position:sticky;top:calc(62px + env(safe-area-inset-top));z-index:8;background:linear-gradient(180deg,#fffaf3 78%,rgba(255,250,243,0));padding:6px 0 10px;margin-bottom:3px}
  .exit-cases{min-height:44px;padding:9px 13px;font-size:14px}
  .case-count strong{font-size:16px}
  .case-count{font-size:14px}
  .progress-shell{height:8px}
  .question-card{padding:17px;border-radius:24px}
  .question-type{font-size:11px;letter-spacing:.07em}
  .passage{font-size:17px;padding:14px;margin:8px 0 17px;gap:8px;border-radius:16px}
  .clue-dot{width:24px;height:24px;min-width:24px;font-size:12px}
  .prompt{font-size:22px;line-height:1.25;margin-bottom:7px}
  .answer-help{font-size:14px;margin-bottom:10px}
  .choice{min-height:60px;padding:14px 13px;font-size:16.5px;border-radius:16px;gap:11px}
  .choice-letter{width:32px;height:32px;min-width:32px}
  .feedback{font-size:16px;margin-top:14px}
  .question-actions{
    position:sticky;
    bottom:0;
    z-index:7;
    grid-template-columns:1fr;
    background:rgba(255,253,249,.96);
    backdrop-filter:blur(10px);
    margin:18px -17px -17px;
    padding:12px 17px max(12px,env(safe-area-inset-bottom));
    border-top:1px solid var(--line);
    border-radius:0 0 24px 24px;
  }
  .hint-btn{width:100%;order:2}
  .attempt-note{order:1;min-height:20px;font-size:13px}
  .check-btn{width:100%;min-width:0;min-height:54px;order:0}
  .results-card{margin:18px auto 0;padding:24px 18px;border-radius:24px}
  .result-score{font-size:60px}
  .result-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  .result-stat{padding:12px 7px}
  .result-stat strong{font-size:22px}
  .result-stat small{font-size:11px}
  .results-actions{display:grid;grid-template-columns:1fr}
  .results-actions button{width:100%}
}

@media(max-width:380px){
  .suite-home strong{font-size:13px}
  .tiny-btn{font-size:11px;padding:8px}
  .question-card{padding:14px}
  .passage{font-size:16px}
  .prompt{font-size:20px}
  .choice{font-size:16px;padding:12px}
  .question-actions{margin-left:-14px;margin-right:-14px;margin-bottom:-14px;padding-left:14px;padding-right:14px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
}


/* Batch 17 — adaptive mastery */
.smart-review-banner{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin:18px 0;padding:20px 22px;border:1px solid var(--line);
  border-radius:22px;background:rgba(255,255,255,.72);box-shadow:var(--shadow);
}
.smart-review-banner h2{margin:4px 0 4px;font-size:24px}
.smart-review-banner p{margin:0;color:var(--muted)}
.mastery-page{max-width:980px;margin:0 auto}
.mastery-hero{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:24px;margin:18px 0;border-radius:26px;background:white;
  border:1px solid var(--line);box-shadow:var(--shadow)
}
.mastery-hero h2{font-size:30px;margin:4px 0 6px}
.mastery-hero p{margin:0;color:var(--muted);font-size:17px}
.mastery-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}
.mastery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mastery-card{
  padding:20px;border-radius:20px;background:white;border:2px solid var(--line);
}
.mastery-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mastery-card h3{margin:0;font-size:21px}
.mastery-card p{margin:8px 0 0;color:var(--muted)}
.mastery-pill{
  white-space:nowrap;font-size:12px;font-weight:900;padding:7px 10px;border-radius:999px;background:#f5f1ec
}
.mastery-card.strong{border-color:#b8ddca}
.mastery-card.strong .mastery-pill{background:#e8f8f0}
.mastery-card.almost{border-color:#e3d6a6}
.mastery-card.almost .mastery-pill{background:#fff8da}
.mastery-card.practice{border-color:#ddb4b8}
.mastery-card.practice .mastery-pill{background:#fff0f1}
.mastery-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

@media(max-width:760px){
  .smart-review-banner{display:grid;grid-template-columns:1fr;padding:18px}
  .smart-review-banner .primary-btn{width:100%}
  .mastery-hero{display:grid;grid-template-columns:1fr;padding:20px}
  .mastery-hero .primary-btn{width:100%}
  .mastery-grid{grid-template-columns:1fr}
  .mastery-actions{display:grid;grid-template-columns:1fr}
  .mastery-actions button{width:100%}
}


/* Batch 18 — streaks, daily challenge, achievements, durable progress */
.home-progress-strip{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:14px
}
.home-progress-strip span{
  background:rgba(255,255,255,.76);border:1px solid var(--line);border-radius:999px;
  padding:7px 10px;font-size:13px;color:var(--muted)
}
.home-progress-strip strong{color:var(--ink)}

.smart-review-actions{display:flex;gap:10px;align-items:center}

.daily-page,.progress-page{max-width:980px;margin:0 auto}
.daily-card{
  display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;
  background:white;border:1px solid var(--line);border-radius:26px;padding:26px;
  box-shadow:var(--shadow);margin:20px 0
}
.daily-icon{font-size:46px}
.daily-date{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}
.daily-card h2{font-size:30px;margin:5px 0 7px}
.daily-card p{margin:0;color:var(--muted);font-size:17px}
.daily-note{
  background:rgba(255,255,255,.62);border:1px solid var(--line);
  border-radius:18px;padding:14px 16px;text-align:center;color:var(--muted)
}

.progress-summary-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 24px
}
.progress-big{
  background:white;border:1px solid var(--line);border-radius:20px;padding:20px;text-align:center
}
.progress-big strong{display:block;font-size:34px}
.progress-big span{color:var(--muted);font-size:14px}

.progress-section{margin:28px 0}
.progress-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.progress-section-head h2{margin:0;font-size:25px}
.progress-section-head span{color:var(--muted);font-weight:800}
.achievement-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.achievement{
  display:flex;gap:12px;align-items:flex-start;padding:17px;border-radius:18px;
  background:white;border:1px solid var(--line)
}
.achievement.locked{opacity:.55;background:rgba(255,255,255,.55)}
.achievement-icon{font-size:28px;line-height:1}
.achievement h3{font-size:17px;margin:0 0 4px}
.achievement p{font-size:14px;color:var(--muted);margin:0}
.achievement small{display:inline-block;margin-top:7px;font-weight:900;color:var(--accent)}

.chapter-progress-list{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px
}
.chapter-progress-row{
  display:grid;grid-template-columns:26px 1fr auto;gap:9px;align-items:center;
  padding:12px 14px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:14px
}
.chapter-progress-row.done{background:white}
.chapter-progress-row strong{font-size:14px}
.chapter-progress-row small{color:var(--muted)}
.unlock-card{
  margin-top:14px;padding:16px 18px;border-radius:18px;background:#fff7d7;border:1px solid #e6d48c;
  display:flex;align-items:center;justify-content:space-between;gap:12px
}
.unlock-card span{font-size:12px;text-transform:uppercase;letter-spacing:.07em;font-weight:900}
.unlock-card strong{font-size:18px}

@media(max-width:800px){
  .progress-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .achievement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .smart-review-actions{display:grid;grid-template-columns:1fr;width:100%}
  .smart-review-actions button{width:100%}
  .daily-card{grid-template-columns:1fr;text-align:center;padding:20px}
  .daily-icon{font-size:40px}
  .daily-card .primary-btn{width:100%}
  .daily-card h2{font-size:26px}
  .progress-summary-grid{gap:8px}
  .progress-big{padding:15px 8px}
  .progress-big strong{font-size:28px}
  .achievement-grid{grid-template-columns:1fr}
  .chapter-progress-list{grid-template-columns:1fr}
}

@media(max-width:380px){
  .home-progress-strip{display:grid;grid-template-columns:1fr}
  .home-progress-strip span{text-align:center}
}


/* Batch 19 — Detective City */
.city-page,.district-page{max-width:1040px;margin:0 auto}
.city-summary,.district-hero{
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:22px 24px;margin:18px 0 20px;background:white;border:1px solid var(--line);
  border-radius:24px;box-shadow:var(--shadow)
}
.city-summary-label,.district-kicker{
  display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)
}
.city-summary strong,.district-hero h2{display:block;font-size:26px;margin:4px 0 5px}
.city-summary p,.district-hero p{margin:0;color:var(--muted)}

.city-map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.district-card{
  position:relative;padding:21px;border-radius:22px;background:white;border:2px solid var(--line);
  box-shadow:var(--shadow);overflow:hidden
}
.district-card.done{border-color:#b9d9c6}
.district-card.started{border-color:#decf9e}
.district-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.district-icon{font-size:34px}
.district-status{
  padding:6px 9px;border-radius:999px;background:#f5f1ec;font-size:12px;font-weight:900
}
.district-card.done .district-status{background:#e8f8f0}
.district-card.started .district-status{background:#fff8da}
.district-number{
  display:block;margin-top:13px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;
  font-weight:900;color:var(--muted)
}
.district-card h2{margin:3px 0 3px;font-size:24px}
.district-card>strong{font-size:15px}
.district-card>p{color:var(--muted);min-height:42px}
.district-chapters{display:grid;gap:6px;margin:14px 0}
.district-chapters span{
  font-size:13px;color:var(--muted);padding:7px 9px;border-radius:10px;background:#f7f5f2
}
.district-chapters span.visited{color:var(--ink);font-weight:800;background:#eef7f2}
.district-open{width:100%}

.district-chapter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.district-chapter-btn{
  min-height:92px;display:flex;align-items:center;gap:11px;text-align:left;padding:15px;
  border:1px solid var(--line);border-radius:18px;background:white;color:var(--ink);cursor:pointer
}
.district-chapter-btn:hover{transform:translateY(-1px)}
.district-chapter-btn>span{font-size:20px}
.district-chapter-btn strong{display:block;font-size:15px}
.district-chapter-btn small{display:block;margin-top:4px;color:var(--muted)}

.city-progress-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.city-progress-row{
  display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;
  padding:12px 14px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:14px
}
.city-progress-row.done{background:white}
.city-progress-row small{color:var(--muted)}

@media(min-width:900px){
  .city-map-grid .district-card:last-child{grid-column:1 / -1;max-width:510px;justify-self:center;width:100%}
}

@media(max-width:760px){
  .city-summary,.district-hero{display:grid;grid-template-columns:1fr;padding:19px}
  .city-summary .primary-btn,.district-hero .primary-btn{width:100%}
  .city-map-grid{grid-template-columns:1fr}
  .district-card>p{min-height:0}
  .district-chapter-grid{grid-template-columns:1fr}
  .district-chapter-btn{min-height:76px}
  .city-progress-list{grid-template-columns:1fr}
}


/* Batch 20 — World character integration */
.world-page,.character-page{max-width:1040px;margin:0 auto}
.world-hero,.character-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:22px 24px;margin:18px 0 20px;background:white;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}
.world-kicker,.character-role{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}
.world-hero h2,.character-hero h2{font-size:27px;margin:4px 0 5px}.world-hero p,.character-hero p{margin:0;color:var(--muted)}
.character-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.character-card{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:20px;background:white;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}
.character-icon{font-size:38px;line-height:1}.character-card h2{margin:3px 0 5px;font-size:23px}.character-card p{margin:0;color:var(--muted)}.character-card .character-open{grid-column:1 / -1;width:100%}
.character-hero{display:grid;grid-template-columns:auto 1fr auto}.character-hero-icon{font-size:52px}
.character-skill-list{margin-top:18px;padding:20px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:20px}.character-skill-list h2{font-size:20px;margin:0 0 10px}
.skill-link{width:100%;display:flex;align-items:center;gap:10px;text-align:left;padding:12px 14px;margin-top:7px;border:1px solid var(--line);border-radius:14px;background:white;color:var(--ink);cursor:pointer}.skill-link span{font-weight:900;color:var(--accent)}
.world-progress-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.world-progress-row{display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;padding:12px 14px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:14px}.world-progress-row.done{background:white}.world-progress-row small{color:var(--muted)}
@media(max-width:760px){.world-hero,.character-hero{display:grid;grid-template-columns:1fr;padding:19px}.world-hero .primary-btn,.character-hero .primary-btn{width:100%}.character-grid{grid-template-columns:1fr}.character-hero-icon{font-size:44px}.world-progress-list{grid-template-columns:1fr}}


/* Batch 21 — multi-step Case Files */
.casefiles-page,.casefile-intro-page{max-width:1040px;margin:0 auto}
.casefiles-hero{
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:22px 24px;margin:18px 0 20px;background:white;border:1px solid var(--line);
  border-radius:24px;box-shadow:var(--shadow)
}
.casefiles-kicker,.casefile-place{
  display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)
}
.casefiles-hero h2{font-size:27px;margin:4px 0 5px}
.casefiles-hero p{margin:0;color:var(--muted)}
.casefile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.casefile-card{
  display:grid;grid-template-columns:auto 1fr;gap:14px;padding:20px;background:white;
  border:2px solid var(--line);border-radius:22px;box-shadow:var(--shadow)
}
.casefile-card.visited{border-color:#b9d9c6}
.casefile-icon{font-size:38px;line-height:1}
.casefile-card h2{font-size:22px;margin:3px 0 5px}
.casefile-card p{margin:0;color:var(--muted)}
.casefile-meta{
  grid-column:1 / -1;display:flex;justify-content:space-between;gap:10px;
  padding-top:10px;border-top:1px solid var(--line);font-size:12px;font-weight:800;color:var(--muted)
}
.casefile-open{grid-column:1 / -1;width:100%}
.casefile-top-back{margin-bottom:14px}
.casefile-intro-card{
  max-width:720px;margin:20px auto;padding:34px;text-align:center;background:white;
  border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)
}
.casefile-intro-card h1{font-size:38px;margin:6px 0 8px}
.casefile-intro-card>p{font-size:18px;color:var(--muted);max-width:580px;margin:0 auto}
.casefile-rules{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:22px 0
}
.casefile-rules span{padding:12px;border-radius:14px;background:#f7f5f2;color:var(--muted);font-size:13px}
.casefile-rules strong{display:block;color:var(--ink);margin-bottom:2px}
.story-step-chip{
  display:inline-block;margin:0 0 10px;padding:6px 9px;border-radius:999px;
  background:#f0ece6;color:var(--muted);font-size:12px;font-weight:900
}
.world-hero-actions{display:flex;gap:10px;align-items:center}
.casefile-progress-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.casefile-progress-row{
  display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;
  padding:12px 14px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:14px
}
.casefile-progress-row.done{background:white}
.casefile-progress-row small{color:var(--muted)}

@media(max-width:760px){
  .casefiles-hero{display:grid;grid-template-columns:1fr;padding:19px}
  .casefiles-hero .primary-btn{width:100%}
  .casefile-grid{grid-template-columns:1fr}
  .casefile-intro-card{padding:24px 18px}
  .casefile-intro-card h1{font-size:31px}
  .casefile-rules{grid-template-columns:1fr}
  .world-hero-actions{display:grid;grid-template-columns:1fr;width:100%}
  .world-hero-actions button{width:100%}
  .casefile-progress-list{grid-template-columns:1fr}
}


/* Batch 23 — runtime hardening */
.mastery-card.new{border-style:dashed}
.mastery-card.new .mastery-status{opacity:.72}

@media(min-width:761px){
  .question-shell::after{
    content:"Esc: leave practice";
    display:block;
    margin-top:10px;
    text-align:center;
    font-size:11px;
    color:var(--muted);
    opacity:.65;
  }
}


/* Batch 24 — Mastery 2.0 */
.mastery-detail{
  display:block;
  margin-top:5px;
  font-size:12px;
  color:var(--muted);
}
.trained-chip{
  display:inline-block;
  margin-top:10px;
  padding:6px 9px;
  border-radius:999px;
  background:#f4f1ec;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}


/* Batch 25 — progress history & adult summary */
.progress-head-actions{display:flex;gap:10px;align-items:center}
.trend-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.trend-card{padding:13px;border:1px solid var(--line);border-radius:14px;background:white}
.trend-card strong,.trend-card span,.trend-card small{display:block}
.trend-card span{margin-top:4px;font-weight:800}
.trend-card small{margin-top:3px;color:var(--muted)}

.parent-progress-page{max-width:1100px;margin:0 auto}
.parent-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0}
.parent-stat{padding:18px;background:white;border:1px solid var(--line);border-radius:18px}
.parent-stat strong{display:block;font-size:29px}
.parent-stat span{color:var(--muted);font-size:13px}
.parent-section{margin:18px 0;padding:20px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:20px}
.skill-table-wrap{overflow-x:auto}
.skill-table{width:100%;border-collapse:collapse;background:white;border-radius:14px;overflow:hidden}
.skill-table th,.skill-table td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:13px;white-space:nowrap}
.skill-table th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.status-pill{display:inline-block;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:900;background:#f2efea}
.status-pill.strong{background:#e8f8f0}.status-pill.almost{background:#fff7d8}.status-pill.practice{background:#ffe8e3}.status-pill.new{background:#f1f1f1}
.focus-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.focus-card{padding:15px;background:white;border:1px solid var(--line);border-radius:15px}
.focus-card h3{margin:8px 0 5px}.focus-card p{margin:0;color:var(--muted);font-size:13px}
.history-list{display:grid;gap:7px}
.history-row{display:grid;grid-template-columns:140px 1fr 1fr;gap:10px;padding:10px 12px;background:white;border:1px solid var(--line);border-radius:12px;font-size:13px}
.parent-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
@media(max-width:800px){
  .trend-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .parent-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .focus-grid{grid-template-columns:1fr}.history-row{grid-template-columns:1fr}
  .progress-head-actions{display:grid;grid-template-columns:1fr}
}
@media(max-width:420px){.trend-card-grid,.parent-summary-grid{grid-template-columns:1fr}}
@media print{
  .suite-bar,.back-btn,.parent-actions,.progress-head-actions{display:none!important}
  body{background:white}.parent-section,.parent-stat{box-shadow:none}
}


/* Batch 27 — Content Workshop */
.workshop-page,.workshop-detail-page{max-width:1120px;margin:0 auto}
.workshop-toolbar{
  display:grid;grid-template-columns:1fr 260px auto;gap:10px;align-items:center;
  padding:14px;margin:18px 0 10px;background:white;border:1px solid var(--line);border-radius:18px
}
.workshop-toolbar input,.workshop-toolbar select{
  width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;
  background:white;color:var(--ink);font:inherit
}
.workshop-check{display:flex;gap:8px;align-items:center;font-size:13px;font-weight:800;white-space:nowrap}
.workshop-summary{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:0 0 12px;color:var(--muted);font-size:13px}
.workshop-summary strong{font-size:22px;color:var(--ink)}
.workshop-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.workshop-record{
  display:grid;gap:10px;padding:16px;background:white;border:1px solid var(--line);border-radius:18px
}
.workshop-record-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.workshop-record h3{margin:3px 0 0;font-size:18px}
.workshop-source{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:900;color:var(--muted)}
.workshop-flag{display:inline-block;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:900;white-space:nowrap}
.workshop-flag.ok{background:#e8f8f0}.workshop-flag.warn{background:#fff1dc}
.workshop-meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.workshop-meta span{padding:5px 7px;background:#f7f5f2;border-radius:999px}
.workshop-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}
.workshop-panel{padding:18px;margin:12px 0;background:white;border:1px solid var(--line);border-radius:18px}
.workshop-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.workshop-stats-grid div{padding:12px;background:#f7f5f2;border-radius:12px}
.workshop-stats-grid strong,.workshop-stats-grid span{display:block}
.workshop-stats-grid strong{font-size:22px}.workshop-stats-grid span{font-size:11px;color:var(--muted)}
.workshop-note{color:var(--muted);font-size:13px}
.workshop-issues{margin:0;padding-left:20px}
.workshop-json{
  max-height:440px;overflow:auto;padding:14px;background:#1f2328;color:#f2f4f6;border-radius:14px;
  font-size:12px;line-height:1.45;white-space:pre-wrap;word-break:break-word
}
.preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.preview-card{padding:15px;border:1px solid var(--line);border-radius:15px;background:#fbfaf8}
.preview-card h3{font-size:17px;margin:4px 0 8px}.preview-card p{margin:4px 0;color:var(--muted)}
.preview-id{font-size:10px;font-weight:900;color:var(--muted)}
.preview-choices{display:grid;gap:6px;margin:10px 0}
.preview-choice{padding:8px 10px;background:white;border:1px solid var(--line);border-radius:10px;font-size:13px}
.preview-choice.correct{border-color:#8cc7a3;background:#eef9f2}
.empty-state{grid-column:1/-1;padding:32px;text-align:center;background:white;border:1px dashed var(--line);border-radius:18px}

@media(max-width:800px){
  .workshop-toolbar{grid-template-columns:1fr}
  .workshop-list,.workshop-detail-grid,.preview-grid{grid-template-columns:1fr}
  .workshop-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:420px){
  .workshop-stats-grid{grid-template-columns:1fr}
}


/* Batch 28 — Creekside universe integration */
.question-case-context{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:9px;
  font-size:11px;color:var(--muted)
}
.question-case-context>span:first-child{
  padding:4px 7px;border-radius:999px;background:#eef5e9;color:#486344;
  text-transform:uppercase;letter-spacing:.06em;font-weight:900
}
.question-case-context strong{color:var(--ink)}


/* Batch 31 — Creekside journey and case-flow */
.journey-strip{
  margin:18px 0 20px;padding:16px 18px;border:1px solid var(--line);
  border-radius:18px;background:var(--paper-2)
}
.journey-strip>div{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.journey-strip strong{font-size:15px}
.journey-strip p{margin:9px 0 8px;line-height:1.55}
.journey-place,.journey-return,.chapter-place,.district-visit-note,.city-next-stop{
  font-size:11px;font-weight:850;letter-spacing:.035em
}
.journey-place{padding:5px 8px;border-radius:999px;background:#eef5e9;color:#486344}
.journey-return,.district-visit-note,.city-next-stop{color:var(--muted)}
.chapter-place{display:block;color:var(--muted);margin-top:5px}
.chapter-card.journey-complete{box-shadow:inset 0 0 0 1px rgba(72,99,68,.22)}
.journey-result-card{
  text-align:left;margin:18px auto;padding:16px 18px;max-width:620px;
  border:1px solid var(--line);border-radius:18px;background:var(--paper-2)
}
.journey-result-card>span{
  display:block;font-size:10px;font-weight:900;text-transform:uppercase;
  letter-spacing:.08em;color:var(--muted);margin-bottom:5px
}
.journey-result-card strong{display:block;font-size:17px}
.journey-result-card p{margin:8px 0;line-height:1.5}
.journey-result-card small{color:var(--muted);font-weight:700}
.next-stop-btn{order:-1}
.city-next-stop{display:block;margin-top:7px}
.district-visit-note{display:block;margin-top:7px}
@media(max-width:640px){
  .journey-strip{padding:14px}
  .journey-result-card{padding:14px}
}


/* Batch 32 — recurring session threads */
.mini-arc-card{
  max-width:760px;margin:10px auto 12px;padding:12px 15px;
  border:1px solid var(--line);border-radius:16px;background:#f6f2e8;
}
.mini-arc-card span{
  display:block;font-size:10px;font-weight:900;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)
}
.mini-arc-card strong{display:block;margin-top:3px;font-size:14px}
.mini-arc-card p{margin:5px 0 0;font-size:13px;line-height:1.4;color:var(--muted)}


/* Batch 33 — contextual question flow and return navigation */
.case-context-copy{display:grid;gap:2px}
.case-context-copy strong{font-size:12px;color:var(--ink)}
.case-context-copy small{font-size:11px;line-height:1.35;color:var(--muted);font-weight:600}
.location-transition{
  max-width:760px;margin:9px auto 11px;padding:9px 13px;
  border-left:3px solid #9bad8e;background:#f7f8f4;border-radius:0 12px 12px 0
}
.location-transition span{
  display:block;font-size:10px;font-weight:900;letter-spacing:.07em;
  text-transform:uppercase;color:#52694d
}
.location-transition p{margin:3px 0 0;font-size:12px;line-height:1.35;color:var(--muted)}
@media(max-width:640px){
  .exit-cases{max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .question-case-context{align-items:flex-start}
}


/* Batch 35 — illustration architecture */
.character-art-wrap{
  width:112px;height:138px;display:flex;align-items:flex-end;justify-content:center;
  overflow:hidden;border-radius:16px;background:#f5efe4;flex:0 0 auto
}
.character-master-card{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.character-hero-art{
  width:150px;height:190px;border-radius:20px;overflow:hidden;background:#f5efe4;
  display:flex;align-items:flex-end;justify-content:center;flex:0 0 auto
}
.character-master-hero{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.asset-fallback{font-size:44px;align-self:center}
.asset-fallback-hidden{display:none}
.journey-strip{position:relative}
.journey-character-art{
  width:64px;height:76px;overflow:hidden;border-radius:12px;background:#f5efe4;
  flex:0 0 auto;align-self:center
}
.journey-character-master{width:100%;height:100%;object-fit:contain;object-position:center bottom}
@media(max-width:640px){
  .character-art-wrap{width:88px;height:112px}
  .character-hero-art{width:112px;height:142px}
  .journey-character-art{width:52px;height:64px}
}
.district-hero{align-items:stretch}
.question-case-context{display:grid;grid-template-columns:72px auto 1fr;align-items:center;gap:10px}
@media(max-width:640px){
  .district-hero{display:block}
  .question-case-context{grid-template-columns:58px auto 1fr}
}


/* Batch 37 — chapter heroes and question illustration pilot */
.chapter-hero-figure{
  margin:14px 0 12px;border-radius:20px;overflow:hidden;background:#eee7da;
  aspect-ratio:16/7;max-height:340px
}
.chapter-hero-img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:640px){
  .chapter-hero-figure{aspect-ratio:16/7.5;margin:10px 0}
}
.production-character{
  position:absolute;left:10px;bottom:0;width:82px;height:116px;overflow:hidden;
  border-radius:12px 12px 0 0;background:rgba(250,246,237,.86)
}
.production-character-img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:640px){
  .production-character{width:62px;height:88px}
}
.story-question-art{margin:12px 0 15px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#f7f2e8}
.story-question-art figcaption,.casefile-completion-art figcaption{padding:7px 11px;font-size:11px;color:var(--muted);font-weight:650}
.casefile-completion-art{max-width:620px;margin:16px auto;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#f7f2e8}
@media(max-width:640px){
  .casefile-completion-art img{height:130px}
}


/* Batch 41 — transition, reward, and progress illustration polish */
.location-transition{position:relative;overflow:hidden;min-height:72px;padding-right:132px}
.achievement-icon{width:62px;min-width:62px}
.achievement-badge-img{width:100%;height:100%;object-fit:cover;display:block}
.progress-big{position:relative;overflow:hidden;min-height:112px;padding-top:42px}
.progress-big strong,.progress-big span{position:relative;z-index:1}
.progress-row-art{display:inline-flex;width:52px;height:42px;border-radius:9px;overflow:hidden;background:#eee7da;align-items:center;justify-content:center}
.progress-character-art{width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block}
@media(max-width:640px){
  .location-transition{padding-right:90px}
  .achievement-icon{width:50px;min-width:50px}
  .progress-big{min-height:96px;padding-top:34px}
  .progress-row-art{width:44px;height:36px}
}


/* Batch 42 — final release hardening */
img{max-width:100%}
.question-card,.lesson-card,.results-card,.casefile-intro-card,.progress-page,.city-page{min-width:0}
.case-context-copy,.choice-text,.journey-strip,.mini-arc-card,.location-transition{overflow-wrap:anywhere}
@media(max-width:640px){
  button,.primary-btn,.secondary-btn,.back-btn,.choice{min-height:44px}
  .hero-actions,.progress-head-actions{gap:8px}
}
.question-card,.case-card { background-image:none !important; }


/* Batch 55 — compact character-first chapter framing */
.chapter-character-frame{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:14px 16px;
}
.chapter-character-frame .journey-character-art{
  width:96px;
  height:112px;
  min-height:0;
  align-self:end;
}
.chapter-character-frame .journey-character-master{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
}
.chapter-frame-copy{min-width:0}
.chapter-frame-copy p{margin:5px 0 7px}
.chapter-frame-meta{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:3px;
}
.chapter-frame-motif{
  display:inline-grid;
  place-items:center;
  min-width:28px;
  height:28px;
  border-radius:9px;
  background:rgba(255,255,255,.72);
  font-weight:800;
}
@media (max-width:640px){
  .chapter-character-frame{
    grid-template-columns:72px minmax(0,1fr);
    gap:10px;
    padding:10px 12px;
  }
  .chapter-character-frame .journey-character-art{
    width:72px;
    height:88px;
  }
  .chapter-frame-copy p{
    font-size:.92rem;
    line-height:1.32;
  }
}


/* Batch 56 — selective Case File narrative framing */
.casefile-character-frame{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:12px;
  align-items:center;
  min-width:0;
}
.casefile-character-frame.compact{
  grid-template-columns:62px minmax(0,1fr);
  gap:9px;
}
.casefile-character-master-wrap{
  width:88px;
  height:104px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
}
.casefile-character-frame.compact .casefile-character-master-wrap{
  width:62px;
  height:72px;
}
.casefile-character-master{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
  display:block;
}
.casefile-character-copy{min-width:0}
.casefile-character-copy strong,
.casefile-character-copy small{display:block}
.casefile-character-copy small{margin-top:2px}
.casefile-frame-meta{
  display:flex;
  gap:6px;
  align-items:center;
  font-size:.78rem;
  margin-bottom:2px;
}
.casefile-frame-icon{font-size:1.05rem}
.casefile-story-beat{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.72);
}
.casefile-beat-note{
  margin:7px 0 0;
  font-size:.82rem;
  line-height:1.3;
  opacity:.78;
}
@media(max-width:640px){
  .casefile-character-frame{grid-template-columns:70px minmax(0,1fr);gap:9px}
  .casefile-character-master-wrap{width:70px;height:84px}
  .casefile-character-frame.compact{grid-template-columns:54px minmax(0,1fr)}
  .casefile-character-frame.compact .casefile-character-master-wrap{width:54px;height:64px}
  .casefile-story-beat{padding:8px 10px;margin:8px 0 10px}
}
.district-identity-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin:8px 0 2px;
}
.district-motif,
.progress-summary-motif{
  display:inline-grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:10px;
  background:rgba(255,255,255,.74);
  font-weight:800;
}
.district-hero-lite{
  grid-template-columns:auto minmax(0,1fr) auto;
}
.district-hero-motif .district-motif{
  width:54px;
  height:54px;
  border-radius:16px;
  font-size:1.35rem;
}
.progress-case-character{
  width:44px;
  height:52px;
  object-fit:contain;
  object-position:center bottom;
}
.progress-summary-motif{
  margin-bottom:4px;
}
.achievement-icon{
  font-weight:800;
}
.location-transition{
  background-image:none !important;
}
@media(max-width:640px){
  .district-hero-lite{grid-template-columns:44px minmax(0,1fr)}
  .district-hero-lite > .primary-btn{grid-column:1/-1}
  .district-hero-motif .district-motif{width:44px;height:44px;border-radius:13px}
}
.question-case-context{
  min-height:0;
}
.question-card .passage{
  margin-top:10px;
}

/* Batch 59 — final character-first runtime visual policy */
.casefile-completion-note{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px auto;font-weight:700}
.location-transition{background-image:none !important}

/* Contextual cast: show the people named in this case, never a random visitor. */
.question-case-context{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:12px;
  margin:0 0 14px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:linear-gradient(135deg,#f8f5ff,#eef8f4);
}
.scenario-reading.has-cast{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px}
.scenario-reading .passage{min-width:0}
.question-scenario-art{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:12px;max-width:300px;margin:0 0 16px}
.scenario-actor{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;margin:0;max-width:100%}
.scenario-actor figcaption{font-size:12px;font-weight:750;color:var(--muted)}
.scenario-character{object-fit:contain;object-position:center bottom}
.creekside-character{animation:none!important;transition:none!important;transform:none!important}
@media(max-width:640px){.scenario-reading.has-cast{gap:10px;grid-template-columns:minmax(0,1fr) 80px}.question-scenario-art{gap:10px;max-width:80px}.scenario-character.character-md{width:80px;max-height:115px}}
.question-cast-art{display:flex;align-items:flex-end;min-width:56px;height:62px;padding-left:4px}
.question-cast-portrait{display:flex;align-items:flex-end;justify-content:center;width:48px;height:62px;overflow:hidden;border:2px solid #fff;border-radius:13px;background:#f5efe4;box-shadow:0 3px 8px rgba(52,42,68,.12)}
.question-cast-portrait + .question-cast-portrait{margin-left:-15px}
.question-cast-image{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.question-context-label{display:block;margin-bottom:2px;font-size:10px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#5d7564}
.question-case-context .case-context-copy{min-width:0}
.question-case-context .case-context-copy strong{display:block;font-size:15px;overflow-wrap:anywhere}
.question-case-context .case-context-copy small{display:block;margin-top:2px;font-size:11px;line-height:1.35}
@media(max-width:640px){
  .question-case-context{gap:9px;padding:9px 10px}
  .question-cast-art{height:54px;min-width:46px}
  .question-cast-portrait{width:42px;height:54px;border-radius:11px}
  .question-cast-portrait + .question-cast-portrait{margin-left:-13px}
  .question-case-context .case-context-copy strong{font-size:14px}
}


/* Batch 62 — teach each new problem type and explain every miss */
.new-type-help{
  margin:10px 0 14px;
  padding:12px 14px;
  border:1px solid var(--line, #d8d8d8);
  border-radius:14px;
  background:rgba(255,255,255,.72);
}
.new-type-help > span{
  display:block;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  opacity:.72;
}
.new-type-help > strong{display:block;margin-top:3px}
.new-type-help p{margin:5px 0 0;line-height:1.45}
.feedback.incorrect p{line-height:1.5}
.picked-answer-note{opacity:.82}


/* Batch 67 — responsive desktop/mobile polish */
html{
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
body{
  overflow-x:hidden;
  overscroll-behavior-y:none;
}
img,svg{max-width:100%}
button,input,select,textarea{max-width:100%}
button{user-select:none}
#main{
  width:min(1120px,calc(100% - 32px));
  padding-top:clamp(20px,3vw,38px);
}
.hero{
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.8fr);
  gap:clamp(18px,2.5vw,34px);
}
.hero-copy,.hero-panel,.lesson-card,.question-card,.results-card,
.chapter-card,.smart-review-banner,.mastery-hero,.daily-card,
.character-card,.casefile-card,.district-card,.progress-big,
.achievement,.workshop-record{
  min-width:0;
}
.hero-copy{padding:clamp(30px,4vw,48px)}
.hero h1{font-size:clamp(52px,6vw,80px)}
.tagline{max-width:38rem}
.section-head>*{min-width:0}
.section-head p{max-width:52rem;line-height:1.5}
.section-head .back-btn{flex:0 0 auto}

.smart-review-banner{
  align-items:flex-start;
}
.smart-review-actions{
  flex:1 1 560px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.smart-review-actions button{
  flex:1 1 132px;
  min-width:0;
  font-size:14px;
  padding-inline:14px;
}

.chapter-card,.district-card,.character-card,.casefile-card,
.achievement,.progress-big,.mastery-card,.workshop-record{
  overflow-wrap:anywhere;
}
.chapter-card h2,.district-card h2,.character-card h2,.casefile-card h2{
  text-wrap:balance;
}
.chapter-grid{
  align-items:stretch;
}
.chapter-card{
  height:100%;
}
.chapter-meta{
  align-items:center;
}
.chapter-meta span{
  max-width:100%;
}

.question-wrap{
  max-width:900px;
}
.question-card{
  overflow:visible;
}
.question-case-context,.case-context-copy{
  min-width:0;
}
.question-card .passage,
.question-card .prompt,
.choice-text,
.feedback,
.hint-box,
.new-type-help{
  overflow-wrap:anywhere;
}
.choice{
  min-width:0;
}
.choice-text{
  min-width:0;
}
#answerFeedback,.hint-box{
  scroll-margin-top:96px;
}
.question-actions button{
  white-space:normal;
}
.feedback p + p{
  margin-top:9px;
}

.character-grid,.casefile-grid,.city-map-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.character-card,.casefile-card{
  align-content:start;
}
.character-card>div,.casefile-card>div{
  min-width:0;
}
.character-hero,.world-hero,.casefiles-hero,.district-hero-lite{
  min-width:0;
}
.character-hero>*,
.world-hero>*,
.casefiles-hero>*,
.district-hero-lite>*{
  min-width:0;
}

.progress-summary-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.progress-section-head>*{
  min-width:0;
}
.chapter-progress-row,.world-progress-row,.casefile-progress-row{
  min-width:0;
}
.chapter-progress-row strong,.chapter-progress-row small,
.world-progress-row strong,.world-progress-row small,
.casefile-progress-row strong,.casefile-progress-row small{
  min-width:0;
  overflow-wrap:anywhere;
}
.skill-table-wrap{
  max-width:100%;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.skill-table{
  min-width:680px;
}

.workshop-toolbar{
  grid-template-columns:minmax(220px,1fr) minmax(180px,260px) auto;
}
.workshop-toolbar input,.workshop-toolbar select{
  min-width:0;
}
.workshop-list{
  align-items:start;
}
.workshop-json{
  max-width:100%;
  overflow-wrap:anywhere;
}

@media(min-width:1200px){
  .hero{min-height:540px}
  .chapter-page{max-width:1080px}
  .chapter-grid{gap:18px}
  .question-wrap{max-width:920px}
  .question-card{padding:36px}
  .passage{font-size:21px}
  .prompt{font-size:28px}
  .choice{font-size:18px}
}

@media(min-width:761px) and (max-width:1024px){
  #main{width:min(100% - 28px,940px)}
  .hero{grid-template-columns:minmax(0,1fr) minmax(260px,.7fr)}
  .hero-copy{padding:32px}
  .hero h1{font-size:clamp(48px,7vw,68px)}
  .smart-review-banner{
    display:grid;
    grid-template-columns:1fr;
  }
  .smart-review-actions{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
  }
  .smart-review-actions button{width:100%}
  .question-card{padding:26px}
  .workshop-toolbar{
    grid-template-columns:minmax(0,1fr) minmax(180px,240px);
  }
  .workshop-check{grid-column:1/-1}
  .workshop-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  html{scroll-padding-top:74px}
  .hero{grid-template-columns:1fr;min-height:auto}
  #main{
    width:min(100% - 16px,680px);
    padding-top:12px;
    padding-bottom:max(76px,calc(56px + env(safe-area-inset-bottom)));
  }
  .suite-bar{
    min-height:58px;
    padding:6px 10px;
    padding-top:max(6px,env(safe-area-inset-top));
    gap:7px;
  }
  .suite-home{min-width:0}
  .suite-home strong{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .tiny-btn{
    min-height:44px;
    flex:0 0 auto;
  }
  .hero-copy{
    padding:22px 20px;
    border-radius:24px;
  }
  .hero h1{
    font-size:clamp(42px,13vw,58px);
    margin-top:9px;
  }
  .tagline{
    font-size:17px;
    line-height:1.45;
  }
  .home-progress-strip{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }
  .home-progress-strip span{
    min-width:0;
    padding:7px 5px;
    text-align:center;
    font-size:11px;
  }
  .home-progress-strip strong{
    display:block;
    font-size:16px;
  }
  .build-note{
    margin-top:14px;
    font-size:13px;
  }

  .section-head{
    gap:10px;
    margin-bottom:16px;
  }
  .section-head h1{
    font-size:clamp(28px,9vw,34px);
    line-height:1.1;
  }
  .section-head .back-btn{
    align-self:flex-start;
  }

  .smart-review-banner{
    margin:12px 0 16px;
    padding:15px;
    gap:12px;
  }
  .smart-review-banner h2{font-size:21px}
  .smart-review-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .smart-review-actions button{
    width:100%;
    min-height:48px;
    font-size:13px;
    padding:10px 8px;
  }
  .smart-review-actions .primary-btn{
    grid-column:1/-1;
  }

  .chapter-card{
    padding:17px;
    border-radius:20px;
  }
  .chapter-card p{
    line-height:1.4;
  }
  .chapter-meta{
    gap:6px;
  }

  .lesson-card{
    padding:18px;
    border-radius:22px;
  }
  .lesson-card .hero-actions{
    gap:8px;
  }

  .play-topbar{
    top:calc(58px + env(safe-area-inset-top));
  }
  .question-card{
    padding:16px;
    border-radius:22px;
  }
  .question-case-context{
    margin-bottom:8px;
  }
  .new-type-help{
    padding:10px 11px;
  }
  .passage{
    font-size:16.5px;
    line-height:1.42;
    padding:13px;
  }
  .prompt{
    font-size:clamp(20px,6vw,23px);
  }
  .choice{
    min-height:58px;
    padding:13px 12px;
    font-size:16px;
  }
  .feedback,.hint-box{
    padding:14px;
  }
  .question-actions{
    margin-left:-16px;
    margin-right:-16px;
    margin-bottom:-16px;
    padding-left:16px;
    padding-right:16px;
  }
  #answerFeedback,.hint-box{
    scroll-margin-top:86px;
    scroll-margin-bottom:180px;
  }

  .character-grid,.casefile-grid,.city-map-grid,
  .achievement-grid,.chapter-progress-list,
  .world-progress-list,.casefile-progress-list,
  .mastery-grid,.workshop-list{
    grid-template-columns:1fr;
  }
  .character-card,.casefile-card,.district-card{
    border-radius:18px;
    padding:16px;
  }
  .character-card h2,.casefile-card h2,.district-card h2{
    font-size:21px;
  }
  .casefile-intro-card{
    margin-top:8px;
    border-radius:22px;
  }
  .casefile-rules{
    gap:7px;
  }
  .district-card>p{min-height:0}

  .daily-card{
    margin:12px 0;
    border-radius:22px;
  }
  .progress-summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
  }
  .progress-big{
    padding:13px 6px;
  }
  .progress-big strong{font-size:27px}
  .progress-section{
    margin:22px 0;
  }
  .progress-section-head{
    align-items:flex-start;
  }
  .progress-section-head h2{font-size:21px}
  .progress-section-head span{
    font-size:12px;
    text-align:right;
  }
  .chapter-progress-row,.world-progress-row,.casefile-progress-row{
    grid-template-columns:28px minmax(0,1fr);
    align-items:start;
  }
  .chapter-progress-row small,.world-progress-row small,.casefile-progress-row small{
    grid-column:2;
  }
  .achievement{
    padding:14px;
  }

  .workshop-toolbar{
    grid-template-columns:1fr;
    padding:10px;
  }
  .workshop-toolbar input,.workshop-toolbar select{
    min-height:48px;
    font-size:16px; /* Prevent iOS focus zoom. */
  }
  .workshop-check{
    min-height:44px;
    white-space:normal;
  }
  .workshop-detail-grid{
    grid-template-columns:1fr;
  }
  .workshop-stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .workshop-json{
    max-height:320px;
    font-size:11px;
  }

  .parent-summary-grid,.trend-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .parent-section{
    padding:14px;
  }
  .parent-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .parent-actions button{width:100%}
}

@media(max-width:420px){
  .smart-review-actions{
    grid-template-columns:1fr;
  }
  .smart-review-actions .primary-btn{
    grid-column:auto;
  }
  .home-progress-strip{
    grid-template-columns:1fr 1fr 1fr;
  }
  .progress-summary-grid,
  .parent-summary-grid,
  .trend-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:340px){
  #main{width:calc(100% - 12px)}
  .suite-bar{padding-inline:6px}
  .suite-arrow{font-size:18px}
  .suite-home strong{font-size:12px}
  .tiny-btn{
    padding:7px 8px;
    font-size:11px;
  }
  .hero-copy{padding:18px 15px}
  .hero h1{font-size:40px}
  .home-progress-strip span{font-size:10px}
  .question-card{padding:13px}
  .question-actions{
    margin-left:-13px;
    margin-right:-13px;
    margin-bottom:-13px;
    padding-left:13px;
    padding-right:13px;
  }
  .choice{
    padding:11px 10px;
    gap:9px;
  }
  .choice-letter{
    width:30px;
    height:30px;
    min-width:30px;
  }
}

@media(max-height:520px) and (min-width:600px){
  .suite-bar{
    min-height:50px;
    padding-top:4px;
    padding-bottom:4px;
  }
  #main{
    padding-top:10px;
    padding-bottom:28px;
  }
  .play-topbar{
    position:static;
  }
  .question-card{
    padding:20px;
  }
  .question-actions{
    margin-top:14px;
  }
}

@media(hover:hover) and (pointer:fine){
  .chapter-card:hover,.district-chapter-btn:hover{
    transform:translateY(-2px);
  }
}