/* Layout: tablet-first kiosk for students (keypad → passage | questions), tabbed desk for the teacher. Paper + ink + highlighter. */
:root{
  --bg:#F7F5F0; --surface:#ffffff; --sunk:#EFEDE8; --ink:#1E2430; --muted:#5B6370; --line:#E5E1DA;
  --accent:#1F5F5B; --accent-ink:#ffffff; --accent-soft:#E2ECEA; --band-main:#1F5F5B;
  --paper:#FBF8F1; --paper-ink:#2A2723;
  --hl:#FCEFB4; --hl-strong:#F7DF7A;
  --good:#2F6B47; --good-soft:#E3EFE6; --bad:#C2410C; --bad-soft:#FBEADF; --warn:#9A5B12; --warn-soft:#F7ECD9;
  --a-voc:#4E7FA8; --a-fact:#1F5F5B; --a-inf:#B07A2A; --a-crit:#7A5A94;
  --f-display:"Hahmlet","Gowun Batang","Nanum Myeongjo",serif;
  --f-kid:"Jua","IBM Plex Sans KR",sans-serif;
  --f-ui:"IBM Plex Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --f-num:"IBM Plex Mono",ui-monospace,monospace;
  --r:12px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111a1b; --surface:#182325; --sunk:#0d1415; --ink:#e4ecea; --muted:#98a9a7; --line:#2b3a3c;
  --accent:#6cc0b4; --accent-ink:#0c1a19; --accent-soft:#1c3533;
  --hl:#4d4415; --hl-strong:#6b5c12;
  --good:#6cc491; --good-soft:#18342a; --bad:#ec8a80; --bad-soft:#3a1f1c; --warn:#e3b35c; --warn-soft:#352a14;
  --a-voc:#7fa9dc; --a-fact:#6cc0b4; --a-inf:#e0a650; --a-crit:#c592d6; --band-main:#6cc0b4; --paper:#1d2628; --paper-ink:#e4ecea; --bad:#f0a070; --bad-soft:#3a2418; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111a1b; --surface:#182325; --sunk:#0d1415; --ink:#e4ecea; --muted:#98a9a7; --line:#2b3a3c;
  --accent:#6cc0b4; --accent-ink:#0c1a19; --accent-soft:#1c3533;
  --hl:#4d4415; --hl-strong:#6b5c12;
  --good:#6cc491; --good-soft:#18342a; --bad:#ec8a80; --bad-soft:#3a1f1c; --warn:#e3b35c; --warn-soft:#352a14;
  --a-voc:#7fa9dc; --a-fact:#6cc0b4; --a-inf:#e0a650; --a-crit:#c592d6; --band-main:#6cc0b4; --paper:#1d2628; --paper-ink:#e4ecea; --bad:#f0a070; --bad-soft:#3a2418; color-scheme:dark}
*{box-sizing:border-box}
html,body{min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-ui);font-size:15px;line-height:1.55;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none}
html,body{touch-action:manipulation}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
h1,h2,h3{text-wrap:balance;margin:0}
.num{font-family:var(--f-num);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.wrap{max-width:1180px;margin:0 auto;padding-inline:16px}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:9px 14px;font-weight:600;min-height:40px}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--bad)}
.btn.sm{padding:5px 10px;min-height:32px;font-size:13px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:600;background:var(--sunk);color:var(--muted);white-space:nowrap}
.chip.good{background:var(--good-soft);color:var(--good)}
.chip.bad{background:var(--bad-soft);color:var(--bad)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.acc{background:var(--accent-soft);color:var(--accent)}
.eyebrow{font-size:12px;letter-spacing:.08em;color:var(--muted);font-weight:600;margin:0}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field label{font-size:12px;font-weight:600;color:var(--muted)}
.inp{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 10px;min-height:40px;width:100%}
textarea.inp{min-height:80px;resize:vertical;line-height:1.6}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:600;z-index:50;max-width:calc(100% - 32px)}
.banner{background:var(--warn-soft);color:var(--warn);padding:8px 16px;font-size:13px;text-align:center}

/* ---------- student kiosk ---------- */
.kiosk{min-height:100vh;display:grid;place-items:center;padding:24px 16px;position:relative}
.kiosk-card{width:100%;max-width:420px;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.kiosk-card h1{font-family:var(--f-display);font-size:34px;font-weight:700}
.pin-dots{display:flex;gap:14px}
.pin-dots span{width:22px;height:22px;border-radius:50%;border:2px solid var(--accent)}
.pin-dots span.on{background:var(--accent)}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%}
.key{height:78px;border-radius:14px;border:1px solid var(--line);background:var(--surface);font-family:var(--f-num);font-size:32px;font-weight:600;box-shadow:0 2px 0 var(--line)}
.key:active{transform:translateY(2px);box-shadow:none}
.key.fn{font-family:var(--f-ui);font-size:17px;color:var(--muted)}
.kiosk-msg{min-height:24px;color:var(--bad);font-weight:600}
.teacher-link{position:absolute;top:12px;right:16px;font-size:13px}
.confirm-name{font-family:var(--f-display);font-size:44px;font-weight:700;color:var(--accent)}
.big-actions{display:flex;gap:12px;width:100%}
.big-actions .btn{flex:1;min-height:64px;font-size:19px;border-radius:14px}
.shake{animation:shake .35s}
@keyframes shake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
@media (prefers-reduced-motion:reduce){.shake{animation:none}}

