html{background:#fffdf7}html[data-mode=dark]{background:#071525}*{box-sizing:border-box}body{min-height:100vh;margin:0;color:var(--tl-ink);background:radial-gradient(75rem 52rem at -10% -15%,rgba(112,76,37,.22),transparent 56%),radial-gradient(56rem 42rem at 108% 0%,rgba(164,59,46,.18),transparent 57%),linear-gradient(160deg,#fffdf7 0%,#f5edde 54%,#d9e1dc 100%) fixed;font:var(--tl-text-body)/1.6 var(--tl-font-ui)}html[data-mode=dark] body{background:radial-gradient(66rem 46rem at 4% -8%,rgba(28,108,122,.40),transparent 55%),radial-gradient(48rem 38rem at 106% 8%,rgba(165,59,46,.34),transparent 56%),linear-gradient(150deg,#071525 0%,#102f42 47%,#17192b 100%) fixed}.shell{width:min(860px,calc(100% - 28px));margin:auto;padding:26px 0 72px}.top{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;min-height:var(--tl-control-min);color:inherit;font-weight:700;text-decoration:none}button,select{min-height:var(--tl-control-min);font:inherit;border:1px solid var(--tl-hair);border-radius:var(--tl-radius-control);background:var(--tl-glass);color:var(--tl-ink);padding:9px 13px}button{cursor:pointer}.surface{margin-top:18px;overflow:hidden;border:1px solid var(--tl-glass-border);border-radius:var(--tl-radius-surface);background:var(--tl-glass);box-shadow:var(--tl-shadow);backdrop-filter:blur(var(--tl-blur))}.head,.work{padding:clamp(22px,6vw,54px)}.head{border-bottom:1px solid var(--tl-hair)}.head h1{margin:8px 0;font:400 var(--tl-text-title)/1 var(--tl-font-shodo)}.head p{margin:0;color:var(--tl-ink-soft);font-size:18px}.eyebrow,.track,.picker span{color:var(--tl-sepia);font:600 var(--tl-text-meta)/1.4 var(--tl-font-mono);letter-spacing:.08em}.picker{display:grid;gap:4px;margin-top:22px;width:min(100%,360px)}.picker select{width:100%;min-width:0}.scope{margin:0 0 18px;color:var(--tl-ink-soft);font-size:14px}.track{margin:0}.bar{height:4px;margin:8px 0 26px;background:var(--tl-hair)}.bar i{display:block;height:100%;background:var(--tl-seal)}.cue{display:grid;gap:8px;margin-bottom:26px;padding-bottom:18px;border-bottom:1px solid var(--tl-hair)}.cue p{margin:0}.cue-ja{font:500 clamp(18px,3vw,24px)/1.55 var(--tl-font-jp)}.cue-row{display:grid;grid-template-columns:96px 1fr;gap:8px;padding-top:8px;border-top:1px solid var(--tl-hair)}.cue-row b{color:var(--tl-sepia);font:600 var(--tl-text-meta)/1.5 var(--tl-font-mono);letter-spacing:.06em;text-transform:uppercase}.question{margin:0;font:600 clamp(28px,6vw,43px)/1.25 var(--tl-font-jp)}.choices{display:grid;gap:8px;margin-top:18px}.choice{min-height:52px;text-align:left}.feedback{margin-top:18px;padding:12px;border-left:4px solid var(--tl-seal);background:color-mix(in srgb,var(--tl-paper-soft) 88%,transparent)}.feedback.ok{border-color:var(--tl-success)}.actions{display:flex;justify-content:space-between;gap:8px;margin-top:24px}.actions button[hidden]{display:none}.recall{margin-top:38px;padding-top:18px;border-top:1px solid var(--tl-hair);color:var(--tl-ink-soft)}body #th-fab{position:absolute!important;top:14px!important;right:14px!important;bottom:auto!important}#th-drawer .th-acct a:not(.th-logout){display:flex!important;align-items:center;min-height:var(--tl-control-min)!important}button:focus-visible,select:focus-visible{outline:3px solid var(--tl-focus);outline-offset:2px}@media(max-width:480px){.top{align-items:stretch;flex-direction:column}.picker{width:100%}.cue-row{grid-template-columns:88px 1fr}.actions button{max-width:43%}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Shared lesson selection stays compact inside an active activity. */
body[data-starter-focus] .shell{max-width:960px;padding:12px}
body[data-starter-focus] .top{display:flex;align-items:center;justify-content:space-between;padding:0 0 12px;gap:12px}
body[data-starter-focus] .top>button{width:auto;min-height:44px}
body[data-starter-focus] .head{padding:16px 18px 8px}
body[data-starter-focus] .head h1{font:650 23px/1.4 var(--tl-font-ui);margin:0 0 8px}
body[data-starter-focus] .head h1::after{display:none}
body[data-starter-focus] .picker{margin:0}
body[data-starter-focus] .picker>span{display:none}
body[data-starter-focus] #lesson{width:100%;min-height:44px;font:16px/1.5 var(--tl-font-ui)}
body[data-starter-focus] .work{padding:8px 18px 18px}
body[data-starter-focus] #scope:empty{display:none}
body[data-starter-focus] #progress{margin:0 0 8px;font-size:13px}
body[data-starter-focus] .cue{padding:12px 0;margin:0;border:0;background:transparent;box-shadow:none}
body[data-starter-focus] .cue>.eyebrow{display:none}
body[data-starter-focus] .cue p{margin:8px 0;font-size:16px;line-height:1.7}
body[data-starter-focus] .cue-ja{font:500 22px/1.8 var(--tl-font-jp)}
body[data-starter-focus] #starterSettings{max-width:min(92vw,640px);max-height:85vh;overflow:auto;padding:18px;background:var(--tl-glass-strong);color:var(--tl-ink);border:1px solid var(--tl-hair);border-radius:var(--tl-radius-panel)}
body[data-starter-focus] #starterSettings button{min-height:44px}

body[data-starter-focus] .bar{margin-bottom:var(--tl-space-2)}

/* Context-reviewed reading layer belongs only to the public JFT starter. */
#stage[data-starter-lesson="jft-basic-work-clarification-01"] ruby{ruby-position:over}
#stage[data-starter-lesson="jft-basic-work-clarification-01"] rt{font-size:11px;line-height:1.1;font-weight:400}
#stage[data-starter-lesson="jft-basic-work-clarification-01"][data-starter-readings="off"] rt{display:none}