/* solve */
.solve{display:flex;flex-direction:column;height:100vh}
.solve-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--surface)}
.solve-top .who{font-weight:700;font-size:17px}
.solve-top .ttl{font-family:var(--f-display);font-size:18px;font-weight:700;min-width:0}
.solve-top .sp{flex:1}
.solve-grid{flex:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0}
.passage{overflow:auto;padding:24px 28px;border-right:1px solid var(--line);background:var(--surface)}
.passage h2{font-family:var(--f-display);font-size:26px;margin-bottom:6px}
.passage .meta{margin-bottom:18px;display:flex;gap:6px;flex-wrap:wrap}
.para{display:grid;grid-template-columns:28px 1fr;gap:8px;margin:0 0 14px;font-family:var(--f-display);font-size:19px;line-height:1.9;max-width:62ch}
.para .pn{font-family:var(--f-num);font-size:12px;color:var(--muted);padding-top:8px;text-align:right}
.para.hl p{background:linear-gradient(transparent 8%,var(--hl) 8%);box-shadow:0 0 0 4px var(--hl);border-radius:2px}
.para.hl2 p{background:var(--hl-strong);box-shadow:0 0 0 4px var(--hl-strong)}
.para p{margin:0;text-align:justify}
.low .para{font-size:22px;line-height:2}
.qs{overflow:auto;padding:20px 20px 40px;display:flex;flex-direction:column;gap:14px}
.qcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.qcard.is-wrong{border-color:var(--bad)}
.qcard.is-ok{border-color:var(--good)}
.qhead{display:flex;gap:10px;align-items:baseline;margin-bottom:10px}
.qno{font-family:var(--f-num);font-weight:600;color:var(--accent);font-size:17px}
.qtext{font-weight:600;font-size:17px;line-height:1.5}
.low .qtext{font-size:19px}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{display:flex;gap:10px;align-items:flex-start;text-align:left;width:100%;border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:12px 14px;min-height:52px;font-size:16px;line-height:1.45}
.low .opt{font-size:18px;min-height:58px}
.opt .c{font-size:20px;line-height:1.1;color:var(--muted)}
.opt.sel{border-color:var(--accent);background:var(--accent-soft);font-weight:600}
.opt.sel .c{color:var(--accent)}
/* 독서 태도·취향 설문 (입학 상담 테스트): 척도 네 칸 한 줄, 보기는 두 줄로 */
.sv-scale{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.sv-scale .opt{align-items:center;padding:10px 6px}
.sv-opts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.sv-opts .opt{align-items:center}
@media (max-width:640px){.sv-scale{grid-template-columns:repeat(2,1fr)}.sv-opts{grid-template-columns:1fr}}
.opt.x{opacity:.45;text-decoration:line-through}
.opt:disabled{cursor:default}
.feedback{margin-top:10px;padding:10px 12px;border-radius:8px;font-weight:600}
.feedback.hint{background:var(--hl);color:var(--ink)}
.feedback.exp{background:var(--sunk)}
.feedback.ok{background:var(--good-soft);color:var(--good)}
.syl{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.syl button{width:54px;height:54px;border-radius:10px;border:1px solid var(--line);background:var(--bg);font-size:22px;font-family:var(--f-display);font-weight:700}
.syl-out{display:flex;align-items:center;gap:8px;min-height:54px;padding:8px 12px;border:2px dashed var(--line);border-radius:10px;font-family:var(--f-display);font-size:24px;font-weight:700}
.submitbar{position:sticky;bottom:0;background:var(--bg);padding:12px 0 4px;display:flex;gap:10px;align-items:center}
.submitbar .btn{flex:1;min-height:58px;font-size:18px;border-radius:12px}
.scorebox{display:flex;align-items:center;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.scorebox .big{font-family:var(--f-num);font-size:46px;font-weight:600;color:var(--accent);line-height:1}
.scorebox .big small{font-size:18px;color:var(--muted)}
.done-card h1{font-size:38px}
.done-score{font-family:var(--f-num);font-size:72px;font-weight:600;color:var(--accent);line-height:1}
@media (max-width:820px){
  .solve{height:auto}
  .solve-grid{grid-template-columns:1fr}
  .passage{border-right:0;border-bottom:1px solid var(--line);padding:20px 16px;max-height:none}
  .qs{padding:16px}
  .para{font-size:17px}
}

/* ---------- teacher desk ---------- */
.desk-top{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
.desk-top .wrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-block:10px}
.brand{font-family:var(--f-display);font-weight:700;font-size:20px}
/* 독해시선 로고 (밝은 화면: 검정+초록 / 어두운 화면: 흰색) */
.dlogo{height:28px;width:auto;display:block}
.dlogo.on-dark{display:none}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .dlogo.on-light{display:none}:root:not([data-theme="light"]) .dlogo.on-dark{display:block}}
:root[data-theme="dark"] .dlogo.on-light{display:none}:root[data-theme="dark"] .dlogo.on-dark{display:block}
.ac-name{font-weight:700;font-size:14px;color:var(--ink);background:var(--sunk);border-radius:999px;padding:3px 12px}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tab{border:0;background:transparent;padding:8px 12px;border-radius:8px;font-weight:600;color:var(--muted)}
.tab.on{background:var(--accent-soft);color:var(--accent)}
.desk{padding-block:20px 60px;display:flex;flex-direction:column;gap:18px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sp{flex:1}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.panel h2{font-size:17px;margin-bottom:10px}
.sec-title{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sec-title h1{font-family:var(--f-display);font-size:26px}
.rec{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.rec-head{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.rec-name{font-weight:700;font-size:17px}
.rec-score{font-family:var(--f-num);font-size:28px;font-weight:600;color:var(--accent);margin-left:auto;line-height:1}
.rec-score small{font-size:13px;color:var(--muted)}
.areas{display:flex;gap:6px;flex-wrap:wrap}
.area-pill{display:inline-flex;gap:6px;align-items:center;font-size:13px;padding:3px 10px;border-radius:999px;background:var(--sunk)}
.area-pill i{width:8px;height:8px;border-radius:50%;display:inline-block}
.area-pill b{font-family:var(--f-num);font-weight:600}
.flag{font-size:13px;padding:6px 10px;border-radius:8px;background:var(--bad-soft);color:var(--bad);font-weight:600}
.subrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 10px;background:var(--bg);border-radius:8px;font-size:14px}
.pts{display:flex;gap:4px;flex-wrap:wrap}
.pts button{width:38px;height:36px;border-radius:8px;border:1px solid var(--line);background:var(--surface);font-family:var(--f-num);font-weight:600}
.pts button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.empty{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--r)}
.tbl-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
td .pin{font-family:var(--f-num);font-size:17px;font-weight:600;letter-spacing:.1em}
.grid-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;align-items:end}
.stock td,.stock th{text-align:center;padding:6px 4px;font-family:var(--f-num)}
.stock th:first-child,.stock td:first-child{text-align:left;font-family:var(--f-ui);white-space:nowrap}
.stock td.need{background:var(--bad-soft);color:var(--bad);font-weight:600}
.stock td.has{color:var(--ink)}
.stock td.zero{color:var(--line)}
.ed-q{border:1px solid var(--line);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.ed-opt{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center}
.ed-opt label{display:flex;align-items:center;gap:4px;font-size:18px;color:var(--muted)}
.ed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.4);display:grid;place-items:center;padding:16px;z-index:40}
.modal{background:var(--surface);border-radius:14px;padding:18px;width:100%;max-width:520px;display:flex;flex-direction:column;gap:12px;max-height:90vh;overflow:auto}
.msgbox{font-family:var(--f-ui);white-space:pre-wrap;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;min-height:200px;width:100%;line-height:1.6}
.report{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.kpis{display:flex;gap:10px;flex-wrap:wrap}
.kpi{flex:1;min-width:120px;background:var(--bg);border-radius:8px;padding:10px 12px}
.kpi b{display:block;font-family:var(--f-num);font-size:26px;font-weight:600}
.kpi span{font-size:12px;color:var(--muted);font-weight:600}
svg text{fill:var(--muted);font-family:var(--f-ui);font-size:11px}
.legend{display:flex;gap:12px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.linkbtn{border:0;background:none;padding:0;font-weight:700;color:var(--accent);text-align:left;text-decoration:underline;text-underline-offset:3px;font-size:14px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:14px}.kv>span{color:var(--muted);font-weight:600;font-size:13px;white-space:nowrap}
.vh{font-size:14px;margin:14px 0 6px}.notes{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px}
.vpara{display:grid;grid-template-columns:22px 1fr;gap:6px;font-family:var(--f-display);font-size:16px;line-height:1.8;margin-bottom:8px}.vpara p{margin:0;text-align:justify}.vpara span{font-size:12px;padding-top:4px;text-align:right}
.orig{background:var(--sunk)}
.vqs{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}.vq{background:var(--bg);border-radius:8px;padding:10px 12px;font-size:14px}
.vopts{list-style:none;margin:0;padding:0;display:grid;gap:2px}.vopts li.ok{color:var(--good);font-weight:700}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}

/* ---------- service additions ---------- */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.auth-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 24px;display:flex;flex-direction:column;gap:14px}
.auth-card h1{font-family:var(--f-display);font-size:26px}
.auth-card .btn{min-height:46px}
.err{color:var(--bad);font-weight:600;font-size:14px;min-height:20px;margin:0}
.spin{display:inline-block;width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation:none}}
.center-msg{min-height:60vh;display:grid;place-items:center;color:var(--muted)}
.draft-chip{background:var(--warn-soft);color:var(--warn)}

/* 답안지 방식 */
.sheet{max-width:760px;margin:0 auto;padding:16px 16px 40px;display:flex;flex-direction:column;gap:10px}
.sheet-note{background:var(--accent-soft);color:var(--accent);border-radius:10px;padding:10px 14px;font-weight:600}
.sec-h{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted);margin:10px 0 0;display:flex;align-items:center;gap:8px}
.sec-h::after{content:"";flex:1;height:1px;background:var(--line)}
.srow{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;flex-wrap:wrap}
.srow.is-wrong{border-color:var(--bad)}.srow.is-ok{border-color:var(--good)}
.srow .n{font-family:var(--f-num);font-weight:600;font-size:20px;color:var(--accent);min-width:34px;text-align:center}
.bubbles{display:flex;gap:8px;flex-wrap:wrap}
.bub{width:56px;height:56px;border-radius:50%;border:2px solid var(--line);background:var(--bg);font-size:26px;line-height:1;display:grid;place-items:center;color:var(--muted)}
.bub.sel{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.bub.x{opacity:.35;text-decoration:line-through}
.bub:disabled{cursor:default}
.srow .fbk{flex-basis:100%;margin:2px 0 0 44px;padding:8px 12px;border-radius:8px;font-weight:600;font-size:15px}
.fbk.hint{background:var(--hl)}.fbk.exp{background:var(--sunk)}.fbk.ok{background:var(--good-soft);color:var(--good)}
.qs .sec-h{margin:6px 0 -4px}

/* 어휘 퀴즈 */
.choose{display:flex;flex-direction:column;gap:12px;width:100%}
.choose .btn{min-height:78px;border-radius:14px;display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center}
.choose .btn b{font-size:21px}.choose .btn small{font-size:14px;opacity:.8;font-weight:400}
.vwrap{max-width:720px;margin:0 auto;padding:18px 16px 40px;display:flex;flex-direction:column;gap:14px}
.vcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px 20px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.vcard .hj{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.vcard .hj div{border:1px solid var(--line);border-radius:8px;min-width:64px;background:var(--bg)}
.vcard .hj b{display:block;font-family:var(--f-display);font-size:40px;line-height:1.35}
.vcard .hj small{display:block;border-top:1px solid var(--line);font-size:13px;color:var(--muted);padding:3px 4px}
.vw{font-family:var(--f-display);font-size:32px;font-weight:700}
.vm{font-size:19px;font-weight:600;line-height:1.5}
.vex{background:var(--sunk);border-radius:10px;padding:10px 14px;font-size:16px;line-height:1.6;width:100%;text-align:left}
.vog{font-size:14px;color:var(--muted);text-align:left;width:100%}
.vnext{min-height:58px;font-size:18px;border-radius:14px}
.vstem{background:var(--sunk);border-radius:10px;padding:12px 14px;margin:6px 0 10px;font-size:18px;line-height:1.6;font-family:var(--f-display)}
.vprog{height:6px;background:var(--sunk);border-radius:3px;overflow:hidden}.vprog i{display:block;height:100%;background:var(--accent)}
.vfbw{font-weight:400;margin-top:6px;color:var(--ink)}.vfbw b{font-size:18px}
.vrow{cursor:pointer}.vrow:hover td{background:var(--sunk)}
.vdet{margin-top:6px;font-size:13px;display:flex;flex-direction:column;gap:3px}

/* 어휘 익히기 */
.vtitle{font-family:var(--f-display);font-size:22px;margin:0;text-align:center}
.vsteps{display:flex;gap:6px;align-items:center;justify-content:center}.vsteps i{width:28px;height:6px;border-radius:3px;background:var(--line)}.vsteps i.done{background:var(--accent-soft)}.vsteps i.on{background:var(--accent)}.vsteps span{font-size:13px;color:var(--muted);margin-left:8px}
.center{text-align:center}
.flips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.fcard{width:86px;height:118px;border-radius:12px;border:2px solid var(--accent);background:var(--accent);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:transform .3s,background .3s}
.fcard b{font-family:var(--f-display);font-size:44px;line-height:1}.fcard small{font-size:13px;opacity:.85}
.fcard.open{background:var(--surface);color:var(--ink);transform:rotateY(360deg)}.fcard.open small{color:var(--accent);font-weight:700;opacity:1}
.reveal{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding-top:6px}.hjs{font-size:18px;color:var(--muted);font-weight:400}
.tale{background:#fbf6e9;border-radius:12px;padding:16px 18px;font-family:var(--f-display);font-size:18px;line-height:1.8;text-align:left;width:100%}.tale p{margin:0 0 6px}
.chain{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center}.chain span{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:14px;background:var(--bg)}.chain b{font-family:var(--f-display);font-size:28px}.chain i{font-style:normal;color:var(--muted)}
.litbox{font-family:var(--f-display);font-size:21px;font-weight:700;color:var(--accent)}
.mrow{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;width:100%}
.mh{width:72px;height:72px;border-radius:12px;border:2px solid var(--line);background:var(--bg);font-family:var(--f-display);font-size:36px}
.mt{min-width:96px;min-height:52px;border-radius:12px;border:2px solid var(--line);background:var(--bg);font-size:17px;padding:0 12px}
.mh.sel{border-color:var(--accent);background:var(--accent-soft)}.mh.ok,.mt.ok{border-color:var(--good);background:var(--good-soft);color:var(--good)}.mt.bad{border-color:var(--bad)}
.cheer{font-weight:700;color:var(--good);font-size:18px}.cheer.big{font-size:26px;font-family:var(--f-display)}
.slots{display:flex;gap:8px;justify-content:center}.slots span{width:62px;height:62px;border-bottom:3px solid var(--accent);display:grid;place-items:center;font-family:var(--f-display);font-size:34px;font-weight:700}
.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.chips button{width:60px;height:60px;border-radius:12px;border:2px solid var(--line);background:var(--bg);font-size:26px;font-family:var(--f-display)}.chips button.used{visibility:hidden}.chips button.bad{border-color:var(--bad)}
.vstem.long{font-size:16px;line-height:1.75}
.fcard.sm{width:64px;height:88px}.fcard.sm b{font-size:32px}
.tale.sm{font-size:15px;line-height:1.7;font-family:var(--f-ui)}.litbox.sm{font-size:17px}

/* 속담 (초1~3) */
.say{border:1px solid var(--line);background:var(--surface,#fff);color:var(--ink);border-radius:999px;width:38px;height:38px;flex:none;cursor:pointer;vertical-align:middle;display:inline-grid;place-items:center;padding:0}
.say svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.say:hover{border-color:var(--accent)}
.vdone{display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-display);font-size:24px;font-weight:700;color:var(--good);margin-top:6px}
.vdone .ck{width:34px;height:34px;border-radius:999px;background:var(--good);display:inline-grid;place-items:center}
.vdone .ck svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.oxdots{display:inline-flex;gap:6px}.oxdots i{width:16px;height:16px;border-radius:999px;border:2px solid var(--good);background:transparent}.oxdots i.on{background:var(--good)}
.starbar{display:flex;align-items:center;gap:10px;justify-content:center;margin:2px auto 10px;padding:8px 14px;border-radius:12px;background:var(--warn-soft);color:var(--ink);width:fit-content;max-width:100%;text-align:left}
.starbar .sb-star svg{width:28px;height:28px;fill:#E3B93A;stroke:#B98A12;stroke-width:1;stroke-linejoin:round;display:block}
.starbar b{font-size:16px;display:block}.starbar .sb-sub{font-size:12.5px;color:var(--muted)}
.starbar.plain{background:var(--sunk)}.starbar.plain .sb-star svg{fill:var(--muted);stroke:none;width:20px;height:20px}
.vhint{margin-top:8px;padding:8px 12px;border-radius:10px;background:var(--surface,#fff);border:1px dashed var(--line);font-weight:400;color:var(--ink)}.vhint b{color:var(--accent);margin-right:6px}
.young .vtitle{font-size:24px}.young .qtext{font-size:19px}.young .vstem{font-size:21px;line-height:1.7}.young .opt{font-size:19px;min-height:60px}
.scene-img img{width:100%;max-height:320px;object-fit:contain;border-radius:12px}
.panels{display:flex;flex-direction:column;gap:10px;width:100%}
.tpanel{display:flex;align-items:center;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:10px 12px;text-align:left}
.tpanel.now{border-color:var(--accent);background:var(--accent-soft)}
.tpanel .pe{font-size:40px;min-width:76px;text-align:center}.tpanel .pt{flex:1;min-width:0;font-size:19px;line-height:1.5;word-break:keep-all;overflow-wrap:anywhere}
/* 휴대폰 폭: 그림(이모지)을 위 한 줄로, 문장은 가로로 넓게 (2026-10-13: 글자가 한두 자씩 세로로 끊김) */
@media (max-width:560px){.tpanel{flex-wrap:wrap;gap:6px 10px}.tpanel .pe{flex:1 1 100%;min-width:0;font-size:30px;text-align:left;line-height:1.2}.tpanel .pt{flex:1 1 0;font-size:17px}}
/* 읽어 주기를 못 하는 화면 안내 */
.novoice{position:fixed;inset:0;background:rgba(20,28,25,.45);display:grid;place-items:center;z-index:9999;padding:16px}
.novoice-box{background:var(--surface,#fff);color:var(--ink,#1E2430);border-radius:16px;max-width:360px;width:100%;padding:20px 18px;box-shadow:0 10px 30px rgba(0,0,0,.2);text-align:center;word-break:keep-all}
.novoice-t{font-weight:700;font-size:18px;margin:0 0 6px}.novoice-s{margin:0 0 14px;color:var(--muted,#5B6661);line-height:1.5}
.novoice-b{display:flex;flex-direction:column;gap:8px}
.vw.prov{font-size:26px;line-height:1.4}
.memo{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;width:100%}
.mcard{min-height:84px;border-radius:14px;border:2px solid var(--accent);background:var(--accent);color:#fff;font-size:30px;font-weight:700;padding:8px}
.mcard.open{background:var(--surface);color:var(--ink);font-size:19px;font-family:var(--f-display)}.mcard.ok{border-color:var(--good);background:var(--good-soft);color:var(--good)}
.pslots{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.pslots span{min-width:64px;min-height:52px;border-bottom:3px solid var(--accent);display:grid;place-items:center;font-family:var(--f-display);font-size:21px;font-weight:700;padding:0 6px}
.pchips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.pchips button{min-height:58px;padding:0 16px;border-radius:14px;border:2px solid var(--line);background:var(--bg);font-size:21px;font-family:var(--f-display)}.pchips button.used{visibility:hidden}.pchips button.bad{border-color:var(--bad)}
.picopts{display:grid;gap:10px;grid-template-columns:repeat(3,1fr)}.picopts.n4{grid-template-columns:repeat(2,1fr)}.picopts.n5{grid-template-columns:repeat(3,1fr)}
.popt{display:flex;flex-direction:column;align-items:center;gap:6px;border:2px solid var(--line);border-radius:16px;background:var(--bg);padding:12px 6px;min-height:130px}
.popt b{font-size:19px}.popt.sel{border-color:var(--accent);background:var(--accent-soft)}.popt.x{opacity:.4}
.pic{display:grid;place-items:center;width:76px;height:76px}.pic img{width:100%;height:100%;object-fit:contain}.pic.emo{font-size:52px;line-height:1}
.oxopts{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ox{min-height:110px;border-radius:18px;border:2px solid var(--line);background:var(--bg);font-size:24px;font-weight:700}.ox.sel{border-color:var(--accent);background:var(--accent-soft)}.ox.x{opacity:.4}
.presults{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.presults span{font-size:15px;padding:4px 8px;border-radius:8px;background:var(--sunk)}.presults .ok{background:var(--good-soft)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-left:12px}.seg button{border:0;background:var(--surface);padding:8px 14px;font-weight:600}.seg button.on{background:var(--accent);color:#fff}.seg small{opacity:.7;font-weight:400}


/* ================= 디자인 v2 ================= */
/* 지문은 모두 명조(Hahmlet), 초등은 제목·큰 단추에 주아, 지문 바탕은 미색 */
.passage{background:var(--paper);color:var(--paper-ink)}
.passage h2{font-weight:700;letter-spacing:-.01em}
.para{font-weight:400;letter-spacing:-.005em}
.tale{background:var(--paper);color:var(--paper-ink)}
.vstem,.vex{font-family:var(--f-display)}
.btn{border-radius:10px}
.kiosk .btn.primary,.sheet .btn.primary,.qs .btn.primary,.vwrap .btn.primary{background:var(--accent);border-color:var(--accent)}

/* 레벨 색: 노랑(Lv1~2) 연두(3~4) 하늘(5~6) 보라(7~9) 자주(10~12) — 차분한 채도. 노랑은 글자·단추를 주황으로 */
body[data-band="1"]{--accent:#B4531A;--accent-soft:#FBF4DF;--band-main:#E3B93A}
body[data-band="2"]{--accent:#3E6224;--accent-soft:#EEF3E6;--band-main:#7FA65A}
body[data-band="3"]{--accent:#1E5874;--accent-soft:#E6F0F5;--band-main:#4E97BD}
body[data-band="4"]{--accent:#3C3485;--accent-soft:#EDEBF5;--band-main:#7468C2}
body[data-band="5"]{--accent:#632B4D;--accent-soft:#F4E9EF;--band-main:#A3527F}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) body[data-band]{--accent:var(--band-main);--accent-ink:#141a1b;--accent-soft:color-mix(in srgb,var(--band-main) 22%,#182325)}}
:root[data-theme="dark"] body[data-band]{--accent:var(--band-main);--accent-ink:#141a1b;--accent-soft:color-mix(in srgb,var(--band-main) 22%,#182325)}
body[data-band] .solve-top{background:var(--accent-soft);border-bottom:3px solid var(--band-main)}
body[data-band] .solve-top .ttl{color:var(--accent)}
body[data-band] .vprog i{background:var(--band-main)}
body.kid .kiosk-card h1,body.kid .done-card h1,body.kid .vtitle,body.kid .choose .btn b,body.kid .go-btn,body.kid .submitbar .btn,body.kid .vnext,body.kid .confirm-name,body.kid .sec-h{font-family:var(--f-kid);font-weight:400}
body.kid .kiosk-card h1{font-size:36px}
body.kid .qno,body.kid .srow .n{font-family:var(--f-kid);font-weight:400;font-size:20px}
body.kid .opt,body.kid .qcard,body.kid .srow{border-radius:16px}
body.kid .opt.sel{border-width:2px}

/* 풀이 시간 */
.ready-card{max-width:560px;gap:20px}
.kiosk-card h1.ready-title,body.kid .kiosk-card h1.ready-title{font-family:var(--f-display);font-weight:700;font-size:30px;line-height:1.35;color:var(--accent)}
.guide{width:100%;display:flex;gap:12px;align-items:flex-start;text-align:left;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--band-main);border-radius:14px;padding:16px 18px}
.guide ol{margin:0;padding-left:22px;display:grid;gap:6px;font-size:17px;line-height:1.55;flex:1}
.guide p{margin:0;font-size:17px;line-height:1.55;flex:1}
.kid .guide ol,.kid .guide p{font-size:19px}
.go-btn{width:100%;min-height:72px;font-size:24px;border-radius:18px}
.paper-card{max-width:480px}
.paper-ico{width:104px;height:104px;border-radius:28px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.pause-btn{display:inline-flex;gap:6px;align-items:center;font-weight:700}
.veiled{filter:blur(16px);pointer-events:none;user-select:none}
.pause-veil{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:color-mix(in srgb,var(--bg) 55%,transparent)}
.pause-card{width:100%;max-width:400px;background:var(--surface);border-radius:22px;padding:30px 26px;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center;box-shadow:0 12px 40px rgba(30,36,48,.18)}
.pause-card h2{font-size:28px;font-family:var(--f-kid);font-weight:400;color:var(--accent)}
.pause-card p{margin:0;color:var(--muted);line-height:1.6}
.time-note{display:flex;flex-direction:column;gap:2px;margin-top:6px;font-size:15px;color:var(--ink)}
.time-note b{font-family:var(--f-num);font-weight:600}
.time-note.big{align-items:center;font-size:18px;margin:0}
.praise{color:var(--good);font-weight:700}

/* 선생님 화면: 학원 색(청록) 한 가지로 통일, 주의가 필요한 곳만 주황 */
.desk-body{--good:var(--accent);--good-soft:var(--accent-soft);--warn:var(--accent);--warn-soft:var(--accent-soft);--a-voc:var(--accent);--a-fact:var(--accent);--a-inf:var(--accent);--a-crit:var(--accent)}
.desk-body .brand{color:var(--accent)}
.desk-body .sec-title h1{font-weight:700}
.desk-body .tab{font-size:15px}
.desk-body .chip.acc{background:transparent;border:1px solid var(--line);color:var(--ink)}
.desk-body .rec{padding:10px 14px;gap:6px;border-radius:12px}
.desk-body .rec-head{gap:8px}
.desk-body .rec-name{font-size:16px}
.desk-body .rec-score{font-size:24px;color:var(--ink)}
.desk-body .rec-score.low{color:var(--bad)}
.desk-body .area-pill{padding:2px 9px;font-size:12px;background:var(--accent-soft);color:var(--accent)}
.desk-body .area-pill.low{background:var(--bad-soft);color:var(--bad)}
.desk-body .area-pill.low i{background:var(--bad)!important}
.desk-body .subrow{padding:6px 10px}
.desk-body .flag{padding:4px 10px}
.desk-body td,.desk-body th{padding:7px 8px}
.desk-body .kpi{background:var(--surface);border:1px solid var(--line)}
.desk-body .kpi.alert{border-color:var(--bad);box-shadow:inset 0 0 0 1px var(--bad)}
.desk-body .kpi.alert span,.desk-body .kpi.alert b{color:var(--bad)}
.today-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.today-kpis .kpi b small{font-size:13px;color:var(--muted);font-weight:500;margin-left:2px;font-family:var(--f-ui)}
.tchip{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);font-family:var(--f-num)}
.tchip.flag-fast,.tchip.flag-long{color:var(--bad);font-weight:600;font-family:var(--f-ui)}

.pin-dots.six{gap:10px}.pin-dots.six span{width:18px;height:18px}
.code-big{font-family:var(--f-num);font-size:34px;font-weight:600;letter-spacing:.12em;color:var(--accent)}
.access{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:center}
.access>span{font-size:13px;color:var(--muted);font-weight:600}
a.btn{color:inherit}

.days{display:flex;gap:2px;margin-top:4px}.days button{width:24px;height:24px;border-radius:6px;border:1px solid var(--line);background:var(--surface);font-size:12px;padding:0;color:var(--muted)}.days button.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}
.kpi b small{font-family:var(--f-ui);font-weight:500}
details>summary{list-style:revert}
.desk-body .btn.sm,.desk-body td.num{white-space:nowrap}

/* 공부 계획 · 도장판 · 배지 · 칭찬 */
.plan-card{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 14px 10px;display:flex;flex-direction:column;gap:8px;text-align:left}
.pc-today{font-weight:700;font-size:17px}.pc-today .ok,.cheer-lines .ok{color:var(--good);font-weight:700;margin-left:2px}
.pc-back{font-size:14px;color:var(--bad);font-weight:600}
.pc-foot{font-size:13px;color:var(--muted);min-height:0}
.stamps{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.stamps .st{display:flex;flex-direction:column;align-items:center;gap:3px}
.stamps .st i{width:100%;aspect-ratio:1;max-width:46px;border-radius:50%;border:2px dashed var(--line);display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:700;color:transparent}
.stamps .st span{font-size:12px;color:var(--muted)}
.stamps .st.todo i{border-color:var(--band-main)}
.stamps .st.now span{color:var(--accent);font-weight:700}
.stamps .st.done i,.stamps .st.ahead i,.stamps .st.makeup i{border:2px solid #C4452C;color:#C4452C;background:#FBEDE8;transform:rotate(-12deg);box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 3px #C4452C}
.stamps .st.makeup i{border-color:var(--band-main);color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 3px var(--band-main)}
.stamps .st.miss i{border-style:solid;border-color:var(--line);background:var(--sunk)}
.stamps .st.off i{border-color:transparent;background:transparent}
.stamps .st.extra i{border:2px dotted var(--band-main)}
.stamps.plain .st i{border-radius:6px;max-width:34px;transform:none!important;box-shadow:none!important;font-size:15px}
.stamps.plain .st.done i,.stamps.plain .st.ahead i,.stamps.plain .st.makeup i{background:var(--accent);border-color:var(--accent);color:#fff}
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badge{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:#7A4B00;background:radial-gradient(circle at 35% 30%,#FFE9A8,#E3B93A);border:2px solid #C99A1E;box-shadow:0 2px 0 #B98A12}
.plan-card.plain .badge{background:var(--accent-soft);color:var(--accent);border-color:var(--accent);box-shadow:none;border-radius:8px;width:auto;padding:0 8px;height:26px}
.cheer-lines{width:100%;display:flex;flex-direction:column;gap:2px;font-weight:700;color:var(--accent);font-size:17px;text-align:center}
.kid .cheer-lines{font-family:var(--f-kid);font-weight:400;font-size:20px}
.cheer-lines.plain{font-size:14px;font-weight:600;color:var(--ink);text-align:left}
.scorebox+.cheer-lines{background:var(--accent-soft);border-radius:10px;padding:8px 12px}
.cheer-veil{position:fixed;inset:0;z-index:35;display:grid;place-items:center;padding:16px;background:color-mix(in srgb,var(--bg) 40%,transparent);pointer-events:none}
/* 칭찬 카드는 카드만 누를 수 있고, 둘레를 누르면 아래 단추가 그대로 눌린다 (2026-10-13) */
.cheer-veil .cheer-card{pointer-events:auto;cursor:pointer}
.cheer-veil{align-items:start;padding-top:10vh}
.cheer-card{position:relative;background:var(--surface);border-radius:24px;padding:26px 28px;max-width:420px;text-align:center;box-shadow:0 14px 44px rgba(30,36,48,.2);display:flex;flex-direction:column;gap:8px;align-items:center;animation:pop .35s cubic-bezier(.2,1.4,.4,1)}
.cheer-card .l1{font-family:var(--f-kid);font-size:28px;line-height:1.3;color:var(--accent)}
.cheer-card .l2{font-size:17px;font-weight:600}
.big-stamp{width:104px;height:104px;border-radius:50%;border:4px solid #C4452C;color:#C4452C;display:grid;place-items:center;font-family:var(--f-kid);font-size:21px;line-height:1.15;transform:rotate(-12deg);box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px #C4452C;background:#FBEDE8;padding:10px;word-break:keep-all;animation:stamp .4s .15s both}
.confetti{position:fixed;inset:0;overflow:hidden;pointer-events:none}
.confetti i{position:absolute;top:-16px;width:10px;height:16px;border-radius:2px;animation:fall 2s linear forwards}
@keyframes fall{to{top:105%;transform:rotate(540deg)}}
@keyframes pop{from{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}
@keyframes stamp{from{transform:scale(1.8) rotate(-12deg);opacity:0}to{transform:rotate(-12deg);opacity:1}}
@media (prefers-reduced-motion:reduce){.confetti{display:none}.cheer-card,.big-stamp{animation:none}}

.stamp-row{font-family:var(--f-num);letter-spacing:.42em;white-space:nowrap;font-size:15px}
.stamp-row .done,.stamp-row .ahead{color:var(--accent)}.stamp-row .makeup{color:var(--accent)}.stamp-row .miss{color:var(--bad);font-weight:700}.stamp-row .todo,.stamp-row .off,.stamp-row .extra{color:var(--muted)}
.plan-tbl th,.plan-tbl td{text-align:center;padding:6px 4px}.plan-tbl select.inp{min-height:36px;padding:4px 6px;min-width:62px}.plan-tbl input[type=checkbox]{width:20px;height:20px}

/* 리포트 인쇄 */
.print-head,.print-only{display:none}
@media print{
  body.print-report{background:#fff}
  body.print-report .desk-top,body.print-report .sec-title,body.print-report .desk>.row,body.print-report .no-print,body.print-report .toast,body.print-report .banner{display:none!important}
  body.print-report .print-head{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid #111;padding-bottom:6px;margin-bottom:10px}
  body.print-report .print-head .t{font-family:var(--f-display);font-size:22pt;font-weight:700}.print-head .t small{font-size:11pt;font-weight:400;color:#444}
  body.print-report .print-head .m{font-size:9pt;color:#444}
  body.print-report .print-only{display:block}
  body.print-report .wrap{max-width:none;padding:0}
  body.print-report .panel{border:1px solid #bbb;break-inside:avoid;box-shadow:none}
  body.print-report .report{grid-template-columns:1fr 1fr;gap:8px}
  body.print-report .kpi{border:1px solid #ccc}
  @page{size:A4;margin:14mm}
}

/* ---------- 레벨 테스트 결과 ---------- */
.qtext{white-space:pre-line}
.bogi{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:0 0 10px;font-size:15.5px;line-height:1.6;white-space:pre-line;background:var(--bg)}
.lt-page{max-width:980px;margin:0 auto;padding:24px 16px 40px;display:flex;flex-direction:column;gap:16px}
.lt-top h1{font-family:var(--f-display);font-size:30px;font-weight:700}
.lt-btns{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:13px}
.lt-btns .btn{min-height:56px;min-width:200px;font-size:18px;border-radius:14px}
.lt-res{display:flex;flex-direction:column;gap:14px;text-align:left}
.lt-head{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;background:var(--surface);border:2px solid var(--accent);border-radius:16px;padding:16px 20px}
.lt-lv{text-align:center;padding-right:18px;border-right:1px solid var(--line);min-width:120px}
.lt-lv small{display:block;font-size:13px;color:var(--muted)}
.lt-lv b{display:block;font-family:var(--f-display);font-size:46px;line-height:1.1;color:var(--accent)}
.lt-lv span{font-weight:700}
.lt-say p{margin:0 0 4px;font-size:15px;line-height:1.55}
.lt-say .g{font-size:18px;font-weight:700}
.lt-res .note{font-size:13px;color:var(--warn,#8a4b12)}
.lt-ladder{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin-bottom:14px}
.lt-ladder div{position:relative;border:1px solid var(--line);border-radius:8px;text-align:center;padding:5px 0 4px;font-size:11px;color:var(--muted);line-height:1.25;background:var(--surface)}
.lt-ladder b{display:block;font-size:15px;color:var(--ink);font-family:var(--f-num)}
.lt-ladder .on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.lt-ladder .on b{color:var(--accent-ink)}
.lt-ladder .gr{border:2px solid var(--a-inf)}
.lt-ladder i{position:absolute;left:0;right:0;bottom:-16px;font-style:normal;font-size:11px;font-weight:700;color:var(--a-inf)}
.lt-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:14px}
.lt-cols>section,.lt-plan{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-width:0}
.lt-res h3{font-size:15px;font-weight:700;margin:0 0 8px}
.lt-res h3 small{font-weight:400;color:var(--muted);font-size:13px}
.lt-bars{width:100%;max-width:400px;height:auto;display:block;margin:0 auto;color:var(--ink)}
.lt-st{width:100%;border-collapse:collapse;font-size:14px}
.lt-st td{border-top:1px solid var(--line);padding:7px 6px;vertical-align:middle}
.lt-st tr:first-child td{border-top:0}
.lt-st .n{width:22px;color:var(--muted);font-family:var(--f-num)}
.lt-st .c{text-align:center;white-space:nowrap}
.lt-st .c div,.lt-st .mk{font-size:12px;color:var(--muted)}
.lt-st .mk{letter-spacing:1px}
.lt-good,.lt-build ul{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14.5px;line-height:1.5}
.lt-build{border-left:4px solid var(--a-inf);padding:2px 0 2px 12px;margin:0 0 12px}
.lt-goodb{border-left:4px solid var(--acc, #0b7d5a);padding:2px 0 2px 12px;margin:0 0 10px}.lt-goodb p{margin:2px 0 0;font-size:14.5px}.lt-goodb:last-child{margin-bottom:0}
.lt-build:last-child{margin-bottom:0}
.lt-build p{margin:2px 0 4px;font-size:14.5px}
.mk i{display:inline-block;width:1em;height:1em;margin:0 .2em;position:relative;vertical-align:middle;font-style:normal;-webkit-print-color-adjust:exact;print-color-adjust:exact}.mk .mo::before{content:'';position:absolute;inset:.1em;border:.1em solid currentColor;border-radius:50%}.mk .mx::before,.mk .mx::after{content:'';position:absolute;left:50%;top:.08em;bottom:.08em;width:.1em;margin-left:-.05em;background:currentColor;transform:rotate(45deg)}.mk .mx::after{transform:rotate(-45deg)}.mk .mq{display:inline-flex;flex-direction:column;align-items:center;width:1.45em;vertical-align:middle}.mk .mq small{font-size:.72em;color:#555;line-height:1;margin-bottom:.12em;font-weight:400}.mk .mq i{margin:0}
.lt-build .rx{margin-top:6px;line-height:1.6;font-size:14.5px}.lt-build .rx span{display:block;padding-left:12px;text-indent:-12px}.lt-build .rx span::before{content:'- '}.lt-build .rx b{display:inline-block;font-size:12.5px;color:#fff;background:var(--a-inf);border-radius:99px;padding:0 9px;margin:0 0 4px}
.lt-plan p{margin:0 0 4px;font-size:14.5px}
.lt-caution{margin:0;font-size:13px;color:var(--muted)}
.desk-body .lt-bars rect.weak{fill:var(--bad);fill-opacity:1}
.desk-body .lt-ladder .gr{border-color:var(--ink)}.desk-body .lt-ladder i{color:var(--ink)}
.desk-body .lt-build{border-left-color:var(--bad)}
@media (max-width:760px){.lt-cols{grid-template-columns:1fr}.lt-head{grid-template-columns:1fr}.lt-lv{border-right:0;border-bottom:1px solid var(--line);padding:0 0 10px}.lt-ladder{grid-template-columns:repeat(6,1fr);row-gap:20px}}
/* 선생님 화면: 레벨 테스트 탭 */
.lt-mode{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}
.lt-mode label{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;background:var(--bg)}
.lt-mode label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.lt-mode b{display:block}.lt-mode small{color:var(--muted);font-size:13px;line-height:1.45;display:block}
.lt-code{font-family:var(--f-num);font-size:20px;font-weight:600;letter-spacing:2px;color:var(--accent)}
.lt-entry{display:grid;gap:10px;margin:10px 0}
.lt-entry .rowq{display:grid;grid-template-columns:minmax(120px,1.4fr) repeat(6,minmax(0,1fr));gap:6px;align-items:center}
.lt-entry .rowq>span{font-size:13px}
.lt-entry input{width:100%;min-height:40px;text-align:center;font-family:var(--f-num);font-size:17px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}
.lt-entry .hdq{font-size:12px;color:var(--muted);text-align:center}
.lt-view{margin-top:12px;border-top:1px solid var(--line);padding-top:14px}
@media (max-width:640px){.lt-mode{grid-template-columns:1fr}}

/* 지문 보호: 주인 학원이 아니면(학생 화면 포함) 지문 글자를 고르거나 복사할 수 없고, 브라우저 인쇄(Ctrl+P)에서는 지문이 빈칸으로 나온다.
   지문 출력은 '이 지문 출력'(서버 기록·워터마크)으로만 한다. */
body.protect .passage,body.protect .vpara,body.protect .para,body.protect .qs,body.protect .qcard{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.copy-note{margin:14px 0 0;font-size:12px;color:var(--muted);text-align:right}
@media print{
  body.protect .passage,body.protect .vpara,body.protect .para,body.protect .qs,body.protect .qcard,body.protect .orig{visibility:hidden!important}
  body.protect .passage::before{content:"지문은 ‘이 지문 출력’ 단추로만 출력할 수 있어요.";visibility:visible}
}

/* 선생님 화면 왼쪽 메뉴 (2026-10-06) */
.wrap.wide{max-width:1400px}
.desk-shell{display:grid;grid-template-columns:184px minmax(0,1fr);gap:28px;align-items:start}
.desk-shell>.desk{min-width:0}
.side{position:sticky;top:64px;display:flex;flex-direction:column;flex-wrap:nowrap;gap:2px;padding:20px 0 40px}
.side .tab{text-align:left;width:100%;padding:10px 14px;font-size:15px;border-radius:10px;color:var(--ink);font-weight:600}
.side .tab:hover{background:var(--sunk)}
.side .tab.on{background:var(--accent-soft);color:var(--accent);font-weight:700;box-shadow:inset 3px 0 0 var(--accent)}
.side .grp{display:block;margin:14px 0 4px;padding:12px 14px 0;border-top:1px solid var(--line);font-size:12px;font-weight:700;color:var(--muted)}
@media (max-width:860px){
  .desk-shell{grid-template-columns:1fr;gap:0}
  .side{position:sticky;top:56px;z-index:4;flex-direction:row;overflow-x:auto;padding:8px 0;background:var(--bg);border-bottom:1px solid var(--line)}
  .side .tab{width:auto;white-space:nowrap;padding:8px 12px}
  .side .tab.on{box-shadow:none}
  .side .grp{margin:0 4px;padding:0 0 0 10px;border-top:0;border-left:1px solid var(--line);align-self:center;white-space:nowrap}
}
@media print{.side{display:none!important}.desk-shell{display:block}}

.pv-lock{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
@media print{.pv-lock{display:none!important}}

/* 학생 달력 */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:10px}
.cal-h{text-align:center;font-size:12.5px;color:var(--muted);font-weight:700}
.cal-c{border:1.5px solid var(--line);border-radius:10px;background:var(--surface);min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:inherit;color:var(--ink);cursor:default;padding:4px}
.cal-c.empty{border:0;background:transparent}
.cal-c .n{font-size:12.5px;color:var(--muted)}
.cal-c .m{font-size:22px;line-height:1;font-weight:700;min-height:22px}
.cal-c.o{border-color:var(--accent);cursor:pointer}.cal-c.o .m{color:var(--accent)}
.cal-c.x .m{color:var(--bad)}
.cal-c.plan .m{color:var(--muted)}
.cal-c.today{box-shadow:inset 0 0 0 2px var(--ink)}
.cal-c.sel{background:var(--accent-soft)}
@media (max-width:520px){.cal{gap:3px}.cal-c{min-height:44px}.cal-c .m{font-size:18px}}

/* 이번 달 한 줄 현황 */
.strip{display:flex;gap:2px;flex-wrap:nowrap;overflow-x:auto;padding:2px 0}
.sd-c{flex:0 0 auto;width:22px;display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:6px;background:var(--surface);padding:1px 0;font:inherit;color:var(--ink)}
.sd-c i{font-style:normal;font-size:10px;color:var(--muted);line-height:1.2}
.sd-c b{font-size:13px;line-height:1.2;min-height:16px}
.sd-c.o{border-color:var(--accent)}.sd-c.o b{color:var(--accent)}
.sd-c.x b{color:var(--bad)}
/* 공부할 날: 테두리 없이 연한 초록 칸 + 초록 날짜만 (아직 안 했으니 표시는 없음) */
.sd-c.plan{background:#dcefe5;border-color:transparent}.sd-c.plan i{color:#0b7d5a;font-weight:700}
.sd-c.o{background:var(--surface)}
.sd-c.today{box-shadow:inset 0 0 0 1.5px var(--ink)}
button.sd-c{cursor:pointer}.sd-c.sel{background:var(--accent-soft)}
.daychk{display:inline-flex}.daychk input{position:absolute;opacity:0;pointer-events:none}
.daychk span{display:inline-grid;place-items:center;width:40px;height:36px;border:1.5px solid var(--line);border-radius:8px;font-weight:700;cursor:pointer;background:var(--surface)}
.daychk input:checked+span{background:var(--accent);border-color:var(--accent);color:#fff}
.daychk input:focus-visible+span{outline:3px solid var(--accent);outline-offset:1px}

/* 학생 화면 카드 (기본 정보 · 학습 · 기타) */
.sp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;align-items:start}
.sp-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.sp-card h3{margin:0 0 4px;font-size:13.5px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.cls-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px;max-height:340px;overflow:auto;padding:2px}
.cls-item{display:flex;gap:8px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:14px;cursor:pointer;background:var(--surface)}
.cls-item:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.sp-row{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}
.sp-row:first-of-type{border-top:0}
.sp-row>span{font-size:13px;color:var(--muted);font-weight:600}
.sp-row .inp{min-height:36px;max-width:260px}

/* 초1·2 OX 몸풀기 (2026-10-09) */
.oxcard{text-align:center;padding:18px}.oxhead{display:flex;align-items:center;justify-content:space-between}.oxstars{font-size:24px;letter-spacing:3px;color:#d39b12}.oxs{font-size:22px;line-height:1.55;font-weight:700;margin:12px 4px 16px}.oxbtns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.oxb{font:800 52px/1 Arial,sans-serif;height:110px;border-radius:20px;border:3px solid var(--line);background:var(--card,#fff);cursor:pointer}.oxb.o{color:#0b7d5a}.oxb.x{color:#c2410c}.oxb.sel.o{background:#e6f2ed;border-color:#0b7d5a}.oxb.sel.x{background:#fbeadf;border-color:#c2410c}.oxb:disabled{opacity:.6}.oxb.tried{opacity:.3;border-style:dashed}.pick-wait .opt,.pick-wait .popt,.pick-wait .ox,.pick-wait .oxb,.pick-wait .bub{pointer-events:none}.oxcard .feedback{margin-top:14px;font-size:17px}

/* 맞음·틀림 효과 (2026-10-09) */
.fx{position:fixed;left:50%;top:42%;transform:translate(-50%,-50%);z-index:9999;pointer-events:none;text-align:center}.fx b{display:inline-block;font-size:34px;font-weight:800;padding:14px 26px;border-radius:22px;box-shadow:0 8px 24px rgba(0,0,0,.18);animation:fxPop .9s ease-out forwards}.fx-ok b{background:#0b7d5a;color:#fff}.fx-no b{background:#fff3e6;color:#c2410c;border:3px solid #f0a070}.fx.teen b{font-size:22px;padding:8px 16px}.fx-burst{position:absolute;left:50%;top:50%;width:0;height:0}.fx-burst i{position:absolute;font-style:normal;font-size:30px;color:#f2b705;transform:rotate(var(--a)) translateY(0);animation:fxStar 1s ease-out forwards}.fx.teen .fx-burst{display:none}
@keyframes fxPop{0%{transform:scale(.4);opacity:0}25%{transform:scale(1.12);opacity:1}70%{transform:scale(1);opacity:1}100%{transform:scale(.96);opacity:0}}
@keyframes fxStar{0%{transform:rotate(var(--a)) translateY(0) scale(.5);opacity:1}100%{transform:rotate(var(--a)) translateY(-130px) scale(1.1);opacity:0}}
.fx-shake{animation:fxShake .45s}@keyframes fxShake{0%,100%{transform:none}20%{transform:translateX(-9px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.fx b,.fx-burst i,.fx-shake{animation:none}}

/* 폭죽·지진 효과 (2026-10-09 고침: 큰 글자 없이) */
.fx-fw{position:fixed;inset:0;z-index:9999;pointer-events:none}.fw{position:absolute;width:0;height:0}.fw i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c);opacity:0;transform:rotate(var(--a)) translateY(0);animation:fwShot 1.05s ease-out forwards}.fx-fw.teen .fw i{width:7px;height:7px;left:-3.5px;top:-3.5px}
@keyframes fwShot{0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(.6)}70%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(-150px) scale(1)}}
.fx-fw.teen .fw i{animation-name:fwShotS}@keyframes fwShotS{0%{opacity:1;transform:rotate(var(--a)) translateY(0)}100%{opacity:0;transform:rotate(var(--a)) translateY(-80px)}}
.fx-quake{animation:fxQuake .65s cubic-bezier(.36,.07,.19,.97)}@keyframes fxQuake{0%,100%{transform:none}10%{transform:translate(-12px,4px) rotate(-1deg)}20%{transform:translate(12px,-4px) rotate(1deg)}30%{transform:translate(-10px,6px) rotate(-.8deg)}40%{transform:translate(10px,-6px) rotate(.8deg)}50%{transform:translate(-8px,3px)}60%{transform:translate(8px,-3px)}70%{transform:translate(-5px,2px)}80%{transform:translate(4px,-2px)}90%{transform:translate(-2px,1px)}}
@media (prefers-reduced-motion:reduce){.fw i,.fx-quake{animation:none}}
/* 월말 어휘 테스트: 이달의 어휘 · 틀린 낱말 다시 보기 (2026-10-13) */
.mlist{width:100%;display:flex;flex-direction:column;gap:0;text-align:left}.mrow{display:grid;grid-template-columns:minmax(6.5em,auto) 1fr;gap:4px 12px;padding:9px 2px;border-bottom:1px solid var(--line);align-items:baseline}.mrow:last-child{border-bottom:0}.mrow b{font-size:17px}.mrow small{grid-column:1;color:var(--muted);font-size:12.5px;letter-spacing:.08em;margin-top:-2px}.mrow span{grid-column:2;grid-row:1 / span 2;color:var(--ink);font-size:15px;line-height:1.5}@media (max-width:520px){.mrow{grid-template-columns:1fr}.mrow span{grid-column:1;grid-row:auto}}

/* 문학 마을 여행 (원장님 2026-10-14): 첫 화면 별 줄 · 내 별 모음 · 도착 카드 */
.litbar{display:flex;align-items:center;gap:12px;width:100%;margin:4px 0 12px;padding:10px 14px;border-radius:14px;background:var(--warn-soft);border:1px solid #efe3b8;color:var(--ink);text-align:left;cursor:pointer;font:inherit}
.litbar .lb-st{width:56px;height:56px;border-radius:50%;overflow:hidden;flex:none;background:#fff}.litbar .lb-st img{width:100%;height:100%;display:block;transform:scale(1.05)}
.litbar .lb-start img{transform:none;object-fit:contain}
.litbar .lb-t{flex:1;min-width:0}.litbar .lb-t b{display:block;font-size:19px}.litbar .lb-t>span{display:block;font-size:13px;color:var(--muted);margin-top:1px;word-break:keep-all}
.litbar .lb-bar{display:block;height:7px;background:#efe8cf;border-radius:5px;margin-top:6px;overflow:hidden}.litbar .lb-bar i{display:block;height:100%;background:#d9a91c;border-radius:5px}
.litbar .lb-go{font-size:13px;color:var(--accent);font-weight:700;white-space:nowrap}
.litcard{max-width:600px}.litcard h1{text-align:center;margin:0 0 2px;font-size:28px}.lit-tot{text-align:center;margin:0 0 10px;color:var(--muted)}.lit-tot b{color:var(--accent);font-size:22px}
.litmap{position:relative;width:100%;align-self:stretch;border-radius:14px;overflow:hidden}.litmap .map{display:block;width:100%;height:auto}
.litmap .walker{position:absolute;width:13%;transform:translate(-100%,-75%);pointer-events:none}
.litstamps{width:100%;align-self:stretch;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px}
.litstamps .lst{aspect-ratio:1;border-radius:50%;overflow:hidden;background:#fff}.litstamps .lst img{width:100%;height:100%;display:block;transform:scale(1.05)}
.litstamps .lst.off{border:2px dashed #cfd5d2;background:#fafaf8;color:#a9b1ad;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.litstamps .lst.off b{font-size:26px;line-height:1}.litstamps .lst.off small{font-size:10.5px;line-height:1.25;margin-top:2px}
.litmonths{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:12px;font-size:14px;color:var(--ink)}
.arrive-veil{position:fixed;inset:0;z-index:60;display:grid;place-items:start center;padding-top:6vh;pointer-events:none}
.arrive-card{pointer-events:auto;width:min(440px,92vw);max-height:88vh;overflow:auto;background:#fff;border:2px solid var(--accent);border-radius:18px;padding:18px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.18);animation:arrIn .35s ease-out}
@keyframes arrIn{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.arrive-card .arr-big{font-size:28px;font-weight:800;color:var(--accent);margin:2px 0 8px}
.arrive-card .arr-st{width:190px;height:190px;margin:0 auto;border-radius:50%;overflow:hidden}.arrive-card .arr-st img{width:100%;height:100%;display:block;transform:scale(1.05)}
.arrive-card .arr-fin{width:220px;height:220px;border-radius:50%;object-fit:cover;display:block;margin:0 auto}
.arrive-card .arr-fact{background:#f3f7f4;border-radius:12px;padding:12px 14px;text-align:left;font-size:16.5px;line-height:1.65;margin-top:12px;word-break:keep-all}.arrive-card .arr-fact b{color:var(--accent)}
@media (prefers-reduced-motion:reduce){.arrive-card{animation:none}}

/* 작품 설명 칸 (원장님 2026-10-14): 예전 class 'guide'가 학생 화면의 안내 칸(.guide, 가로 flex)과 이름이 겹쳐 묶음이 가로로 늘어서고 글자가 세로로 흐름 → 'wguide'로 이름을 바꾸고 위아래로 쌓는다 */
.wguide{display:block;text-align:left}.wguide>*{max-width:100%}
@media (max-width:520px){.wguide>div[style*=grid]{grid-template-columns:1fr!important;gap:0 0!important}.wguide>div[style*=grid]>b{margin-top:6px}}