/* 켐탑 /app 셸 스타일 — app.html 인라인 <style> 에서 분리.
 * 로직 없음. 고치면 app.html 의 ?v= 를 같이 올린다.
 */
:root{
  --page-max:1200px;
  --page-pad:22px;
  --indigo:#4C63F6;--indigo-deep:#3A4FE0;--indigo-soft:#8B9BFF;
  --bg:#f6f7fc;--bg-soft:#eef1ff;--card:#fff;
  --border:#e8eaf2;--border-soft:#dde3ff;
  --text:#1b1f2e;--sub:#5e6478;--muted:#9196a8;
  --ok:#0d9f6e;--no:#f04438;--amber:#f59e0b;
  --shadow-sm:0 2px 10px rgba(60,80,180,.06);
  --shadow:0 8px 28px rgba(60,80,180,.10);
  --shadow-lg:0 16px 48px rgba(50,70,160,.16);
  --radius:18px;--radius-sm:14px;--radius-pill:999px;
  /* ⛔ 타이포 계단(--fs-* · --lh*)은 여기 없다 — 정본은 assets/type-tokens.css.
     app.html 이 그 파일을 먼저 로드한다. 여기에 다시 정의하지 말 것. */
}
*{box-sizing:border-box;}
html{overflow-anchor:none;-webkit-text-size-adjust:100%;}
/* iOS Safari: 메인 문서 스크롤은 브라우저 네이티브에 맡김 (강제 고정 금지) */
html,body{overscroll-behavior-y:auto;}
body{margin:0;background:linear-gradient(180deg,#e8edff 0%,#eef1ff 18%,#f6f7fc 42%,#f8f9fc 100%);font-family:var(--font-sans);color:var(--text);padding:1.35rem 1rem 2rem;font-size:var(--fs-base);line-height:var(--lh);-webkit-text-size-adjust:100%;}
.wrap{max-width:820px;margin:0 auto;width:100%;}
/* 시험 모드 · PC OMR 답안지 + 타이머 (국가기술자격 CBT 스타일) */
.side-dock{display:none;position:fixed;right:max(10px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));bottom:max(10px,env(safe-area-inset-bottom));width:280px;z-index:45;flex-direction:column;gap:8px;pointer-events:none;}
.side-dock > *{pointer-events:auto;}

/* 타이머 닫힌 뒤 다시 열기 스트립 (PC side-dock) */
.exam-timer-reopen{
  display:none;flex-shrink:0;align-items:center;justify-content:space-between;gap:8px;
  background:#fff;border:1px solid var(--border);border-radius:14px;padding:10px 12px;
  box-shadow:0 4px 14px rgba(30,28,60,.08);
}
.exam-timer-reopen.show{display:flex;}
.exam-timer-reopen b{font-size:13px;font-weight:800;color:#92400e;}
.exam-timer-reopen button{
  border:0;background:var(--indigo);color:#fff;border-radius:10px;padding:8px 12px;
  font-size:12.5px;font-weight:800;cursor:pointer;font-family:inherit;
}
/* 미니바 타이머 아이콘 — 시안: 원형 아이콘 버튼 */
body.solve-play .solve-mini-right .solve-timer-ico{
  display:inline-flex!important;
}
body.solve-play.timer-open .solve-mini-right .solve-timer-ico{
  /* 타이머 패널 열리면 아이콘 유지(토글) 또는 약하게 */
  background:#eef0fe;color:#3b48d8;
}
body.solve-play .solve-mini-right .solve-timer-close{display:none!important;}

.exam-timer-panel{flex-shrink:0;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 28px rgba(30,28,60,.12);overflow:hidden;}
.exam-timer-panel .et-hd{padding:10px 12px 6px;background:linear-gradient(180deg,#fff7ed,#fff);border-bottom:1px solid #fde68a;display:flex;align-items:center;justify-content:space-between;gap:8px;}
.exam-timer-panel .et-hd b{font-size:13px;font-weight:800;color:#92400e;margin:0;flex:1;min-width:0;}
.exam-timer-panel .et-hd .et-close,
.exam-timer-panel .et-hd .et-open{
  flex-shrink:0;margin-left:auto;border:1px solid #fde68a;background:#fff;color:#92400e;
  border-radius:999px;padding:4px 12px;font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;line-height:1.3;
}
.exam-timer-panel .et-hd .et-close:hover,
.exam-timer-panel .et-hd .et-open:hover{background:#fff7ed;border-color:#f59e0b;}
.exam-timer-panel .et-hd .et-open{
  background:#fffbeb;border-color:#fde68a;color:#92400e;display:inline-flex;align-items:center;
}
.exam-timer-panel .et-hd .et-close{display:inline-flex;align-items:center;}
/* 접힌 타이머: 헤더만 */
.exam-timer-panel.et-collapsed .et-clock,
.exam-timer-panel.et-collapsed .et-sub,
.exam-timer-panel.et-collapsed .et-adj,
.exam-timer-panel.et-collapsed .et-btns,
.exam-timer-panel.et-collapsed .et-presets,
.exam-timer-panel.et-collapsed .et-opts{display:none!important;}
.exam-timer-panel.et-collapsed .et-hd{border-bottom:0;}
.exam-timer-panel .et-presets{display:none;}
.exam-timer-panel .et-adj{
  display:flex;align-items:center;justify-content:center;gap:6px;padding:4px 10px 8px;flex-wrap:wrap;
}
.exam-timer-panel .et-adj button{
  border:1px solid var(--border);background:#fafbff;border-radius:10px;
  padding:6px 10px;font-size:12.5px;font-weight:800;color:var(--sub);cursor:pointer;font-family:inherit;min-width:40px;
}
.exam-timer-panel .et-adj button:hover{border-color:var(--indigo-soft);color:var(--indigo);}
.exam-timer-panel .et-adj button:disabled{opacity:.4;cursor:default;}
.exam-timer-panel .et-opts{display:none !important;}
.exam-timer-panel .et-clock{font-variant-numeric:tabular-nums;font-size:2rem;font-weight:900;letter-spacing:.02em;text-align:center;padding:6px 10px 2px;color:var(--indigo);line-height:1.1;}
.exam-timer-panel .et-clock.warn{color:#b45309;}
.exam-timer-panel .et-clock.danger{color:#b91c1c;animation:etPulse 1s ease infinite;}
@keyframes etPulse{0%,100%{opacity:1}50%{opacity:.55}}
.exam-timer-panel .et-sub{font-size:11px;font-weight:700;color:var(--sub);text-align:center;padding:0 10px 8px;line-height:1.35;}
.exam-timer-panel .et-btns{display:flex;gap:6px;padding:0 10px 10px;flex-wrap:wrap;}
.exam-timer-panel .et-btns button{flex:1;min-width:64px;border:1px solid var(--border);background:#eef1ff;border-radius:10px;padding:8px 6px;font-size:12.5px;font-weight:800;color:var(--indigo);cursor:pointer;}
.exam-timer-panel .et-btns button.primary{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.exam-timer-panel .et-btns button:disabled{opacity:.45;cursor:default;}
/* 타이머 옵션: 라벨·컨트롤 간격 타이트 */
.exam-timer-panel .et-opts{
  padding:0 10px 10px;display:flex;flex-direction:column;gap:6px;
}
.et-opt-row{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;border-radius:10px;background:#fafbff;border:1px solid #eef0f6;
  font-size:12.5px;font-weight:700;color:var(--text);cursor:pointer;user-select:none;
  margin:0;line-height:1.3;
}
.et-opt-row:active{background:#f4f6ff;}
.et-opt-row .et-opt-txt{flex:1;min-width:0;}
.et-opt-row .et-opt-txt small{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-top:2px;}
.et-opt-row input[type=checkbox]{
  width:18px;height:18px;margin:0;flex-shrink:0;accent-color:var(--indigo);cursor:pointer;
}
.et-opt-row select{
  flex:0 0 auto;width:auto;min-width:72px;max-width:40%;
  border:1px solid var(--border);border-radius:8px;padding:5px 8px;
  font-size:12.5px;font-weight:800;background:#fff;color:var(--text);cursor:pointer;
}
.omr-dock{display:none;flex:1;min-height:0;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 28px rgba(30,28,60,.14);overflow:hidden;}
.omr-dock .omr-hd{
  padding:12px 14px 10px;border-bottom:1px solid var(--border);background:#fff;flex-shrink:0;
  display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
}
.omr-dock .omr-hd b{display:block;font-size:15px;font-weight:900;color:#312e81;letter-spacing:-.02em;}
.omr-dock .omr-hd .meta{
  font-size:12.5px;color:var(--muted);font-weight:800;margin-top:2px;line-height:1.3;
  white-space:nowrap;flex-shrink:0;
}
.omr-dock .omr-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 8px 10px;min-height:0;}
.omr-row{display:grid;grid-template-columns:22px 24px repeat(4,1fr);gap:2px;align-items:center;padding:2px 2px;border-bottom:1px solid #f4f4f8;border-radius:7px;}
.omr-row.ch5{grid-template-columns:22px 24px repeat(5,1fr);}
.omr-row:last-child{border-bottom:0;}
.omr-row.omr-current{outline:2px solid #c8cdf8;outline-offset:-1px;background:#f5f6ff;}
.omr-row.omr-current.flagged{background:#fff8e8;}
/* omr-flag 리본 아이콘 스타일은 아래 북마크 블록과 공용 */
.omr-n{font-size:11.5px;font-weight:800;color:var(--indigo);text-align:center;cursor:pointer;border:0;background:transparent;padding:2px 0;border-radius:6px;}
.omr-n:hover{background:#eef2ff;}
.omr-b{border:1.5px solid #c5c9e0;background:#fafbff;border-radius:999px;width:100%;aspect-ratio:1;max-height:24px;max-width:24px;margin:0 auto;font-size:10.5px;font-weight:800;color:var(--sub);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;}
.omr-b:hover{border-color:var(--indigo);color:var(--indigo);}
.omr-b.on{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.omr-b.ok{background:#12b76a;border-color:#12b76a;color:#fff;}
.omr-b.no{background:#f04438;border-color:#f04438;color:#fff;}
.omr-b.ans{box-shadow:0 0 0 2px #12b76a inset;border-color:#12b76a;}
.omr-row.unmarked .omr-n{color:#b45309;}
.omr-row.flagged{background:#fffbeb;}
.omr-ft{padding:8px 10px 10px;border-top:1px solid var(--border);flex-shrink:0;background:#fafafa;}
.omr-ft .scorebtn,.omr-ft .resetbtn{width:100%;margin-top:6px;}
.omr-ft .scorebtn:first-child,.omr-ft .resetbtn:first-child{margin-top:0;}
.omr-hint{font-size:11px;color:var(--muted);line-height:1.4;margin:0 0 6px;}
/* 문항 북마크 — 리본 아이콘 (미선택: 투명 윤곽 / 선택: 코랄 로즈) */
/* ⚠ touch-action:manipulation 은 장식이 아니다 — 뷰포트가 user-scalable=yes 라
   이게 없는 요소는 iOS 사파리가 「더블탭 확대인지」 보려고 탭을 ~350ms 붙들고,
   그 사이 두 번째 탭이 오면 **두 탭을 모두 확대 제스처로 먹어 버린다**(운영자: 「북마크
   누를 때 씹힘」). 선지(.choice)에만 걸려 있어 선지는 즉각·북마크는 씹혔다.
   ⛔ 지우지 말 것. 같은 이유로 .omr-flag · .rv-chip 에도 건다 (2026-08-01). */
.chkbtn{
  border:0;background:transparent;color:transparent;border-radius:10px;
  padding:6px;width:40px;height:40px;cursor:pointer;line-height:0;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.chkbtn .bm-ico{display:block;width:22px;height:26px;}
.chkbtn .bm-ico svg{display:block;width:100%;height:100%;}
/* 미선택: 채움 투명, 부드러운 회색 윤곽 */
.chkbtn .bm-fill{fill:transparent;}
.chkbtn .bm-stroke{stroke:#c5c9d6;stroke-width:1.6;fill:none;}
.chkbtn:hover .bm-stroke{stroke:#9aa3b5;}
.chkbtn:hover{background:rgba(0,0,0,.04);}
/* 선택: 자연스러운 코랄 로즈 (순수 빨강 대신 살짝 톤 다운) */
.chkbtn.on .bm-fill{fill:#e2554a;}
.chkbtn.on .bm-stroke{stroke:#c2410c;stroke-width:1.4;}
.chkbtn.on:hover .bm-fill{fill:#d6453d;}
.chkbtn.on{background:transparent;}
.card.card-checked{outline:none;box-shadow:none;}
.card.card-checked .card-head-slim .chkbtn.on{/* 선택 시 카드 외곽 강조 없음 — 아이콘만 */}
.iconbtn.active-check{background:#fff5f4;border-color:#f5c4bf;color:#c2410c;}
/* OMR 별 → 미니 리본 */
.omr-flag{
  border:0;background:transparent;border-radius:6px;width:28px;height:28px;
  font-size:0;cursor:pointer;padding:0;line-height:0;
  display:inline-flex;align-items:center;justify-content:center;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
.omr-flag:hover{background:rgba(0,0,0,.04);}
.omr-flag .bm-ico{width:16px;height:19px;display:block;}
.omr-flag .bm-ico svg{width:100%;height:100%;display:block;}
.omr-flag .bm-fill{fill:transparent;}
.omr-flag .bm-stroke{stroke:#c5c9d6;stroke-width:1.6;fill:none;}
.omr-flag.on .bm-fill{fill:#e2554a;}
.omr-flag.on .bm-stroke{stroke:#c2410c;stroke-width:1.4;}

/* 로그인 필수 안내 */
.login-gate-overlay{display:none;position:fixed;inset:0;z-index:120;background:rgba(20,22,40,.48);align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(3px);}
.login-gate-overlay.show{display:flex;}
.login-gate-panel{position:relative;background:#fff;border-radius:18px;padding:28px 24px 20px;max-width:380px;width:100%;box-shadow:0 20px 50px rgba(30,28,60,.22);text-align:center;}
.login-gate-panel h2{margin:0 0 10px;font-size:1.15rem;font-weight:900;color:var(--text);line-height:1.35;}
.login-gate-panel p{margin:0 0 18px;font-size:14px;line-height:1.55;color:var(--sub);font-weight:600;}
.login-gate-ico{font-size:2rem;margin-bottom:8px;line-height:1;}
.login-gate-x{position:absolute;top:10px;right:12px;border:0;background:transparent;font-size:22px;color:var(--muted);cursor:pointer;line-height:1;padding:4px 8px;}
.login-gate-cta{width:100%;padding:12px 16px;font-size:15px;}
body.login-gate-open{overflow:hidden;}

/* 미로그인 저장불가 안내 (풀이·시험 입장) */
.guest-save-overlay{display:none;position:fixed;inset:0;z-index:125;background:rgba(20,22,40,.42);align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px);}
.guest-save-overlay.show{display:flex;}
/* 이어하기 커버가 먼저 올라온 세트 진입에서도 게스트 관문은 그 위에 보여야 한다. */
html.resume-boot body > #guestSaveOverlay.show{
  visibility:visible!important;pointer-events:auto!important;opacity:1!important;
  display:flex!important;z-index:2147483647!important;
}
.guest-save-panel{
  position:relative;background:#fff;border-radius:20px;padding:28px 24px 22px;
  max-width:360px;width:100%;box-shadow:0 24px 56px rgba(20,22,40,.2);
  text-align:left;font-family:inherit;
}
.guest-save-panel h2{margin:0 0 12px;font-size:1.12rem;font-weight:900;color:#1B1F2E;letter-spacing:-.02em;line-height:1.35;padding-right:28px;}
.guest-save-panel .gs-body{margin:0 0 20px;font-size:14px;line-height:1.6;color:#4a4f5c;font-weight:500;}
.guest-save-x{position:absolute;top:12px;right:12px;border:0;background:transparent;font-size:22px;color:#9aa1b0;cursor:pointer;line-height:1;padding:4px 8px;border-radius:8px;}
.guest-save-x:hover{background:#f3f4f8;color:#5b6070;}
.guest-save-acts{display:flex;gap:10px;align-items:stretch;}
.guest-save-acts button{flex:1;font-family:inherit;font-size:14.5px;font-weight:800;padding:13px 12px;border-radius:12px;cursor:pointer;line-height:1.2;}
.guest-save-skip{border:1.5px solid #e2e4ee;background:#fff;color:#1B1F2E;}
.guest-save-skip:hover{border-color:#c8ccd8;background:#fafbff;}
.guest-save-login{border:0;background:#1B1F2E;color:#fff;}
.guest-save-login:hover{filter:brightness(1.08);}
.guest-save-day{
  display:flex;align-items:center;gap:8px;margin-top:16px;cursor:pointer;
  font-size:13px;font-weight:600;color:#8b91a0;user-select:none;
}
.guest-save-day input{position:absolute;opacity:0;width:0;height:0;}
.guest-save-day .gs-check{
  width:20px;height:20px;border-radius:999px;border:1.5px solid #d0d4e0;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  font-size:11px;font-weight:900;color:transparent;transition:.12s;
}
.guest-save-day input:checked + .gs-check{background:#1B1F2E;border-color:#1B1F2E;color:#fff;}
.guest-save-day input:checked + .gs-check::after{content:'✓';}
body.guest-save-open{overflow:hidden;}


.exam-timer-mobile .etm-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;width:100%;}
.exam-timer-mobile .etm-settings{width:100%;margin-top:8px;padding-top:8px;border-top:1px dashed #e5e7eb;display:flex;flex-direction:column;gap:8px;}
.exam-timer-mobile .etm-settings[hidden]{display:none !important;}
.exam-timer-mobile .etm-settings .et-presets{display:none;}
.exam-timer-mobile .et-opt-row{display:none !important;}
.exam-timer-mobile .et-adj{
  display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
}
.exam-timer-mobile .et-adj button{
  border:1px solid var(--border);background:#fafbff;border-radius:10px;
  padding:6px 10px;font-size:12.5px;font-weight:800;color:var(--sub);cursor:pointer;font-family:inherit;min-width:40px;
}
.exam-timer-mobile .etm-set-title{font-size:12.5px;font-weight:800;color:#92400e;}
.exam-timer-mobile .etm-opt,
.exam-timer-mobile .et-opt-row{
  display:flex;align-items:center;gap:10px;justify-content:flex-start;
  padding:9px 10px;border-radius:10px;background:#fffbeb;border:1px solid #fde68a;
  font-size:13px;font-weight:700;color:var(--text);cursor:pointer;user-select:none;margin:0;
}
.exam-timer-mobile .et-opt-row .et-opt-txt{flex:1;min-width:0;}
.exam-timer-mobile .et-opt-row .et-opt-txt small{display:block;font-size:11px;font-weight:600;color:#a16207;margin-top:2px;}
.exam-timer-mobile .et-opt-row input[type=checkbox]{width:18px;height:18px;margin:0;flex-shrink:0;accent-color:#d97706;}
.exam-timer-mobile .et-opt-row select{
  flex:0 0 auto;width:auto;min-width:70px;max-width:38%;
  border:1px solid #fcd34d;border-radius:8px;padding:6px 8px;font-size:12.5px;font-weight:800;background:#fff;
}
.exam-timer-mobile .etm-hint{margin:0;font-size:11.5px;line-height:1.45;color:var(--muted);font-weight:600;}
.exam-timer-mobile .et-presets{display:flex;flex-wrap:wrap;gap:4px;}
.exam-timer-mobile .et-presets button{border:1px solid var(--border);background:#fafbff;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:700;color:var(--sub);cursor:pointer;}
.exam-timer-mobile .et-presets button.on{background:#fff7ed;border-color:#fbbf24;color:#92400e;}
#etmSetBtn.on{background:#fff7ed;border-color:#fbbf24;color:#92400e;}

/* 랜딩→학습실·#sr 진입: 문제은행 목록 깜빡임 차단 (학습실 오버레이만 노출) */
/* 학습실 딥링크 부팅 커버.
   ⛔ `body > .site-footer` 를 지우지 말 것 — 푸터는 `.wrap` 안이 **아니라 body 직계**다
      (런타임 실측 2026-08-22: `#siteFooter.site-footer < body.qb-guest`). 지우면 학습실 뒤로
      「(주)켐탑에듀케이션 …」이 그대로 읽힌다. 소스 줄번호로 추정하지 말 것 — `.wrap` 은
      푸터 마크업보다 **앞에서** 닫힌다.
   ⛔ `#solveShell` 도 body 직계다 — 「0 / 0」 바·목록·「다음 문제」가 여기 들어 있다.
      이게 빠져 있어서 학습실 뒤로 빈 풀이 화면이 읽혔다 (2026-08-22 운영자 제보의 그 화면).
      ⛔ `.solve-shell` 을 빼지 말 것 — 그러면 `body.solve-play #solveShell.solve-shell`
         (`visibility:visible !important`)과 특이도가 같아져 **뒤에 있는 그 규칙이 이긴다.**
      ⛔ 자손 `*` 도 빼지 말 것 — `visibility` 는 상속이라 자손이 스스로 `visible !important`
         를 걸면 되살아난다. 「0 / 0」 미니바(`body.solve-play #solveMini.solve-mini`)와
         하단 네비가 정확히 그렇게 다시 보였다.
   · `body > .envwarn` 은 실제로 `.wrap` 안이라 이 줄 없이도 상속으로 덮인다(무해해 남겨 둔다).
   ⛔ `display:none` 으로 바꾸지 말 것 — 풀이 스크롤 위치·연습장 캔버스가 날아간다. */
html.sr-boot body > .wrap,
html.sr-boot body > .envwarn,
html.sr-boot body > .site-footer,
html.sr-boot body > #solveShell.solve-shell,
html.sr-boot body > #solveShell.solve-shell *{visibility:hidden !important;pointer-events:none !important;}
html.sr-boot body.studyroom-open #studyRoomOverlay{visibility:visible !important;pointer-events:auto !important;}
html.sr-boot #list{opacity:0;pointer-events:none;}
html.sr-boot .toolbar{opacity:.35;}
/* OAuth 콜백: 폐기 /app 허브(이어서 풀기·하단탭) 깜빡임 금지 — 로딩만 */
html.oauth-boot,
html.oauth-boot body{
  background:#eef1ff !important;
  overflow:hidden !important;
}
html.oauth-boot body > *:not(#qbLoadBar):not(#oauthBootSplash){
  visibility:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
}
html.oauth-boot #qbLoadBar{
  visibility:visible !important;
  pointer-events:none !important;
  opacity:1 !important;
  display:block !important;
  z-index:2147483646 !important;
}
html.oauth-boot #oauthBootSplash{
  visibility:visible !important;
  pointer-events:none !important;
  opacity:1 !important;
  display:flex !important;
  position:fixed !important;
  inset:0 !important;
  z-index:2147483645 !important;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:12px;
  background:linear-gradient(180deg,#e8edff 0%,#f6f7fc 100%);
  color:#5e6478;
  font:700 15px/1.4 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
html.oauth-boot #oauthBootSplash .obs-spin{
  width:28px;height:28px;border-radius:50%;
  border:3px solid #c8d0f8;border-top-color:#3D5AFE;
  animation:oauthBootSpin .7s linear infinite;
}
@keyframes oauthBootSpin{to{transform:rotate(360deg)}}
/* 이어하기 진입: 빈 0/0·중간 셸·부분 큐 한 프레임도 금지 — 단일 전체 화면 로딩만 */
html.resume-boot body{
  background:#eef1ff !important;
  overflow:hidden !important;
}
html.resume-boot body > *:not(#qbLoadBar):not(#qbResumeBootOverlay):not(#guestSaveOverlay){
  visibility:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
}
html.resume-boot #qbLoadBar{
  visibility:visible !important;
  pointer-events:none !important;
  opacity:1 !important;
  display:block !important;
  z-index:2147483646 !important;
}
html.resume-boot #qbResumeBootOverlay,
#qbResumeBootOverlay.resume-boot-show{
  visibility:visible !important;
  pointer-events:none !important;
  opacity:1 !important;
  display:flex !important;
  position:fixed !important;
  inset:0 !important;
  z-index:2147483645 !important;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:10px;
  background:linear-gradient(180deg,#e8edff 0%,#f6f7fc 100%);
  color:#5e6478;
  font:700 15px/1.45 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  text-align:center;
  padding:24px 18px;
  box-sizing:border-box;
}
#qbResumeBootOverlay{
  display:none;
}
/* 빠른 이어하기: 배경 커버만(중간 셸 가림). 문구·스피너는 지연 후에만 (rbo-chrome-show) */
#qbResumeBootOverlay .rbo-spin,
#qbResumeBootOverlay .rbo-title,
#qbResumeBootOverlay .rbo-sub,
#qbResumeBootOverlay .rbo-bar{
  opacity:0;
  visibility:hidden;
  transition:opacity .12s ease;
}
#qbResumeBootOverlay.rbo-chrome-show .rbo-spin,
#qbResumeBootOverlay.rbo-chrome-show .rbo-title,
#qbResumeBootOverlay.rbo-chrome-show .rbo-sub,
#qbResumeBootOverlay.rbo-chrome-show .rbo-bar:not([hidden]){
  opacity:1;
  visibility:visible;
}
#qbResumeBootOverlay .rbo-spin{
  width:28px;height:28px;border-radius:50%;
  border:3px solid #c8d0f8;border-top-color:#3D5AFE;
  animation:oauthBootSpin .7s linear infinite;
  margin:0 auto 4px;
}
#qbResumeBootOverlay .rbo-title{
  font-size:15px;font-weight:800;color:var(--text,#1b1f2e);letter-spacing:-.02em;
}
#qbResumeBootOverlay .rbo-sub{
  font-size:12.5px;font-weight:600;color:var(--sub,#5e6478);margin-top:2px;
}
/* 진행 막대 (S2-P257) — 회차 JSON 을 몇 개나 받았는지. 폭은 JS 가 넣는다. */
#qbResumeBootOverlay .rbo-bar{
  width:min(200px,62vw);height:4px;margin-top:8px;
  border-radius:999px;background:#d7ddf8;overflow:hidden;
}
#qbResumeBootOverlay .rbo-bar > i{
  display:block;height:100%;width:0;
  border-radius:inherit;background:var(--brand,#3D5AFE);
  transition:width .25s ease;
}
@media (prefers-reduced-motion:reduce){
  #qbResumeBootOverlay .rbo-bar > i{ transition:none; }
}
/* 폐기: /app 내부 이어서 풀기 허브 — 트랙(/g9/ 등)이 선택 진입점. 절대 표시 금지 */
#hubHeroWrap, #hubDock, #hubMainGrid, .hub-main-grid, #hubDash,
#hubExamSec, #hubQuickSec, .hub-sec-hd, #hubToolsSec, #solveEnterWrap,
body.solve-hub #hubHeroWrap, body.solve-hub #hubDock, body.solve-hub #hubMainGrid,
body.solve-hub .hub-dock, body.solve-hub .hub-hero-wrap, body.solve-hub .hub-main-grid{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
}
/* 상단 로딩 바 — 회차/과목 전환 체감 */
#qbLoadBar{position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;pointer-events:none;opacity:0;transition:opacity .2s;}
#qbLoadBar.on{opacity:1;}
#qbLoadBar > i{display:block;height:100%;width:28%;background:linear-gradient(90deg,#3D5AFE,#818cf8,#3D5AFE);border-radius:0 2px 2px 0;animation:qbLoadSlide 1s ease-in-out infinite;}
@keyframes qbLoadSlide{0%{transform:translateX(-120%)}100%{transform:translateX(420%)}}
.list-skel{border:1px dashed var(--border);border-radius:16px;padding:28px 16px;text-align:center;color:var(--sub);font-weight:700;background:#fafbff;}
/* 모바일 타이머 바 — 풀이 중에는 미니바 칩으로 대체 (공간 절약) */
.exam-timer-mobile{display:none;position:sticky;top:0;z-index:40;margin:0 0 10px;padding:10px 12px;background:#fff;border:1px solid #fde68a;border-radius:12px;box-shadow:var(--shadow-sm);align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.exam-timer-mobile.show{display:flex;}
/* 풀이 화면: 큰 노란 카드 숨김 (설정 펼침 때만 얇게 표시) */
body.solve-play .exam-timer-mobile.show{display:none !important;}
body.solve-play .exam-timer-mobile.show.etm-settings-open{
  display:flex !important;flex-direction:column;margin:0;border-radius:0;border-left:0;border-right:0;
  border-top:0;position:sticky;top:52px;z-index:34;padding:8px 12px 10px;
}
body.solve-play .exam-timer-mobile.show.etm-settings-open .etm-top{display:none !important;}
.exam-timer-mobile .etm-clock{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:900;color:var(--indigo);}
.exam-timer-mobile .etm-clock.warn{color:#b45309;}
.exam-timer-mobile .etm-clock.danger{color:#b91c1c;}
.exam-timer-mobile .etm-acts{display:flex;gap:6px;flex-wrap:wrap;}
.exam-timer-mobile .etm-acts button{border:1px solid var(--border);background:#eef1ff;border-radius:10px;padding:6px 10px;font-size:12px;font-weight:800;color:var(--indigo);cursor:pointer;}
/* 미니바 타이머 칩 반응형 (본 스타일은 .solve-mini-timer 시안 블록 참고) */
body.solve-play .solve-mini-title{max-width:100%;}
/* 모바일: 칩이 뜨면 ⏱ 아이콘 숨김 → 시험명 공간 확보 */
@media (max-width:720px){
  body.solve-play .solve-mini-right:has(.solve-mini-timer.show) .solve-timer-ico{
    display:none !important;
  }
  .solve-mini-timer .smt-clock{font-size:12.5px;padding:6px 9px 6px 8px;gap:3px;}
  .solve-mini-timer .smt-ico{font-size:10px;}
}
@media (max-width:380px){
  .solve-mini-timer .smt-clock{font-size:11.5px;padding:5px 7px 5px 6px;gap:2px;}
  .solve-mini-timer .smt-ico{font-size:9px;}
}
@media (min-width:1100px){
  /* 시험 카운트다운: PC는 사이드 패널 사용 → 미니 칩 숨김
     학습 스톱워치: 미니 칩으로 경과 표시 */
  body:not(.timer-stopwatch) .solve-mini-timer{display:none !important;}
  body.timer-stopwatch .solve-mini-timer.show{display:inline-flex !important;}
  /* 목록 시험/타이머: 고정 독. 풀이 임베드 시험은 제외 */
  body.mode-test:not(.admin-page):not(.studyroom-open):not(.solve-play):not(.solve-exam-embed) .side-dock,
  body.timer-open:not(.admin-page):not(.studyroom-open):not(.solve-exam-embed):not(.timer-stopwatch):not(.mode-study) .side-dock{display:flex;}
  body.mode-test:not(.admin-page):not(.solve-play):not(.solve-exam-embed),
  body.timer-open:not(.admin-page):not(.solve-exam-embed):not(.mode-test):not(.timer-stopwatch):not(.mode-study){padding-right:min(308px,30vw);}
  body.mode-test:not(.admin-page):not(.solve-play):not(.solve-exam-embed) .wrap,
  body.timer-open:not(.admin-page):not(.solve-exam-embed):not(.mode-test):not(.timer-stopwatch):not(.mode-study) .wrap{margin-right:0;}
  body.mode-test:not(.admin-page):not(.studyroom-open):not(.solve-play) .omr-dock{display:flex;}
  /* 학습 스톱워치: OMR·사이드독 강제 숨김 */
  body.timer-stopwatch .side-dock,
  body.mode-study.solve-play .side-dock,
  body.timer-stopwatch #solveExamDockHost,
  body.mode-study.solve-play #solveExamDockHost,
  body.timer-stopwatch .omr-dock{display:none !important;}
  .exam-timer-mobile{display:none !important;}
  /* 단, 시험 CBT 에서 「시간」을 누르면 설정 패널은 PC 에서도 열려야 한다 (2026-07-30 운영자:
     시간 버튼 무반응). exam-cbt 는 PC 타이머 카드(.exam-timer-panel)를 숨기므로
     이 패널이 유일한 시간 설정 UI 다. 상단 바 아래 드롭다운으로 띄운다. */
  body.exam-cbt .exam-timer-mobile.show.etm-settings-open{
    display:flex !important;
    position:fixed !important; top:calc(var(--ecb-h, 56px) + 8px) !important;
    right:calc(min(264px,24vw) + 12px) !important; left:auto !important;
    width:min(360px, 42vw) !important; margin:0 !important; z-index:2100 !important;
    box-shadow:0 18px 44px rgba(20,22,40,.22) !important;
  }
}
@media (max-width:1099px){
  body.mode-test{padding-right:1rem;}
  .side-dock{display:none !important;}
  /* 모바일 시험: OMR 답안지 제거 (문항·미니바·문제 선택으로 충분) */
  #omrDock,
  .omr-dock,
  #solveExamDockHost .omr-dock{
    display:none !important;
    height:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    pointer-events:none !important;
    visibility:hidden !important;
  }
  /* 미채점 시험 풀이: 사이드(OMR 자리) 자체 숨김 → 문제 전체 폭 */
  body.solve-play.mode-test:not(.solve-test-graded) .solve-side{
    display:none !important;
  }
  body.solve-play.mode-test:not(.solve-test-graded) .solve-layout{
    grid-template-columns:1fr !important;
  }
}
/* ---------- 인쇄 설정 모달 ---------- */
.print-modal-backdrop{position:fixed;inset:0;z-index:140;background:rgba(15,18,35,.48);display:none;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;}
.print-modal-backdrop.show{display:flex;}
.print-modal{background:#fff;border-radius:16px;max-width:440px;width:100%;padding:18px 18px 16px;box-shadow:0 16px 48px rgba(20,20,50,.28);max-height:min(90vh,640px);overflow-y:auto;}
.print-modal h3{margin:0 0 12px;font-size:1.1rem;font-weight:800;}
.print-modal label.rowl{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;font-weight:600;color:var(--text);margin:8px 0;cursor:pointer;line-height:1.4;}
.print-modal label.rowl input{margin-top:3px;flex-shrink:0;}
.print-modal .fld{margin:10px 0;}
.print-modal .fld>span{display:block;font-size:12px;font-weight:800;color:var(--sub);margin-bottom:6px;}
.print-modal select{width:100%;border:1px solid var(--border);border-radius:10px;padding:9px 12px;font-size:14px;font-weight:700;background:#fff;}
.print-modal .psum{background:#f5f6ff;border:1px solid #e0e4ff;border-radius:10px;padding:10px 12px;font-size:12.5px;line-height:1.5;color:var(--sub);margin:10px 0 4px;}
.print-modal .mrow{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap;}
/* ---------- 인쇄 시트 (body 직속 · 화면 숨김 · 인쇄 시만) ----------
   주의: printRoot 는 .wrap 안이 아니라 body 직속이어야 함.
   body > * 숨김 시 부모가 사라지면 자식도 함께 사라져 미리보기가 빈 화면이 됨. */
#printRoot{display:none;color:#111;background:#fff;font-family:"Apple SD Gothic Neo","Malgun Gothic",sans-serif;box-sizing:border-box;}
body.is-printing #printRoot{
  display:block !important;position:fixed;inset:0;z-index:2147483000;
  overflow:auto;padding:16px;background:#fff !important;
}
body.is-printing > *:not(#printRoot):not(script):not(style):not(link){display:none !important;}
#printRoot .ph{margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid #222;}
#printRoot .ph h1{font-size:14pt;margin:0 0 4px;font-weight:800;}
#printRoot .ph .meta{font-size:9pt;color:#444;line-height:1.45;}
#printRoot .pq{break-inside:avoid;page-break-inside:avoid;margin:0 0 12px;padding:0 0 8px;border-bottom:1px solid #ddd;max-width:100%;box-sizing:border-box;}
#printRoot .pq:last-of-type{border-bottom:0;}
#printRoot .pq-hd{font-size:10pt;font-weight:800;margin:0 0 4px;color:#1a1a2e;}
#printRoot .pq-exam{font-size:8pt;color:#555;font-weight:600;margin:0 0 6px;}
/* pre-line: 지문 내 ㄱ/ㄴ/ㄷ · (가)(나) 줄바꿈 유지 (화면 .stem 과 동일) */
#printRoot .pq-stem{font-size:10.5pt;line-height:1.55;margin:0 0 8px;white-space:pre-line;overflow-wrap:anywhere;word-break:keep-all;}
/* 인쇄 도표: 600dpi 원본이 픽셀 폭 그대로 나가 잘리는 문제 방지 — mm 상한 + 100% */
#printRoot .pq-imgwrap{display:block;max-width:100%;width:100%;margin:5px 0 8px;box-sizing:border-box;overflow:visible;text-align:left;}
#printRoot .pq-imgwrap.kind-tank{text-align:center;}
#printRoot .pq-dimg,#printRoot .pq-chimg{
  display:block !important;width:auto !important;height:auto !important;
  max-width:100% !important;object-fit:contain !important;object-position:left top;
  margin:0;border:0;image-rendering:auto;-webkit-print-color-adjust:exact;print-color-adjust:exact;
}
/* 지문 도표 기본 상한 (A4 인쇄 폭 ~186mm 여유 두고 본문과 균형) */
#printRoot .pq-imgwrap.kind-formula .pq-dimg{max-width:95mm !important;max-height:48mm !important;}
#printRoot .pq-imgwrap.kind-tank .pq-dimg{max-width:115mm !important;max-height:70mm !important;}
#printRoot .pq-imgwrap.kind-table .pq-dimg,
#printRoot .pq-imgwrap.kind-box .pq-dimg{max-width:145mm !important;max-height:78mm !important;}
#printRoot .pq-imgwrap.kind-wide .pq-dimg{max-width:100% !important;max-height:72mm !important;}
#printRoot .pq-imgwrap.kind-box .pq-dimg,#printRoot .pq-imgwrap:not([class*="kind-"]) .pq-dimg{max-width:145mm !important;max-height:78mm !important;}
/* 선지 이미지: 카드폭 사용하되 세로 과대 방지 */
#printRoot .pq-chimgwrap{display:block;max-width:100%;width:100%;margin:4px 0 8px;box-sizing:border-box;}
#printRoot .pq-chimg{max-width:100% !important;max-height:110mm !important;}
#printRoot .pq-chimgwrap.kind-formula .pq-chimg{max-width:100% !important;max-height:100mm !important;}
#printRoot .pq-chimgwrap.kind-table .pq-chimg,
#printRoot .pq-chimgwrap.kind-box .pq-chimg,
#printRoot .pq-chimgwrap.kind-wide .pq-chimg{max-width:100% !important;max-height:95mm !important;}
#printRoot .pq-ch{margin:2px 0;font-size:10pt;line-height:1.45;display:flex;gap:6px;align-items:flex-start;}
#printRoot .pq-ch .cn{flex-shrink:0;font-weight:800;min-width:1.2em;}
#printRoot .pq-ans{margin-top:6px;font-size:9.5pt;font-weight:800;color:#0b5;padding:4px 0 0;}
#printRoot .pq-exp{margin-top:6px;font-size:9pt;line-height:1.5;color:#222;background:#f7f7f9;border:1px solid #e2e2ea;border-radius:6px;padding:8px 10px;}
#printRoot .pq-exp b{font-weight:800;}
#printRoot .pq-exp img{max-width:100% !important;max-height:60mm !important;height:auto !important;}
#printRoot .pq-exp-miss{margin-top:6px;font-size:8.5pt;color:#888;font-style:italic;}
#printRoot .omr-print{break-before:page;page-break-before:always;margin-top:8px;}
#printRoot .omr-print h2{font-size:12pt;margin:0 0 8px;}
#printRoot .omr-print table{width:100%;border-collapse:collapse;font-size:9pt;}
#printRoot .omr-print td{border:1px solid #ccc;padding:5px 4px;text-align:center;}
#printRoot .omr-print .n{font-weight:800;width:2.2em;}
#printRoot .omr-print .b{width:1.6em;}
/* 용지별 가독성 + 도표 스케일 */
#printRoot.ps-a4{font-size:11pt;}
#printRoot.ps-a4 .pq-stem{font-size:11pt;}
#printRoot.ps-letter{font-size:11pt;}
#printRoot.ps-b5{font-size:10pt;}
#printRoot.ps-b5 .pq-stem{font-size:10.2pt;}
#printRoot.ps-b5 .pq-ch{font-size:9.5pt;}
#printRoot.ps-b5 .pq-imgwrap.kind-formula .pq-dimg{max-width:80mm !important;max-height:42mm !important;}
#printRoot.ps-b5 .pq-imgwrap.kind-tank .pq-dimg{max-width:95mm !important;max-height:58mm !important;}
#printRoot.ps-b5 .pq-imgwrap.kind-table .pq-dimg,
#printRoot.ps-b5 .pq-imgwrap.kind-box .pq-dimg,
#printRoot.ps-b5 .pq-imgwrap:not([class*="kind-"]) .pq-dimg{max-width:120mm !important;max-height:65mm !important;}
#printRoot.ps-b5 .pq-imgwrap.kind-wide .pq-dimg{max-height:60mm !important;}
#printRoot.ps-b5 .pq-chimg{max-height:90mm !important;}
#printRoot.ps-a5{font-size:9.5pt;}
#printRoot.ps-a5 .pq-stem{font-size:9.5pt;}
#printRoot.ps-a5 .pq-ch{font-size:9pt;}
#printRoot.ps-a5 .pq-imgwrap.kind-formula .pq-dimg{max-width:68mm !important;max-height:36mm !important;}
#printRoot.ps-a5 .pq-imgwrap.kind-tank .pq-dimg{max-width:78mm !important;max-height:48mm !important;}
#printRoot.ps-a5 .pq-imgwrap.kind-table .pq-dimg,
#printRoot.ps-a5 .pq-imgwrap.kind-box .pq-dimg,
#printRoot.ps-a5 .pq-imgwrap:not([class*="kind-"]) .pq-dimg{max-width:100% !important;max-height:52mm !important;}
#printRoot.ps-a5 .pq-imgwrap.kind-wide .pq-dimg{max-height:48mm !important;}
#printRoot.ps-a5 .pq-chimg{max-height:70mm !important;}
/* 인쇄 미리보기: is-printing 클래스 없이도 #printRoot 내용만 나오도록 (타이밍·부모 숨김 이슈 방지) */
@media print{
  html,body{background:#fff !important;padding:0 !important;margin:0 !important;height:auto !important;overflow:visible !important;}
  /* body 직속 형제만 숨김 — printRoot 는 body 직속이어야 함 */
  body > *:not(#printRoot){display:none !important;}
  #printRoot{
    display:block !important;visibility:visible !important;
    position:static !important;inset:auto !important;z-index:auto !important;
    overflow:visible !important;padding:0 !important;margin:0 !important;
    width:100% !important;max-width:100% !important;background:#fff !important;color:#111 !important;
    box-sizing:border-box !important;
  }
  #printRoot *{visibility:visible !important;box-sizing:border-box;}
  /* 브라우저가 원본 픽셀 폭을 그대로 쓰는 경우 대비 — 인쇄 시 강제 축소 */
  #printRoot .pq-dimg,#printRoot .pq-chimg,#printRoot img{
    max-width:100% !important;height:auto !important;
  }
  a[href]:after{content:none !important;}
}
/* 강·약·중·강·약 타이포 리듬 */
h1{font-size:1.5rem;font-weight:900;letter-spacing:-0.03em;margin:0 0 .4rem;line-height:1.28;color:var(--text);}
.sub{font-size:var(--fs-sm);color:var(--sub);margin-bottom:.7rem;line-height:var(--lh);font-weight:500;}
/* —— 정보 구조: ① 바로가기 ② 문제 범위 ③ 풀이 도구 —— */
.ui-sec{margin:0 0 12px;}
.ui-sec-label{
  display:flex;align-items:center;gap:8px;margin:0 0 8px;
  font-size:12px;font-weight:900;color:var(--muted);letter-spacing:.02em;
}
.ui-sec-label .ui-step{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:999px;font-size:11px;font-weight:900;
  background:#eef1ff;color:var(--indigo);border:1px solid #c9d2ff;flex-shrink:0;
}
.ui-sec-label b{color:var(--text);font-weight:900;}
.ui-sec-hint{font-weight:600;color:var(--muted);font-size:11.5px;margin-left:auto;}

.examblock{
  margin-bottom:0;padding:12px 12px 10px;border-radius:16px;
  background:linear-gradient(180deg,#f8f9ff,#fff);border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
}
.tracktabs{display:flex;gap:8px;flex-wrap:nowrap;margin:0 0 8px;min-height:40px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px;}
.tracktabs::-webkit-scrollbar{display:none;}
.tracktab{border:2px solid var(--border);background:#fff;color:var(--sub);border-radius:14px;padding:10px 14px;font-size:var(--fs-md);font-weight:900;cursor:pointer;line-height:1.3;box-shadow:var(--shadow-sm);letter-spacing:-0.02em;transition:border-color .12s,background .12s,color .12s;flex:0 0 auto;white-space:nowrap;text-align:left;}
.tracktab:hover{border-color:var(--indigo-soft);color:var(--indigo-deep);}
.tracktab.on{background:linear-gradient(135deg,#eef1ff,#e8edff);border-color:var(--indigo);color:var(--indigo-deep);box-shadow:0 4px 14px rgba(61,90,254,.15);}
.tracktab .tcnt{display:block;font-size:11.5px;font-weight:700;opacity:.8;margin-top:2px;}
.subtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;min-height:36px;}
.subtab{border:1px solid var(--border);background:var(--card);color:var(--sub);border-radius:var(--radius-pill);padding:8px 15px;font-size:var(--fs-md);font-weight:700;cursor:pointer;line-height:1.25;box-shadow:var(--shadow-sm);transition:border-color .12s,box-shadow .12s,background .12s;}
.subtab:hover{border-color:var(--border-soft);}
.subtab.on{background:var(--indigo);color:#fff;border-color:var(--indigo);box-shadow:0 6px 16px rgba(76,99,246,.28);}
.subtab .subcnt{font-weight:600;opacity:.85;font-size:12px;margin-left:4px;}
.subtab.on .subcnt{opacity:.9;}
.examrow{display:flex;align-items:center;gap:8px;position:relative;}
.examrow .examicon{font-size:14px;color:var(--sub);flex-shrink:0;}
.examrow select.exam-sel-native{
  flex:1;min-width:0;max-width:100%;border:1px solid var(--border);border-radius:var(--radius-pill);
  padding:9px 15px;font-size:16px;font-weight:700;background:var(--card);color:var(--text);
  outline:none;cursor:pointer;text-overflow:ellipsis;box-shadow:var(--shadow-sm);
  /* iOS 줌 방지: 16px 이상 */
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235e6478' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;
}
.examrow select.exam-sel-native:focus{border-color:var(--indigo-soft);box-shadow:0 0 0 3px rgba(76,99,246,.14);}
/* 터치·아이폰: 네이티브 휠 대신 커스텀 시트 버튼 */
.exam-sel-btn{
  display:none;flex:1;min-width:0;align-items:center;justify-content:space-between;gap:10px;
  border:1px solid var(--border);border-radius:var(--radius-pill);padding:12px 14px 12px 16px;
  font-size:15px;font-weight:800;background:var(--card);color:var(--text);cursor:pointer;
  font-family:inherit;text-align:left;box-shadow:var(--shadow-sm);line-height:1.35;
  -webkit-tap-highlight-color:transparent;
}
.exam-sel-btn:active{background:#f4f6ff;border-color:var(--indigo-soft);}
.exam-sel-btn .exam-sel-btn-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;}
.exam-sel-btn .exam-sel-btn-chev{flex-shrink:0;width:18px;height:18px;color:var(--muted);opacity:.85;}
body.exam-picker-touch .exam-sel-native{
  position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;
  overflow:hidden !important;clip:rect(0,0,0,0) !important;border:0 !important;opacity:0 !important;
  pointer-events:none !important;
}
body.exam-picker-touch .exam-sel-btn{display:inline-flex;}
/* 회차 선택 하단 시트 */
.exam-picker-backdrop{
  display:none;position:fixed;inset:0;z-index:180;background:rgba(20,22,40,.45);
  align-items:flex-end;justify-content:center;padding:0;box-sizing:border-box;
  -webkit-overflow-scrolling:touch;
}
.exam-picker-backdrop.show{display:flex;}
.exam-picker-sheet{
  width:100%;max-width:560px;max-height:min(72vh,560px);
  background:#fff;border-radius:18px 18px 0 0;
  box-shadow:0 -8px 40px rgba(20,24,50,.2);
  display:flex;flex-direction:column;overflow:hidden;
  padding-bottom:max(10px,env(safe-area-inset-bottom));
  transform:translateY(8px);opacity:.98;
}
.exam-picker-hd{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px 10px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,#f8f9ff,#fff);flex-shrink:0;
}
.exam-picker-hd h3{margin:0;font-size:15px;font-weight:900;color:var(--text);}
.exam-picker-hd .sub{margin:2px 0 0;font-size:12px;font-weight:600;color:var(--muted);}
.exam-picker-list{
  flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:8px 10px 16px;overscroll-behavior:contain;
}
.exam-picker-item{
  display:flex;align-items:flex-start;gap:10px;width:100%;text-align:left;
  border:1px solid transparent;background:#fff;border-radius:12px;
  padding:12px 12px;margin:0 0 4px;cursor:pointer;font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}
.exam-picker-item:active{background:#f4f6ff;}
.exam-picker-item.on{background:#eef1ff;border-color:#c9d2ff;}
.exam-picker-item .lab{flex:1;min-width:0;font-size:14.5px;font-weight:800;color:var(--text);line-height:1.4;}
.exam-picker-item .tag{flex-shrink:0;font-size:11.5px;font-weight:800;color:var(--muted);padding-top:2px;}
.exam-picker-item.on .lab{color:var(--indigo-deep);}
.exam-picker-item.lock .lab{color:var(--sub);}
.exam-picker-item .chk{
  flex-shrink:0;width:20px;height:20px;border-radius:999px;border:2px solid #c9d2ff;
  margin-top:1px;display:inline-flex;align-items:center;justify-content:center;
}
.exam-picker-item.on .chk{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.exam-picker-item.on .chk::after{content:'✓';font-size:11px;font-weight:900;line-height:1;}
body.exam-picker-open{overflow:hidden;}

/* 사이트 IA 다이어그램 — body 직속 + z-index 관리자(120)보다 위
   (admin-page 시 .wrap display:none 이라 wrap 안 IA는 절대 안 보임 → open 시 body로 이동) */
.ia-backdrop{
  display:none;position:fixed;inset:0;z-index:400;background:rgba(20,22,40,.55);
  align-items:stretch;justify-content:center;padding:max(10px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));
  box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.ia-backdrop.show{display:flex !important;}
body.admin-page .ia-backdrop.show{display:flex !important;z-index:400;}
.ia-panel{
  background:#fff;border-radius:18px;max-width:720px;width:100%;margin:auto;
  box-shadow:0 20px 50px rgba(20,24,50,.25);max-height:min(92vh,900px);
  display:flex;flex-direction:column;overflow:hidden;
}
.ia-hd{
  display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:16px 16px 12px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,#eef1ff,#fff);flex-shrink:0;
}
.ia-hd h2{margin:0;font-size:1.1rem;font-weight:900;color:var(--indigo-deep);}
.ia-hd .ia-sub{margin:4px 0 0;font-size:12.5px;font-weight:600;color:var(--sub);line-height:1.4;}
.ia-body{padding:14px 14px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0;}
.ia-legend{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;}
.ia-chip{
  display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;
  font-size:11.5px;font-weight:800;border:1px solid var(--border);background:#f8f9ff;color:var(--sub);
}
.ia-chip i{width:8px;height:8px;border-radius:50%;display:inline-block;}
.ia-chip i.l{background:#4C63F6;}
.ia-chip i.a{background:#0d9f6e;}
.ia-chip i.s{background:#c2410c;}
.ia-chip i.m{background:#7c3aed;}
.ia-tree{display:flex;flex-direction:column;gap:10px;}
.ia-node{
  border:1px solid var(--border);border-radius:14px;background:#fafbff;overflow:hidden;
}
.ia-node.level-0{background:linear-gradient(135deg,#eef1ff,#f8f9ff);border-color:#c9d2ff;}
.ia-node-hd{
  display:flex;align-items:center;gap:10px;padding:11px 12px;flex-wrap:wrap;
  border-bottom:1px solid #eef0f6;
}
.ia-node.level-0 > .ia-node-hd{border-bottom-color:#d4dbff;}
.ia-badge{
  flex-shrink:0;font-size:10.5px;font-weight:900;padding:3px 8px;border-radius:999px;
  background:#eef1ff;color:var(--indigo);border:1px solid #c9d2ff;letter-spacing:.02em;
}
.ia-badge.land{background:#ecfdf5;color:#047857;border-color:#a7f3d0;}
.ia-badge.app{background:#eef1ff;color:#3a4fe0;border-color:#c9d2ff;}
.ia-badge.shop{background:#fff7ed;color:#c2410c;border-color:#fed7aa;}
.ia-badge.admin{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe;}
.ia-title{font-size:14px;font-weight:900;color:var(--text);line-height:1.3;}
.ia-path{font-size:11.5px;font-weight:700;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}
.ia-kids{padding:8px 10px 10px;display:flex;flex-direction:column;gap:6px;}
.ia-leaf{
  display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:10px;
  background:#fff;border:1px solid #eef0f6;font-size:13px;line-height:1.4;
}
.ia-leaf b{font-weight:800;color:var(--text);}
.ia-leaf span{color:var(--sub);font-weight:600;font-size:12px;}
.ia-leaf .dot{width:6px;height:6px;border-radius:50%;background:var(--indigo);margin-top:6px;flex-shrink:0;opacity:.7;}
.ia-row{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0 4px;}
.ia-pill{
  display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;
  font-size:12px;font-weight:800;background:#fff;border:1px solid #e2e8f0;color:var(--sub);
}
.ia-pill em{font-style:normal;color:var(--indigo);margin-right:4px;font-weight:900;}
.ia-flow{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;margin:0 0 10px;
  border-radius:12px;background:#f0fdf4;border:1px solid #bbf7d0;font-size:12.5px;font-weight:700;color:#065f46;
}
.ia-flow .arr{color:#16a34a;font-weight:900;}
.ia-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:12px;border-top:1px dashed #e2e8f0;}
body.ia-open{overflow:hidden;}
.scope-now{
  margin:8px 0 0;padding:8px 10px;border-radius:10px;background:#eef1ff;border:1px dashed #c9d2ff;
  font-size:12.5px;font-weight:700;color:var(--indigo-deep);line-height:1.4;
}
.scope-now .scope-now-lab{font-weight:700;color:var(--sub);}
.scope-now #subTxt{font-weight:800;color:var(--indigo-deep);}

/* ① 바로가기 */
.quickbar{
  display:flex;gap:8px;align-items:stretch;margin-bottom:12px;flex-wrap:wrap;
}
.quickbar .q-primary{
  display:flex;gap:8px;flex:1 1 auto;min-width:min(100%,220px);flex-wrap:wrap;
}
.quickbar .q-meta{
  display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-left:auto;
}
.streakchip{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-pill);padding:9px 15px;font-weight:800;font-size:var(--fs-sm);box-shadow:var(--shadow-sm);color:var(--sub);line-height:1.3;}
.streakchip.fire{color:#d9480f;background:#fff7f3;border-color:#ffd8c2;font-weight:700;}
.streakchip.due{
  color:var(--indigo);cursor:pointer;background:#f3f5ff;border-color:var(--border-soft);
  font-weight:900;padding:10px 16px;font-size:13.5px;
}
.streakchip.due:hover{border-color:var(--indigo-soft);background:#eef1ff;}
.streakchip.dday{color:var(--indigo-deep);cursor:pointer;background:#f8f9ff;border-color:var(--border-soft);font-size:12.5px;padding:6px 12px;}
.goalwrap{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-pill);padding:6px 12px;font-size:12.5px;font-weight:700;cursor:pointer;box-shadow:var(--shadow-sm);}
.goalbar{width:72px;height:7px;background:#eef0f8;border-radius:var(--radius-pill);overflow:hidden;}
.goalfill{height:100%;background:linear-gradient(90deg,var(--indigo),var(--indigo-soft));border-radius:var(--radius-pill);transition:width .4s ease;}
.goalwrap.done .goalfill{background:linear-gradient(90deg,var(--ok),#5ce0a5);}
.goalwrap.done{color:var(--ok);}
.streakchip.today{
  color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--indigo),#5a6ee8);
  border-color:transparent;box-shadow:0 4px 14px rgba(61,90,254,.28);
  font-weight:900;padding:10px 16px;font-size:13.5px;
}
.streakchip.today:hover{filter:brightness(1.05);}

/* ③ 풀이 도구 */
.toolbar{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:.85rem;
  padding:10px;border-radius:16px;background:#fff;border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
.toolbar .tb-main{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex:1 1 auto;}
.toolbar .tb-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.mode{display:flex;background:#f4f6ff;border:1px solid var(--border-soft);border-radius:var(--radius-pill);padding:3px;box-shadow:none;}
.mode button{border:0;background:transparent;padding:9px 17px;border-radius:var(--radius-pill);font-size:var(--fs-md);cursor:pointer;color:var(--sub);font-weight:800;transition:background .12s,color .12s;}
.mode button.on{background:var(--indigo);color:#fff;box-shadow:0 4px 12px rgba(76,99,246,.28);}
.iconbtn{border:1px solid var(--border);background:var(--card);border-radius:var(--radius-pill);padding:8px 14px;font-size:var(--fs-md);cursor:pointer;color:var(--sub);position:relative;line-height:1.25;font-weight:700;box-shadow:none;transition:border-color .12s,background .12s,color .12s;}
.iconbtn:hover{border-color:var(--border-soft);color:var(--indigo);background:#f8f9ff;}
.iconbtn.active{border-color:var(--indigo-soft);color:var(--indigo);background:#eef1ff;}
.iconbtn.snd{min-width:3.2rem;font-size:13.5px;padding:7px 12px;}
.iconbtn.snd.off{opacity:.9;background:#f4f5fa;color:var(--muted);}
/* 툴바 더보기 — 덜 쓰는 기능만 */
.tb-more{position:relative;display:inline-flex;}
.tb-more-btn[aria-expanded="true"]{border-color:var(--indigo-soft);color:var(--indigo);background:#eef1ff;}
.tb-more-menu{
  display:none;position:absolute;top:calc(100% + 6px);right:0;z-index:50;
  min-width:180px;padding:6px;background:#fff;border:1px solid var(--border);
  border-radius:14px;box-shadow:0 12px 32px rgba(20,24,60,.14);
}
.tb-more.open .tb-more-menu{display:flex;flex-direction:column;gap:2px;}
.tb-more-menu button{
  border:0;background:transparent;text-align:left;padding:10px 12px;border-radius:10px;
  font-size:13.5px;font-weight:700;color:var(--text);cursor:pointer;width:100%;
}
.tb-more-menu button:hover,.tb-more-menu button:focus-visible{background:#f4f6ff;color:var(--indigo);outline:none;}
.tb-more-menu button.active{color:var(--indigo);background:#eef1ff;}
.tb-more-menu .tb-more-cap{
  font-size:11px;font-weight:800;color:var(--muted);padding:6px 12px 2px;letter-spacing:.02em;
}
.streakchip.today:focus-visible,.iconbtn:focus-visible,.mode button:focus-visible,
.tracktab:focus-visible,.subtab:focus-visible,.app-login-btn:focus-visible,.scorebtn:focus-visible{
  outline:2px solid var(--indigo);outline-offset:2px;
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:9999;background:var(--indigo);color:#fff;
  padding:10px 16px;font-weight:800;border-radius:0 0 10px 0;
}
.skip-link:focus{left:0;}

.search{display:flex;gap:8px;align-items:flex-start;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:11px 13px;flex:1 1 220px;min-width:min(100%,180px);max-width:100%;box-sizing:border-box;box-shadow:var(--shadow-sm);}
.search:focus-within{border-color:var(--indigo-soft);box-shadow:0 0 0 3px rgba(76,99,246,.14);}
#list{overflow-anchor:none;display:block;}
.toolbar{overflow-anchor:none;}
.search{overflow-anchor:none;}
.search .search-ico{flex-shrink:0;width:16px;height:16px;margin-top:4px;color:var(--muted);display:inline-flex;}
.search .search-ico svg{width:16px;height:16px;display:block;}

.search textarea{flex:1;min-width:0;width:100%;border:0;outline:0;font-size:var(--fs-base);line-height:var(--lh);background:transparent;resize:none;overflow-y:auto;max-height:7.5em;min-height:1.5em;font-family:inherit;padding:0;margin:0;field-sizing:content;}
.search textarea::placeholder{color:var(--muted);}
.search .search-clear{flex-shrink:0;border:0;background:#eef0f6;color:var(--sub);border-radius:999px;width:26px;height:26px;font-size:14px;cursor:pointer;display:none;align-items:center;justify-content:center;padding:0;margin-top:0;}
.search.has-text .search-clear{display:inline-flex;}
.search .search-clear:hover{background:#e0e4ff;color:var(--indigo);}
@media (max-width:640px){
  .search{flex:1 1 100%;order:10;}
}
.panel{display:none;}
.panel.open{display:flex;}
.profilebar{gap:8px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:8px 14px;margin-bottom:.6rem;font-size:13px;color:var(--sub);flex-wrap:wrap;}
.profilebar select,.profilebar input{border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13px;outline:none;background:#fff;}
.apibar{gap:8px;align-items:center;background:var(--card);border:1px dashed var(--border);border-radius:12px;padding:8px 14px;margin-bottom:.6rem;font-size:13px;color:var(--sub);flex-wrap:wrap;}
.apibar input{flex:1;min-width:180px;border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13px;outline:none;}
.goalbar-settings{gap:8px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:8px 14px;margin-bottom:.6rem;font-size:13px;color:var(--sub);flex-wrap:wrap;}
.goalbar-settings input{border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13px;outline:none;background:#fff;}
.pillspanel{display:none;flex-wrap:wrap;gap:7px;margin-bottom:.8rem;align-items:center;}
.pillspanel.open{display:flex;}
.pill-label{width:100%;font-size:11.5px;font-weight:800;color:var(--muted);letter-spacing:.02em;margin:4px 0 2px;}
.pill-label .hint{font-weight:600;color:var(--muted);opacity:.9;}
.pill.group{border-color:var(--indigo-soft);background:#f7f8ff;}
.pill.group.active{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.pill.group.multi{padding-right:10px;}
.pill .gmeta{font-size:11px;opacity:.8;font-weight:600;}
.pill .gmeta .sim{font-weight:800;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px;}
.pill.group.active .gmeta .sim{text-decoration-color:rgba(255,255,255,.7);}
.pill{padding:8px 15px;border-radius:var(--radius-pill);font-size:var(--fs-sm);cursor:pointer;border:1px solid var(--border);background:var(--card);color:var(--sub);user-select:none;font-weight:600;box-shadow:var(--shadow-sm);transition:border-color .12s,background .12s,color .12s;}
.pill:hover{border-color:var(--border-soft);}
.pill.active{border-color:var(--indigo-soft);background:#eef1ff;color:var(--indigo);font-weight:700;}
/* 유사 묶음 선택 시: 포함 표기 목록 (호버/롱프레스 없이 확인) */
.pill-bundle{
  flex:1 1 100%;width:100%;margin:2px 0 6px;padding:10px 12px;
  border-radius:12px;border:1px solid #c9d2ff;background:linear-gradient(180deg,#f8f9ff,#fff);
  box-sizing:border-box;
}
.pill-bundle .pb-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px;}
.pill-bundle .pb-title{font-size:12.5px;font-weight:800;color:var(--indigo-deep);line-height:1.35;}
.pill-bundle .pb-title b{color:var(--indigo);}
.pill-bundle .pb-sub{font-size:11.5px;font-weight:600;color:var(--sub);margin-top:2px;line-height:1.4;}
.pill-bundle .pb-close{
  flex-shrink:0;border:0;background:#eef1ff;color:var(--indigo);border-radius:999px;
  width:28px;height:28px;font-size:16px;font-weight:700;cursor:pointer;line-height:1;
}
.pill-bundle .pb-members{display:flex;flex-wrap:wrap;gap:6px;}
.pill-bundle .pb-mem{
  display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:999px;
  border:1px solid var(--border);background:#fff;font-size:12px;font-weight:700;color:var(--text);
  max-width:100%;
}
.pill-bundle .pb-mem .n{font-size:11px;font-weight:800;color:var(--indigo);background:#eef1ff;border-radius:999px;padding:1px 6px;}
.pill-bundle .pb-note{margin:8px 0 0;font-size:11.5px;color:var(--muted);line-height:1.45;font-weight:600;}
.count{font-size:var(--fs-sm);color:var(--sub);margin:.55rem 0 .65rem;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-weight:600;line-height:var(--lh);}
.btnrow{display:flex;gap:8px;}
.scorebtn{border:0;background:var(--indigo);color:#fff;padding:9px 17px;border-radius:var(--radius-pill);font-size:var(--fs-md);font-weight:700;cursor:pointer;box-shadow:0 6px 16px rgba(76,99,246,.26);}
.scorebtn:hover{filter:brightness(1.04);}
.resetbtn{border:1px solid var(--border);background:var(--card);color:var(--sub);padding:9px 17px;border-radius:var(--radius-pill);font-size:var(--fs-md);font-weight:700;cursor:pointer;box-shadow:var(--shadow-sm);}
.resetbtn:hover{border-color:var(--border-soft);color:var(--indigo);}
.statbox{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:12px;font-size:13px;display:none;box-shadow:var(--shadow-sm);}
.statbox.show{display:block;}
.statbox table{border-collapse:collapse;width:100%;}
.statbox td,.statbox th{padding:5px 8px;border-bottom:1px solid var(--border);text-align:left;font-size:12.5px;}
.statbox th{color:var(--sub);font-weight:600;}
.acc-hi{color:var(--ok);font-weight:700;}
.acc-lo{color:var(--no);font-weight:700;}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 17px 15px;margin-bottom:12px;box-shadow:var(--shadow-sm);position:relative;overflow:visible;transition:box-shadow .15s ease,border-color .15s ease;}
.card:hover{box-shadow:var(--shadow);border-color:var(--border-soft);}
/* 카드 전체 배경 플래시 폐기 — 선지만 가볍게 반응 (화면 전체가 붉어지던 요란함 방지) */
.card.flashOK,.card.flashNO{animation:none;}
@keyframes flashG{0%,100%{box-shadow:var(--shadow-sm)}}
@keyframes flashR{0%,100%{box-shadow:var(--shadow-sm)}}
.card-head{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-bottom:12px;min-width:0;}
/* 문항 N · 영역 | (1회 안내) | 북마크 — 한 줄, 북마크 우측 끝 */
.card-title-row{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;min-width:0;}
.card-title-row .tag-title{flex:0 1 auto;min-width:0;overflow-wrap:anywhere;word-break:keep-all;}
.card-title-row .pick-hint{
  flex:1 1 auto;min-width:0;text-align:center;
  font-size:12px;font-weight:700;color:var(--indigo);line-height:1.35;
  letter-spacing:-0.02em;overflow-wrap:anywhere;word-break:keep-all;
  opacity:1;transition:opacity .45s ease;
  pointer-events:none;user-select:none;
}
.card-title-row .pick-hint.out{opacity:0;}
.card-title-row .chkbtn{flex-shrink:0;margin:0;white-space:nowrap;margin-left:auto;}
@media (max-width:420px){
  .card-title-row .pick-hint{font-size:11px;}
}
.headbtns{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-width:0;max-width:100%;}
.headbtns > *{max-width:100%;overflow-wrap:anywhere;word-break:keep-all;}
.tag-title{font-size:var(--fs-md);font-weight:800;color:var(--indigo);letter-spacing:-0.02em;min-width:0;}
.tag-cat{font-size:13px;font-weight:800;color:var(--indigo);letter-spacing:-.02em;}
body.solve-play .card-head-slim{margin-bottom:6px;}
body.solve-play .card-head-slim .headbtns{display:none;}
/*
  풀이 레이아웃 (전 과목·전 과정 공통 · S2-U)
  ─ 미니바: 회차 제목 삭제 (나가기·타이머만)
  ─ 카드 PC/모바일 동일:
      337/340  20년 3회…     [단원 (1/5)] [🔖]
                              [다음 …]      ← 없을 때 숨김
*/
body.solve-play .card-head-slim .card-title-row{
  justify-content:flex-start;align-items:center;gap:8px;
  flex-wrap:nowrap;
}
.solve-card-prog{
  font-size:14px;font-weight:800;color:var(--text);letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;line-height:1.2;white-space:nowrap;
  flex:0 1 auto;align-self:center;display:inline-flex;align-items:baseline;gap:8px;
  min-width:0;max-width:min(62%, 22rem);
}
.solve-card-subj{
  font-size:14px;font-weight:500;color:#6b7180;letter-spacing:-.02em;
  line-height:1.15;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.due-cap-notice{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:0 0 10px;padding:10px 14px;border-radius:12px;
  background:#EEF0FF;border:1px solid #D8DDFF;color:#2B3FD0;
  font-size:12.5px;font-weight:700;line-height:1.5;
}
.due-cap-notice .t{min-width:0}
.due-cap-notice b{font-variant-numeric:tabular-nums}
.due-cap-notice .due-cap-all{
  margin-left:auto;border:0;background:#3D5AFE;color:#fff;font:inherit;font-weight:800;
  padding:7px 14px;border-radius:9px;cursor:pointer;white-space:nowrap;
}
.due-cap-notice .due-cap-all:hover{filter:brightness(1.05)}
/* 전부 풀기 진행 중 — 안내(권유)가 아니라 현재 상태 표시. 되돌리기는 보조 액션 (S8-G) */
.due-cap-notice.is-nocap{background:#F4F5FA;border-color:#DCE0EC;color:#4A5169}
.due-cap-notice.is-nocap .due-cap-all{background:#fff;color:#3D5AFE;border:1px solid #C9D0F5}
@media(max-width:520px){ .due-cap-notice .due-cap-all{margin-left:0;width:100%} }
.solve-card-exam{
  flex:1 1 auto;min-width:0;margin-left:6px;margin-right:6px;
  text-align:left;font-size:12.5px;font-weight:700;color:#6b7180;
  letter-spacing:-.03em;line-height:1.25;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;align-self:center;
}
/* 단원 열 + 북마크 = 우측 클러스터 */
.solve-card-cat-col{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:2px;
  min-width:0;
  flex:0 1 auto;
  margin-left:auto;
  max-width:min(56%, 26rem);
  align-self:center;
}
.solve-card-cat-col .solve-card-cat{
  margin:0;
  max-width:100%;
}
body.solve-play .card-head-slim .card-title-row .chkbtn{
  margin-left:0;
  flex:0 0 auto;
  align-self:center;
}
/* 미니바 회차 제목 삭제 — 전 과목 공통 (카드 exam 만 사용) */
body.solve-play .solve-mini-center,
body.solve-play .solve-mini-title{
  display:none !important;
}
body.solve-play .solve-mini-prog-lab{
  display:none !important;
}
.solve-card-next{
  font-size:11px;
  font-weight:700;
  color:#6b7180;
  letter-spacing:-.03em;
  line-height:1.2;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:right;
  padding-left:0;
}
.solve-card-next[hidden]{display:none !important;}
/* PC: 카드 회차 표시 · 단원 우측 */
@media(min-width:721px){
  body.solve-play .solve-card-exam,
  body.solve-play #solveCardExamLab{
    display:block !important;
    flex:0 1 auto;
    min-width:0;
    max-width:min(42%, 16rem);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .solve-card-cat-col{
    flex:0 0 auto;
    max-width:none;
    min-width:auto;
    margin-left:auto;
    align-items:flex-end;
  }
  .solve-card-cat,
  .solve-card-cat-col .solve-card-cat{
    max-width:none;
    overflow:visible;
    text-overflow:clip;
  }
  .solve-card-next{
    overflow:visible;
    text-overflow:clip;
    max-width:none;
    text-align:right;
  }
}
/* 모바일: PC와 동일 1행 — 순번|회차 … 단원(우측)|북마크 (2행 강제 금지) */
@media(max-width:720px){
  body.solve-play .card-head-slim .card-title-row{
    flex-wrap:nowrap; /* PC와 동일: 단원 아래로 떨어지지 않음 */
    align-items:center;
    gap:6px;
  }
  .solve-card-prog{
    font-size:13px;color:#3b3f4a;align-self:center;
    flex:0 1 auto;gap:6px;max-width:min(52%, 14rem);
  }
  .solve-card-subj{font-size:13px;}
  body.solve-play .solve-card-exam,
  body.solve-play #solveCardExamLab{
    display:block !important;
    flex:1 1 auto;
    min-width:0;
    margin-left:4px;
    margin-right:4px;
    font-size:11px;
    letter-spacing:-.04em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis; /* 좁으면 회차만 … */
    line-height:1.25;
    align-self:center;
  }
  /* 단원 열 = 북마크 직전 우측 (PC와 동일) */
  .solve-card-cat-col{
    flex:0 1 auto;
    max-width:min(48%, 12rem);
    margin-left:auto;
    align-items:flex-end;
    align-self:center;
    order:unset;
  }
  body.solve-play .card-head-slim .card-title-row .chkbtn{
    margin-left:0;
    order:unset;
    align-self:center;
  }
  .solve-card-cat,
  .solve-card-cat-col .solve-card-cat{
    font-size:10.5px;
    padding:2px 8px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
    line-height:1.25;
  }
  .solve-card-next{
    font-size:10px;
    text-align:right;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }
}
@media(max-width:380px){
  .solve-card-exam{font-size:10.5px;}
  .solve-card-cat,.solve-card-cat-col .solve-card-cat{font-size:10px;padding:2px 7px;}
  .solve-card-cat-col{max-width:min(46%, 10.5rem);}
}
body.bg-eye-dark .solve-card-exam{color:#9aa3b5;}
/* ───── 회독 스트립 (풀이 카드·오답노트·검색 목록 공용) ─────
   칸 = 목표 회독 수. 정·오를 색과 「채움 높이」 둘로 인코딩해 색각 이상에서도 읽힌다.
   ⛔ 화면별 변형 CSS 금지 — 크기 조정은 폭 미디어쿼리 한 곳에서만. */
.seen-strip{
  display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
  cursor:pointer;vertical-align:middle;-webkit-tap-highlight-color:transparent;
}
/* A안: 칸 = 최근 회차 정·오, 숫자 = 총 회독수 (SEEN_MAX 에 안 잘림) */
.seen-strip .seen-cells{display:inline-flex;border-radius:3px;overflow:hidden}
.seen-strip .seen-n{
  font-size:11px;font-weight:850;color:var(--sub);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
}
.seen-strip.warn .seen-n{color:var(--no);}
.seen-strip i{
  display:block;width:8px;height:13px;position:relative;
  background:#e6e9f0;border-right:1px solid var(--card);
}
.seen-strip i:last-child{border-right:0;}
.seen-strip i.ok{background:var(--ok);}
.seen-strip i.no{background:#fbd8d5;}
.seen-strip i.no::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:45%;background:var(--no);
}
.seen-strip i.now{background:transparent;box-shadow:inset 0 0 0 1.5px var(--indigo);}
.seen-strip .seen-more{ /* deprecated: A안에서 .seen-n 으로 대체 */
  font-size:9px;font-weight:850;color:var(--sub);letter-spacing:-.02em;
  margin-right:3px;font-variant-numeric:tabular-nums;
}
/* 최근 2회 연속 오답 = 지금 손봐야 할 문항 */
.seen-strip.warn{box-shadow:0 1.5px 0 0 var(--no);}
.seen-strip:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;}
body.bg-eye-dark .seen-strip i{background:#343a47;border-right-color:var(--card);}
body.bg-eye-dark .seen-strip i.no{background:#3a2422;}
@media(max-width:380px){
  .seen-strip i{width:7px;height:12px;}
}
.solve-card-cat{
  flex:0 1 auto;max-width:100%;min-width:0;margin-right:0;
  font-size:11px;font-weight:800;color:var(--indigo);background:#eef1ff;
  border-radius:999px;padding:3px 9px;letter-spacing:-.02em;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
body.bg-eye-dark .solve-card-cat{color:#a5b4fc;background:#1e2438}
/* 복수 세부과목(전체·멀티): 회차·단원 옆 인라인 단계 (S2-P3: 단원 배지에 2/7만 붙이지 않음 · 「N/M단계」로 표기) */
.solve-card-seg{
  flex:0 1 auto;min-width:0;max-width:46%;
  font-size:11px;font-weight:700;color:#6b7180;
  letter-spacing:-.03em;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-variant-numeric:tabular-nums;
}
.solve-card-seg .scs-step{
  color:var(--indigo);font-weight:800;
}
.solve-card-seg .scs-next{
  color:#8990a3;font-weight:700;
}
@media(max-width:720px){
  .solve-card-seg{font-size:10px;max-width:40%;}
}
@media(max-width:380px){
  .solve-card-seg .scs-next{display:none;} /* 좁으면 다음 단원 생략 */
}
body.bg-eye-dark .solve-card-seg{color:#9aa3b5;}
body.bg-eye-dark .solve-card-seg .scs-step{color:#a5b4fc;}
body.bg-eye-dark .solve-card-seg .scs-next{color:#6b7280;}
/* 구 박스 trail 잔존 시 숨김 */
.solve-seg-trail{display:none !important;}


.exambadge{font-size:var(--fs-sm);color:var(--indigo);background:#eef1ff;border-radius:var(--radius-pill);padding:5px 11px;font-weight:700;max-width:100%;overflow-wrap:anywhere;}
.wrongbadge{font-size:var(--fs-sm);color:var(--no);background:#fef1f0;border-radius:var(--radius-pill);padding:5px 11px;font-weight:700;}
.srsbadge{font-size:var(--fs-sm);color:#7c5c00;background:#fff6df;border-radius:var(--radius-pill);padding:5px 11px;font-weight:700;}
.reportbtn{font-size:var(--fs-md);color:var(--muted);background:#fff;border:1px solid var(--border);border-radius:var(--radius-pill);padding:5px 12px;cursor:pointer;font-weight:600;}
.reportbtn:hover{border-color:var(--border-soft);color:var(--sub);}
/* 토론 제거 (2026-07-31) — .cmtbtn/.cmtbox 스타일 삭제 */
.cmthd{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.cmthd .dtitle{font-size:13px;font-weight:700;color:var(--indigo);}
.cmtlist{display:flex;flex-direction:column;gap:10px;max-height:320px;overflow-y:auto;margin-bottom:10px;}
.cmtitem{display:flex;gap:10px;align-items:flex-start;padding:10px;background:#fff;border:1px solid var(--border);border-radius:10px;}
.cmtav{width:28px;height:28px;border-radius:50%;object-fit:cover;background:#eef0ff;flex-shrink:0;}
.cmtav.ph{display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--indigo);}
.cmtbody{flex:1;min-width:0;}
.cmt-spoiler{margin:6px 0;border:1px solid #e2e5f0;border-radius:10px;background:#f8f9fc;overflow:hidden;}
.cmt-spoiler>summary{cursor:pointer;list-style:none;padding:8px 12px;font-size:12.5px;font-weight:800;color:var(--indigo);user-select:none;}
.cmt-spoiler>summary::-webkit-details-marker{display:none;}
.cmt-spoiler>summary::before{content:'▶ ';font-size:9px;color:var(--muted);}
.cmt-spoiler[open]>summary::before{content:'▼ ';}
.cmt-spoiler-body{padding:0 12px 10px;font-size:13.5px;line-height:1.55;color:var(--ink);font-weight:600;}
.cmt-spoiler-inline{display:inline-block;margin:0 2px;vertical-align:baseline;border-radius:8px;}
.cmt-spoiler-inline>summary{padding:2px 8px;font-size:12px;}
.cmt-spoiler-inline .cmt-spoiler-body{padding:0 8px 6px;display:block;}
.cmtmeta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:4px;}
.cmtname{font-size:12.5px;font-weight:700;color:var(--text);}
.cmttime{font-size:11px;color:var(--muted);}
.cmttext{font-size:var(--fs-base);line-height:1.75;font-weight:400;white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;color:var(--text);}
.cmtdel{border:0;background:none;color:var(--muted);font-size:11px;cursor:pointer;padding:0 4px;}
.cmtdel:hover{color:var(--no);}
.cmtempty,.cmtload,.cmterr{font-size:13px;color:var(--sub);padding:8px 2px;line-height:1.55;}
.cmterr{color:var(--no);}
.cmtform{display:flex;flex-direction:column;gap:8px;}
.cmtform textarea{border:1px solid var(--border);border-radius:10px;padding:10px;font-size:13.5px;min-height:72px;font-family:inherit;resize:vertical;outline:none;}
.cmtform textarea:focus{border-color:#c5c9ff;box-shadow:0 0 0 3px rgba(61,90,254,.12);}
.cmtform .cmtrow{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.cmtform .cmthint{font-size:11.5px;color:var(--muted);}
.cmtsend{border:0;background:var(--indigo);color:#fff;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;cursor:pointer;}
.cmtsend:disabled{opacity:.5;cursor:default;}
.cmtlogin{border:1px solid #d4d8ff;background:#fff;color:var(--indigo);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700;cursor:pointer;}
.cmtlogin:hover{background:#eef0ff;}
/* 회원/로컬 메모 히스토리 */
.memobtn{font-size:var(--fs-md);color:#0f766e;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:999px;padding:7px 15px;cursor:pointer;font-weight:700;}
.memobtn:hover{background:#d1fae5;}
.memobox{margin-top:10px;display:none;border:1px solid #a7f3d0;border-radius:12px;padding:12px 14px;background:#f6fffb;}
.memobox.show{display:block;}
.memohd{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.memohd .dtitle{font-size:13px;font-weight:700;color:#0f766e;}
.memolist{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow-y:auto;margin-bottom:10px;}
.memoitem{background:#fff;border:1px solid #d1fae5;border-radius:10px;padding:10px 12px;}
.memometa{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:4px;font-size:11.5px;color:var(--muted);}
.memodate{font-weight:700;color:#0f766e;}
.memoedit,.memodel{border:0;background:none;font-size:11.5px;cursor:pointer;padding:0 4px;font-weight:600;}
.memoedit{color:var(--indigo);}
.memodel{color:var(--muted);}
.memodel:hover{color:var(--no);}
.memotext{font-size:var(--fs-base);line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;color:var(--text);}
.memoempty{font-size:13px;color:var(--sub);padding:6px 2px;}
.memoform textarea{width:100%;border:1px solid #a7f3d0;border-radius:10px;padding:10px;font-size:13.5px;min-height:64px;font-family:inherit;resize:vertical;outline:none;box-sizing:border-box;}
.memoform textarea:focus{border-color:#34d399;box-shadow:0 0 0 3px rgba(16,185,129,.12);}
.memoform .memorow{display:flex;gap:8px;justify-content:flex-end;margin-top:8px;flex-wrap:wrap;}
.memo-privacy{margin:0 0 8px;font-size:12px;line-height:1.45;color:#0f766e;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:8px;padding:8px 10px;}
.accbadge{font-size:12px;color:#0f766e;background:#ecfdf5;border-radius:999px;padding:3px 9px;font-weight:700;max-width:100%;overflow-wrap:anywhere;}
.accbadge.lo{color:var(--no);background:#fef1f0;}
.accbadge.mid{color:#7c5c00;background:#fff6df;}
.accbadge.na{color:var(--muted);background:var(--bg);font-weight:600;}
.stem,.admin-cmp-live{font-size:var(--fs-lg);line-height:var(--lh-loose);font-weight:500;white-space:pre-line;margin-bottom:14px;overflow-wrap:anywhere;word-break:keep-all;color:var(--text);}
/* 시행처가 「정답 없음」으로 처리한 문항 등, 문항에 붙는 안내. data 의 `notice` 한 줄. */
.qnotice{display:flex;gap:8px;align-items:flex-start;margin:-4px 0 14px;padding:10px 12px;
  border:1px solid #E8D9A8;background:#FDF8EC;border-radius:10px;
  font-size:var(--fs-md);line-height:1.5;color:#6B5714;word-break:keep-all}
.qnotice b{color:#8A6D06}
.pq-notice{margin:0 0 8px;padding:8px 10px;border:1px solid #DDD;background:#FAFAFA;
  border-radius:6px;font-size:12px;color:#555}
/* 지문 내 표(HTML) — 이미지 없이 원본형 표 렌더. white-space:pre-line 해제 */
.stem table.qtable,.pq-stem table.qtable,.admin-cmp-live table.qtable, .admin-cmp-live table.qtable{
  white-space:normal;border-collapse:collapse;margin:12px 0 4px;max-width:100%;
  font-size:var(--fs-md);line-height:var(--lh-tight);font-weight:600;color:var(--text);
  border:1.5px solid #2a2f45;background:#fff;
}
.stem table.qtable th,.stem table.qtable td,
.pq-stem table.qtable th,.pq-stem table.qtable td,.admin-cmp-live table.qtable th, .admin-cmp-live table.qtable td{
  border:1px solid #2a2f45;padding:8px 12px;text-align:center;vertical-align:middle;
  overflow-wrap:anywhere;word-break:keep-all;
}
.stem table.qtable.left th,.stem table.qtable.left td,
.pq-stem table.qtable.left th,.pq-stem table.qtable.left td,
.admin-cmp-live table.qtable.left th,.admin-cmp-live table.qtable.left td{
  text-align:left;
}
.stem table.qtable.center th,.stem table.qtable.center td,
.pq-stem table.qtable.center th,.pq-stem table.qtable.center td,
.admin-cmp-live table.qtable.center th,.admin-cmp-live table.qtable.center td{
  text-align:center;
}
.stem table.qtable th,.pq-stem table.qtable th,.admin-cmp-live table.qtable th, .admin-cmp-live table.qtable th{font-weight:800;background:#f7f8fc;}
/* 원본처럼 대각선으로 나눈 머리칸 (특성/상) */
.stem table.qtable th.qcorner,.pq-stem table.qtable th.qcorner,.admin-cmp-live table.qtable th.qcorner,.tr-pane table.qtable th.qcorner{
  position:relative;min-width:4.8em;height:3.6em;padding:0 !important;overflow:hidden;
  background-color:#f7f8fc;
  background-image:linear-gradient(to top right, transparent calc(50% - .7px), #2a2f45 50%, transparent calc(50% + .7px));
}
.stem table.qtable th.qcorner::before,.pq-stem table.qtable th.qcorner::before,
.admin-cmp-live table.qtable th.qcorner::before,.tr-pane table.qtable th.qcorner::before{
  content:attr(data-top);position:absolute;top:5px;right:8px;font-weight:800;font-size:.92em;line-height:1.2;
}
.stem table.qtable th.qcorner::after,.pq-stem table.qtable th.qcorner::after,
.admin-cmp-live table.qtable th.qcorner::after,.tr-pane table.qtable th.qcorner::after{
  content:attr(data-bot);position:absolute;bottom:5px;left:8px;font-weight:800;font-size:.92em;line-height:1.2;
}
.stem table.qtable caption,.pq-stem table.qtable caption,.admin-cmp-live table.qtable caption, .admin-cmp-live table.qtable caption{
  caption-side:top;text-align:center;font-weight:800;padding:6px 4px 8px;color:var(--text);
}
/* 이름 | 화학식 두 칸 — 바깥 테두리만, 안쪽 선 없음, 오른쪽 칸 정렬 */
.stem table.qtable.pair,.pq-stem table.qtable.pair,.admin-cmp-live table.qtable.pair,.tr-pane table.qtable.pair{
  width:auto;max-width:100%;
}
.stem table.qtable.pair th,.stem table.qtable.pair td,
.pq-stem table.qtable.pair th,.pq-stem table.qtable.pair td,
.admin-cmp-live table.qtable.pair th,.admin-cmp-live table.qtable.pair td,
.tr-pane table.qtable.pair th,.tr-pane table.qtable.pair td{
  border:0;text-align:left !important;font-weight:500;background:transparent;
  padding:7px 18px 7px 14px;white-space:nowrap;vertical-align:middle;
}
.stem table.qtable.pair td:first-child,.pq-stem table.qtable.pair td:first-child,
.admin-cmp-live table.qtable.pair td:first-child,.tr-pane table.qtable.pair td:first-child{
  padding-right:2.8em;
}
/* 지문 내 반응식·조건 박스 (원본 테두리 박스) */
.stem .qbox,.pq-stem .qbox,.admin-cmp-live .qbox, .admin-cmp-live .qbox{
  white-space:normal;display:block;width:100%;max-width:100%;box-sizing:border-box;
  margin:12px 0 4px;padding:14px 16px;border:1.5px solid #2a2f45;background:#fff;
  text-align:center;font-size:var(--fs-base);line-height:1.7;font-weight:600;color:var(--text);
  overflow-wrap:anywhere;word-break:keep-all;
}
/* 보기(㉠㉡…) 등 여러 줄 지문 박스 — 좌정렬 가독 */
.stem .qbox.left,.pq-stem .qbox.left,.admin-cmp-live .qbox.left, .admin-cmp-live .qbox.left{
  text-align:left;font-weight:500;
}
/* 줄글 지문 상자 — 가운데 정렬은 문단을 들쭉날쭉하게 만든다 (전하 제보 2026-09-10) */
.stem .qbox.just,.pq-stem .qbox.just,.admin-cmp-live .qbox.just, .tr-pane .qbox.just{
  text-align:justify;text-justify:inter-character;font-weight:500;
}
/* ㄱ/ㄴ/ㄷ·㉠ 내어쓰기 — 기호 칸과 본문 칸을 나눠 둘째 줄이 본문 첫 글자에 붙는다 */
.stem .qbox.left .qitem,.pq-stem .qbox.left .qitem,
.admin-cmp-live .qbox.left .qitem,.tr-pane .qbox.left .qitem{
  display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:.62em;
  align-items:start;margin:0 0 .42em;padding-left:0;
  overflow-wrap:anywhere;word-break:keep-all;text-indent:0;
}
.stem .qbox.left .qitem:last-child,.pq-stem .qbox.left .qitem:last-child,
.admin-cmp-live .qbox.left .qitem:last-child,.tr-pane .qbox.left .qitem:last-child{
  margin-bottom:0;
}
.stem .qbox.left .qmark,.pq-stem .qbox.left .qmark,
.admin-cmp-live .qbox.left .qmark,.tr-pane .qbox.left .qmark{
  display:block;padding:0;margin:0;white-space:nowrap;text-indent:0;line-height:inherit;
}
.stem .qbox.left .qtxt,.pq-stem .qbox.left .qtxt,
.admin-cmp-live .qbox.left .qtxt,.tr-pane .qbox.left .qtxt{
  display:block;min-width:0;padding:0;margin:0;text-align:left;text-indent:0;line-height:inherit;
}
/* 한 줄에 항목이 나란한 qbox(ㄱ. …　ㄴ. …): 열 격자 — ㄱ·ㄷ 과 ㄴ·ㄹ 이 세로로 맞는다 */
.stem .qbox .qgrid,.pq-stem .qbox .qgrid,.admin-cmp-live .qbox .qgrid,.tr-pane .qbox .qgrid{
  display:grid;grid-template-columns:repeat(var(--qgrid-k,2),max-content);
  column-gap:1.6em;row-gap:.42em;justify-content:start;max-width:100%;
}
.stem .qbox .qgrid .qitem,.pq-stem .qbox .qgrid .qitem,.admin-cmp-live .qbox .qgrid .qitem,.tr-pane .qbox .qgrid .qitem{
  margin:0;min-width:0;
}
@media (max-width:480px){
  .stem .qbox .qgrid,.pq-stem .qbox .qgrid{grid-template-columns:repeat(var(--qgrid-k,2),minmax(0,auto));column-gap:1em;}
}
/* 「—— < 보기 > ——」 원본형: 윗변 테두리가 좌우 모서리까지 연결, 가운데 표제만 덮음 */
.stem .qbox.has-cap,.pq-stem .qbox.has-cap,.admin-cmp-live .qbox.has-cap, .admin-cmp-live .qbox.has-cap{
  position:relative;
  margin-top:14px;
  padding-top:16px;
  /* 윗변 유지 → 좌·우 세로선과 모서리 연결. 표제 배경이 가운데만 가림 */
  border-top:1.5px solid #2a2f45;
}
.stem .qbox .qbox-cap,.pq-stem .qbox .qbox-cap,.admin-cmp-live .qbox .qbox-cap, .admin-cmp-live .qbox .qbox-cap{
  position:absolute;
  top:0;left:50%;
  transform:translate(-50%,-50%);
  display:block;
  margin:0;padding:0;
  background:transparent;
  z-index:1;
  pointer-events:none;
  white-space:nowrap;
  line-height:1.2;
}
/* 표제 글자 뒤 흰 배경이 윗변 선을 끊음 → 양옆 선이 모서리까지 이어짐 */
.stem .qbox .qbox-cap .qbox-cap-t,.pq-stem .qbox .qbox-cap .qbox-cap-t,.admin-cmp-live .qbox .qbox-cap .qbox-cap-t, .admin-cmp-live .qbox .qbox-cap .qbox-cap-t{
  display:inline-block;
  padding:0 10px;
  background:#fff;
  font-weight:700;
  font-size:var(--fs-base);
  line-height:1.2;
  color:var(--text);
  white-space:nowrap;
  pointer-events:auto;
}
body.bg-eye-dark .stem .qbox .qbox-cap .qbox-cap-t,
body.bg-eye-dark .pq-stem .qbox .qbox-cap .qbox-cap-t,
body.solve-play.bg-eye-dark .solve-main .qbox .qbox-cap .qbox-cap-t{
  background:var(--bg,#1a1d27);
}
body.bg-eye-dark .stem .qbox.has-cap,
body.bg-eye-dark .pq-stem .qbox.has-cap,
body.solve-play.bg-eye-dark .solve-main .qbox.has-cap{
  border-top-color:var(--border,#2a2f45);
}

/* 코드 지문 박스 — 들여쓰기·줄바꿈 보존 (정보처리기사 등) */
.stem .qbox.code,.pq-stem .qbox.code,.admin-cmp-live .qbox.code, .admin-cmp-live .qbox.code{
  white-space:pre;text-align:left;font-weight:500;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:calc(var(--fs-base) * .95);line-height:1.55;
  overflow-x:auto;overflow-wrap:normal;word-break:normal;
}

/* 선지 안 수식 박스 — formula 이미지 대체 위치 (가스 등) */
.choice .qbox{
  display:block;width:100%;max-width:100%;box-sizing:border-box;
  margin:8px 0 0;padding:12px 14px;
  border:1.5px solid #c5c9d6 !important;border-radius:12px;
  background:#fff !important;text-align:center;
  font-weight:600;line-height:1.6;
}
.choice .qbox .katex{font-size:1.12em}
body.solve-play .solve-main .choice{align-items:flex-start}
body.solve-play .solve-main .choice .cnum{margin-top:2px;flex-shrink:0}
body.solve-play.bg-eye-dark .solve-main .choice .qbox,
body.bg-eye-dark.solve-play .choice .qbox{
  background:#1e2430 !important;border-color:#3a4150 !important;color:#e8eaef !important;
}

/* 문항 이미지 — 소스 고해상 유지.
   소스 2× 레티나 유지. formula≤640px, box/table/wide=카드 폭 100%.
   choicesImg도 카드 폭 + 높은 max-height. */
.diagram{max-width:100%;width:auto;height:auto;max-height:min(62vh,760px);object-fit:contain;display:block;margin:12px 0;border-radius:12px;border:1px solid var(--border);background:#fff;image-rendering:auto;-ms-interpolation-mode:bicubic;box-shadow:var(--shadow-sm);}
.diagram.formula{
  max-width:min(100%,640px);
  width:auto;
  max-height:min(80vh,900px);   /* 높이 제한 완화 */
  overflow:auto;                /* 넘치면 스크롤 가능하게 */
  -webkit-overflow-scrolling:touch;
}
.diagram.table{max-width:100%;width:100%;max-height:min(70vh,880px);}
.diagram.box{max-width:100%;width:100%;max-height:min(70vh,880px);}
.diagram.tank{max-width:min(100%,520px);width:auto;max-height:min(52vh,520px);margin:12px auto;}
.diagram.wide{max-width:100%;width:100%;max-height:min(68vh,840px);}
/* 선지 안 소형 도표(판·속도분포 등)와 같은 체감 크기 — 전달현상 1 등 */
.diagram.choicefig{max-width:min(48%,220px);width:auto;height:auto;max-height:min(30vh,240px);margin-left:auto;margin-right:auto;object-fit:contain;}
/* 문제 화면 선지 — 소프트 필(연회 배경 · 원형 번호 · 보더 없음) */
.choices{display:flex;flex-direction:column;gap:10px;margin:12px 0 8px;}
.choice{
  display:flex;gap:12px;align-items:center;padding:14px 16px;border:0;
  border-radius:18px;font-size:var(--fs-base);line-height:1.5;font-weight:600;cursor:pointer;
  background:#f0f2f6;color:#1B1F2E;
  box-shadow:none;
  transition:background .12s,color .12s,box-shadow .12s,transform .08s;min-width:0;
  -webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation;user-select:none;
}
.choice > span:last-child{min-width:0;flex:1;overflow-wrap:anywhere;word-break:keep-all;}
/* 표형 선지 (choiceTable · S2-P260): 머리표 행과 번호 행을 같은 격자에 놓아 열이 세로로 맞는다.
   행은 그대로 .choice 라 선택·정오·잠금 스타일을 공유한다. */
.choices-table .choice,.choices-table .ctab-head{
  display:grid;grid-template-columns:28px repeat(var(--ctab-k,2),minmax(0,1fr));
  column-gap:12px;row-gap:4px;align-items:center;
}
.choices-table .ctab-head{padding:0 14px 2px;color:#5b6070;font-size:0.92em;font-weight:700;}
.choices-table .ctab-head .ctab-cell{border-bottom:1px solid #d5d8e2;padding-bottom:4px;}
.choices-table .ctab-cell{min-width:0;overflow-wrap:anywhere;word-break:keep-all;}
.choices-table .choice > span:last-child{flex:none;}
/* 부모 word-break/line-height 가 KaTeX 분수 위아래를 눌러 겹친다
   (2026-08-17 cfarmm 12 실측). 수식은 한 덩어리로 두고 줄 높이를 되돌린다. */
.choice .katex,.stem .katex,.pq-ch .katex,.admin-cmp-live .katex,.qbox .katex,.tr-pane .katex{
  line-height:normal;overflow-wrap:normal;word-break:normal;
}
.stem .qbox .katex,.tr-pane .qbox .katex{
  display:inline-block;vertical-align:middle;
}
.choice > span:last-child .katex{
  display:inline-block;vertical-align:middle;max-width:100%;
}
/* 슬롯별 선지 그림 (choiceImgs). 원본이 HWP 에 박혀 있던 그림이라 폭이 작다
   (실측 100~350px) — 늘려 놓으면 뭉개지므로 **원본 크기까지만** 키운다.
   ⛔ width:100% 를 주지 말 것. 350px 짜리 수식이 카드 폭으로 늘어나 흐려진다. */
.choice-img{display:block;max-width:100%;height:auto;margin:4px 0 2px;background:#fff;border-radius:6px;}
.choice-img.inline{display:inline-block;vertical-align:middle;margin:0 3px;max-height:2.4em;width:auto;}
.diagram.inline,.pq-dimg.inline{display:inline-block;vertical-align:middle;margin:0 4px;max-height:2.6em;width:auto;}
.choice.locked .choice-img,.choice.correct .choice-img,.choice.wrong .choice-img{mix-blend-mode:multiply;}
#printRoot .pq-ch .choice-img{max-width:100%;margin:2px 0;}
.qacmp-ch .choice-img{max-width:100%;margin:3px 0;border:1px solid var(--border-soft);}
@media (hover:hover) and (pointer:fine){
  .choice:hover:not(.locked):not(.picked):not(.correct):not(.wrong){
    background:#e8eaef;
  }
}
.choice:active:not(.locked):not(.picked):not(.correct):not(.wrong){
  background:#e2e4ea;transform:scale(.995);
}
.cnum{
  width:28px;height:28px;border-radius:50%;
  background:#e2e4ea;color:#5b6070;
  font-weight:800;font-size:13.5px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  position:relative;line-height:1;border:0;box-shadow:none;
}
.choice.picked .cnum{background:#4d5bf0;color:#fff;}
/* 정·오: 번호 자리에 O / X 스탬프
 * ⛔ 이어하기·다음/이전·재수화 페인트: correct/wrong 만 → O/X 즉시 정적 표시 (stamp 애니 금지)
 * 클릭 직후만 animOK/animNO 가 stampOX 재생 (opacity 0→1 플리커 = 이어하기 버그 원인) */
.choice.correct .cnum{
  background:#dcfce7;color:transparent;border:0;
  box-shadow:none;width:28px;height:28px;
}
.choice.wrong .cnum{
  background:#fee2e2;color:transparent;border:0;
  box-shadow:none;width:28px;height:28px;
}
.choice.correct .cnum::after,
.choice.wrong .cnum::after{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:1.05em;line-height:1;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  /* 정적 표시 — 애니메이션 없음 (복원·네비 시 재재생 플리커 방지) */
  transform:scale(1);opacity:1;
  pointer-events:none;
}
.choice.correct .cnum::after{content:"O";color:var(--ok);font-size:1.15em;letter-spacing:0;}
.choice.wrong .cnum::after{content:"✕";color:var(--no);font-size:1.05em;}
/* ⛔ `color:transparent` 로 숫자를 감추는 건 -webkit-text-fill-color 에 무너진다.
 * 다크 테마가 카드 전체에 `-webkit-text-fill-color:#e8eaef !important` 를 걸어 두는데,
 * 그 값이 .cnum 까지 **상속**돼 ① 숨겼던 숫자가 도로 칠해지고 ② O/X 색까지 밀린다
 * (2026-07-31 다크모드 실측: 번호와 ✕ 가 겹쳐 보였다).
 * 상속은 자기 선언에 지므로 여기서 못 박으면 어느 테마가 뭘 걸든 안전하다.
 * fill 을 currentColor 로 두면 색 지정이 `color` 한 곳에만 남는다. */
.choice.correct .cnum,
.choice.wrong .cnum{ -webkit-text-fill-color:transparent; }
.choice.correct .cnum::after,
.choice.wrong .cnum::after{ -webkit-text-fill-color:currentColor; }
@keyframes stampOX{
  0%{transform:scale(.35);opacity:0;}
  55%{transform:scale(1.22);opacity:1;}
  100%{transform:scale(1);opacity:1;}
}
/* 선지 클릭 직후에만 스탬프 애니 (paintStudyPickOnCard / lastAnim) */
.choice.animOK .cnum::after{animation:stampOX .45s cubic-bezier(.2,1.35,.4,1) both;}
.choice.animNO .cnum::after{animation:stampOX .4s cubic-bezier(.2,1.35,.4,1) both;}
.choice.picked{
  border:0;background:#e8ecff;color:#1B1F2E;
  box-shadow:none;
}
.choice.correct{
  border:0;background:#eaf7f0;color:#1B1F2E;
  box-shadow:none;
}
.choice.wrong{
  border:0;background:#fdeeee;color:#1B1F2E;
  box-shadow:none;
}
.choice.locked{cursor:default;}
.choice.locked:hover,.choice.picked:hover,.choice.correct:hover,.choice.wrong:hover,
.choice.locked:active,.choice.picked:active,.choice.correct:active,.choice.wrong:active{
  /* 상태 배경 유지 */
}
.choice.picked:hover,.choice.picked:active{
  border:0;background:#e8ecff;box-shadow:none;
}
.choice.correct:hover,.choice.correct:active{
  border:0;background:#eaf7f0;box-shadow:none;
}
.choice.wrong:hover,.choice.wrong:active{
  border:0;background:#fdeeee;box-shadow:none;
}
.choice.locked:not(.picked):not(.correct):not(.wrong):hover,
.choice.locked:not(.picked):not(.correct):not(.wrong):active{
  border:0;background:#f0f2f6;box-shadow:none;
}
/* 선지만 가벼운 피드백 (전체 카드/화면 깜빡임 없음) */
@keyframes popOK{0%{transform:scale(1)}40%{transform:scale(1.015)}100%{transform:scale(1)}}
@keyframes shakeNO{0%,100%{transform:translateX(0)}30%{transform:translateX(-3px)}60%{transform:translateX(2px)}}
.choice.animOK{animation:popOK .28s ease both;}
.choice.animNO{animation:shakeNO .28s ease both;}
.feedback{font-size:var(--fs-base);font-weight:800;margin-top:8px;letter-spacing:-0.01em;line-height:var(--lh);}
.feedback.ok{color:var(--ok);}
.feedback.no{color:var(--no);}
.confetti{position:absolute;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:5;}
/* 선지 이미지: 카드 폭 전체 사용(1·13·17 등 구조식이 우측 여백 없이 크게) */
.choicesImgWrap{margin:10px 0;padding:12px 14px;border:1px solid var(--border-soft);border-radius:var(--radius-sm);background:#f7f8ff;width:100%;max-width:100%;box-sizing:border-box;}
.choicesImgMap{position:relative;width:100%;}
.choicesImgWrap img{max-width:100%;width:100%;height:auto;max-height:min(72vh,900px);object-fit:contain;object-position:left top;display:block;image-rendering:auto;-ms-interpolation-mode:bicubic;}
.choicesImgWrap.formula{max-width:100%;}
.choicesImgWrap.table{max-width:100%;}
.choicesImgWrap.box{max-width:100%;}
.choicesImgWrap.wide{max-width:100%;}
@media (max-width:820px){
  .diagram.formula{max-width:100%;max-height:min(50vh,520px);}
  .diagram.table,.diagram.box,.diagram.wide{max-width:100%;width:100%;max-height:min(68vh,820px);}
  .diagram.tank{max-width:100%;max-height:min(50vh,480px);}
  .diagram.choicefig{max-width:min(52%,200px);max-height:min(28vh,220px);}
  .choicesImgWrap{width:100%;max-width:100%;padding:10px;}
  .choicesImgWrap img{width:100%;max-height:min(68vh,820px);}
}
@media (max-width:400px){
  .diagram.formula{max-height:min(46vh,400px);}
  .choicesImgWrap img{max-height:min(64vh,640px);}
}
/* PC 넓은 화면: 모아보기(list) 모드에서만 2단 그리드 */
@media (min-width:1100px){
  .wrap{max-width:1200px;}
  body.solve-list #list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    align-items:stretch;
    overflow-anchor:none;
  }
  body.solve-list #list .card{
    margin-bottom:0;
    min-width:0;
    height:100%;
    display:flex;
    flex-direction:column;
    box-sizing:border-box;
  }
  body.solve-list #list .card .stem{flex:0 0 auto;}
  body.solve-list #list .card .choices{flex:1 1 auto;}
  body.solve-list #list .card .kws{margin-top:auto;}
}
@media (min-width:1400px){
  .wrap{max-width:1320px;}
  body.solve-list #list{gap:16px;}
}

/* ───────── 시험 모드 CBT 셸 (body.exam-cbt) ─────────
 * 상단 바(시계·제출) · 본문 페이지당 2문항 · 우측 답안지 전 높이.
 * 사이드 「시험 타이머」 첨부 패널은 숨긴다(헤더·시간 버튼으로 조작).
 * ⛔ 전 규칙을 body.exam-cbt 로 스코프한다 — 학습 경로 CSS 를 건드리지 않는다.
 */
.exam-cbt-bar,.exam-cbt-foot{display:none;}
body.exam-cbt .exam-cbt-bar{
  display:block;position:fixed;top:0;left:0;right:0;z-index:60;
  background:#fff;border-bottom:1px solid var(--border);
  box-shadow:0 2px 10px rgba(30,40,80,.06);padding:8px 14px;
}
/* 첨부 타이머 카드 제거 → 답안지가 사이드 독 전체 사용 */
body.exam-cbt .exam-timer-panel,
body.exam-cbt .exam-timer-reopen{display:none !important;}
body.exam-cbt .side-dock{gap:0;}
body.exam-cbt .omr-dock{
  display:flex !important;flex:1 1 auto !important;min-height:0 !important;
  height:100%;max-height:none;
}
body.exam-cbt .omr-ft{display:none !important;} /* 채점/다시풀기는 상단 제출·결과로 */
/* 페이지 밖 문항 숨김 (한 화면 2문항) */
body.exam-cbt #list .card.ecb-page-hide{display:none !important;}
/* PC: 한 줄 · 제목 가운데. 모바일: 2줄 (제목 행 + 시계/제출 행) */
body.exam-cbt .ecb-main{
  display:flex;align-items:center;gap:10px;position:relative;min-height:36px;
}
body.exam-cbt .ecb-title{
  flex:1;min-width:0;text-align:center;font-size:15.5px;font-weight:900;color:#1f2437;
  letter-spacing:-0.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  padding:0 4px;
}
body.exam-cbt .ecb-x{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:#fff;
  color:#5b6072;font-size:15px;cursor:pointer;flex-shrink:0;font-family:inherit;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;z-index:1;
}
body.exam-cbt .ecb-tools{
  display:flex;align-items:center;gap:10px;flex-shrink:0;margin-left:auto;z-index:1;
}
body.exam-cbt .ecb-clock{
  background:none;border:0;padding:0;margin:0;font:inherit;color:#1f2437;cursor:pointer;
  display:inline-flex;align-items:center;gap:2px;font-size:14px;font-weight:900;
  font-variant-numeric:tabular-nums;letter-spacing:-0.02em;white-space:nowrap;
}
body.exam-cbt .ecb-clock b{font-weight:900;}
body.exam-cbt .ecb-clock small{font-weight:700;color:var(--muted);margin-left:2px;}
body.exam-cbt .ecb-leftn{
  font-size:13.5px;font-weight:800;color:#5b6072;white-space:nowrap;font-variant-numeric:tabular-nums;
}
body.exam-cbt .ecb-leftn b{color:#c2410c;font-weight:900;}
body.exam-cbt .ecb-time-btn{
  border:1px solid var(--border);background:#fff;border-radius:10px;padding:6px 12px;
  font-size:12.5px;font-weight:800;color:#5b6072;cursor:pointer;font-family:inherit;white-space:nowrap;
}
body.exam-cbt .ecb-submit{
  border:1px solid var(--indigo);background:var(--indigo);color:#fff;border-radius:10px;
  padding:7px 14px;font-size:13px;font-weight:900;cursor:pointer;font-family:inherit;white-space:nowrap;
}
/* 레거시 클래스 잔여 방지 */
body.exam-cbt .ecb-hd,body.exam-cbt .ecb-row,body.exam-cbt .ecb-stats,body.exam-cbt .ecb-acts{display:contents;}
@media (min-width:900px){
  /* PC 한 줄: 제목을 바 전체 기준 가운데 (✕·도구와 겹치지 않게 max-width) */
  body.exam-cbt .ecb-main{min-height:40px;}
  body.exam-cbt .ecb-title{
    position:absolute;left:50%;transform:translateX(-50%);
    max-width:min(46%,420px);width:auto;flex:none;padding:0 8px;font-size:16px;
  }
  body.exam-cbt .ecb-tools{gap:12px;}
}
@media (max-width:899px){
  /* 모바일 2줄: 1행 ✕+제목(가운데) · 2행 시계·남은·시간·제출 */
  body.exam-cbt .ecb-main{
    display:grid;grid-template-columns:34px 1fr 34px;grid-template-rows:auto auto;
    column-gap:8px;row-gap:8px;align-items:center;
  }
  body.exam-cbt .ecb-x{grid-column:1;grid-row:1;}
  body.exam-cbt .ecb-title{
    grid-column:1 / -1;grid-row:1;text-align:center;padding:0 38px;font-size:14.5px;
    position:static;transform:none;max-width:none;
  }
  body.exam-cbt .ecb-tools{
    grid-column:1 / -1;grid-row:2;margin-left:0;width:100%;
    justify-content:space-between;gap:6px;flex-wrap:nowrap;
  }
  body.exam-cbt .ecb-clock{font-size:13px;}
  body.exam-cbt .ecb-leftn{font-size:12.5px;}
  body.exam-cbt .ecb-time-btn{padding:5px 10px;font-size:12px;}
  body.exam-cbt .ecb-submit{padding:6px 12px;font-size:12.5px;}
}
/* 풀이 셸(한 문제 집중) 대신 전 문항 목록을 쓴다.
 * ⛔ body.solve-play 가 뒤에서 `#list{display:none!important}` · `.solve-shell{display:block!important}`
 *    로 못박으므로, 클래스 하나 더 얹어 특이도로 이긴다 (선언 순서로는 못 이긴다). */
/* ⛔ `#list` 는 `.wrap` 의 형제다 — `.wrap` 패딩이 먹지 않으니 여기서 직접 준다 */
body.exam-cbt.solve-play #list{display:block !important;padding:0 14px;box-sizing:border-box;}
body.exam-cbt.solve-play .solve-shell,
body.exam-cbt.solve-play #solveShell.solve-shell{display:none !important;}
/* 상·하단 고정 바 높이는 화면 폭에 따라 달라진다(버튼 줄바꿈) → JS 가 실측해 변수로 넣는다 */
body.exam-cbt.solve-play{
  padding:calc(var(--ecb-h, 72px) + 10px) 0 calc(var(--ecf-h, 56px) + 12px) !important;
}
body.exam-cbt.solve-play .wrap{
  max-width:none;margin:0 auto;padding:0 16px !important;box-sizing:border-box;
}
/* 학습 전용 크롬·도구는 시험 중 감춘다 (해설·메모·연습장·오답 배지) */
body.exam-cbt .solve-shell,
body.exam-cbt #listModeBar,
body.exam-cbt #list .card .headbtns,
body.exam-cbt #list .card .solve-side-toolrow,
body.exam-cbt #list .card .expbox,
body.exam-cbt #list .card .reportbox,
body.exam-cbt #list .card .memobox,
body.exam-cbt #list .card .feedback,
body.exam-cbt #list .card .kws{display:none !important;}
body.exam-cbt{padding-top:80px;padding-bottom:64px;}
body.exam-cbt .exam-cbt-foot{
  display:flex !important;position:fixed !important;
  left:0 !important;right:0 !important;bottom:0 !important;
  transform:none !important;-webkit-transform:translateZ(0);
  width:100% !important;max-width:none !important;margin:0 !important;
  z-index:80 !important;
  align-items:center;justify-content:space-between;gap:10px;
  background:#fff !important;border-top:1px solid var(--border);
  box-shadow:0 -4px 20px rgba(20,24,40,.08);
  padding:9px 14px calc(9px + env(safe-area-inset-bottom,0px));
  box-sizing:border-box;
  visibility:visible !important;opacity:1 !important;
  min-height:calc(52px + env(safe-area-inset-bottom,0px));
  /* iOS 스크롤 중 하단 바가 사라졌다 나타나는 깜빡임 완화 */
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
}
body.exam-cbt .ecf-left,body.exam-cbt .ecf-right{display:flex;align-items:center;gap:8px;}
body.exam-cbt .ecf-pos{
  font-size:14px;font-weight:900;color:#1f2437;font-variant-numeric:tabular-nums;
}
body.exam-cbt .ecf-pos small{color:var(--muted);font-weight:800;}
body.exam-cbt .ecf-btn{
  border:1px solid var(--border);background:#fff;border-radius:10px;padding:7px 14px;
  font-size:13px;font-weight:800;color:#3c4356;cursor:pointer;font-family:inherit;
}
/* 시안 1: 「다음」은 두 모드 모두 **채운 인디고**. 오른쪽 끝 = 전진 (S2-P45).
   ⛔ 외곽선으로 되돌리지 말 것 — 학습의 「다음 문제」와 무게가 달라지면 모드를 오갈 때
      주 버튼을 눈으로 다시 찾게 된다 (2026-07-31 운영자 지적의 핵심). */
body.exam-cbt .ecf-btn.primary{
  background:var(--indigo);border-color:var(--indigo);color:#fff;
  box-shadow:0 4px 12px -5px rgba(76,99,246,.7);
}
body.exam-cbt .ecf-btn[disabled]{opacity:.4;cursor:default;}
@media (min-width:1100px){
  /* 우측 답안 표기란 = 기존 고정 side-dock 재사용 (상·하단 바 높이만큼 비켜 앉힌다).
   * ⛔ `body.solve-play.mode-test .side-dock:not(.dock-embedded){display:none!important}`
   *    (집중 풀이 임베드 전용 규칙)보다 특이도가 높아야 한다 — 같은 셀렉터 길이로는 진다. */
  body.exam-cbt.solve-play.mode-test .side-dock:not(.dock-embedded),
  body.exam-cbt.solve-play .side-dock{
    display:flex !important;flex-direction:column;
    top:calc(max(10px,env(safe-area-inset-top)) + var(--ecb-h, 56px));
    bottom:calc(max(10px,env(safe-area-inset-bottom)) + var(--ecf-h, 56px));
  }
  body.exam-cbt.solve-play.mode-test .omr-dock,
  body.exam-cbt.solve-play .omr-dock{
    display:flex !important;flex:1 1 auto !important;min-height:0 !important;
  }
  /* 독 폭도 축소한 여백(264)에 맞춘다 — 280 이면 본문 위로 16px 겹친다 */
  body.exam-cbt.solve-play .side-dock{ width:238px; }
  /* 답안 표기란 자리 확보. `body.solve-play.mode-test{padding-right:0!important}` 보다 높게 */
  /* 답안지 폭 축소 (2026-07-30 운영자) — 행 간격 축소와 함께 본문 폭을 돌려준다 */
  body.exam-cbt.solve-play.mode-test:not(.solve-exam-embed){padding-right:min(264px,24vw) !important;}
  body.exam-cbt.solve-play .wrap{max-width:none;margin-right:0;}
  /* PC: 한 페이지 2문항 · 좌우 독립 스크롤 · 가운데 얇은 구분선 */
  html:has(body.exam-cbt.solve-play){height:100%;overflow:hidden;}
  body.exam-cbt.solve-play{
    height:100dvh !important;max-height:100dvh !important;overflow:hidden !important;
    padding:0 !important;
  }
  body.exam-cbt.solve-play #list{
    display:grid !important;grid-template-columns:1fr 1fr;gap:0;
    align-items:stretch;overflow:hidden;overflow-anchor:none;
    position:fixed;
    top:var(--ecb-h, 56px);
    bottom:var(--ecf-h, 56px);
    left:0;
    right:min(264px,24vw);
    height:auto;max-height:none;
    padding:0 !important;margin:0;box-sizing:border-box;
    background:#fff;z-index:1;
  }
  /* ── 상·하단 바를 **문제 영역**에 맞춘다 (S2-P48, 2026-07-31 운영자) ──
     기준은 위 #list 와 **같은 예약폭** `min(264px,24vw)` (답안지 자리)와 카드 안쪽 여백 18px.
     ⛔ 숫자를 따로 적지 말 것 — #list 와 어긋나면 바와 본문이 세로로 안 맞는다. */
  body.exam-cbt.solve-play .exam-cbt-foot{
    /* 이전·다음이 답안지 밑에 있어 너무 오른쪽이었다 → 오류 제보와 같은 선(카드 우단)까지 당긴다 */
    padding-left:18px;
    padding-right:calc(min(264px,24vw) + 18px);
  }
  /* 제목은 좌우를 나누는 세로 구분선 위 — 즉 문제 영역(답안지 제외)의 한가운데.
     ⛔ flex 의 `flex:1 + text-align:center` 로는 화면 중앙(답안지 포함)에 놓여 구분선에서 밀린다.
        절대 배치로 #list 와 같은 span 을 덮고 그 안에서 중앙 정렬한다.
     ⛔ 그러면 제목이 흐름에서 빠지므로 도구 묶음이 왼쪽으로 붙는다 — margin-left:auto 로 되돌린다.
     ⛔ pointer-events:none — 제목 상자가 ✕ 위를 덮어 나가기가 안 눌리면 안 된다. */
  body.exam-cbt.solve-play .ecb-title{
    position:absolute;left:0;right:min(264px,24vw);
    /* ⛔ 위 @media(min-width:900px) 의 `left:50% · transform:translateX(-50%) · max-width:420px`
       을 반드시 무력화할 것 — left 만 이기면 폭이 420 으로 잘린 채 -210 만큼 밀려
       제목이 화면 왼쪽 밖으로 나간다(실측 [-196,224]). */
    transform:none;max-width:none;width:auto;
    padding:0 46px;pointer-events:none;
  }
  body.exam-cbt.solve-play .ecb-tools{margin-left:auto;}
  body.exam-cbt.solve-play #list .card{
    margin:0;min-width:0;height:100%;max-height:100%;
    display:flex;flex-direction:column;box-sizing:border-box;
    overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    border:0;border-radius:0;box-shadow:none;background:#fff;
    padding:16px 18px 24px;
  }
  /* 좌열 오른쪽 = 얇은 구분선 */
  body.exam-cbt.solve-play #list .card.ecb-col-a{
    border-right:1px solid #e6e8ef;
  }
  body.exam-cbt.solve-play #list .card.ecb-page-hide{display:none !important;}
  body.exam-cbt.solve-play #list .card .stem{flex:0 0 auto;}
  body.exam-cbt.solve-play #list .card .choices{flex:0 0 auto;}
}
@media (max-width:1099px){
  body.exam-cbt .side-dock{display:none !important;}
  body.exam-cbt .ecb-title{font-size:15px;}
}
/* 모바일 CBT: 한 문제씩 · 본문(#list)만 스크롤 · 상·하단 바 고정
 * ⛔ 문서 전체 스크롤을 쓰면 iOS 주소창 show/hide 때 fixed 하단 바가 깜빡인다. */
@media (max-width:1099px){
  html:has(body.exam-cbt.solve-play){height:100%;overflow:hidden;}
  body.exam-cbt.solve-play{
    height:100dvh !important;max-height:100dvh !important;overflow:hidden !important;
    padding:0 !important;
  }
  body.exam-cbt.solve-play .wrap{
    display:none !important; /* CBT 본문은 #list 만 */
  }
  body.exam-cbt.solve-play #list{
    display:block !important;
    position:fixed !important;
    top:var(--ecb-h, 88px);
    bottom:var(--ecf-h, 64px);
    left:0;right:0;
    overflow-y:auto;overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    padding:10px 12px 16px !important;
    margin:0 !important;
    box-sizing:border-box;
    z-index:1;
    background:var(--bg, #f6f7fc);
  }
  body.exam-cbt.solve-play #list .card:not(.ecb-page-hide){
    margin:0;border-radius:14px;box-shadow:0 1px 0 rgba(20,24,44,.04);
    background:#fff;
  }
  body.exam-cbt.solve-play #list .card.ecb-col-a{border-right:0;}
  body.exam-cbt .exam-cbt-bar{
    position:fixed !important;top:0;left:0;right:0;z-index:90 !important;
    transform:none !important;-webkit-transform:translateZ(0);
  }
}
@media (max-width:899px){
  /* 학습 셸 overflow 잠금이 CBT 를 덮지 않게 — 위 1099 규칙이 정본 */
  body.exam-cbt.solve-play .wrap{
    display:none !important;
  }
}
@media (max-width:640px){
  body.exam-cbt .exam-cbt-bar{padding:6px 10px;}
  body.exam-cbt .ecb-title{font-size:14px;}
  body.exam-cbt .ecb-x{width:30px;height:30px;font-size:14px;}
  body.exam-cbt .ecb-time-btn{padding:5px 9px;font-size:11.5px;}
  body.exam-cbt .ecb-submit{padding:6px 11px;font-size:12px;}
  body.exam-cbt .exam-cbt-foot{
    padding:7px 10px calc(9px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.exam-cbt .ecf-btn{padding:6px 10px;font-size:12px;}
  body.exam-cbt .ecf-left,body.exam-cbt .ecf-right{gap:6px;}
}
/* 저장 불가 안내 / 결과 제출 확인 */
.exam-cbt-modal{
  display:none;position:fixed;inset:0;z-index:2200;background:rgba(20,22,34,.5);
  align-items:center;justify-content:center;padding:20px;
}
.exam-cbt-modal.show{display:flex;}
.exam-cbt-modal .ecm-panel{
  width:min(400px,100%);background:#fff;border-radius:16px;padding:20px 22px 18px;
  box-shadow:0 24px 60px rgba(20,22,40,.28);
}
.exam-cbt-modal .ecm-hd{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.exam-cbt-modal .ecm-hd b{flex:1;font-size:16px;font-weight:900;color:#1f2437;}
.exam-cbt-modal .ecm-x{
  border:0;background:none;font-size:17px;color:#8b90a0;cursor:pointer;font-family:inherit;line-height:1;
}
.exam-cbt-modal .ecm-msg{font-size:13.5px;font-weight:600;color:#4b5162;line-height:1.6;margin:0 0 16px;}
/* 「풀지 않은 문제 · N문제」 — 숫자를 세는 자리는 여기 하나 (상시 칩 없음) */
.exam-cbt-modal .ecm-row{
  display:flex;align-items:baseline;gap:12px;margin:0 0 18px;
  font-size:14px;font-weight:700;color:#3c4356;
}
.exam-cbt-modal .ecm-row .ecm-k{flex:1;min-width:0;}
.exam-cbt-modal .ecm-row .ecm-v{
  font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:#3c4356;
}
.exam-cbt-modal .ecm-row .ecm-v.warn{color:#d92d20;}
.exam-cbt-modal .ecm-row[hidden]{display:none;}
.exam-cbt-modal .ecm-btns{display:flex;gap:8px;}
.exam-cbt-modal .ecm-btns button{
  flex:1;border-radius:12px;padding:13px 14px;font-size:14.5px;font-weight:800;
  cursor:pointer;font-family:inherit;line-height:1.2;
}
.exam-cbt-modal .ecm-cancel{border:1.5px solid var(--border);background:#fff;color:#3c4356;}
.exam-cbt-modal .ecm-ok{border:1.5px solid var(--slate-ink,#1f2437);background:#1f2437;color:#fff;}
/* 마지막 페이지: 「다음」이 제출로 바뀐 상태 */
.exam-cbt-foot .ecf-btn.is-submit{background:#1f2437;border-color:#1f2437;color:#fff;}

/* —— 한 문제 집중 풀이 셸 (기본) —— */
.solve-shell{display:none;margin:0 0 16px;}
body.solve-focus .solve-shell{display:block;}
body.solve-focus #list{display:none !important;}
body.solve-list .solve-shell{display:none;}
body.solve-list #list{display:block;}
.solve-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  margin:0 0 12px;padding:10px 12px;border-radius:14px;
  background:#fff;border:1px solid var(--border);box-shadow:var(--shadow-sm);
}
.solve-prog{
  font-size:var(--fs-md);font-weight:900;color:var(--indigo);letter-spacing:-0.02em;
  font-variant-numeric:tabular-nums;
}
.solve-prog small{font-weight:700;color:var(--muted);font-size:var(--fs-sm);margin-left:6px;}
.solve-bar-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.solve-layout{display:flex;flex-direction:column;gap:0;min-height:0;}
@media (min-width:900px){
  .solve-layout{
    display:grid;grid-template-columns:1fr 1fr; /* 문제·해설 동일 폭 (CBT 24″) */
    gap:0;align-items:stretch;
  }
  .solve-side{
    position:sticky;top:0;max-height:calc(100vh - 112px);overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
}
.solve-main .card{margin-bottom:0;}
.solve-side{
  background:#fff;border:0;border-radius:0;
  padding:14px 16px;box-shadow:none;min-height:80px;
}
.solve-side-tools{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start;align-items:center;
  margin:0 0 8px;min-height:0;
}
.solve-side-tools:empty{display:none;margin:0;}
.solve-side-tools .expbtn,
.solve-side-tools .memobtn,
.solve-side-tools .reportbtn,
.solve-side-tools .scratchbtn{margin-top:0;}
body.solve-play.mode-test .solve-side-tools{display:none!important;}
.solve-side-ph{
  font-size:var(--fs-sm);font-weight:600;color:var(--muted);line-height:1.55;padding:8px 4px 12px;
}
.solve-side-ph b{color:var(--sub);font-weight:800;}
/* AI 해설·메모 등: 버튼 바로 아래, 불필요한 상단 여백 최소화 */
#solveSideBody{margin:0;padding:0;min-width:0;}
#solveSideBody > .feedback{margin-top:0;margin-bottom:10px;}
#solveSideBody > .expbox{margin-top:8px;}
/* .exp-lab 이 앞에 끼어들었으므로(시안 방향 1) 라벨 바로 뒤 해설은 여백 0 */
#solveSideBody > .exp-lab:first-child{margin-top:2px;}
#solveSideBody > .feedback + .exp-lab{margin-top:8px;}
#solveSideBody > .exp-lab + .expbox{margin-top:0;}
#solveSideBody > .expbox:first-child,
#solveSideBody > .feedback + .expbox{margin-top:6px;}
.solve-side .feedback{margin-top:0;margin-bottom:10px;}
.solve-side .expbtn,.solve-side .memobtn,.solve-side .reportbtn,.solve-side .scratchbtn{margin-top:0;}
/* —— 연습장 (웹 전용 · 내부 이름은 scratch — 저장 키 호환) —— */
.solve-side-tabs{
  display:none;gap:0;border-bottom:1px solid #eceef2;margin:0 0 12px;
}
body.solve-play.mode-study .solve-side-tabs,
body.solve-play.solve-test-graded .solve-side-tabs{display:flex;}
.solve-side-tabs button{
  flex:1;border:0;background:transparent;padding:10px 8px;font-size:13px;font-weight:700;
  color:#8990a3;cursor:pointer;font-family:inherit;border-bottom:2px solid transparent;
  margin-bottom:-1px;white-space:nowrap;
}
.solve-side-tabs button.on{color:#3b48d8;border-bottom-color:#4d5bf0;font-weight:800;}
.solve-side-tabs button:hover:not(.on){color:#5e6478;}
.scratchbtn{
  margin-top:12px;border:1.5px solid #c9d2ff;background:#f8f9ff;color:var(--indigo);
  padding:9px 16px;border-radius:var(--radius-pill);font-size:var(--fs-md);font-weight:700;
  cursor:pointer;box-shadow:var(--shadow-sm);font-family:inherit;
}
.scratchbtn:hover{background:#eef1ff;border-color:var(--indigo);}
.scratchbtn.on{background:#eef0fe;border-color:#4d5bf0;color:#3b48d8;font-weight:800;}
/* 풀이 도구 칩 — 한 줄 규격 통일. 높이 4종(30·31.5·32.5·37.5) · 글자 2종(13·14) 이
   섞여 두 줄이 들쭉날쭉했다. 이 행 안에서만 규격을 맞춘다(다른 화면의 같은 클래스는 그대로). */
.solve-side-toolrow{position:relative;}
.solve-side-toolrow>button{
  margin-top:0;font-size:13px;line-height:1.25;padding:0 13px;min-height:32px;
  box-shadow:none;display:inline-flex;align-items:center;gap:6px;
}
.toolmorebtn{
  border:1px solid var(--border);background:var(--card,#fff);color:var(--muted);
  border-radius:var(--radius-pill);font-family:inherit;font-weight:600;cursor:pointer;
}
.toolmorebtn[aria-expanded="true"]{border-color:var(--indigo);color:var(--indigo);}
/* 「더보기」 팝오버 — 2026-07-31 이후 담을 항목이 없어 렌더되지 않는다.
   스타일·함수는 남겨 둔다: 다시 넷째 도구가 생기면 그대로 쓴다. */
.toolmore{
  display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:154px;
  background:var(--card,#fff);border:1px solid var(--border);border-radius:12px;
  box-shadow:0 8px 22px rgba(16,23,40,.16);padding:6px;
}
.toolmore.open{display:block;}
.toolmore.open.up{top:auto;bottom:calc(100% + 6px);}
.toolmore>button{
  display:flex;width:100%;align-items:center;gap:8px;text-align:left;
  background:none;border:0;border-radius:8px;padding:9px 10px;box-shadow:none;
  font-family:inherit;font-size:13.5px;font-weight:600;color:inherit;cursor:pointer;
}
.toolmore>button:hover{background:var(--bg-soft,#f3f4f6);}
.toolmore>button.on{color:var(--indigo);font-weight:800;background:#eef0fe;}
/* ── 정답 보기 — 헤드 칩(OFF) ↔ 선지 위 상태 배너(ON) (2026-07-30 운영자 지시) ──
   OFF 칩은 메타 3층 헤드의 옛 「내일 복습」 자리. 켜면 선지 위 배너가 이어받는다. */
.reveal-row{display:flex;justify-content:flex-end;align-items:center;margin:2px 0 10px;}
/* 오른쪽 묶음 = 정답 보기 → 북마크 (2026-07-31 교환). 밀개는 **첫 요소**가 갖는다.
   칩이 있으면 여기서 밀고 북마크는 gap:8px 로 붙어 온다. 칩이 없으면(채점 후)
   아래 .chkbtn 의 margin-left:auto 가 대신 민다 — 두 경우를 모두 덮어야 한다. */
.card-title-row .reveal-row{flex:0 0 auto;margin:0 0 0 auto;align-self:center;}
.card-title-row .reveal-row + .chkbtn{margin-left:0;}
.card-title-row .reveal-row .rv-chip{font-size:11px;gap:4px;padding:4px 9px;}
.card-title-row .reveal-row .rv-chip svg{width:12px;height:12px;}
.reveal-row .rv-chip{
  display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;
  color:var(--muted);background:var(--card,#fff);border:1px solid var(--border);
  border-radius:999px;padding:6px 12px;cursor:pointer;font-family:inherit;line-height:1.2;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
.reveal-row .rv-chip:hover{border-color:var(--indigo-soft);color:var(--indigo);}
/* ON — **같은 칩 자리**에서 상태만 바뀐다 (S2-P45). 선지 위 배너로 옮기지 않는다:
   누른 버튼이 사라지고 다른 곳에 나타나면 끄려는 사람이 대상을 다시 찾아야 한다. */
.reveal-row .rv-chip.on{
  background:#ecfdf5;border-color:#a7f3d0;color:#0f766e;font-weight:800;
}
.reveal-row .rv-chip.on:hover{border-color:#6ee7b7;color:#0b5d52;}
body.bg-eye-dark .reveal-row .rv-chip.on{
  background:rgba(67,214,154,.14);border-color:#2a4a3c;color:#43d69a;
}
/* ⛔ 아래 .reveal-row.on 은 옛 선지 위 배너 스킨 — 배너를 되살리지 말 것 (S2-P45) */
.reveal-row.on{
  justify-content:flex-start;gap:7px;background:#ecfdf5;border:1px solid #a7f3d0;color:#0f766e;
  border-radius:10px;padding:8px 11px;font-size:12.5px;line-height:1.4;
}
.reveal-row.on b{font-weight:800;}
.reveal-row.on .rv-sub{color:#4d7c6f;min-width:0;}
.reveal-row.on .rv-off{
  margin-left:auto;flex:0 0 auto;font-size:11.5px;font-weight:700;color:#0f766e;background:#fff;
  border:1px solid #a7f3d0;border-radius:999px;padding:4px 11px;cursor:pointer;font-family:inherit;
}
body.bg-eye-dark .reveal-row .rv-chip{background:var(--card);border-color:var(--border);color:var(--muted);}
body.bg-eye-dark .reveal-row.on{background:rgba(67,214,154,.12);border-color:#2a4a3c;color:#43d69a;}
body.bg-eye-dark .reveal-row.on .rv-sub{color:#7fb9a2;}
body.bg-eye-dark .reveal-row.on .rv-off{background:transparent;border-color:#2a4a3c;color:#43d69a;}
/* ── 메타 3층 (2026-07-30) — ①순번·회차(과목명까지)·정답보기·북마크 ②회독 ③단원 ── */
body.solve-play .card-head-3t .card-title-row{flex-wrap:nowrap;}
.card-head-3t .solve-card-prog{font-size:19px;}
.card-head-3t .solve-card-subj{font-size:14px;font-weight:500;color:#6b7180;}
.card-head-3t .solve-card-exam,
body.solve-play .card-head-3t #solveCardExamLab{flex:1 1 auto;max-width:none;}
.card-head-3t .ch-seen-row{display:flex;align-items:center;gap:8px;margin-top:5px;min-width:0;}
.card-head-3t .solve-card-cat-col{
  flex-direction:row;align-items:baseline;gap:8px;justify-content:flex-start;
  margin:7px 0 0;max-width:100%;width:100%;
}
.card-head-3t .solve-card-cat-col .solve-card-next{margin-left:auto;text-align:right;}
/* 시안 정합 3종 (2026-07-30 운영자 확정) —
   ① 학습 스톱워치: 알약 → 조용한 모노 텍스트 (시험 카운트다운 알약은 그대로) */
body.mode-study .solve-mini-timer .smt-clock{
  background:transparent;box-shadow:none;padding:7px 4px;
  color:var(--muted);font-weight:700;font-size:12.5px;
  font-family:ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.03em;
}
body.mode-study .solve-mini-timer.running .smt-clock{background:transparent;box-shadow:none;}
body.mode-study .solve-mini-timer .smt-ico{display:none;}
/* ② 단원: 칩 → 텍스트 (3층 헤드에서만 — 목록·검색의 칩은 유지) */
.card-head-3t .solve-card-cat,
.card-head-3t .solve-card-cat-col .solve-card-cat{
  background:none;padding:0;border-radius:0;
  font-size:13px;font-weight:800;color:var(--text);
  font-variant-numeric:tabular-nums;
}
body.bg-eye-dark .card-head-3t .solve-card-cat{background:none;color:var(--text);}
/* ③ 회독 문장 라벨 — verbose 스트립(풀이 카드)에만 */
.seen-strip .seen-res{font-size:10.5px;font-weight:700;color:var(--muted);margin-left:2px;white-space:nowrap;}
.seen-strip.warn .seen-res{color:var(--no);}
/* (시안 9 소프트 카드 스킨은 시트 맨 끝 — 후행 동특이도 규칙에 밀리지 않게 이동) */
#solveScratchPane{display:none;flex-direction:column;gap:10px;min-height:0;}
#solveScratchPane.show{display:flex;}
/* ⛔ #solveSideTools 를 여기에 다시 넣지 말 것 — 탭바를 없앤 뒤로(2026-07-31)
   칩 줄이 연습장에서 해설·메모로 돌아오는 유일한 길이다. 숨기면 갇힌다. */
body.solve-side-scratch #solveSideBody,
body.solve-side-scratch #solveSidePh{display:none !important;}
.scratch-toolbar{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;
}
.scratch-toolbar button{
  border:1px solid #e2e4ee;background:#fff;border-radius:999px;padding:6px 12px;
  font-size:12.5px;font-weight:700;color:#5e6478;cursor:pointer;font-family:inherit;
  line-height:1.2;
}
.scratch-toolbar button.on{background:#eef0fe;border-color:#c9d2ff;color:#3b48d8;font-weight:800;}
.scratch-toolbar button:hover{border-color:#c9d2ff;color:#3b48d8;}
/* 색·굵기는 이름 대신 **그 자체**를 보여 준다 — 툴바가 한 줄에 들어와야 한다 */
.scratch-toolbar .sc-swatches,.scratch-toolbar .sc-sizes{display:inline-flex;align-items:center;gap:4px;}
.scratch-toolbar .sc-sw,.scratch-toolbar .sc-sz{
  padding:0;width:28px;height:28px;border-radius:999px;display:inline-flex;
  align-items:center;justify-content:center;border:1px solid #e2e4ee;background:#fff;
}
.scratch-toolbar .sc-sw i{display:block;width:15px;height:15px;border-radius:999px;}
.scratch-toolbar .sc-sw[data-sc-color="ink"] i{background:#2c3242;}
.scratch-toolbar .sc-sw[data-sc-color="blue"] i{background:#4d5bf0;}
.scratch-toolbar .sc-sw[data-sc-color="red"] i{background:#e11d48;}
.scratch-toolbar .sc-sw[data-sc-color="hl"] i{background:rgba(250,224,70,.95);border-radius:3px;width:16px;height:11px;}
.scratch-toolbar .sc-sw.on{border-color:#3b48d8;box-shadow:0 0 0 2px #dfe3ff;background:#fff;}
.scratch-toolbar .sc-sz i{display:block;background:#8b91a4;border-radius:999px;width:15px;}
.scratch-toolbar .sc-sz[data-sc-size="s"] i{height:2px;}
.scratch-toolbar .sc-sz[data-sc-size="m"] i{height:4px;}
.scratch-toolbar .sc-sz[data-sc-size="l"] i{height:7px;}
.scratch-toolbar .sc-sz.on{border-color:#3b48d8;box-shadow:0 0 0 2px #dfe3ff;background:#fff;}
.scratch-toolbar .sc-sz.on i{background:#3b48d8;}
/* 세로 길이 손잡이 — 폭 전체를 잡을 수 있게 넓게, 높이는 탭 기준(22px + 여백) */
.scratch-resize{
  display:block;width:100%;height:22px;margin:-4px 0 0;padding:0;border:0;background:none;
  cursor:ns-resize;touch-action:none;border-radius:8px;
}
.scratch-resize i{display:block;width:46px;height:4px;margin:9px auto;border-radius:999px;background:#d5daf0;}
.scratch-resize:hover i,.scratch-resize:focus-visible i{background:#a9b3e8;}
.scratch-resize:focus-visible{outline:2px solid #4d5bf0;outline-offset:2px;}
body.bg-eye-dark .scratch-toolbar .sc-sw,body.bg-eye-dark .scratch-toolbar .sc-sz{background:#1a1f33;border-color:#2a3358;}
body.bg-eye-dark .scratch-toolbar .sc-sw[data-sc-color="ink"] i{background:#e8eaef;}
body.bg-eye-dark .scratch-resize i{background:#2a3358;}
@media (max-width:767px){
  /* 폰: 한 줄에 들어오게 조인다. 「전체 지우기」를 오른쪽 끝으로 밀면(margin-left:auto)
     자리가 모자라 혼자 둘째 줄로 떨어져 어수선하다 — 왼쪽부터 차곡차곡 채운다. */
  .scratch-toolbar{gap:5px;}
  .scratch-toolbar .sc-sw,.scratch-toolbar .sc-sz{width:26px;height:26px;}
  .scratch-toolbar .sc-swatches,.scratch-toolbar .sc-sizes{gap:3px;}
  .scratch-toolbar button{padding:6px 9px;font-size:12px;}
  .scratch-toolbar .sc-clear{margin-left:0;}
}
.scratch-toolbar .sc-clear{margin-left:auto;color:#c2410c;border-color:#fecaca;}
.scratch-toolbar .sc-clear:hover{background:#fef2f2;border-color:#fca5a5;}
.scratch-stage{
  position:relative;border:1.5px dashed #d5daf0;border-radius:14px;background:#fafbff;
  overflow:hidden;touch-action:none;min-height:240px;
}
.scratch-stage canvas{
  display:block;width:100%;height:auto;cursor:crosshair;touch-action:none;
  background:transparent;vertical-align:top;
}
.scratch-hint{
  font-size:11.5px;font-weight:600;color:#a4a9b8;text-align:center;line-height:1.4;
  padding:0 4px 2px;
}
body.bg-eye-dark .scratch-stage{background:#1a1f33;border-color:#2a3358;}
body.bg-eye-dark .scratch-hint{color:#7a8299;}
body.bg-eye-dark .solve-side-tabs{border-bottom-color:var(--border);}
body.bg-eye-dark .solve-side-tabs button.on{color:#a5b4fc;border-bottom-color:#818cf8;}

/* ---------- 문제 화면 필기 오버레이 (기기 로컬 · 입력은 2026-07-31 중단) ---------- */
body.solve-play .solve-main .card{
  position:relative;
  /* 짧은 문항도 하단 네비(이전) 바로 위까지 필기 영역 확보 — JS ensureInkCardFillHeight 가 정밀 보정 */
  overflow:visible;
}
.q-ink-canvas{
  position:absolute;left:0;top:0;width:100%;height:100%;
  z-index:6;pointer-events:none;
  /* 필기 OFF: 세로 스크롤 + 핀치 줌 통과 */
  touch-action:pan-y pinch-zoom;
  cursor:crosshair;display:block;
  box-sizing:border-box;
  background:transparent !important;
  mix-blend-mode:multiply;
}
body.bg-eye-dark .q-ink-canvas{
  mix-blend-mode:normal;
}
body.solve-ink-on .q-ink-canvas{
  pointer-events:auto;
  /* 한 손 필기 중에도 두 손가락 핀치는 브라우저에 맡김 */
  touch-action:pan-y pinch-zoom;
}
/* 모바일 풀이: 세로 스크롤 + 두 손가락 확대축소 (상·하단 fixed 유지) */
@media (max-width:899px){
  body.solve-play,
  body.solve-play .solve-shell,
  body.solve-play #solveShell{
    touch-action:pan-y pinch-zoom;
  }
  body.solve-play .solve-scroll{
    -webkit-overflow-scrolling:touch !important;
    overflow-y:auto !important;
    overscroll-behavior-y:contain;
    touch-action:pan-y pinch-zoom;
  }
  body.solve-play .solve-main,
  body.solve-play .solve-layout{
    touch-action:pan-y pinch-zoom;
  }
}
/* 필기 캔버스: 본문(stem·도표) 위 그리기. 선지·버튼은 네이티브 클릭 우선 */
body.solve-ink-on .q-ink-canvas{
  z-index:20;
  pointer-events:auto;
}
/* 필기 OFF: 인라인 잔존 방지 — 항상 클릭 통과 */
body:not(.solve-ink-on) .q-ink-canvas{
  pointer-events:none !important;
  cursor:default;
}
/* 헤더·북마크 — 캔버스 위 */
body.solve-play .solve-main .card .card-head{
  position:relative;
  z-index:8;
}
body.solve-ink-on .solve-main .card .card-head{
  z-index:26;
}
body.solve-ink-on .solve-main .card .card-head,
body.solve-ink-on .solve-main .card .card-head .chkbtn{
  pointer-events:auto;
  cursor:pointer;
}
body.solve-ink-on .solve-main .card .chkbtn{
  position:relative;
  z-index:27;
  background:rgba(255,255,255,.92);
  border-radius:10px;
}
/*
 * 선지·버튼 = 캔버스보다 위 + pointer-events:auto
 * (구버전: 선지를 캔버스 아래에 두고 JS hit-test 통과 → 마우스 클릭 간헐 실패)
 * stem·도표만 캔버스 아래 — 필기 영역 유지
 */
body.solve-ink-on .solve-main .card .choice,
body.solve-ink-on .solve-main .card .headbtns,
body.solve-ink-on .solve-main .card .headbtns button,
body.solve-ink-on .solve-main .card button,
body.solve-ink-on .solve-main .card a,
body.solve-ink-on .solve-main .card input,
body.solve-ink-on .solve-main .card textarea,
body.solve-ink-on .solve-main .card select,
body.solve-ink-on .solve-main .card label{
  position:relative;
  z-index:25;
  pointer-events:auto;
}
body.solve-ink-on .solve-main .card .stem,
body.solve-ink-on .solve-main .card .choicesImgWrap,
body.solve-ink-on .solve-main .card .diagram,
body.solve-ink-on .solve-main .card .feedback,
body.solve-ink-on .solve-main .card .kws{
  position:relative;
  z-index:1;
}
/* .choices 컨테이너는 올림 금지 — 간격에서 필기 가능, 각 .choice 만 클릭 수신 */
body.solve-ink-on .solve-main .card .choices{
  position:relative;
  z-index:1;
}
body.solve-ink-on .solve-main .card{
  box-shadow:inset 0 0 0 1.5px rgba(77,91,240,.28);
  border-radius:12px;
}
body.solve-ink-eraser .q-ink-canvas{cursor:cell;}
/* 필기 플로팅 바 — 하단 네비 바로 위 (네비를 덮지 않음) */
.solve-ink-bar{
  display:none;position:fixed;left:50%;transform:translateX(-50%);
  bottom:calc(var(--solve-bot-h, 70px) + 10px + env(safe-area-inset-bottom, 0px));
  z-index:59;align-items:center;gap:6px;flex-wrap:nowrap;justify-content:center;
  max-width:min(96vw,560px);padding:6px 8px;
  background:rgba(255,255,255,.96);border:1px solid #e2e4ee;border-radius:999px;
  box-shadow:0 6px 22px rgba(20,24,40,.12);backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);box-sizing:border-box;
  /* 2줄 랩으로 네비를 가리지 않게 — 가로 스크롤 */
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.solve-ink-bar::-webkit-scrollbar{display:none;}
body.solve-hub .solve-ink-bar,
body:not(.solve-play) .solve-ink-bar{display:none !important;}

/* 셸이 position:relative 역할을 하도록 (모바일 absolute 필기바 기준) */
body.solve-play .solve-shell{position:relative;}
/* 필기 ON: 하단 네비 항상 노출 (카드 확장·캔버스 레이어에 가리지 않음) */
body.solve-play.solve-ink-on #solveNav.solve-nav,
body.solve-play.solve-ink-on .solve-nav{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  z-index:58 !important;
  position:fixed !important;
  bottom:0 !important;
  left:0 !important;
  right:0 !important;
}
body.solve-play.solve-ink-on .solve-ink-bar,
body.solve-play.solve-ink-on #solveInkBar{
  z-index:59 !important;
  bottom:calc(var(--solve-bot-h, 64px) + env(safe-area-inset-bottom, 0px) + 8px) !important;
}
/* 필기 ON: 본문 하단에 필기바 높이만큼 여유 (가림 방지) */
body.solve-play.solve-ink-on .solve-scroll{
  padding-bottom:calc(var(--solve-bot-h, 72px) + var(--solve-ink-h, 52px) + env(safe-area-inset-bottom, 0px) + 16px) !important;
}
body.solve-play.solve-ink-on .solve-shell,
body.solve-play.solve-ink-on #solveShell.solve-shell{
  padding-bottom:calc(var(--solve-bot-h, 72px) + var(--solve-ink-h, 52px) + env(safe-area-inset-bottom, 0px) + 20px) !important;
}
/* 미니바 필기 아이콘 */
.solve-ico-btn.solve-ink-ico.on{
  background:#eef0fe;color:#3b48d8;
}
.solve-ink-bar button{
  border:0;background:#f3f4f6;border-radius:999px;padding:8px 12px;
  font-size:12.5px;font-weight:800;color:#5e6478;cursor:pointer;font-family:inherit;
  line-height:1.2;white-space:nowrap;flex:0 0 auto;
}
.solve-ink-bar button:hover{background:#e8eaef;color:var(--text);}
.solve-ink-bar button.on{background:#eef0fe;color:#3b48d8;}
.solve-ink-bar #inkToggleBtn.on{
  background:var(--indigo);color:#fff;
}
.solve-ink-bar .ink-tools{display:none;align-items:center;gap:4px;flex:0 0 auto;}
body.solve-ink-on .solve-ink-bar .ink-tools{display:inline-flex;}
.solve-ink-bar .ink-swatch{
  min-width:32px;padding:7px 9px;font-size:12px;
}
.solve-ink-bar .ink-swatch .ink-dot{
  display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;
  vertical-align:middle;border:1px solid rgba(0,0,0,.08);
}
.solve-ink-bar #inkPenBtn .ink-dot{background:#4d5bf0;}
.solve-ink-bar #inkRedBtn .ink-dot{background:#e11d48;}
.solve-ink-bar #inkHlBtn .ink-dot{background:rgba(254,240,100,.85);border-radius:3px;width:12px;height:9px;}
.solve-ink-bar #inkPenBtn.on{background:#eef0fe;color:#3b48d8;}
.solve-ink-bar #inkRedBtn.on{background:#fff1f2;color:#be123c;border-color:#fecdd3;}
.solve-ink-bar #inkHlBtn.on{background:#fefce8;color:#a16207;border-color:#fde68a;}
.solve-ink-bar .ink-clear{color:#c2410c;background:#fff7ed;}
.solve-ink-bar .ink-clear:hover{background:#ffedd5;}
.solve-ink-bar .ink-hint{
  display:none;font-size:11px;font-weight:700;color:#8990a3;padding:0 4px;
}
/* 힌트는 툴 열리면 줄바꿈·네비 가림 유발 → 기본 숨김 */
body.solve-ink-on .solve-ink-bar .ink-hint{display:none !important;}
@media(max-width:420px){
  .solve-ink-bar{gap:4px;padding:5px 6px;max-width:98vw;}
  .solve-ink-bar button{padding:7px 10px;font-size:12px;}
}
body.bg-eye-dark .solve-ink-bar{
  background:rgba(30,34,52,.96);border-color:#2a3358;
}
body.bg-eye-dark .solve-ink-bar button{background:#2a3358;color:#c5d0ff;}
body.bg-eye-dark .solve-ink-bar #inkToggleBtn.on{background:#6366f1;color:#fff;}
body.bg-eye-dark.solve-ink-on .solve-main .card{
  box-shadow:inset 0 0 0 1.5px rgba(129,140,248,.4);
}

.solve-nav{
  display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;
  margin-top:12px;padding:10px 8px;position:sticky;bottom:max(8px,env(safe-area-inset-bottom));
  z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 28px rgba(40,50,120,.12);
}
.solve-nav button:not(.solve-choice-dot){
  flex:0 1 auto;min-width:72px;max-width:100%;border:1.5px solid #e6e8ef;background:#fff;color:#5b6070;
  border-radius:999px;padding:12px 18px;font-size:var(--fs-md);font-weight:800;cursor:pointer;
  font-family:inherit;line-height:1.2;white-space:nowrap;
}
/* 시안 1: 하단 바 왼쪽 끝 진도 — 시험 하단 바의 .ecf-pos 와 같은 자리·같은 톤 (S2-P45) */
.solve-nav .solve-nav-pos{
  flex:0 0 auto;font-size:13px;font-weight:900;color:var(--text);
  font-variant-numeric:tabular-nums;white-space:nowrap;padding:0 2px;line-height:1.2;
}
.solve-nav .solve-nav-pos small{color:var(--muted);font-weight:800;}
.solve-nav button.primary{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.solve-nav button:disabled{opacity:.4;cursor:default;}
.solve-nav .solve-pick-btn{flex:1 1 auto;min-width:0;max-width:160px;background:#eef1ff;border-color:#c9d2ff;color:var(--indigo);}
/* 문항 번호 — 원형 도트 (시안) */
.solve-nav .solve-choice-dot,
.solve-nav #solvePageDot{
  width:40px;height:40px;min-width:40px;border-radius:50%;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:#4d5bf0;border:0;color:#fff;font-weight:800;font-size:14px;
}
.solve-nav #solveNextBtn,
.solve-nav button.primary#solveNextBtn{
  flex:0 1 auto;min-width:7.5em;max-width:11.5em;margin-left:auto;
}
.solve-picker-backdrop{
  display:none;position:fixed;inset:0;z-index:200;background:rgba(20,22,40,.48);
  align-items:flex-end;justify-content:center;padding:0;box-sizing:border-box;
}
.solve-picker-backdrop.show{display:flex;}
.solve-picker{
  width:100%;max-width:520px;max-height:min(78vh,640px);background:#fff;
  border-radius:18px 18px 0 0;padding:14px 14px max(16px,env(safe-area-inset-bottom));
  box-shadow:0 -8px 40px rgba(20,24,50,.2);display:flex;flex-direction:column;min-height:0;
}
@media(min-width:720px){
  .solve-picker-backdrop{align-items:center;padding:20px;}
  .solve-picker{border-radius:18px;max-height:min(72vh,560px);}
}
.solve-picker-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;}
.solve-picker-hd b{font-size:var(--fs-md);font-weight:900;color:var(--text);}
.solve-picker-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:8px;overflow-y:auto;
  -webkit-overflow-scrolling:touch;padding:4px 2px 8px;min-height:0;
}
.solve-picker-grid button{
  aspect-ratio:1;max-height:52px;border:1.5px solid var(--border);border-radius:12px;
  background:#fafbff;font-weight:800;font-size:var(--fs-md);color:var(--sub);cursor:pointer;
  font-family:inherit;padding:0;position:relative;
}
.solve-picker-grid button.done{border-color:#a7f3d0;background:#ecfdf5;color:#047857;}
.lr-pick-grid button.done{border-color:#a7f3d0;background:#ecfdf5;color:#047857;}
.solve-picker-grid button.wrong{border-color:#fecaca;background:#fef2f2;color:#b91c1c;}
.lr-pick-grid button.wrong{border-color:#fecaca;background:#fef2f2;color:#b91c1c;}
/* 북마크한 문항 — 문제 선택 그리드: 문항 카드와 동일 리본 아이콘 */
.solve-picker-grid button.flag,
.lr-pick-grid button.flag{
  border-color:#fcd34d;background:#fffbeb;color:#92400e;
}
.solve-picker-grid button.flag.done,
.lr-pick-grid button.flag.done{border-color:#fbbf24;background:#ecfdf5;color:#047857;}
.solve-picker-grid button.flag.wrong,
.lr-pick-grid button.flag.wrong{border-color:#fbbf24;background:#fef2f2;color:#b91c1c;}
/* 「현재」는 **상태 규칙 뒤에** 온다 — 지금 보고 있는 칸은 어떤 상태든 파랑이 이긴다.
   ⛔ .on 을 .done/.wrong 앞으로 되돌리지 말 것: 특이도가 같아 뒤에 적힌 쪽이 이기므로
   오답 칸의 현재 표시가 통째로 사라진다. 북마크가 걸려 있을 때만 보였던 이유는
   .flag.on 만 특이도가 높았기 때문이다 (2026-08-01 운영자 제보: 18번 북마크를 풀자
   파란 표시가 사라짐 · 실측 cls "on wrong" → bg rgb(254,242,242)). */
.solve-picker-grid button.on,
.solve-picker-grid button.done.on,
.solve-picker-grid button.wrong.on{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.lr-pick-grid button.on,
.lr-pick-grid button.done.on,
.lr-pick-grid button.wrong.on{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.solve-picker-grid button.flag.on{
  background:var(--indigo);border-color:#fbbf24;color:#fff;
  box-shadow:inset 0 0 0 2px rgba(251,191,36,.85);
}
.lr-pick-grid button.flag.on{
  background:var(--indigo);border-color:#fbbf24;color:#fff;
  box-shadow:inset 0 0 0 2px rgba(251,191,36,.85);
}
.solve-picker-grid button.flag .bm-ico,
.lr-pick-grid button.flag .bm-ico{
  position:absolute;top:2px;right:3px;width:10px;height:12px;
  display:block;pointer-events:none;line-height:0;
}
.solve-picker-grid button.flag .bm-ico svg,
.lr-pick-grid button.flag .bm-ico svg{display:block;width:100%;height:100%;}
.solve-picker-grid button.flag .bm-fill,
.lr-pick-grid button.flag .bm-fill{fill:#e2554a;}
.solve-picker-grid button.flag .bm-stroke,
.lr-pick-grid button.flag .bm-stroke{stroke:#c2410c;stroke-width:1.4;fill:none;}
.solve-picker-grid button.flag.on .bm-fill,
.lr-pick-grid button.flag.on .bm-fill{fill:#fecaca;}
.solve-picker-grid button.flag.on .bm-stroke,
.lr-pick-grid button.flag.on .bm-stroke{stroke:#fee2e2;stroke-width:1.4;fill:none;}
.solve-picker-legend{
  display:none;flex-wrap:wrap;gap:8px 12px;margin:0 0 8px;padding:0 2px;
  font-size:11.5px;font-weight:700;color:var(--muted);
}
.solve-picker-legend.show{display:flex;}
.solve-picker-legend span{display:inline-flex;align-items:center;gap:4px;}
.solve-picker-legend i{
  display:inline-block;width:12px;height:12px;border-radius:4px;border:1.5px solid var(--border);
  background:#fafbff;box-sizing:border-box;
}
.solve-picker-legend i.flag{
  border-color:#fcd34d;background:#fffbeb;position:relative;
  width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;
}
.solve-picker-legend i.flag .bm-ico{display:block;width:9px;height:11px;line-height:0;}
.solve-picker-legend i.flag .bm-ico svg{display:block;width:100%;height:100%;}
.solve-picker-legend i.flag .bm-fill{fill:#e2554a;}
.solve-picker-legend i.flag .bm-stroke{stroke:#c2410c;stroke-width:1.4;fill:none;}
.solve-picker-legend i.done{border-color:#a7f3d0;background:#ecfdf5;}
.solve-picker-legend i.wrong{border-color:#fecaca;background:#fef2f2;}
.solve-picker-legend i.on{border-color:var(--indigo);background:var(--indigo);}
/* 누를 수 있는 범례 = 필터 (2026-08-01). 탭 크기를 확보하되 글씨는 범례 톤 그대로 */
.solve-picker-legend .lg-f{
  display:inline-flex;align-items:center;gap:4px;cursor:pointer;font-family:inherit;
  font-size:11.5px;font-weight:700;color:var(--muted);line-height:1;
  border:1px solid var(--border);background:#fff;border-radius:999px;padding:7px 10px;
}
.solve-picker-legend .lg-f:hover{border-color:#c9d2ff;color:#3b48d8;}
.solve-picker-legend .lg-f.on{background:#eef0fe;border-color:#c9d2ff;color:#3b48d8;font-weight:800;}
.solve-picker-legend .lg-note{color:#a4a9b8;font-weight:600;}
@media (max-width:767px){
  /* 폰: 눌리는 면적을 키운다 (글씨는 범례 톤 그대로) */
  .solve-picker-legend .lg-f{padding:10px 12px;}
}
/* ⛔ 다크에서 켜짐/꺼짐을 배경 밝기 차이로만 구분하지 말 것 — 두 알약이 똑같아 보인다
   (2026-08-01 실측). 켜짐은 테두리·글씨까지 확실히 바꾼다. */
body.bg-eye-dark .solve-picker-legend .lg-f{background:#161b2b;border-color:#2a3358;color:#98a2b3;}
body.bg-eye-dark .solve-picker-legend .lg-f.on{
  background:#3b48d8;border-color:#8c9bff;color:#ffffff;font-weight:800;
}
body.solve-picker-open{overflow:hidden;}

/* —— 허브(선택) vs 플레이(풀이) 완전 분리 —— */
/* 허브: 풀이 셸·미니바 숨김 — 과목/회차 고르고 입장만 */
body.solve-hub .solve-shell,
body.solve-hub #solveShell,
body.solve-hub .solve-mini,
body.solve-hub .solve-nav,
body.solve-hub .solve-ink-bar,
body.solve-hub #solveInkBar,
body.solve-hub #listModeBar{display:none !important;}
body.solve-hub #list{display:none !important;}
/* 플레이: 허브 규칙보다 나중에 강제 표시 (특이도·순서 보강)
   ⛔ #solveShell 에 display:flex 만 주면 기본 direction=row → 미니바가 왼쪽 세로로 깨짐 */
body.solve-play #solveMini.solve-mini,
body.solve-play #solveNav.solve-nav{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
body.solve-play #solveShell.solve-shell,
body.solve-play #solveShell{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
/* 모바일: 세로 flex 셸 (상단 미니 · 스크롤 · 하단 네비) */
@media (max-width:899px){
  body.solve-play #solveShell.solve-shell,
  body.solve-play #solveShell{
    display:flex !important;
    flex-direction:column !important;
  }
}
/* PC: 문서 흐름 block — sticky 미니바 + 본문 스크롤 */
@media (min-width:900px){
  body.solve-play #solveShell.solve-shell,
  body.solve-play #solveShell{
    display:block !important;
    flex-direction:unset;
  }
}
/* —— 허브 오르조 톤 (홈+자료실) —— */
/* 풀이 overflow:hidden · 스크롤 잠금 잔여가 허브 스크롤을 죽이지 않게 강제 */
html:has(body.solve-hub:not(.solve-play)){
  height:auto !important;
  max-height:none !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:auto !important;
}
body.solve-hub{
  background:#fff !important;
  padding:0.85rem 1rem calc(128px + env(safe-area-inset-bottom,0px)) !important;
  height:auto !important;
  max-height:none !important;
  min-height:100% !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:auto !important;
  touch-action:pan-y pinch-zoom !important;
  position:relative !important; /* fixed 잠금 잔여 해제 */
  left:auto !important;
  right:auto !important;
  width:auto !important;
  top:auto !important;
}
body.solve-hub .wrap{
  max-width:720px;margin:0 auto;width:100%;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
/* 모달 없을 때 허브 body-scroll-locked 가 남으면 스크롤 허용 */
body.solve-hub.body-scroll-locked:not(.shop-open):not(.studyroom-open):not(.login-gate-open):not(.legal-open){
  position:relative !important;
  overflow-y:auto !important;
  height:auto !important;
  touch-action:pan-y pinch-zoom !important;
}
body.solve-hub .app-topbar{
  border-bottom:1px solid #eceef2;padding-bottom:12px;margin-bottom:14px;
}
body.solve-hub .top-nav-btn,body.solve-hub .app-home-btn,body.solve-hub .app-shop-btn,body.solve-hub .app-bank-btn{
  height:34px;padding:0 11px;font-size:13px;box-shadow:none;
  border-width:1px;
}
body.solve-hub .top-nav-btn.primary,body.solve-hub .app-bank-btn,body.solve-hub .top-nav-btn.is-here{
  box-shadow:none;
}
body.solve-hub .brand-badge{/* 10a badge keeps brand blue */}

body.solve-hub .ui-sec{margin:0 0 18px;}
body.solve-hub .ui-sec-label .ui-step{display:none;}
body.solve-hub .ui-sec-label{
  font-size:13px;font-weight:800;color:#111;margin-bottom:10px;
}
body.solve-hub .ui-sec-hint{display:none;}
body.solve-hub .examblock{
  margin:0;padding:0;border:0;background:transparent;box-shadow:none;border-radius:0;
}
/* 탭: 밑줄형 */

/* 앱 v2 트랙 칩 — 하단 컬러 블록이 최종 적용 (여기는 리셋만) */
body.solve-hub .tracktab .tcnt{display:none;}
body.solve-hub .subtabs{gap:6px;margin-bottom:14px;}
body.solve-hub .subtab{
  border:0;background:#f3f4f6;color:#5e6478;box-shadow:none;
  border-radius:999px;padding:8px 14px;font-weight:700;
}
body.solve-hub .subtab.on{background:var(--indigo);color:#fff;}
body.solve-hub .examrow{display:none !important;} /* 카드 그리드가 주 UI */
body.solve-hub .scope-now{display:none;}
/* soft quick cards */
body.solve-hub .quickbar.streakbar{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
  background:transparent;border:0;box-shadow:none;padding:0;margin:0;
}
body.solve-hub .quickbar .q-primary,
body.solve-hub .quickbar .q-meta{
  display:contents;
}
body.solve-hub .streakchip,
body.solve-hub .goalwrap{
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:4px;padding:14px 14px;border-radius:16px;border:0;min-height:72px;
  font-size:14px;font-weight:800;cursor:pointer;box-shadow:none;
  background:linear-gradient(135deg,#f0f4ff,#f8f9ff);color:var(--text);
}
body.solve-hub .streakchip.today{background:linear-gradient(135deg,#e8edff,#f4f6ff);color:var(--indigo-deep);}
body.solve-hub .streakchip.due{background:linear-gradient(135deg,#ecfdf5,#f0fdf4);color:#047857;}
body.solve-hub .streakchip.fire{background:linear-gradient(135deg,#fff7ed,#fffbeb);color:#c2410c;}
body.solve-hub .streakchip.dday{background:linear-gradient(135deg,#f5f3ff,#faf5ff);color:#5b21b6;}
body.solve-hub .goalwrap{background:linear-gradient(135deg,#f8fafc,#f1f5f9);}
body.solve-hub .goalwrap .goalbar{width:100%;height:6px;border-radius:999px;background:#e5e7eb;margin-top:4px;overflow:hidden;}
body.solve-hub .goalwrap .goalfill{display:block;height:100%;background:var(--indigo);border-radius:999px;}
/* tools collapsible */
body.solve-hub .hub-tools-fold{
  border:1px solid #eceef2;border-radius:14px;background:#fafafa;overflow:hidden;
}
body.solve-hub .hub-tools-fold > summary{
  list-style:none;cursor:pointer;padding:12px 14px;font-size:14px;font-weight:800;color:#5e6478;
  display:flex;align-items:center;justify-content:space-between;
}
body.solve-hub .hub-tools-fold > summary::-webkit-details-marker{display:none;}
body.solve-hub .hub-tools-fold > summary::after{content:'▾';font-size:12px;color:#9196a8;}
body.solve-hub .hub-tools-fold[open] > summary::after{content:'▴';}
body.solve-hub .hub-tools-fold .toolbar{padding:0 10px 12px;border:0;background:transparent;box-shadow:none;}
body.solve-hub .ui-sec[aria-label="풀이 도구"] .ui-sec-label{display:none;}
/* 회차 고르기: 연도 칩 + 아코디언 리스트 */
.exam-card-grid{display:block;margin:4px 0 8px;}
.exam-scope-bar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;
}
.exam-scope-bar button{
  border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:7px 12px;
  font-size:12.5px;font-weight:800;color:#5e6478;cursor:pointer;font-family:inherit;
}
.exam-scope-bar button.on{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.exam-year-chips{
  display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  margin:0 0 12px;padding-bottom:2px;scrollbar-width:none;
}
.exam-year-chips::-webkit-scrollbar{display:none;}
.exam-year-chips button{
  flex:0 0 auto;border:1px solid #e5e7eb;background:#f8f9fb;border-radius:999px;
  padding:7px 12px;font-size:12.5px;font-weight:800;color:#5e6478;cursor:pointer;font-family:inherit;
}
.exam-year-chips button.on{background:#eef1ff;border-color:#c9d2ff;color:var(--indigo);}
.exam-year-block{border:1px solid #eceef2;border-radius:14px;margin:0 0 8px;overflow:hidden;background:#fff;}
.exam-year-hd{
  display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  border:0;background:#fafafa;padding:12px 14px;font-family:inherit;cursor:pointer;text-align:left;
}
.exam-year-hd b{font-size:14.5px;font-weight:900;color:var(--text);}
.exam-year-hd .yc{font-size:12px;font-weight:700;color:var(--muted);}
.exam-year-hd .ych{font-size:12px;color:#9196a8;font-weight:800;}
.exam-year-body{display:none;border-top:1px solid #eceef2;}
.exam-year-block.open .exam-year-body{display:block;}
.exam-year-block.open .exam-year-hd{background:#f4f6ff;}
.exam-row{
  display:flex;align-items:center;gap:10px;width:100%;border:0;border-bottom:1px solid #f0f1f4;
  background:#fff;padding:12px 14px;font-family:inherit;cursor:pointer;text-align:left;
  -webkit-tap-highlight-color:transparent;
}
.exam-row:last-child{border-bottom:0;}
.exam-row:active{background:#f9fafb;}
.exam-row.on{background:#eef1ff;}
.exam-row.lock{opacity:.88;}
.exam-row .er-main{flex:1;min-width:0;}
.exam-row .er-title{font-size:14px;font-weight:800;color:var(--text);line-height:1.35;word-break:keep-all;}
.exam-row .er-meta{font-size:12px;font-weight:600;color:var(--muted);margin-top:2px;}
.exam-row .er-tag{
  flex-shrink:0;font-size:11.5px;font-weight:800;padding:4px 8px;border-radius:999px;
  background:#f3f4f6;color:#5e6478;
}
.exam-row.on .er-tag{background:#fff;color:var(--indigo);}
.exam-row .er-tag.free{background:#ecfdf5;color:#047857;}
.exam-row .er-tag.lock{background:#fef2f2;color:#b91c1c;}
.exam-row-all{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  margin-top:10px;padding:12px 14px;border:1px dashed #c9d2ff;border-radius:14px;
  background:#f8f9ff;font-family:inherit;cursor:pointer;text-align:left;
}
.exam-row-all.on{border-style:solid;border-color:var(--indigo);background:#eef1ff;}
.exam-row-all .er-title{font-size:13.5px;font-weight:800;color:var(--indigo-deep);}
.exam-row-all .er-meta{font-size:12px;font-weight:600;color:var(--muted);margin-top:2px;}
.exam-resume-chip{
  display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  margin:0 0 10px;padding:10px 12px;border-radius:12px;border:1.5px solid #c9d2ff;
  background:#f8f9ff;font-family:inherit;cursor:pointer;text-align:left;
}
.exam-resume-chip b{font-size:13px;font-weight:900;color:var(--indigo-deep);}
.exam-resume-chip span{font-size:12px;font-weight:700;color:var(--indigo);}

/* hub fixed dock: CTA + tabs */
.hub-dock{
  display:none;position:fixed;left:50%;transform:translateX(-50%);
  bottom:0;width:100%;max-width:720px;z-index:50;
  background:#fff;border-top:1px solid #eceef2;
  padding:10px 14px max(10px,env(safe-area-inset-bottom));
  box-sizing:border-box;
}
body.solve-hub .hub-dock{display:block;}
body.solve-play .hub-dock{display:none !important;}
.hub-dock-cta{display:flex;gap:10px;margin-bottom:8px;}
.hub-dock-cta button{
  flex:1;border:0;border-radius:14px;padding:14px 12px;font-size:15px;font-weight:900;
  font-family:inherit;cursor:pointer;line-height:1.2;
}
.hub-dock-cta .enter-test{
  background:#f3f4f6;color:var(--text);
}
.hub-dock-cta .enter-study{
  background:var(--indigo);color:#fff;
  box-shadow:0 6px 16px rgba(76,99,246,.28);
}
.hub-dock-cta button:disabled{opacity:.4;cursor:default;box-shadow:none;}
.hub-dock-tabs{
  display:flex;align-items:stretch;justify-content:space-around;gap:4px;
  padding-top:4px;
}
.hub-dock-tabs button{
  flex:1;border:0;background:transparent;padding:6px 4px 2px;cursor:pointer;
  font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:2px;
  color:#9196a8;font-size:10.5px;font-weight:700;
}
.hub-dock-tabs button .ico{font-size:18px;line-height:1;opacity:.9;}
.hub-dock-tabs button.on{color:var(--indigo);}
.hub-dock-tabs button:active{opacity:.7;}
/* P2 회차 선택 요약 바 */
.hub-select-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 0 10px;padding:10px 12px;border-radius:12px;
  border:1.5px solid #dbe4ff;background:#f8f9ff;
  font-size:13px;font-weight:700;color:var(--sub);line-height:1.35;
  min-height:44px;box-sizing:border-box;
}
.hub-select-bar.on{
  border-color:var(--indigo);color:var(--text);background:#eef1ff;
}
.hub-select-bar .hs-main{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hub-select-bar .hs-main b{font-weight:900;color:var(--indigo-deep);}
.hub-select-bar .hs-go{
  flex-shrink:0;border:0;background:transparent;color:var(--indigo);
  font-size:13px;font-weight:900;cursor:pointer;font-family:inherit;padding:4px 0 4px 8px;
  white-space:nowrap;
}
.hub-select-bar .hs-go:disabled{opacity:.35;cursor:default;}
/* P3 탭 SVG */
.hub-dock-tabs button .ico{
  display:flex;align-items:center;justify-content:center;
  width:22px;height:22px;margin:0 auto 2px;font-size:0;
}
.hub-dock-tabs button .ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.hub-dock-tabs button.on .ico svg{stroke-width:2.1;}
/* P1 마이페이지 리스트 */
.sr-mypage-head{
  display:flex;align-items:center;gap:12px;padding:4px 2px 14px;margin-bottom:4px;
  border-bottom:1px solid #eceef2;
}
.sr-mypage-av{
  width:44px;height:44px;border-radius:999px;background:var(--indigo);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:16px;flex-shrink:0;
  overflow:hidden;
}
.sr-mypage-av img{width:100%;height:100%;object-fit:cover;}
.sr-mypage-meta{flex:1;min-width:0;}
.sr-mypage-meta b{display:block;font-size:15.5px;font-weight:900;color:var(--text);}
.sr-mypage-meta span{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sr-mylist{border-top:1px solid #eceef2;margin:0 0 16px;}
.sr-mylist button{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  padding:14px 4px;border:0;border-bottom:1px solid #f0f1f4;background:transparent;
  font-family:inherit;font-size:14.5px;font-weight:700;color:var(--text);cursor:pointer;text-align:left;
  box-sizing:border-box;
}
.sr-mylist button:active{background:#f9fafb;}
.sr-mylist .my-lab{flex:1;min-width:0;}
.sr-mylist .my-val{font-size:13px;font-weight:700;color:var(--muted);flex-shrink:0;}
.sr-mylist .my-chev{color:#c5c9d4;font-size:16px;font-weight:700;flex-shrink:0;}
.sr-mylist .my-danger{color:#b91c1c;}
body.studyroom-open .studyroom-body .sr-setcard{
  box-shadow:none;border-color:#eceef2;border-radius:14px;
}

/* hide old inline enter on hub (dock replaces) */
body.solve-hub .solve-enter-wrap{display:none !important;}
body.solve-hub #solveEnterWrap{display:none !important;}

/* 플레이: 스크린샷 영역 전부 숨김 */
body.solve-play .app-topbar,
body.solve-play .ui-sec,
body.solve-play #cats,
body.solve-play #tags,
body.solve-play #statbox,
body.solve-play .count,
body.solve-play #countTxt,
body.solve-play #listModeBar,
body.solve-play .site-footer,
body.solve-play #siteFooter,
body.solve-play .site-notice-bar,
body.solve-play .skip-link,
body.solve-play #srReturnBtn,
body.solve-play #hubMainGrid,
body.solve-play .hub-main-grid,
body.solve-play #hubDash,
body.solve-play #hubHeroWrap,
body.solve-play #hubExamSec,
body.solve-play #hubQuickSec,
body.solve-play #hubFilterDrop,
body.solve-play #hubFilterWrap,
body.solve-play .hub-sec-hd,
body.solve-play .hub-filter-drop,
body.solve-play .envwarn,
body.solve-play #envwarn,
body.solve-play #oauthHelp,
/* 풀이(학습·시험) 화면: 홈 › 직렬 경로 숨김 */
body.solve-play .site-path-wrap,
body.solve-play #appSitePathWrap,
body.solve-play #appSitePath,
body.solve-play .site-path{display:none !important;}
/* 모바일 타이머는 JS .show 로만 표시 (풀이 중에도 재오픈 가능) */
body.solve-play .exam-timer-mobile{display:none;}
body.solve-play .exam-timer-mobile.show{display:flex !important;}
/* CBT 24″ FHD: 중앙 1200px · 회색 거터 · 흰 시험지 (맞추다+오르조) */
body.solve-play{
  background:#f3f4f6 !important;
  padding:0 !important;
}
@media (min-width:1100px){
  /* 타이머만 연 경우(고정 독): 우측 여백. 시험 임베드(mode-test)는 여백 없음 */
  /* 시험 타이머 패널용 여백만 (학습 스톱워치는 제외) */
  body.solve-play.timer-open:not(.mode-test):not(.solve-exam-embed):not(.timer-stopwatch):not(.mode-study){
    padding-right:min(308px,30vw) !important;
    padding-left:0 !important;
    padding-top:0 !important;
  }
  body.solve-play.timer-open:not(.mode-test):not(.solve-exam-embed):not(.timer-stopwatch):not(.mode-study) .wrap{
    max-width:min(1200px, calc(100vw - 320px));
  }
}
/* 풀이: 본문만 가로 상한 · 상·하단 크롬은 전폭 흰 바 (버튼 위치는 패딩으로 기존과 동일 유지) */
body.solve-play{
  --solve-content-max:1100px; /* 2열 시 열당 ~550px · 수험 시인성 */
  /* 뷰포트 가장자리 → 예전 1100 셸 안 16px 패딩과 같은 버튼 inset */
  --solve-chrome-pad-left:max(16px, calc((100vw - var(--solve-content-max)) / 2 + 16px));
  --solve-chrome-pad-right:max(16px, calc((100vw - var(--solve-content-max)) / 2 + 16px));
}
body.solve-play .wrap{
  max-width:none;
  margin:0 auto;
  padding:0;
  width:100%;
}
/* 셸 = 전폭 (상·하단 흰 바가 끊기지 않게). 본문 폭 제한은 layout 에서 */
body.solve-play .solve-shell,
body.solve-play #solveShell.solve-shell{
  display:block !important;
  margin:0 !important;
  background:transparent !important;
  min-height:100vh;
  max-width:none !important;
  width:100% !important;
  box-sizing:border-box;
  box-shadow:none !important;
}
/* 넓은 화면: 본문 양옆 여백만 톤 구분 (상·하단은 흰 바) */
@media (min-width:1140px){
  body.solve-play:not(.bg-eye-dark):not(.bg-eye-warm):not(.bg-eye-green){
    background:#e8eaef !important;
  }
  /* 학습지 팔레트 (2026-07-30 시안 확정) — 바탕 크림, 표면 밝은 크림 */
  body.solve-play.bg-eye-warm{background:#F3EDE0 !important;}
  body.solve-play.bg-eye-green{background:#e2ebe2 !important;}
  body.solve-play.bg-eye-dark{background:#12151c !important;}
}
/* 상단 미니바 · 진행바 · 하단 네비 = 전폭 흰(또는 다크) 배경, 버튼 배치는 chrome-pad 로 고정 */
body.solve-play .solve-mini{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  background:#fff !important;
  box-sizing:border-box;
  padding-left:var(--solve-chrome-pad-left) !important;
  padding-right:var(--solve-chrome-pad-right) !important;
}
body.solve-play .solve-mini-prog{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  background:#eef0f6 !important;
}
/* 하단 네비: 뷰포트 하단 고정 — 상하 스크롤과 무관하게 항상 노출 */
body.solve-play .solve-nav,
body.solve-play #solveNav.solve-nav{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  transform:none !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  z-index:70 !important;
  background:#fff !important;
  box-sizing:border-box;
  border-radius:0 !important;
  border:0 !important;
  border-top:1px solid #eceef2 !important;
  box-shadow:0 -4px 20px rgba(20,24,40,.08) !important;
  padding-left:var(--solve-chrome-pad-left) !important;
  padding-right:var(--solve-chrome-pad-right) !important;
  padding-top:10px !important;
  padding-bottom:max(10px, env(safe-area-inset-bottom, 0px)) !important;
  min-height:calc(var(--solve-bot-h, 64px) + env(safe-area-inset-bottom, 0px));
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
}
body.solve-play.bg-eye-dark .solve-mini,
body.solve-play.bg-eye-dark .solve-nav{
  background:var(--card,#252a33) !important;
}
body.solve-play.bg-eye-dark .solve-mini-prog{
  background:var(--bg-soft,#2a303c) !important;
}
body.solve-play.bg-eye-warm .solve-mini,
body.solve-play.bg-eye-warm .solve-nav{
  background:#FBF7EE !important;
}
body.solve-play.bg-eye-green .solve-mini,
body.solve-play.bg-eye-green .solve-nav{
  background:#f4faf4 !important;
}
/* 중간 본문만 상한 + 흰 카드 영역 */
body.solve-play .solve-scroll{
  background:transparent;
}
body.solve-play .solve-layout{
  max-width:var(--solve-content-max);
  width:100%;
  margin-left:auto;
  margin-right:auto;
  background:#fff;
  box-sizing:border-box;
}
body.solve-play #list{display:none !important;}
/* 허브: 시험 독 강제 숨김 (exit 후 mode-test 잔존 방어) */
body.solve-hub .side-dock,
body.solve-hub #sideDock,
body.solve-hub #omrDock,
body.solve-hub #examTimerPanel,
body.solve-hub #examTimerReopen{display:none!important;}

/* 미니 바 — 풀이 중 상단 고정 (모바일 sticky 이탈 방지 → fixed) */
.solve-mini{
  display:none;align-items:center;justify-content:space-between;gap:10px;
  margin:0;padding:10px 16px 8px;border-bottom:0;
  position:sticky;top:0;z-index:50;background:#fff;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-sizing:border-box;
}
/* 풀이 중 크롬 강제 표시 (허브 display:none 과 충돌 방지) */
body.solve-play .solve-mini{display:flex !important;visibility:visible !important;opacity:1 !important;}
body.solve-play .solve-nav{display:flex !important;visibility:visible !important;opacity:1 !important;}
body.solve-play .solve-mini-prog{display:block !important;visibility:visible !important;}
body.solve-play .solve-ink-bar{display:inline-flex !important;visibility:visible !important;}
body.solve-play .solve-bar{display:none;} /* 미니 바로 대체 */
/* 상단 진행 바 */
.solve-mini-prog{
  display:none;height:3px;background:#eef0f6;width:100%;margin:0;padding:0;border:0;
  overflow:hidden;box-sizing:border-box;
}
body.solve-play .solve-mini-prog{display:block !important;position:sticky;top:52px;z-index:49;}
.solve-mini-prog > i{
  display:block;height:100%;width:0%;background:linear-gradient(90deg,#5b6cff,#4C63F6);
  border-radius:0 2px 2px 0;transition:width .25s ease;
}
/* 모바일: flex 셸 — 상단 미니/하단 네비는 스크롤 밖 (iOS fixed-in-overflow 클리핑 방지) */
@media (max-width:899px){
  body.solve-play{
    --solve-top-h:56px;
    --solve-prog-h:3px;
    --solve-bot-h:72px;
    /* 모바일: 세이프영역 우선 (초광폭 chrome-pad 미사용) */
    --solve-chrome-pad-left:max(10px, env(safe-area-inset-left, 0px));
    --solve-chrome-pad-right:max(10px, env(safe-area-inset-right, 0px));
    /* 문서 스크롤 잠그고, 중간 영역만 스크롤 */
    height:100% !important;
    height:100dvh !important;
    max-height:100dvh !important;
    overflow:hidden !important;
    overscroll-behavior:none;
    position:relative;
  }
  html:has(body.solve-play){
    height:100%;
    overflow:hidden;
  }
  body.solve-play .wrap{
    height:100%;
    max-height:100dvh;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    position:relative;
  }
  /* 셸 = 뷰포트 전체 세로 flex (overflow 스크롤 금지 → 미니바 잘림 방지)
     flex-direction:column 필수 — 없으면 row 로 미니바가 좌측에 붙음 */
  body.solve-play .solve-shell,
  body.solve-play #solveShell.solve-shell{
    display:flex !important;
    flex-direction:column !important;
    position:fixed !important;
    top:0;left:0;right:0;bottom:0;
    /* 좁은 화면: 전폭 */
    width:100%;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    min-height:0 !important;
    max-height:none !important;
    height:100% !important;
    height:100dvh !important;
    overflow:hidden !important;
    background:#fff !important;
    box-sizing:border-box;
    z-index:40;
  }
  /* 상단 미니바: flex 고정 헤더 (position:fixed 아님 → Safari 클리핑 없음) */
  body.solve-play .solve-mini{
    position:relative !important;
    top:auto !important;left:auto !important;right:auto !important;
    width:100%;
    max-width:none !important;
    margin:0;
    /* ⛔ 기본값(.solve-mini z-index:50)과 같게 유지 — 낮추지 말 것.
       미니바가 쌓임 맥락을 만들므로 ⋯ 메뉴(.solve-mini-menu)는 이 값에 갇힌다.
       5 로 두면 카드 헤드(.card-head z-index:8 · 필기 ON 26)가 메뉴를 덮어
       「정답 보기」칩·북마크가 메뉴 글자 위로 겹쳐 그려진다.
       메뉴 자체의 z-index 를 올려도 소용없다 — 상한이 여기다.
       50 = 진행바(49) 위 · 하단 네비(55) 아래. 모달류(드로어 80·게이트 120·인쇄 140)는
       .solve-shell(z-index:40) 바깥이라 이 값과 무관하게 항상 위에 온다. */
    z-index:50;
    flex:0 0 auto;
    padding-top:max(8px, env(safe-area-inset-top, 0px));
    padding-left:var(--solve-chrome-pad-left) !important;
    padding-right:var(--solve-chrome-pad-right) !important;
    padding-bottom:6px;
    min-height:calc(var(--solve-top-h) + env(safe-area-inset-top, 0px));
    border-bottom:1px solid #f0f1f5;
    box-shadow:0 1px 0 rgba(20,24,40,.04);
    background:#fff !important;
  }
  body.solve-play .solve-mini-prog{
    position:relative !important;
    top:auto !important;left:auto !important;right:auto !important;
    width:100%;
    z-index:4;
    height:var(--solve-prog-h);
    flex:0 0 auto;
  }
  /* 가운데만 스크롤 */
  body.solve-play .solve-scroll{
    flex:1 1 auto;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    background:#fff;
  }
  /* 모바일도 하단 네비는 fixed (flex 흐름 밖) — 스크롤해도 항상 보임 */
  body.solve-play .solve-nav,
  body.solve-play #solveNav.solve-nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    transform:none !important;
    width:100% !important;
    max-width:none !important;
    z-index:70 !important;
    flex:0 0 auto;
    margin:0 !important;
  }
  body.solve-play .solve-scroll{
    /* 고정 하단 네비 높이만큼 본문 여백 */
    padding-bottom:calc(var(--solve-bot-h, 72px) + env(safe-area-inset-bottom, 0px) + 12px) !important;
  }
  body.solve-play .solve-layout{
    min-height:0;
    display:block;
  }
  body.solve-play .solve-main{
    padding:12px 16px 20px;
  }
  body.solve-play .solve-side{
    padding-bottom:28px;
  }
  /* 모바일: 1열 — 필기 버튼 화면 가로 중앙 */
  body.solve-play .solve-ink-bar,
  body.solve-play #solveInkBar{
    position:fixed !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:calc(var(--solve-bot-h, 72px) + env(safe-area-inset-bottom, 0px) + 8px) !important;
    z-index:56 !important;
  }
  /* 타이머 설정 패널: 미니바 아래 */
  body.solve-play .exam-timer-mobile.show.etm-settings-open{
    position:fixed !important;
    top:calc(var(--solve-top-h) + var(--solve-prog-h) + env(safe-area-inset-top, 0px)) !important;
    left:0;right:0;z-index:53;
  }
  body.solve-play .solve-shell > .solve-bar{display:none !important;}
}
/* 허브 입장 CTA */
.solve-enter-wrap{
  margin:14px 0 8px;padding:14px 14px 12px;border-radius:16px;
  background:linear-gradient(180deg,#f8f9ff,#fff);border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
}
.solve-enter-wrap .solve-enter-lab{
  font-size:var(--fs-md);font-weight:700;color:var(--sub);margin:0 0 10px;line-height:1.45;
}
.solve-enter-wrap .solve-enter-lab b{color:var(--indigo);font-weight:900;}
.solve-enter-btns{display:flex;flex-wrap:wrap;gap:10px;}
.solve-enter-btns button{
  flex:1;min-width:140px;border:0;border-radius:14px;padding:14px 16px;
  font-size:var(--fs-md);font-weight:900;cursor:pointer;font-family:inherit;line-height:1.25;
}
.solve-enter-btns .enter-study{
  background:var(--indigo);color:#fff;box-shadow:0 6px 18px rgba(76,99,246,.28);
}
.solve-enter-btns .enter-test{
  background:#fff;color:var(--indigo);border:1.5px solid #c9d2ff;
}
.solve-enter-btns button:disabled{opacity:.45;cursor:default;box-shadow:none;}

.solve-mini{position:relative;align-items:center;}
.solve-mini-left{
  display:flex;flex-direction:row;align-items:center;justify-content:flex-start;
  gap:0;min-width:40px;flex:0 0 auto;z-index:1;
}
.solve-mini-exit{
  flex-shrink:0;width:36px;height:36px;border-radius:999px;border:0;
  background:#f3f4f6;font-size:18px;font-weight:500;color:#6b7280;cursor:pointer;
  font-family:inherit;line-height:1;display:inline-flex;align-items:center;justify-content:center;
}
.solve-mini-exit:hover{background:#e8eaef;color:var(--text);}
/* 미니바 진행 라벨 미사용 — 카드 좌측 북마크 라인으로 이동 */
.solve-mini-prog-lab{display:none !important;}
/* 시험 라벨: 정답 OFF 톤 · 전체 회차명 표시 (절대배치 제거 → flex로 폭 확보) */
.solve-mini-center{
  position:static;flex:1 1 auto;min-width:0;max-width:none;
  text-align:left;pointer-events:none;z-index:0;
  padding:0 6px 0 4px;box-sizing:border-box;
  display:flex;align-items:center;
}
.solve-mini-title{
  display:block;width:100%;
  font-size:12.5px;font-weight:700;color:#6b7180;letter-spacing:-0.03em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  line-height:1.25;word-break:keep-all;
}
.solve-mini-right{display:flex;align-items:center;justify-content:flex-end;gap:4px;flex:0 0 auto;min-width:0;z-index:1;}
/* 모바일: 더 작게 · 흐리게 · 한 줄 전체 표기 */
@media(max-width:720px){
  body.solve-play{
    --solve-top-h:58px;
    --solve-bot-h:70px;
  }
  body.solve-play .solve-mini{
    padding-left:max(10px, env(safe-area-inset-left, 0px));
    padding-right:max(10px, env(safe-area-inset-right, 0px));
    padding-bottom:6px;
    gap:4px;
  }
  .solve-mini-center{
    position:static;transform:none;left:auto;right:auto;
    flex:1 1 auto;min-width:0;max-width:none;
    text-align:left;padding:0 4px 0 2px;
  }
  .solve-mini-title{
    font-size:10.5px;font-weight:700;color:#6b7180;letter-spacing:-.04em;line-height:1.2;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    -webkit-line-clamp:unset;display:block;
  }
  .solve-mini-exit{width:34px;height:34px;font-size:17px;}
  .solve-ans-toggle{padding:6px 8px;font-size:11.5px;}
  .solve-ans-toggle #solveAnsToggleLab{font-size:11.5px;}
  .solve-ico-btn,.solve-mini-more{width:34px;height:34px;}
  .solve-mini-right{gap:3px;}
}
@media(max-width:380px){
  .solve-mini-title{font-size:10px;letter-spacing:-.05em;}
}
@media(min-width:721px){
  .solve-mini-left{flex-direction:row;align-items:center;gap:0;min-width:0;}
  .solve-mini-center{
    position:static;transform:none;flex:1 1 auto;min-width:0;
    max-width:none;text-align:left;padding:0 10px;
    justify-content:flex-start;
  }
  .solve-mini-title{
    font-size:13px;font-weight:800;color:var(--text);
    white-space:nowrap;display:inline-block;width:auto;
    overflow:visible;text-overflow:clip;max-width:none;
  }
  /* 학습/시험 전환은 모든 폭에서 ⋯ 메뉴 하나로 — 상단 칩은 제거됐다 (2026-07-30) */
}
/* S2-U: 풀이 중 미니바 회차 숨김 · 카드 exam 만 (전 과목·후순위 규칙 덮어쓰기) */
body.solve-play .solve-mini-center,
body.solve-play .solve-mini-title{
  display:none !important;
}
/* 원형 아이콘 버튼 (타이머 등) */
.solve-ico-btn{
  border:0;background:#f3f4f6;border-radius:999px;width:36px;height:36px;padding:0;
  color:#6b7280;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.solve-ico-btn:hover{background:#e8eaef;color:var(--text);}
.solve-ico-btn svg{display:block;}
/* 학습/시험 모드 칩 CSS 제거 (2026-07-30) — 상단 칩을 없애고 ⋯ 메뉴로 일원화 */
/* 풀이 현황(이력) 칩 — 시안: 상단 필 버튼 */
.solve-hist-chip{
  border:0;background:#1b1f2e;color:#fff;border-radius:999px;
  padding:7px 12px;font-size:12.5px;font-weight:800;cursor:pointer;
  font-family:inherit;line-height:1.2;white-space:nowrap;flex-shrink:0;
  letter-spacing:-.02em;
}
.solve-hist-chip:hover{filter:brightness(1.08);}
.solve-hist-chip[aria-expanded="true"]{background:#3b48d8;}
/* 화면 분할 토글 — 패드/와이드에서 반응형 강제 분할 대신 사용자 선택 */
.solve-layout-chip{
  border:1.5px solid #d8dbe6;background:#fff;color:#3a3f4d;border-radius:999px;
  padding:6px 11px;font-size:12.5px;font-weight:800;cursor:pointer;
  font-family:inherit;line-height:1.2;white-space:nowrap;flex-shrink:0;
  letter-spacing:-.02em;display:inline-flex;align-items:center;gap:5px;
}
.solve-layout-chip svg{width:14px;height:14px;flex-shrink:0;opacity:.85;}
.solve-layout-chip:hover{border-color:#b8bdd0;background:#f7f8fb;}
.solve-layout-chip.is-on{
  border-color:#1b1f2e;background:#1b1f2e;color:#fff;
}
.solve-layout-chip.is-on:hover{filter:brightness(1.08);}
body.bg-eye-dark .solve-layout-chip{background:#2a3358;border-color:#3d4670;color:#e8eaef;}
body.bg-eye-dark .solve-layout-chip.is-on{background:#e8eaef;color:#1b1f2e;border-color:#e8eaef;}
/* 좁은 폰: 분할 의미 없음 → 숨김 (메뉴에는 유지 가능) */
@media(max-width:699px){
  .solve-layout-chip{display:none !important;}
}
@media(max-width:420px){
  .solve-hist-chip{padding:7px 10px;font-size:12px;}
  .solve-hist-chip .shc-full{display:none;}
  .solve-hist-chip .shc-short{display:inline;}
  .solve-layout-chip .slc-full{display:none;}
  .solve-layout-chip .slc-short{display:inline;}
}
@media(min-width:421px){
  .solve-hist-chip .shc-short{display:none;}
  .solve-layout-chip .slc-short{display:none;}
}
body.bg-eye-dark .solve-hist-chip{background:#e8eaef;color:#1b1f2e;}
/* 강제 한 화면(세로 스택) — 문제·선지 폭 = 하단 해설·메모·스크래치와 동일
   최대폭은 layout 의 --solve-content-max(1100px) 유지, 가운데 720 축소 금지 */
@media(min-width:700px){
  body.solve-play.solve-layout-stack .solve-layout{
    display:flex !important;
    flex-direction:column !important;
    grid-template-columns:none !important;
    max-width:var(--solve-content-max, 1100px);
    width:100%;
    margin-left:auto;
    margin-right:auto;
    box-sizing:border-box;
  }
  body.solve-play.solve-layout-stack .solve-main{
    max-width:none !important;
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box;
    /* 하단 사이드(해설 탭)와 같은 가로 패딩으로 정렬 */
    padding:16px 16px 20px;
  }
  body.solve-play.solve-layout-stack .solve-main .card{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }
  body.solve-play.solve-layout-stack .solve-main .stem,
  body.solve-play.solve-layout-stack .solve-main .choices,
  body.solve-play.solve-layout-stack .solve-main .choicesImgWrap{
    max-width:100%;
  }
  body.solve-play.solve-layout-stack .solve-side{
    position:relative !important;
    top:auto !important;
    max-height:none !important;
    overflow:visible !important;
    border-top:1px solid #eceef2;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box;
    padding:14px 16px 28px; /* 좌우 16 = main 과 동일 */
  }
  /* 강제 좌·우 분할 (반응형 임계와 무관, 700px+) */
  body.solve-play.solve-layout-split .solve-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:0 !important;
    align-items:stretch !important;
  }
  body.solve-play.solve-layout-split .solve-side{
    position:sticky !important;
    top:0 !important;
    max-height:calc(100vh - 100px) !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
    border-left:1px solid #eceef2;
    border-top:0 !important;
  }
  body.solve-play.solve-layout-split .solve-main{
    max-width:none;
    margin:0;
  }
}
/* 풀이 현황 드로어 */
.solve-hist-overlay{
  display:none;position:fixed;inset:0;z-index:80;
  background:rgba(20,24,44,.4);align-items:stretch;justify-content:flex-end;
}
.solve-hist-overlay.show{display:flex;}
.solve-hist-panel{
  width:min(380px,100%);max-width:100%;height:100%;
  background:#f6f7fb;box-shadow:-12px 0 40px rgba(20,24,44,.18);
  display:flex;flex-direction:column;animation:solveHistIn .2s ease-out;
}
@keyframes solveHistIn{
  from{transform:translateX(12px);opacity:.6}
  to{transform:none;opacity:1}
}
@media(max-width:520px){
  .solve-hist-overlay{align-items:flex-end;justify-content:center;background:rgba(20,24,44,.45);}
  .solve-hist-panel{
    width:100%;height:min(88vh,640px);max-height:92vh;border-radius:18px 18px 0 0;
    animation:solveHistUp .22s ease-out;
  }
  @keyframes solveHistUp{
    from{transform:translateY(16px);opacity:.7}
    to{transform:none;opacity:1}
  }
}
.solve-hist-hd{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:16px 16px 12px;background:#fff;border-bottom:1px solid #eceef2;flex-shrink:0;
}
.solve-hist-hd h3{margin:0;font-size:17px;font-weight:900;letter-spacing:-.02em;}
.solve-hist-x{
  width:34px;height:34px;border:0;border-radius:10px;background:#f1f2f6;color:#6b7180;
  font-size:18px;cursor:pointer;font-family:inherit;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
}
.solve-hist-x:hover{background:#e8eaef;color:var(--text);}
.solve-hist-body{
  flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:14px 14px max(20px,env(safe-area-inset-bottom));
}
.sh-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 12px;
}
.sh-stat{
  background:#fff;border-radius:14px;padding:12px 8px 11px;text-align:center;
  border:1px solid #eceef2;
}
.sh-stat .l{font-size:12px;font-weight:700;color:#8b91a0;margin:0 0 6px;}
.sh-stat .n{font-size:1.35rem;font-weight:900;line-height:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;}
.sh-stat .n.tot{color:#3b48d8;}
.sh-stat .n.ok{color:#059669;}
.sh-stat .n.bad{color:#e11d48;}
.sh-stat .ico{font-size:15px;opacity:.9;}
.sh-acc{
  background:#fff;border:1px solid #eceef2;border-radius:14px;padding:14px 14px 12px;margin:0 0 12px;
}
.sh-acc-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;}
.sh-acc-row .l{font-size:14px;font-weight:800;color:var(--text);}
.sh-acc-row .p{font-size:1.25rem;font-weight:900;color:#3b48d8;}
.sh-acc-bar{height:8px;border-radius:999px;background:#e8eaf0;overflow:hidden;}
.sh-acc-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#4d5bf0,#3b48d8);width:0;transition:width .25s ease;}
.sh-card{
  background:#fff;border:1px solid #eceef2;border-radius:14px;padding:14px;margin:0 0 12px;
}
.sh-card h4{margin:0 0 12px;font-size:14px;font-weight:900;}
.sh-cal-hd{
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;
}
.sh-cal-hd button{
  width:32px;height:32px;border:0;border-radius:10px;background:#f1f2f6;color:#5b6070;
  font-size:16px;cursor:pointer;font-family:inherit;font-weight:700;
}
.sh-cal-hd button:hover{background:#e8eaef;}
.sh-cal-hd b{font-size:14px;font-weight:800;}
.sh-cal-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:4px 2px;text-align:center;
}
.sh-cal-dow{font-size:11px;font-weight:700;color:#a0a5b3;padding:2px 0 6px;}
.sh-cal-dow.sun,.sh-cal-day.sun{color:#e11d48;}
.sh-cal-day{
  min-height:36px;padding:4px 0 6px;font-size:12.5px;font-weight:700;color:#3a3f4d;
  border-radius:10px;position:relative;
}
.sh-cal-day.out{color:#c5c9d4;font-weight:600;}
.sh-cal-day.today{background:#eef0fe;color:#3b48d8;font-weight:900;}
.sh-cal-dots{display:flex;justify-content:center;gap:3px;margin-top:2px;min-height:6px;}
.sh-cal-dots i{width:5px;height:5px;border-radius:50%;display:inline-block;}
.sh-cal-dots i.ok{background:#22c55e;}
.sh-cal-dots i.bad{background:#ef4444;}
.sh-list{margin:0;padding:0;list-style:none;}
.sh-list li{
  display:flex;align-items:flex-start;gap:10px;padding:10px 0;
  border-bottom:1px solid #f0f1f5;font-size:13px;
}
.sh-list li:last-child{border-bottom:0;}
.sh-list .mk{
  width:22px;height:22px;border-radius:999px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:900;
}
.sh-list .mk.ok{background:#ecfdf5;color:#059669;}
.sh-list .mk.bad{background:#fff1f2;color:#e11d48;}
.sh-list .mk.na{background:#f3f4f6;color:#9ca3af;}
.sh-list .meta{flex:1;min-width:0;}
.sh-list .meta b{display:block;font-size:13px;font-weight:800;color:var(--text);line-height:1.3;}
.sh-list .meta span{display:block;font-size:11.5px;font-weight:600;color:#8b91a0;margin-top:2px;}
.sh-empty{font-size:13px;font-weight:600;color:#9196a3;text-align:center;padding:18px 8px;}
.sh-note{font-size:11.5px;font-weight:600;color:#a0a5b3;margin:4px 0 0;line-height:1.45;}
/* 최근 활동 헤더 · 달력/목록 토글 */
.sh-act-hd{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;
}
.sh-act-hd h4{margin:0;font-size:14px;font-weight:900;}
.sh-view-tog{
  display:inline-flex;background:#f1f2f6;border-radius:10px;padding:3px;gap:2px;
}
.sh-view-tog button{
  width:34px;height:30px;border:0;border-radius:8px;background:transparent;
  color:#8b91a0;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;justify-content:center;
}
.sh-view-tog button.on{background:#1b1f2e;color:#fff;}
.sh-view-tog button:hover:not(.on){color:#3a3f4d;}
.sh-view-tog svg{display:block;width:16px;height:16px;}
/* 일별 활동 목록 (시안: 날짜 + ✓n ×m) */
.sh-day-list{display:flex;flex-direction:column;gap:8px;}
.sh-day-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#f7f8fb;border-radius:12px;padding:12px 14px;
}
.sh-day-row .d{font-size:13.5px;font-weight:700;color:var(--text);}
.sh-day-row .cnts{display:inline-flex;align-items:center;gap:12px;font-size:13.5px;font-weight:800;flex-shrink:0;}
.sh-day-row .cnts .ok{color:#059669;}
.sh-day-row .cnts .bad{color:#e11d48;}
.sh-day-row .cnts .ok span,.sh-day-row .cnts .bad span{margin-left:3px;font-variant-numeric:tabular-nums;}
.sh-foot{
  flex-shrink:0;padding:10px 14px max(14px,env(safe-area-inset-bottom));
  background:#fff;border-top:1px solid #eceef2;
}
.sh-foot-close{
  width:100%;border:0;border-radius:14px;background:#1b1f2e;color:#fff;
  font-size:15px;font-weight:800;padding:14px;cursor:pointer;font-family:inherit;
}
.sh-foot-close:hover{filter:brightness(1.08);}
.solve-hist-panel{/* ensure footer sticks */}
.solve-hist-panel .solve-hist-body{flex:1;min-height:0;}
.solve-mini-more{
  border:0;background:#f3f4f6;border-radius:999px;width:36px;height:36px;padding:0;
  font-size:18px;font-weight:700;color:#6b7280;cursor:pointer;font-family:inherit;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
}
.solve-mini-more:hover{background:#e8eaef;color:var(--text);}
.solve-mini-menu{
  display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:40;
  min-width:168px;background:#fff;border:1px solid #e8eaef;border-radius:14px;
  box-shadow:0 10px 32px rgba(20,24,40,.14);padding:6px 0;overflow:hidden;
}
.solve-mini-menu.show{display:block;}
.solve-mini-menu button{
  display:block;width:100%;text-align:left;border:0;background:transparent;
  padding:11px 16px;font-size:14px;font-weight:700;color:var(--text);
  cursor:pointer;font-family:inherit;
}
.solve-mini-menu button:hover{background:#f4f6ff;color:var(--indigo);}
.solve-mini-menu button.on{background:#eef1ff;color:var(--indigo);font-weight:800;}
.solve-mini-menu .menu-row{font-weight:700;}
.solve-mini-menu .menu-print{color:var(--indigo);font-weight:800;}
.solve-mini-menu .menu-print:hover{background:#eef1ff;color:var(--indigo-deep,#3b48d8);}
/* 「오답·북마크 비우기」 — 파괴적 동작이라 색으로 구분 (2026-08-20 · 알약에서 이사) */
.solve-mini-menu .menu-clear{color:var(--no);}
.solve-mini-menu .menu-clear:hover{background:#fff1f0;color:var(--no);}
.solve-mini-menu .menu-clear[hidden]{display:none;}
.solve-mini-menu .menu-sub{
  background:#fafbff;border-top:1px solid #f0f1f6;border-bottom:1px solid #f0f1f6;
  padding:4px 0;
}
.solve-mini-menu .menu-sub button{
  padding:9px 16px 9px 22px;font-size:13px;font-weight:600;color:#5b6170;
}
.solve-mini-menu .menu-sub button.on{color:var(--indigo);font-weight:800;background:#eef1ff;}
.solve-mini-menu .menu-sep{height:1px;background:#eef0f6;margin:4px 0;}
.solve-mini-wrap{position:relative;}
/* 시험 타이머 칩 — 탭=시작/정지 (버튼 없음, 좁은 칸) */
.solve-mini-timer{
  display:none;align-items:center;gap:0;flex-shrink:0;
}
.solve-mini-timer.show{display:inline-flex;}
.solve-mini-timer .smt-clock{
  font-variant-numeric:tabular-nums;font-size:14px;font-weight:900;color:#3b48d8;
  border:0;background:#eef0fe;border-radius:999px;
  padding:7px 11px 7px 9px;cursor:pointer;font-family:inherit;line-height:1.2;
  min-width:0;text-align:center;letter-spacing:0.02em;
  display:inline-flex;align-items:center;gap:5px;
  -webkit-tap-highlight-color:transparent;box-shadow:none;
  user-select:none;-webkit-user-select:none;
}
.solve-mini-timer .smt-clock:active{opacity:.88;transform:scale(.98);}
.solve-mini-timer .smt-ico{
  font-size:11px;line-height:1;flex-shrink:0;opacity:.92;
  width:1.1em;text-align:center;font-weight:700;
}
.solve-mini-timer .smt-time{font-variant-numeric:tabular-nums;}
.solve-mini-timer.running .smt-clock{
  background:#e8ebff;box-shadow:0 0 0 2px rgba(76,99,246,.18);
}
.solve-mini-timer.running .smt-ico{
  animation:smtPulse 1.4s ease infinite;
}
@keyframes smtPulse{0%,100%{opacity:1}50%{opacity:.45}}
.solve-mini-timer .smt-clock.warn{color:#b45309;background:#fff7ed;}
.solve-mini-timer .smt-clock.danger{color:#b91c1c;background:#fef2f2;}
.solve-mini-timer.running .smt-clock.warn{box-shadow:0 0 0 2px rgba(245,158,11,.25);}
.solve-mini-timer.running .smt-clock.danger{box-shadow:0 0 0 2px rgba(239,68,68,.28);}
/* 지문 볼드 + 글자 크기 배율 */
body.solve-play .solve-main .stem{
  font-weight:700;font-size:calc(var(--fs-lg) * var(--solve-fs, 1));
  line-height:1.65;letter-spacing:-0.02em;color:var(--text);
}
body.solve-play .solve-main .choice{
  font-size:calc(var(--fs-base) * var(--solve-fs, 1));
  line-height:1.55;
}
body.solve-play .solve-main .tag-title{
  font-size:calc(13px * var(--solve-fs, 1));
}
/* 글자 크기 단계: 기본 / 작게 / 크게 / 매우크게 */
body.solve-play.fs-sm{--solve-fs:.9;}
body.solve-play.fs-md{--solve-fs:1;}
body.solve-play.fs-lg{--solve-fs:1.12;}
body.solve-play.fs-xl{--solve-fs:1.26;}

/* 시험 모드: 좌·우 균형 스플릿 (독 임베드) */
body.solve-play.mode-test .solve-layout{
  min-height:calc(100vh - 120px);
}
@media(min-width:900px){
  body.solve-play.mode-test .solve-layout{
    grid-template-columns:minmax(0,1fr) minmax(300px,360px) !important;
  }
  body.solve-play.mode-test .solve-side{
    display:block !important;
    border-left:1px solid #eceef2;
    padding:12px 12px 16px !important;
    background:#f8f9fc;
    position:sticky;top:52px;
    max-height:calc(100vh - 120px);
    overflow:hidden;
  }
  body.solve-play.mode-test .solve-side-ph{display:none!important;}
  /* 고정 side-dock 숨기고 임베드만 */
  body.solve-play.mode-test .side-dock.dock-fixed-hidden{display:none!important;}
  body.solve-play.mode-test .side-dock:not(.dock-embedded),
  body.solve-exam-embed .side-dock:not(.dock-embedded){
    display:none !important;
  }
  body.solve-play.mode-test,
  body.solve-exam-embed{
    padding-right:0 !important;
    padding-left:0 !important;
  }
  body.solve-play.mode-test .wrap,
  body.solve-exam-embed .wrap{
    max-width:1200px !important;
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important; /* margin-right:0 쏠림 해제 */
  }
}
.solve-exam-dock-host{
  display:flex;flex-direction:column;gap:10px;height:100%;min-height:0;
  max-height:calc(100vh - 130px);
}
/* 학습 모드에서 hidden 이어도 height:100%+display:flex!important 가
   AI 해설 버튼을 위로, 해설 본문을 한참 아래로 밀어내던 문제 차단 */
#solveExamDockHost[hidden],
.solve-exam-dock-host[hidden]{
  display:none !important;
  height:0 !important;
  max-height:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  pointer-events:none !important;
}
.solve-exam-dock-host .side-dock,
.solve-exam-dock-host#sideDock,
#solveExamDockHost > .side-dock,
#solveExamDockHost:not([hidden]){
  position:static !important;inset:auto !important;width:100% !important;
  max-height:100%;height:100%;display:flex !important;flex-direction:column;
  gap:10px;pointer-events:auto;z-index:1;
}
#solveExamDockHost .exam-timer-panel{
  flex-shrink:0;box-shadow:0 2px 10px rgba(30,40,80,.06);
}
#solveExamDockHost .exam-timer-panel .et-adj{display:flex;padding:2px 8px 8px;} /* 시간 ± 조절 표시 */
#solveExamDockHost .exam-timer-panel .et-clock{font-size:1.65rem;padding:4px 8px 0;}
#solveExamDockHost .exam-timer-panel .et-sub{padding:0 8px 6px;}
#solveExamDockHost .exam-timer-panel .et-adj button{padding:5px 8px;font-size:12px;min-width:36px;}
#solveExamDockHost .exam-timer-panel .et-btns{padding:0 8px 10px;}
#solveExamDockHost .omr-dock{
  display:flex !important;flex:1;min-height:0;box-shadow:0 2px 10px rgba(30,40,80,.06);
}
#solveExamDockHost .exam-timer-reopen{display:none!important;}
/* 학습 정답 공개 토글 칩 — 시안: 상단 상시 */
.solve-ans-toggle{
  display:none;align-items:center;gap:6px;border:1px solid #e8eaef;background:#fff;
  border-radius:999px;padding:7px 11px;font-size:12.5px;font-weight:700;color:#6b7180;
  cursor:pointer;font-family:inherit;flex-shrink:0;line-height:1.2;
}
body.solve-play.mode-study .solve-ans-toggle{display:inline-flex;}
body.solve-play.mode-test .solve-ans-toggle{display:none !important;}
.solve-ans-toggle.on{background:#eef0fe;border-color:#c9d2ff;color:#3b48d8;}
.solve-ans-toggle .dot{
  width:7px;height:7px;border-radius:50%;background:#c5c9d4;flex-shrink:0;
}
.solve-ans-toggle.on .dot{background:#3b48d8;}
/* 시력보호 배경 */
body.bg-eye-warm{--bg-page:#F3EDE0;}
body.bg-eye-warm,body.bg-eye-warm.solve-play,body.bg-eye-warm.solve-hub{background:#F3EDE0 !important;}
body.bg-eye-warm.solve-play .solve-shell,
body.bg-eye-warm.solve-play .solve-main,
body.bg-eye-warm.solve-play .solve-side{background:#FBF7EE !important;}
body.bg-eye-green{--bg-page:#eef5ee;}
body.bg-eye-green,body.bg-eye-green.solve-play,body.bg-eye-green.solve-hub{background:#eef5ee !important;}
body.bg-eye-green.solve-play .solve-shell,
body.bg-eye-green.solve-play .solve-main,
body.bg-eye-green.solve-play .solve-side{background:#f4faf4 !important;}
/* 다크(눈 보호): 토큰 일괄 → stem/선지/네비 등 var(--text) 경로 자동 대비 */
body.bg-eye-dark{
  --bg:#1c1f26;
  --bg-soft:#2a303c;
  --bg-page:#1c1f26;
  --card:#252a33;
  --border:#3a4050;
  --border-soft:#4a5164;
  --text:#e8eaef;
  --sub:#a8b0c0;
  --muted:#8b93a7;
  --shadow-sm:0 2px 10px rgba(0,0,0,.28);
  --shadow:0 8px 28px rgba(0,0,0,.4);
  color:var(--text);
}
body.bg-eye-dark,body.bg-eye-dark.solve-play,body.bg-eye-dark.solve-hub{
  background:var(--bg) !important;color:var(--text);
}
body.bg-eye-dark.solve-play .solve-shell,
body.bg-eye-dark.solve-play .solve-layout,
body.bg-eye-dark.solve-play .solve-main,
body.bg-eye-dark.solve-play .solve-side,
body.bg-eye-dark .solve-mini,
body.bg-eye-dark .solve-nav{
  background:var(--card) !important;color:var(--text);border-color:var(--border) !important;
}
body.bg-eye-dark.solve-play .solve-main .choice,
body.bg-eye-dark .choice{
  background:#2a303c !important;
  color:var(--text) !important;
  border:0 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.picked{
  background:#2a3358 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct{
  background:#163a2c !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong{
  background:#3a2222 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .cnum{
  background:#3a4254!important;color:var(--text)!important;border:0!important;box-shadow:none!important;
}
body.bg-eye-dark.solve-play .solve-main .choice.picked .cnum{
  background:#4d5bf0!important;color:#fff!important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct .cnum{
  background:#163a2c!important;color:transparent!important;border:0!important;
  box-shadow:none!important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong .cnum{
  background:#3a2222!important;color:transparent!important;border:0!important;
  box-shadow:none!important;
}
body.bg-eye-dark .choice.correct .cnum::after{color:#6ee7b7!important;}
body.bg-eye-dark .choice.wrong .cnum::after{color:#fca5a5!important;}
body.bg-eye-dark.solve-play .solve-side{border-left-color:var(--border) !important;}
body.bg-eye-dark .solve-side-ph{color:var(--muted);}
body.bg-eye-dark .solve-side .feedback{
  background:var(--bg-soft);border-color:var(--border);color:var(--text);
}
body.bg-eye-dark.solve-play .solve-nav{
  background:var(--card);border-top-color:var(--border);box-shadow:0 -4px 20px rgba(0,0,0,.25);
}
body.bg-eye-dark.solve-play .solve-nav #solvePrevBtn{
  background:var(--bg-soft)!important;color:var(--sub)!important;
}
body.bg-eye-dark.solve-play .solve-nav .solve-pick-btn,
body.bg-eye-dark.solve-play .solve-nav #solvePickBtn{
  background:transparent !important;color:#c5d0ff !important;border-color:#4a5580 !important;
}
body.bg-eye-dark.solve-play .solve-nav button.primary,
body.bg-eye-dark.solve-play .solve-nav #solveNextBtn{
  background:var(--indigo) !important;color:#fff !important;border-color:var(--indigo) !important;
}
body.bg-eye-dark .solve-mini{background:var(--card);}
body.bg-eye-dark .solve-mini-prog{background:var(--bg-soft);}
body.bg-eye-dark .solve-mini-title{color:#9aa3b5;}
body.bg-eye-dark .solve-mini-exit{
  color:var(--sub);border:0;background:var(--bg-soft);
}
body.bg-eye-dark .solve-mini-more,
body.bg-eye-dark .solve-ico-btn{color:var(--sub);background:var(--bg-soft);}
body.bg-eye-dark .solve-mini-more:hover,
body.bg-eye-dark .solve-ico-btn:hover{background:#2a3358;color:var(--text);}
body.bg-eye-dark .solve-ans-toggle{background:var(--card);border-color:var(--border);color:var(--sub);}
body.bg-eye-dark .solve-mini-menu{
  background:var(--card);border-color:var(--border);color:var(--text);
  box-shadow:var(--shadow);
}
body.bg-eye-dark .solve-mini-menu button{color:var(--text);}
body.bg-eye-dark .solve-mini-menu button:hover{background:var(--bg-soft);color:var(--indigo-soft);}
body.bg-eye-dark .solve-mini-menu button.on{background:#2a3358;color:var(--indigo-soft);}
body.bg-eye-dark .solve-mini-menu .menu-sub{background:#1a2038;border-color:var(--border);}
body.bg-eye-dark .solve-mini-menu .menu-sep{background:var(--border);}
body.bg-eye-dark .solve-mini-menu button.bg-opt{color:var(--sub);}
body.bg-eye-dark .solve-mini-menu button.bg-opt.on{color:var(--indigo-soft);background:#2a3358;}
body.bg-eye-dark .solve-mini-timer .smt-clock{background:#2a3358;color:#c5d0ff;}
body.bg-eye-dark .hub-round,body.bg-eye-dark .hub-dash-card{
  background:var(--card);border-color:var(--border);color:var(--text);
}
body.bg-eye-dark .hub-sec-hd h2,body.bg-eye-dark .hr-title{color:var(--text);}
body.bg-eye-dark .expbtn{
  background:var(--bg-soft);border-color:#4a5580;color:#a8b6ff;
}
body.bg-eye-dark .expbtn:hover{background:#2a3358;border-color:var(--indigo-soft);}
body.bg-eye-dark .memobtn{
  background:#1e3a32;border-color:#2d6a55;color:#6ee7b7;
}
body.bg-eye-dark .memobtn:hover{background:#234a3e;}

body.bg-eye-dark .reportbtn{
  background:var(--bg-soft);border-color:var(--border);color:var(--sub);
}
body.bg-eye-dark .reportbtn:hover{color:var(--text);border-color:var(--border-soft);}
body.bg-eye-dark .tag-title{color:var(--indigo-soft);}
body.bg-eye-dark .chkbtn{background:transparent;}
body.bg-eye-dark .chkbtn:hover{background:rgba(255,255,255,.06);}
body.bg-eye-dark .chkbtn .bm-stroke{stroke:#6b7280;}
body.bg-eye-dark .chkbtn.on .bm-fill{fill:#e2554a;}
body.bg-eye-dark .chkbtn.on .bm-stroke{stroke:#fca5a5;}
body.bg-eye-dark .omr-flag .bm-stroke{stroke:#6b7280;}
body.bg-eye-dark .omr-flag.on .bm-fill{fill:#e2554a;}
.solve-mini-menu .menu-sep{height:1px;background:#eceef2;margin:4px 0;}
.solve-mini-menu button.bg-opt{font-weight:600;color:#5e6478;}
.solve-mini-menu button.bg-opt.on{color:var(--indigo);background:#f4f6ff;}

/* 플레이: 흰 캔버스 · 1:1 · 맞추다 pill · 오르조 심플 */
body.solve-play .solve-layout{
  background:#fff;
  min-height:calc(100vh - 112px);
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
/* 다크: 흰 캔버스 금지 (토큰 대비와 맞춤) */
body.solve-play.bg-eye-dark .solve-layout,
body.bg-eye-dark.solve-play .solve-layout{
  background:#252a33 !important;
}
body.solve-play.bg-eye-dark .solve-main,
body.bg-eye-dark.solve-play .solve-main{
  background:#252a33 !important;
  color:#e8eaef !important;
}
@media (min-width:900px){
  body.solve-play .solve-layout{
    display:grid;
    /* 2열 균등 · 각 열 최소 가독 폭 유지 */
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:0;
    max-width:var(--solve-content-max,1100px);
    margin:0 auto;
  }
  body.solve-play .solve-main{
    /* 한 열 본문 줄길이 과도 확장 방지 (패딩 포함) */
    max-width:100%;
  }
}
body.solve-play .solve-main{
  min-width:0;
  padding:20px 24px 28px;
  background:#fff;
}
body.solve-play .solve-main .headbtns{display:none;}
body.solve-play .solve-main .kws{display:none;}
body.solve-play .solve-main .card{
  border:0;box-shadow:none;padding:0;background:transparent;border-radius:0;
}
/*
 * 다크(흑백) 모드: 위 흰 캔버스 규칙을 반드시 덮음.
 * (순서상 이 블록이 뒤에 와야 stem이 흰 배경+연한 글자로 안 보이는 사고 방지)
 */
body.bg-eye-dark.solve-play .solve-shell,
body.bg-eye-dark.solve-play .solve-layout,
body.bg-eye-dark.solve-play .solve-scroll,
body.bg-eye-dark.solve-play .solve-main,
body.bg-eye-dark.solve-play .solve-side,
body.bg-eye-dark.solve-play .solve-mini,
body.bg-eye-dark.solve-play .solve-nav,
body.bg-eye-dark.solve-play .solve-mini-prog{
  background:var(--card,#252a33) !important;
  color:var(--text,#e8eaef) !important;
  border-color:var(--border,#3a4050) !important;
}
body.bg-eye-dark.solve-play .solve-main .card,
body.bg-eye-dark.solve-play .solve-main .stem,
body.bg-eye-dark.solve-play .solve-main .card-head,
body.bg-eye-dark.solve-play .solve-main .card-head-slim,
body.bg-eye-dark.solve-play .solve-main .tag-title{
  background:transparent !important;
  color:var(--text,#e8eaef) !important;
}
body.bg-eye-dark.solve-play .solve-main .stem{
  color:var(--text,#e8eaef) !important;
  -webkit-text-fill-color:var(--text,#e8eaef);
}
body.bg-eye-dark.solve-play .solve-main .solve-card-exam,
body.bg-eye-dark.solve-play .solve-main .solve-card-prog,
body.bg-eye-dark.solve-play .card-head-slim .tag-title{
  color:var(--sub,#a8b0c0) !important;
}
body.bg-eye-dark.solve-play .solve-main .choice{
  background:#2a303c !important;
  color:var(--text,#e8eaef) !important;
  border:0 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.picked{
  background:#2a3358 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct{
  background:#163a2c !important;
  color:var(--text,#e8eaef) !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong{
  background:#3a2222 !important;
  color:var(--text,#e8eaef) !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .cnum{
  background:#3a4254 !important;
  color:var(--text,#e8eaef) !important;
  border:0 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct .cnum{
  background:#163a2c !important;
  color:transparent !important;
  border:0 !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong .cnum{
  background:#3a2222 !important;
  color:transparent !important;
  border-color:#f87171 !important;
}
body.bg-eye-dark.solve-play .solve-side-tabs{
  background:var(--card,#252a33) !important;
  border-bottom-color:var(--border,#3a4050) !important;
}
body.bg-eye-dark.solve-play .solve-side-tabs button{
  color:var(--muted,#8b93a7) !important;
  background:transparent !important;
}
body.bg-eye-dark.solve-play .solve-side-tabs button.on{
  color:#a5b4fc !important;
  border-bottom-color:#818cf8 !important;
}
body.bg-eye-dark.solve-play .solve-scroll{
  background:var(--card,#252a33) !important;
  -webkit-overflow-scrolling:touch;
}
body.bg-eye-dark.solve-play .solve-mini{
  border-bottom:1px solid var(--border,#3a4050) !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-nav{
  border-top:1px solid var(--border,#3a4050) !important;
  box-shadow:0 -4px 18px rgba(0,0,0,.35) !important;
}
/* 하단 선지 점 · 목록 버튼 대비 */
body.bg-eye-dark.solve-play .solve-nav .solve-choice-dot{
  background:var(--bg-soft,#2a303c) !important;
  color:var(--text,#e8eaef) !important;
  border-color:var(--border,#3a4050) !important;
}
body.bg-eye-dark.solve-play .solve-nav #solvePrevBtn,
body.bg-eye-dark.solve-play .solve-nav #solvePickBtn{
  background:var(--bg-soft,#2a303c) !important;
  color:var(--sub,#a8b0c0) !important;
  border-color:var(--border,#3a4050) !important;
}
body.bg-eye-dark.solve-play .solve-nav #solveNextBtn,
body.bg-eye-dark.solve-play .solve-nav button.primary{
  background:var(--indigo,#4C63F6) !important;
  color:#fff !important;
}
/* 필기 바 · 스크래치 */
body.bg-eye-dark.solve-play .solve-ink-bar{
  background:rgba(37,42,51,.96) !important;
  border-color:var(--border,#3a4050) !important;
  color:var(--text,#e8eaef) !important;
}
body.bg-eye-dark.solve-play .solve-ink-bar button{
  background:var(--bg-soft,#2a303c) !important;
  color:var(--sub,#a8b0c0) !important;
}
body.bg-eye-dark.solve-play #solveScratchPane,
body.bg-eye-dark.solve-play .scratch-stage{
  background:#1a1f33 !important;
  border-color:#2a3358 !important;
  color:var(--text,#e8eaef) !important;
}
/* 허브 다크: 흰 잔여 영역 방지 (파란 이어서 카드·하단 행은 자체 스타일 유지) */
body.bg-eye-dark.solve-hub .wrap,
body.bg-eye-dark.solve-hub .hub-home,
body.bg-eye-dark.solve-hub .hub-hero-wrap{
  background:var(--bg,#1c1f26) !important;
  color:var(--text,#e8eaef) !important;
}
body.bg-eye-dark.solve-hub .hub-hero{
  /* 그라데이션 유지 — 배경 !important 로 덮지 않음 */
  color:#fff !important;
}
body.solve-play .solve-main .card:hover{box-shadow:none;border-color:transparent;}
/* 선지: 소프트 필 (라이트 전용 — 다크는 맨 끝 블록이 담당) */
body.solve-play .solve-main .choices{gap:10px;margin:14px 0 8px;}
body.solve-play:not(.bg-eye-dark) .solve-main .choice{
  border:0 !important;border-radius:18px;padding:14px 16px;
  min-height:52px;align-items:center;
  background:#f0f2f6 !important;
  box-shadow:none !important;
  font-weight:600;color:#1B1F2E;
}
@media (hover:hover) and (pointer:fine){
  body.solve-play:not(.bg-eye-dark) .solve-main .choice:hover:not(.locked):not(.picked):not(.correct):not(.wrong){
    background:#e8eaef !important;
    box-shadow:none !important;
  }
}
body.solve-play:not(.bg-eye-dark) .solve-main .choice:active:not(.locked):not(.picked):not(.correct):not(.wrong){
  background:#e2e4ea !important;
  box-shadow:none !important;
}
body.solve-play:not(.bg-eye-dark) .solve-main .choice.picked{
  background:#e8ecff !important;
  box-shadow:none !important;
}
body.solve-play:not(.bg-eye-dark) .solve-main .choice.correct{
  background:#eaf7f0 !important;
  box-shadow:none !important;
}
body.solve-play:not(.bg-eye-dark) .solve-main .choice.wrong{
  background:#fdeeee !important;
  box-shadow:none !important;
}
body.solve-play .solve-main .cnum{
  width:28px;height:28px;border-radius:50%;background:#e2e4ea;color:#5b6070;
  font-weight:800;font-size:13.5px;padding:0;position:relative;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1;
  border:0;box-shadow:none;
}
body.solve-play .solve-main .choice.picked .cnum{
  background:#4d5bf0;color:#fff;box-shadow:none;
}
body.solve-play .solve-main .choice.correct .cnum{
  background:#dcfce7;color:transparent;border:0;
  box-shadow:none;width:28px;height:28px;
}
body.solve-play .solve-main .choice.wrong .cnum{
  background:#fee2e2;color:transparent;border:0;
  box-shadow:none;width:28px;height:28px;
}
body.solve-play .solve-side{
  border:0;box-shadow:none;background:#fff;padding:20px 24px 28px;
  border-left:1px solid #eceef2;border-radius:0;min-height:0;
}
body.solve-play .solve-side .feedback{
  border-radius:12px;background:#fafbff;border:1px solid #eef0f6;
  padding:12px 14px;
}
/* 시험 모드: 우측 패널 없음 → 문제 전체 폭 */
body.solve-test-plain .solve-layout{
  grid-template-columns:1fr !important;
}
body.solve-test-plain .solve-side{display:none !important;}
@media(max-width:899px){
  body.solve-play .solve-main{padding:16px 16px 20px;}
  body.solve-play .solve-side{
    border-left:0;border-top:1px solid #eceef2;padding:16px 16px 24px;
    position:static;max-height:none;
  }
}
/* 플레이: 하단 네비 — 뷰포트 하단 전폭 fixed (상하 스크롤 무관 항상 노출) */
/* 상세 고정 규칙은 위 body.solve-play .solve-nav 블록 참고 */
/* 스크롤 래퍼 기본(PC: 일반 흐름 / 모바일: flex 중간 영역) */
.solve-scroll{display:block;min-width:0;}
body.solve-play .solve-shell,
body.solve-play #solveShell.solve-shell{
  padding-bottom:calc(var(--solve-bot-h, 72px) + env(safe-area-inset-bottom, 0px) + 16px) !important;
  box-sizing:border-box;
}
/* 모바일 셸은 fixed·overflow:hidden 이다 — **여기에 하단 여백을 주면 안 된다** (S2-P59).
 * 그 여백만큼 스크롤 영역이 하단 바보다 **위에서 끝나고**, 그 사이에 셸 배경(회색)이 드러난다.
 * 지나가는 내용은 바 밑으로 미끄러지는 대신 그 경계에서 **잘린다** —
 * 2026-08-02 운영자(아이폰): 「하단 바 바로 윗부분 회색띠로 AI해설·개인학습메모·연습장 일부가
 * 잘리게 나온다」. 실측 390x700: 스크롤 아래끝 620 · 바 윗변 635 → 15px 띠에서 칩이 잘렸다.
 * ⛔ 자리를 비우는 일은 `.solve-scroll` 의 padding-bottom 이 이미 한다 — 두 곳에서 빼지 말 것.
 * ⚠ PC(≥900px)는 셸이 흐름 안(block)이라 그 여백이 실제로 쓰인다 — 그대로 둔다. */
@media (max-width:899px){
  body.solve-play .solve-shell,
  body.solve-play #solveShell.solve-shell,
  /* 필기 ON 은 body 클래스가 하나 더 붙어 특이도가 높다 — 같이 적어야 이긴다 */
  body.solve-play.solve-ink-on .solve-shell,
  body.solve-play.solve-ink-on #solveShell.solve-shell{
    padding-bottom:0 !important;
  }
}
body.solve-play{
  --solve-bot-h:64px;
}
/* 필기 바: 고정 하단 네비 바로 위 */
body.solve-play .solve-ink-bar,
body.solve-play #solveInkBar{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:calc(var(--solve-bot-h, 64px) + env(safe-area-inset-bottom, 0px) + 8px) !important;
  transform:translateX(-50%) !important;
  z-index:56 !important;
}
/* 필기 OFF 인 바는 네비(70) 아래 떠 있어도 클릭을 먹지 않는다 (S2-P172) */
body.solve-play:not(.solve-ink-on) .solve-ink-bar,
body.solve-play:not(.solve-ink-on) #solveInkBar{
  pointer-events:none !important;
}
/* 2열: 필기 버튼 = 좌측 문제 열 폭의 가로 중앙(콘텐츠 폭의 1/4 지점) */
@media (min-width:900px){
  body.solve-play:not(.solve-test-plain) .solve-ink-bar,
  body.solve-play:not(.solve-test-plain) #solveInkBar{
    /* 레이아웃 중앙(50%)에서 콘텐츠 폭의 1/4 만큼 왼쪽 = 문제 열 중앙 */
    left:calc(50% - min(100vw, var(--solve-content-max, 1100px)) / 4) !important;
    transform:translateX(-50%) !important;
  }
  /* 시험 plain(우측 패널 없음): 전체 중앙 유지 */
  body.solve-play.solve-test-plain .solve-ink-bar,
  body.solve-play.solve-test-plain #solveInkBar{
    left:50% !important;
    transform:translateX(-50%) !important;
  }
}
/* PC: 상단 미니 sticky · 스크롤 래퍼는 문서 흐름 · 셸 block (row flex 금지) */
@media (min-width:900px){
  body.solve-play .solve-shell,
  body.solve-play #solveShell,
  body.solve-play #solveShell.solve-shell{
    display:block !important;
    position:relative !important;
    top:auto;left:auto;right:auto;bottom:auto;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    flex-direction:unset;
  }
  body.solve-play .solve-mini{
    position:sticky;
    top:0;
    z-index:50;
    width:100%;
  }
  body.solve-play .solve-mini-prog{
    position:sticky;
    top:52px;
    z-index:49;
  }
  body.solve-play .solve-scroll{
    overflow:visible;
    flex:none;
    min-height:0;
    display:block;
  }
}
/* 선지 원(·choice-dot)은 테두리 유지 — 전역 border:0 에서 제외 */
body.solve-play .solve-nav button:not(.solve-choice-dot){
  border:0;font-family:inherit;cursor:pointer;line-height:1.2;
  white-space:nowrap;font-weight:800;
}
body.solve-play .solve-nav button.solve-choice-dot{
  font-family:inherit;cursor:pointer;line-height:1;
  white-space:nowrap;
}
body.solve-play .solve-nav #solvePrevBtn{
  flex:0 0 auto;min-width:0;max-width:none;padding:12px 18px;border-radius:999px;
  background:#fff;color:#5b6070;font-size:14px;margin-left:0;
  border:1.5px solid #e6e8ef !important;
}
body.solve-play .solve-nav #solvePrevBtn:disabled{opacity:.35;}
body.solve-play .solve-nav .solve-pick-btn,
body.solve-play .solve-nav #solvePickBtn{
  flex:0 0 auto;min-width:0;max-width:none;padding:8px 10px;border-radius:999px;
  background:#f4f5f8;color:#5e6478;border:1px solid #e8eaef;
  font-size:12px;font-weight:700;margin-left:0;
}
body.solve-play .solve-nav .solve-pick-btn:hover{background:#f4f6ff;}
/* 다음 문제: 항상 보이도록 shrink 금지 (모바일에서 화면 밖 잘림 방지) */
body.solve-play .solve-nav button.primary,
body.solve-play .solve-nav #solveNextBtn{
  flex:0 0 auto !important;
  flex-shrink:0 !important;
  min-width:0;
  max-width:42vw;
  width:auto;
  margin-left:0;
  padding:12px 14px;border-radius:14px;
  background:var(--indigo)!important;border:0!important;color:#fff!important;
  font-size:14px;font-weight:900;box-shadow:0 4px 12px rgba(76,99,246,.22);
  position:relative;
  z-index:3;
  pointer-events:auto !important;
  touch-action:manipulation;
}
/* 이어하기 1280×800: 시각 중앙 (1173,710) 이 레이아웃 박스(y=744)보다 위.
   히트만 위로 연장 — 그림은 그대로. */
body.solve-play .solve-nav #solveNextBtn::before{
  content:'';
  position:absolute;
  left:0;right:0;bottom:0;
  top:-40px;
}
body.solve-play .solve-nav #solveNextBtn:disabled,
body.solve-play .solve-nav #solveNextBtn.is-at-end,
body.solve-play .solve-nav #solveNextBtn[aria-disabled="true"]{opacity:.4;box-shadow:none;}
/* 마지막 문항 + 다음 회차: 다음 버튼 강조, 선지 점 숨겨 공간 확보 */
body.solve-play.solve-at-last-round .solve-choice-dots{display:none !important;}
body.solve-play.solve-at-last-round .solve-nav #solveNextBtn{
  flex:1 1 auto !important;
  max-width:none;
  min-width:7.5rem;
  font-size:15px;
  padding:12px 16px;
}
body.solve-play.solve-at-last-round .solve-nav #solvePrevBtn{flex:0 0 auto;}
body.solve-play.solve-at-last-round .solve-nav-mid{flex:0 0 auto;max-width:30%;}
@media(max-width:420px){
  body.solve-play .solve-nav{gap:4px;padding-left:8px;padding-right:8px;}
  body.solve-play .solve-nav #solvePrevBtn{padding:10px 8px;font-size:12px;border-radius:10px;flex-shrink:0;}
  body.solve-play .solve-nav #solvePickBtn{padding:6px 8px;font-size:11px;}
  body.solve-play .solve-nav #solveNextBtn{padding:10px 10px;font-size:12px;max-width:46vw;}
  body.solve-play .solve-nav button.solve-choice-dot,
  body.solve-play .solve-nav .solve-choice-dot{
    width:32px !important;height:32px !important;min-width:32px !important;max-width:32px !important;
    flex:0 0 32px !important;font-size:13px !important;
  }
  .solve-choice-dots{gap:4px;}
  .solve-nav-mid{gap:4px;}
  body.solve-play.solve-at-last-round .solve-nav #solveNextBtn{font-size:14px;padding:12px 12px;}
}
@media(min-width:720px){
  body.solve-play .solve-nav #solveNextBtn{padding:14px 18px;font-size:15px;max-width:none;}
  body.solve-play .solve-nav #solvePrevBtn{padding:14px 16px;font-size:15px;}
}
/* 하단: 선지 동그라미 1~5 + 목록 — 가운데만 줄어들고 이전/다음은 유지 */
.solve-nav-mid{
  flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:4px;
  overflow:hidden;
}
/* 2열: 선지 점 그룹을 화면 중앙(2·3 사이)에 맞춤 — 네비 자체는 fixed 전폭 유지 */
@media (min-width:900px){
  body.solve-play .solve-nav-mid{
    position:absolute;
    left:50%;
    transform:translateX(calc(-50% + 10px));
    flex:0 0 auto;
    overflow:visible;
    z-index:1;
    pointer-events:auto;
  }
  /* 필기 바 위치는 위 2열 전용 규칙(문제 열 중앙) 사용 — 여기서 덮지 않음 */
}
.solve-choice-dots{
  display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:nowrap;
  min-width:0;flex:0 1 auto;
}
/* 하단 선지: 참고 UI — 연한 회색 원 테두리 + 일반 숫자 1·2·3·4
   (.solve-nav button 의 min-width·padding 이 원을 찌그러뜨리지 않도록 전부 덮어씀) */
.solve-choice-dots{
  gap:8px;
}
body.solve-play .solve-nav button.solve-choice-dot,
body.solve-play .solve-nav .solve-choice-dot,
#solveNav .solve-choice-dot,
.solve-choice-dot{
  width:40px !important;height:40px !important;min-width:40px !important;max-width:40px !important;
  border-radius:999px !important;
  border:1.5px solid #c5c9d2 !important;background:#fff !important;
  font-size:15px !important;font-weight:500 !important;color:#6b7280 !important;
  cursor:pointer;font-family:inherit;
  display:inline-flex !important;align-items:center;justify-content:center;
  padding:0 !important;margin:0 !important;line-height:1 !important;
  flex:0 0 40px !important;flex-shrink:0 !important;-webkit-tap-highlight-color:transparent;
  letter-spacing:0;box-sizing:border-box;box-shadow:none !important;
  white-space:nowrap;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .12s ease,box-shadow .14s ease;
}
body.solve-play .solve-nav .solve-choice-dot:hover,
.solve-choice-dot:hover{
  border-color:#9ca3af !important;color:#4b5563 !important;background:#fafafa !important;
}
body.solve-play .solve-nav .solve-choice-dot:active,
.solve-choice-dot:active{
  transform:scale(.94);
}
/* 선택됨: 채운 원 + 흰 숫자 — 탭 한 느낌이 분명 */
body.solve-play .solve-nav .solve-choice-dot.picked,
.solve-choice-dot.picked,
body.solve-play .solve-nav .solve-choice-dot[aria-pressed="true"],
.solve-choice-dot[aria-pressed="true"]{
  border-color:#4d5bf0 !important;
  background:#4d5bf0 !important;
  color:#fff !important;
  font-weight:800 !important;
  box-shadow:0 0 0 3px rgba(77,91,240,.22) !important;
}
body.solve-play .solve-nav .solve-choice-dot.picked:hover,
.solve-choice-dot.picked:hover{
  border-color:#3b48d8 !important;background:#3b48d8 !important;color:#fff !important;
}
/* 정답/오답은 선택 채움보다 우선 */
body.solve-play .solve-nav .solve-choice-dot.correct,
.solve-choice-dot.correct{
  border-color:#0d9f6e !important;background:#0d9f6e !important;color:#fff !important;
  font-weight:800 !important;
  box-shadow:0 0 0 3px rgba(13,159,110,.2) !important;
}
body.solve-play .solve-nav .solve-choice-dot.wrong,
.solve-choice-dot.wrong{
  border-color:#f04438 !important;background:#f04438 !important;color:#fff !important;
  font-weight:800 !important;
  box-shadow:0 0 0 3px rgba(240,68,56,.2) !important;
}
.solve-choice-dot:disabled{opacity:.45;cursor:default;transform:none;}
@media(max-width:380px){
  body.solve-play .solve-nav .solve-choice-dot,
  .solve-choice-dot{width:36px;height:36px;font-size:14px;min-width:36px !important;max-width:36px !important;flex-basis:36px !important;}
  .solve-choice-dots{gap:6px;}
}
body.solve-play .solve-nav .solve-pick-btn,
body.solve-play .solve-nav #solvePickBtn{
  flex:0 0 auto;min-width:0;max-width:none;padding:8px 12px;font-size:12.5px;
  border-radius:999px;background:#f4f5f8;border:1px solid #e8eaef;color:#5e6478;
  font-weight:700;
}
body.solve-play .solve-nav .solve-pick-btn:hover{background:#eef0fe;border-color:#c9d2ff;color:#3b48d8;}
body.bg-eye-dark .solve-choice-dot,
body.bg-eye-dark body.solve-play .solve-nav .solve-choice-dot{
  background:var(--card) !important;border-color:#4b5563 !important;color:#9ca3af !important;
  box-shadow:none !important;
}
body.bg-eye-dark .solve-choice-dot.picked,
body.bg-eye-dark body.solve-play .solve-nav .solve-choice-dot.picked,
body.bg-eye-dark .solve-choice-dot[aria-pressed="true"]{
  background:#6366f1 !important;border-color:#818cf8 !important;color:#fff !important;
  box-shadow:0 0 0 3px rgba(129,140,248,.28) !important;
}
body.bg-eye-dark .solve-choice-dot.correct{
  background:#059669 !important;border-color:#34d399 !important;color:#fff !important;
}
body.bg-eye-dark .solve-choice-dot.wrong{
  background:#dc2626 !important;border-color:#f87171 !important;color:#fff !important;
}


/* 관리자 PDF 검수 */
.admin-pdf-layout{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:60vh;}
@media (max-width:900px){.admin-pdf-layout{grid-template-columns:1fr;}}
.admin-pdf-frame{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#f7f6fb;min-height:420px;display:flex;flex-direction:column;}
.admin-pdf-frame iframe,.admin-pdf-frame embed{flex:1;width:100%;min-height:420px;border:0;background:#fff;}
.admin-pdf-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px;}
.admin-pdf-tools select{border:1px solid var(--border);border-radius:8px;padding:7px 10px;font-size:13px;max-width:100%;}
.admin-qrow{border:1px solid var(--border);border-radius:10px;padding:10px;margin-bottom:8px;background:#fff;}
.admin-qrow.ok{border-color:#86efac;background:#f0fdf4;}
.admin-qrow.issue{border-color:#fca5a5;background:#fef2f2;}
.admin-qrow.warn{border-color:#fcd34d;background:#fffbeb;}
.admin-qrow .flags{font-size:12px;color:var(--sub);line-height:1.45;margin-top:4px;}
.admin-qrow .flags b.bad{color:var(--no);}
.admin-qrow .flags b.good{color:var(--ok);}
.admin-qrow img.qa-thumb{max-width:100%;max-height:120px;border:1px solid var(--border);border-radius:8px;margin-top:6px;background:#fff;}
/* ⛔ 대조 화면의 오른쪽은 **학생 화면과 같아야** 한다. 지문 박스(.qbox)·보기 표제는
 *    `.stem`/`.pq-stem` 안에서만 스타일이 걸려 있어서, 대조 화면에서는 네모 상자가
 *    안 그려지고 맨 글로 보였다 (운영자 지적 2026-08-06: 「미리보기와 문항 열기가 다르다」).
 *    같은 규칙에 `.admin-cmp-live` 를 함께 태운다 — 규칙을 베끼면 또 갈라진다. */
/* ── 원본 ↔ 실린 내용 (좌우 대조) ────────────────────────────────────
 * 규칙(validate_exam)이 못 잡는 결함 — 빠진 그림·눌린 구조식 — 은 **원본과 나란히
 * 놓고 눈으로 봐야** 보인다. 그래서 이 화면이 원본·검수의 본체다. */
.admin-cmp-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:1px solid var(--border);
  border-radius:12px;padding:10px;margin-bottom:10px;background:#fff;}
@media (max-width:1000px){.admin-cmp-row{grid-template-columns:1fr;}}
.admin-cmp-row.issue{border-color:#fca5a5;}
.admin-cmp-row.warn{border-color:#fcd34d;}
.admin-cmp-row.ok{border-color:#86efac;}
.admin-cmp-row.bookmark{border-color:#f3a59d;box-shadow:inset 4px 0 0 #e2554a;}
.admin-cmp-row.recrop{border-color:#5eead4;box-shadow:inset 4px 0 0 #0f766e;}
.admin-cmp-bookmark-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:7px 10px;
  margin:0 0 9px;border:1px solid #f3c2bd;border-radius:9px;background:#fff7f5;color:#9f342d;font-size:12px;}
.admin-cmp-bookmark-meta b{color:#7f2924;}
.admin-cmp-recrop-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:7px 10px;
  margin:0 0 9px;border:1px solid #99f6e4;border-radius:9px;background:#f0fdfa;color:#0f766e;font-size:12px;}
.admin-cmp-recrop-meta b{color:#115e59;}
.admin-cmp-side{min-width:0;}
.admin-cmp-hd{font-size:11.5px;font-weight:800;color:var(--muted);letter-spacing:-.02em;
  padding-bottom:4px;margin-bottom:6px;border-bottom:1px solid var(--border);}
.admin-cmp-orig{background:#f7f6fb;border-radius:8px;min-height:120px;display:flex;
  align-items:flex-start;justify-content:center;padding:6px;overflow:auto;max-height:60vh;}
.admin-cmp-orig canvas{max-width:100%;height:auto;background:#fff;border-radius:6px;}
.admin-cmp-live{font-size:13.5px;line-height:1.6;color:var(--text);max-height:60vh;overflow:auto;}
.admin-cmp-live img{max-width:100%;max-height:230px;height:auto;background:#fff;
  border:1px solid var(--border);border-radius:6px;margin:4px 0;}
.admin-cmp-live img.inline{display:inline-block;vertical-align:middle;max-height:1.9em;margin:0 2px;border:0;}
.admin-cmp-live table{border-collapse:collapse;font-size:12.5px;margin:6px 0;}
.admin-cmp-live th,.admin-cmp-live td{border:1px solid var(--border);padding:3px 7px;}
.admin-cmp-ch{list-style:none;padding:0;margin:8px 0 0;}
.admin-cmp-ch li{padding:4px 8px;border-radius:7px;margin-bottom:3px;background:#f8f9fc;}
.admin-cmp-ch li.ans{background:#eef2ff;border:1px solid #c7d2fe;font-weight:700;}
.admin-cmp-ch li .k{color:var(--muted);font-size:11.5px;margin-right:5px;}
.admin-cmp-empty{font-size:12.5px;color:var(--muted);padding:12px;text-align:center;}
.admin-pipeline{background:#f7f6fb;border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:12px;font-size:13px;line-height:1.55;color:var(--sub);}
.admin-pipeline b{color:var(--text);}
.admin-pipeline ol{margin:8px 0 0 1.1em;padding:0;}
.admin-pipeline li{margin:4px 0;}
.admin-orig-modal{position:fixed;inset:0;z-index:250;background:rgba(15,18,35,.55);display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:max(12px,env(safe-area-inset-top)) 12px max(20px,env(safe-area-inset-bottom));box-sizing:border-box;-webkit-transform:translateZ(0);transform:translateZ(0);}
.admin-orig-modal.show{display:block;}
.admin-orig-panel{background:#fff;border-radius:16px;max-width:980px;width:100%;margin:12px auto;box-shadow:0 16px 48px rgba(20,20,50,.3);overflow:visible;min-height:40vh;}
.admin-orig-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#f8f7ff,#fff);position:sticky;top:0;z-index:2;}
.admin-orig-hd h3{margin:0;font-size:1.05rem;font-weight:800;}
.admin-orig-body{padding:14px 16px 28px;-webkit-overflow-scrolling:touch;}
.admin-orig-body h4{margin:14px 0 8px;font-size:13.5px;font-weight:800;color:var(--indigo);}
.admin-orig-body h4:first-child{margin-top:0;}
.admin-orig-canvases{display:flex;flex-direction:column;gap:14px;align-items:stretch;}
.admin-orig-canvases canvas,.admin-orig-canvases img{max-width:100%;width:100%;height:auto;border:1px solid var(--border);border-radius:10px;background:#fff;box-shadow:0 2px 10px rgba(30,28,60,.08);display:block;}
.admin-orig-note{font-size:12.5px;color:var(--sub);line-height:1.5;margin-top:8px;}
.admin-qrow .qa-open-orig{border:1px solid #c5c9ff;background:#edefff;color:var(--indigo);border-radius:8px;padding:4px 10px;font-size:12px;font-weight:800;cursor:pointer;}
.admin-qrow .qa-open-orig:hover{background:#e0e4ff;}
body.admin-orig-open{overflow:hidden;position:relative;}
/* iOS Safari: 관리자 전체페이지에서도 원본 모달이 보이도록 */
body.admin-page .admin-orig-modal{z-index:300;}


.kws{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;}
.kw{font-size:var(--fs-sm);padding:5px 11px;border-radius:var(--radius-pill);background:#eef1ff;color:var(--sub);font-weight:600;}
.expbtn{margin-top:12px;border:1.5px solid var(--indigo-soft);background:#fff;color:var(--indigo);padding:9px 16px;border-radius:var(--radius-pill);font-size:var(--fs-md);font-weight:700;cursor:pointer;box-shadow:var(--shadow-sm);}
.expbtn:hover{background:#eef1ff;border-color:var(--indigo);}
.expbtn:disabled{opacity:.5;cursor:default;}
.expbox{margin-top:10px;padding:16px 17px;border-radius:var(--radius-sm);background:#f3f5ff;border:1px solid var(--border-soft);font-size:var(--fs-base);line-height:1.85;font-weight:400;white-space:pre-wrap;display:none;overflow-wrap:anywhere;word-break:keep-all;}
.expbox.show{display:block;}
/* ⛔ overflow-x 만 auto 로 주면 overflow-y 가 visible → **auto** 로 계산돼
   수식 블록 자체가 세로 스크롤 컨테이너가 된다. 분수처럼 키 큰 수식에서 1~2px 만 넘쳐도
   수식 옆에 작은 세로 막대가 뜬다 (2026-07-31 운영자 캡처). 세로는 명시적으로 끈다.
   ⛔ padding 을 2px 로 되돌리지 말 것 — 분수 위아래가 잘린다. */
.expbox .katex-display{margin:8px 0;overflow-x:auto;overflow-y:hidden;padding:7px 0;}
.expbox .katex{font-size:1.05em;}
/* 지문·선지 KaTeX (이미지 크롭 없이 분수 표기) */
.stem .katex-display,.pq-stem .katex-display,.admin-cmp-live .katex-display, .admin-cmp-live .katex-display{
  margin:10px 0;padding:12px 16px;border:1px solid var(--border);border-radius:12px;
  background:#fafbff;overflow-x:auto;overflow-y:hidden;text-align:center;
}
.stem .katex,.choice .katex,.pq-ch .katex,.admin-cmp-live .katex{font-size:1.06em;}
.choice .katex-display,.pq-ch .katex-display{margin:2px 0;text-align:left;overflow:visible;}
.choice .katex-display>.katex{text-align:left;}

.expbox code{background:#e4e9ff;border-radius:4px;padding:1px 5px;font-size:12.5px;}
/* 오류 제보 — 좌측 문제 카드 맨 아래 우측 (2026-07-31 운영자 확정).
   문제·선지를 다 읽은 뒤에 누르는 동작이라 여기가 동선에 맞다. 평소엔 회색 작은 글씨.
   ⛔ .reportbtn 클래스를 붙이지 말 것 — bindSolveToolClicks 가 capture 에서
      그 클래스를 가로채고(#solveSideTools 안쪽만), 클래스가 겹치면 혼선이 난다 (S2-TOOLCHIP). */
.qreport-row{display:flex;justify-content:flex-end;margin-top:12px;}
.qreport-btn{
  display:inline-flex;align-items:center;gap:5px;border:0;background:none;
  padding:5px 4px;cursor:pointer;font-family:inherit;line-height:1.2;border-radius:6px;
  font-size:11.5px;font-weight:700;color:#a9aebd;
}
.qreport-btn svg{width:12px;height:12px;flex-shrink:0;}
.qreport-btn:hover,.qreport-btn:focus-visible{color:#c2410c;outline:none;}
.qreport-btn.on{color:#c2410c;}
body.bg-eye-dark .qreport-btn{color:#6b7280;}
body.bg-eye-dark .qreport-btn:hover,body.bg-eye-dark .qreport-btn.on{color:#fdba74;}
@media (max-width:767px){
  /* 폰: 글씨는 그대로 작게 두고 **눌리는 면적만** 44px 로 넓힌다 (23.8px 은 탭 미달).
     여백은 padding 이 만들므로 행 margin 은 줄인다. */
  .qreport-row{margin-top:0;}
  .qreport-btn{padding:15px 8px;}
}
/* 신고하기 모달 (2026-08-22 운영자 시안) — 분류 선택 · 내용 · 취소/제출.
   ⛔ DOM 은 문제 카드 안에 그대로 있다 (S2-PANEL: 오류 제보는 좌측 카드 안).
      막 자체를 position:fixed 로 띄우므로 카드 안이라도 화면 가운데에 뜬다.
      .card 는 z-index 가 없어 쌓임 맥락을 만들지 않는다 — 카드 밖으로 옮기지 말 것. */
.reportbox{
  position:fixed;inset:0;z-index:330;display:none;
  align-items:center;justify-content:center;padding:16px;box-sizing:border-box;
  background:rgba(20,24,40,.45);text-align:left;cursor:default;
}
.reportbox.show{display:flex;}
.rep-dlg{
  background:var(--card);color:var(--text);border-radius:18px;
  width:100%;max-width:420px;max-height:calc(100vh - 32px);overflow:auto;
  padding:20px 20px 18px;box-sizing:border-box;box-shadow:var(--shadow-lg,0 24px 60px rgba(0,0,0,.28));
  display:flex;flex-direction:column;gap:14px;
}
.rep-top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.rep-top h3{margin:0;font-size:1.15rem;font-weight:900;letter-spacing:-.02em;color:var(--text);}
.rep-x{
  border:0;background:transparent;color:var(--muted);cursor:pointer;
  width:34px;height:34px;padding:0;border-radius:10px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
}
.rep-x svg{width:20px;height:20px;}
.rep-x:hover{background:var(--bg);color:var(--text);}
.rep-cat{
  appearance:none;-webkit-appearance:none;width:100%;box-sizing:border-box;cursor:pointer;
  border:1px solid var(--border);border-radius:12px;background-color:var(--card);color:var(--text);
  padding:13px 42px 13px 14px;font-size:15px;font-weight:600;font-family:inherit;line-height:1.3;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b93a7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 14px center;background-size:18px;
}
.rep-cat:focus{outline:none;border-color:var(--indigo);}
/* 관리자 수정요청 드롭박스 (원본·검수 대조 줄) */
.adm-fixreq{display:inline-flex;gap:3px;align-items:center}
.adm-fixreq-sel{font:inherit;font-size:11.5px;padding:2px 4px;border:1px solid var(--line,#d9d9e3);border-radius:6px;background:#fff;color:#9f342d;font-weight:700;max-width:150px}
.adm-fixreq-note{font:inherit;font-size:11.5px;padding:2px 6px;border:1px solid var(--line,#d9d9e3);border-radius:6px;background:#fff;width:150px;min-width:0}
.adm-fixreq-note:focus{outline:none;border-color:#9f342d}
.adm-fixreq-go{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
/* 관리자 대조 화면의 표형 선지 — 열 머리 + 번호 열, 정답 행 강조 */
.admin-cmp-ctab{border-collapse:collapse;margin:6px 0 10px;font-size:14px}
.admin-cmp-ctab th,.admin-cmp-ctab td{border:1px solid #d9d9e3;padding:4px 10px;text-align:center}
.admin-cmp-ctab th{background:#f7f8fc;font-weight:800}
.admin-cmp-ctab .k{color:var(--muted);font-weight:700;width:2em}
.admin-cmp-ctab tr.ans td{background:#ecfdf5;font-weight:800}
/* 미선택일 때만 회색 — 「분류 선택」은 자리표시다 */
.rep-cat:has(option[value=""]:checked){color:var(--muted);}
.reportbox textarea{
  border:1px solid var(--border);border-radius:12px;background:var(--card);color:var(--text);
  padding:13px 14px;font-size:15px;min-height:130px;font-family:inherit;resize:vertical;
  width:100%;box-sizing:border-box;line-height:1.5;
}
.reportbox textarea:focus{outline:none;border-color:var(--indigo);}
.reportbox textarea::placeholder{color:var(--muted);}
.rep-act{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.rep-act button{
  border-radius:12px;padding:14px 10px;font-size:15px;font-weight:800;
  font-family:inherit;cursor:pointer;line-height:1.2;
}
.rep-cancel{border:1px solid var(--border);background:var(--card);color:var(--text);}
.rep-cancel:hover{border-color:var(--border-soft);}
.rep-submit{border:0;background:var(--indigo);color:#fff;box-shadow:0 6px 16px rgba(76,99,246,.26);}
.rep-submit:hover{filter:brightness(1.04);}
.result{position:sticky;bottom:12px;background:var(--indigo);color:#fff;border-radius:var(--radius);padding:13px 18px;font-size:15px;font-weight:700;text-align:center;margin-top:12px;box-shadow:0 8px 24px rgba(76,99,246,.32);display:none;}
.result.show{display:block;}
/* —— 학습 결과 오버레이 (design_handoff_result) —— */
.lr-overlay{
  display:none;position:fixed;inset:0;z-index:260;
  background:rgba(20,24,44,.48);align-items:stretch;justify-content:center;
  padding:0;overflow:hidden;
}
.lr-overlay.show{display:flex}
body.lr-open{overflow:hidden}
.lr-panel{
  width:100%;max-width:none;margin:0;height:100dvh;
  background:#f6f7fc;display:flex;flex-direction:column;min-height:0;
  box-shadow:none;
}
@media(min-width:720px){
  .lr-overlay{padding:0}
  .lr-panel{height:100dvh;max-height:none;border-radius:0;overflow:hidden}
}
.lr-hd{
  flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 16px;background:#fff;border-bottom:1px solid #eceef2;
}
@media(min-width:720px){.lr-hd{padding:14px 22px}}
.lr-hd-left{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap}
.lr-hd h2{margin:0;font-size:16px;font-weight:900;color:#1B1F2E;letter-spacing:-.3px;white-space:nowrap}
.lr-badge{
  font-size:11px;font-weight:700;color:#7c3aed;background:#f3ebfe;
  padding:3px 9px;border-radius:999px;white-space:nowrap;max-width:min(60vw,320px);
  overflow:hidden;text-overflow:ellipsis;
}
.lr-close{
  width:30px;height:30px;border-radius:9px;border:0;background:#f1f2f6;color:#6b7180;
  display:inline-flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer;
  font-family:inherit;flex-shrink:0;
}
.lr-close:hover{background:#e8eaef;color:#1B1F2E}
.lr-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px clamp(14px,3vw,48px) 28px}
@media(min-width:720px){.lr-body{padding-top:24px;padding-bottom:40px}}

.lr-top{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.lr-top{grid-template-columns:220px 1fr;gap:14px}}
.lr-verdict{
  background:#fff;border:1px solid #e6e8ef;border-radius:16px;padding:22px 18px;
  text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.lr-verdict .ico{
  width:74px;height:74px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:30px;
}
.lr-verdict .ico.fail{background:#fdeaea}
.lr-verdict .ico.pass{background:#e7f5ee}
.lr-verdict .lab{font-size:20px;font-weight:900;margin-top:12px}
.lr-verdict .lab.fail{color:#d64545}
.lr-verdict .lab.pass{color:#118049}
.lr-verdict .cap{font-size:11.5px;color:#9196a3;margin-top:4px;line-height:1.4}
.lr-stats{display:flex;flex-direction:column;gap:10px}
.lr-stat{
  flex:1;background:#fff;border:1px solid #e6e8ef;border-radius:14px;
  padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.lr-stat .k{font-size:13px;font-weight:700;color:#5b6070;white-space:nowrap}
.lr-stat .v{font-size:15px;font-weight:900;color:#1B1F2E;white-space:nowrap;text-align:right}
.lr-stat .v .bad{color:#d64545}
.lr-stat .v .good{color:#118049}
.lr-stat .v .me{font-weight:900}

.lr-card{
  background:#fff;border:1px solid #e6e8ef;border-radius:16px;padding:18px 16px;margin-top:14px;
}
@media(min-width:720px){.lr-card{padding:22px}}
.lr-card h3{margin:0;font-size:14px;font-weight:800;color:#1B1F2E}
.lr-card h3 .sub{font-size:11px;font-weight:700;color:#9196a3;margin-left:4px}
.lr-rings{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:12px;margin-top:16px;
}
.lr-ring-item{text-align:center}
.lr-ring{
  width:76px;height:76px;margin:0 auto;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.lr-ring > i{
  width:58px;height:58px;border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:900;font-style:normal;
}
.lr-ring-item .nm{font-size:12px;font-weight:700;color:#1B1F2E;margin-top:8px;line-height:1.25}
.lr-ring-item .st{font-size:10.5px;font-weight:700;margin-top:2px}
.lr-ring-item .st.fail{color:#d64545}
.lr-ring-item .st.pass{color:#118049}
.lr-cta{
  width:100%;margin-top:16px;border:0;border-radius:12px;padding:13px;
  font-weight:800;font-size:14px;cursor:pointer;font-family:inherit;white-space:nowrap;
}
.lr-cta.primary{background:#4d5bf0;color:#fff}
.lr-cta.primary:hover{filter:brightness(1.04)}
.lr-cta.soft{border:1px solid #dfe2fb;background:#eef0fe;color:#3b48d8}
.lr-cta.soft:hover{filter:brightness(.98)}

.lr-easy-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.lr-easy-chips button{
  width:34px;height:34px;border-radius:50%;border:0;background:#fdeaea;color:#d64545;
  font-size:12.5px;font-weight:800;cursor:pointer;font-family:inherit;
}
.lr-easy-chips button:hover{filter:brightness(.97)}
.lr-easy-empty{font-size:13px;color:#9196a3;font-weight:600;margin-top:12px}
.lr-analysis-gate{
  min-height:220px;margin-top:14px;padding:32px clamp(18px,5vw,72px);border:1px solid #e6e8ef;
  border-radius:14px;background:#f9fafc;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;
}
.lr-gate-lock{width:54px;height:54px;border-radius:50%;background:#eef0fe;display:flex;align-items:center;justify-content:center;font-size:24px}
.lr-analysis-gate h4{margin:16px 0 0;font-size:18px;font-weight:900;color:#1B1F2E;letter-spacing:-.3px}
.lr-analysis-gate p{margin:9px 0 0;max-width:680px;font-size:13.5px;line-height:1.65;color:#6b7180;font-weight:600;word-break:keep-all}
.lr-gate-btn{margin-top:18px;border:0;border-radius:11px;padding:12px 28px;background:#1B1B1B;color:#fff;font:inherit;font-size:14px;font-weight:800;cursor:pointer}
.lr-gate-btn:hover{filter:brightness(1.08)}

/* review */
.lr-review{
  padding:0;overflow:hidden;display:flex;flex-direction:column;
  height:auto;min-height:0;
}
.lr-review-hd{
  flex:none;
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  padding:16px 16px;border-bottom:1px solid #f0f1f5;
}
@media(min-width:720px){.lr-review-hd{padding:16px 22px}}
.lr-review-hd b{font-size:14px;font-weight:800;color:#1B1F2E}
.lr-filters{display:flex;gap:7px;flex-wrap:wrap}
.lr-filters select{
  border:1px solid #e2e4ee;background:#fff;padding:7px 10px;border-radius:9px;
  font-size:12px;font-weight:700;color:#5b6070;font-family:inherit;
}
.lr-strip{
  flex:none;
  padding:11px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;
}
@media(min-width:720px){.lr-strip{padding:11px 22px}}
.lr-strip.ok{background:#eaf7f0}
.lr-strip.no{background:#fdeaea}
.lr-strip .lab{font-size:13px;font-weight:800}
.lr-strip.ok .lab{color:#118049}
.lr-strip.no .lab{color:#d64545}
.lr-strip .acts{display:flex;align-items:center;gap:10px}
.lr-qbody{
  flex:none;height:clamp(400px,45dvh,720px);min-height:0;padding:0;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,58%) minmax(0,42%);
  background:#fff;
}
.lr-question-pane{
  min-width:0;min-height:0;padding:18px 16px 20px;overflow-y:auto;
  overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch;
}
@media(min-width:720px){.lr-question-pane{padding:20px 22px}}
@media(min-width:1000px){
  .lr-qbody{
    grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);
    grid-template-rows:minmax(0,1fr);
  }
}
.lr-qmeta{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap;
}
.lr-qmeta .tag{font-size:12.5px;font-weight:700;color:#4d5bf0;white-space:nowrap}
.lr-qmeta .btns{display:flex;gap:6px;flex-wrap:wrap}
.lr-qmeta .btns button{
  border:1px solid #e2e4ee;background:#fff;padding:6px 12px;border-radius:9px;
  font-size:11.5px;font-weight:700;color:#5b6070;cursor:pointer;font-family:inherit;white-space:nowrap;
}
.lr-stem{font-size:15px;font-weight:700;color:#1B1F2E;line-height:1.55;margin-bottom:14px}
.lr-choices{display:flex;flex-direction:column;gap:8px}
.lr-ch{
  display:flex;align-items:flex-start;gap:12px;border:1px solid #ececf2;background:#f7f8fa;
  border-radius:12px;padding:12px 14px;font-size:13.5px;color:#5b6070;line-height:1.45;
}
.lr-ch .num{
  flex:none;width:24px;height:24px;border-radius:50%;background:#e6e8ee;color:#5b6070;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;
}
.lr-ch.correct{border:2px solid #118049;background:#eaf7f0;color:#1B1F2E}
.lr-ch.correct .num{background:#118049;color:#fff}
.lr-ch.wrong-pick{border:2px solid #d64545;background:#fdeaea;color:#1B1F2E}
.lr-ch.wrong-pick .num{background:#d64545;color:#fff}
.lr-nav{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px max(14px,env(safe-area-inset-bottom));border-top:1px solid #f0f1f5;
  background:#fff;box-shadow:0 -8px 22px rgba(27,31,46,.06);z-index:2;
}
@media(min-width:720px){.lr-nav{padding:14px 22px}}
.lr-nav .left{display:flex;align-items:center;gap:9px}
.lr-nav .cnt{font-size:13.5px;font-weight:800;color:#1B1F2E;white-space:nowrap}
.lr-nav button{
  border:1px solid #e2e4ee;background:#fff;padding:6px 12px;border-radius:9px;
  font-size:12px;font-weight:700;color:#5b6070;cursor:pointer;font-family:inherit;white-space:nowrap;
}
.lr-nav .right{display:flex;align-items:center;gap:14px}
.lr-nav .right button{
  border:0;background:transparent;font-size:12.5px;font-weight:700;color:#a4a9b8;padding:0;
}
.lr-nav .right button.next{color:#4d5bf0;font-weight:800}
.lr-nav .right button:disabled{opacity:.4;cursor:default}
.lr-pick-grid{
  flex:none;display:none;padding:12px 16px 16px;border-top:1px solid #f0f1f5;
  max-height:min(35dvh,240px);overflow-y:auto;background:#fff;
}
.lr-pick-grid.show{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:6px}
.lr-pick-grid button{
  height:40px;border-radius:12px;border:1.5px solid var(--border);background:#fafbff;
  font-size:var(--fs-md);font-weight:800;color:var(--sub);cursor:pointer;
  font-family:inherit;padding:0;position:relative;
}
@media(max-width:480px){
  .lr-nav{gap:6px;padding-left:12px;padding-right:12px}
  .lr-nav .left{gap:6px}
  .lr-nav .right{gap:6px}
  .lr-nav button{padding:6px 8px;font-size:11.5px}
  .lr-nav .right button{font-size:11.5px}
}
.lr-foot-actions{display:none!important} /* 결과 닫고 해설/다시 풀기 폐기 — 해설 고정 pane + 트랙 복귀 */
.lr-exp{
  min-width:0;min-height:0;margin:0;border:0;border-top:1px solid #e6e8ef;
  border-left:3px solid #4d5bf0;border-radius:0;background:#f7f8fc;padding:14px 16px;
  overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch;
}
@media(min-width:720px){.lr-exp{padding:18px 20px}}
@media(min-width:1000px){.lr-exp{border-top:0;border-left:3px solid #4d5bf0}}
.lr-exp-hd{
  display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;
  margin-bottom:8px;
}
.lr-exp-hd .ttl{font-size:12.5px;font-weight:800;color:#4d5bf0;letter-spacing:-.1px}
.lr-exp-hd .ans-pill{
  font-size:11px;font-weight:800;color:#4d5bf0;background:#eef0fe;
  padding:2px 9px;border-radius:999px;white-space:nowrap;
}
.lr-exp-body{
  font-size:13.5px;line-height:1.75;color:#2a2f3d;font-weight:500;
  overflow-wrap:anywhere;word-break:keep-all;
}
.lr-exp-body .katex-display{margin:8px 0;overflow-x:auto;overflow-y:hidden;padding:5px 0}
.lr-exp-empty{font-size:13px;color:#9196a3;font-weight:600;line-height:1.5}
.lr-exp.is-collapsed .lr-exp-body{display:none}
.lr-exp-toggle{
  border:0;background:transparent;color:#4d5bf0;font:inherit;font-size:12.5px;font-weight:800;
  cursor:pointer;padding:0;margin-top:6px;
}
.lr-hub-bar{margin-top:14px}
.lr-hub-bar button{
  width:100%;border:0;border-radius:12px;padding:13px;background:#4d5bf0;color:#fff;
  font:inherit;font-size:14px;font-weight:800;cursor:pointer;
}
.lr-hub-bar button:hover{filter:brightness(1.04)}
.toast{position:fixed;left:50%;top:42%;bottom:auto;transform:translate(-50%,-40%) scale(.98);max-width:min(88vw,360px);width:max-content;background:#1b1f2e;color:#fff;border-radius:var(--radius);padding:12px 20px;font-size:14px;font-weight:700;line-height:1.5;text-align:center;word-break:keep-all;box-shadow:var(--shadow-lg);z-index:300;opacity:0;transition:opacity .22s,transform .22s;pointer-events:none;}
.toast.show{opacity:.97;transform:translate(-50%,-50%) scale(1);}
.toast.toast-timer{
  max-width:min(300px,90vw);
  z-index:90;
  box-shadow:0 10px 32px rgba(20,24,50,.28);
  font-size:13.5px;
  padding:11px 16px;
  /* 기본 중앙 transform 덮어씀 */
  transform:translate(-50%,0) scale(.98);
}
.toast.toast-timer.show{
  opacity:.97;
  transform:translate(-50%,0) scale(1) !important;
}
.toast.toast-ans{
  max-width:min(300px,90vw);
  z-index:120;
  box-shadow:0 10px 32px rgba(20,24,50,.28);
  font-size:13px;
  padding:10px 14px;
  transform:translate(-50%,0) scale(.98);
}
.toast.toast-ans.show{
  opacity:.97;
  transform:translate(-50%,0) scale(1) !important;
}

/* 키보드 포커스 가시성 (접근성) */
:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;border-radius:6px;}
button:focus:not(:focus-visible),a:focus:not(:focus-visible),select:focus:not(:focus-visible),input:focus:not(:focus-visible),textarea:focus:not(:focus-visible){outline:none;}
.iconbtn:focus-visible,.scorebtn:focus-visible,.resetbtn:focus-visible,.mode button:focus-visible{outline-offset:3px;}
sub{font-size:.72em;} sup{font-size:.72em;}
/* 모바일 사파리: overlay 자체가 스크롤 + body 고정 */
.overlay{position:fixed;inset:0;background:rgba(30,40,90,.42);z-index:99;padding:max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:block;box-sizing:border-box;}
.overlay[hidden],.overlay.is-hidden{display:none !important;}
html.guide-skip #guide{display:none !important;}
.guide{background:#fff;border-radius:22px;max-width:520px;width:100%;margin:max(12px, 4vh) auto;padding:26px 22px 22px;box-shadow:var(--shadow-lg);max-height:none;overflow:visible;}
.guide h2{margin:0 0 6px;font-size:1.28rem;font-weight:900;letter-spacing:-0.03em;line-height:1.3;}
.guide .gsub{font-size:13.5px;color:var(--sub);margin-bottom:16px;font-weight:500;line-height:1.5;}
.gitem{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;}
.gicon{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#eef1ff,#e0e6ff);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;color:var(--indigo);letter-spacing:-0.03em;flex-shrink:0;}
.gicon.emoji-legacy{font-size:18px;font-weight:400;color:inherit;letter-spacing:0;}
.gtxt{font-size:14.5px;line-height:1.65;font-weight:400;overflow-wrap:anywhere;word-break:keep-all;}
.gtxt b{color:var(--indigo);font-weight:800;}
.gstart{width:100%;margin-top:10px;border:0;background:var(--indigo);color:#fff;padding:14px;border-radius:var(--radius-sm);font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 8px 22px rgba(76,99,246,.3);}
.privnote{font-size:12.5px;color:var(--muted);margin-top:12px;line-height:1.6;font-weight:400;}
body.guide-open{overflow:hidden;position:fixed;width:100%;touch-action:none;}
/* ===== 첫 방문 온보딩 A안 (시험 선택 → 하루 분량 → 홈) ===== */
html.onboard-skip #onboard{display:none !important;}
#onboard.overlay{z-index:110;padding:0;background:#f4f5f8;}
#onboard .onboard-panel{
  min-height:100%;min-height:100dvh;max-width:440px;margin:0 auto;
  display:flex;flex-direction:column;padding:max(14px,env(safe-area-inset-top)) 18px max(16px,env(safe-area-inset-bottom));
  box-sizing:border-box;
}
#onboard .ob-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
#onboard .ob-brand{display:flex;align-items:center;gap:8px;font-weight:900;font-size:14px;letter-spacing:-.03em;color:var(--text);}
#onboard .ob-mark{
  width:30px;height:30px;border-radius:9px;background:linear-gradient(145deg,#4C63F6,#186CB4);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;flex-shrink:0;
}
#onboard .ob-skip{
  border:0;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:800;
  cursor:pointer;padding:8px 4px;-webkit-tap-highlight-color:transparent;
}
#onboard .ob-step{font-size:12px;font-weight:800;color:var(--indigo);letter-spacing:.04em;margin:10px 0 8px;}
#onboard .ob-h1{margin:0 0 8px;font-size:1.55rem;font-weight:900;letter-spacing:-.035em;line-height:1.25;}
#onboard .ob-sub{margin:0 0 16px;font-size:14px;line-height:1.55;color:var(--sub);font-weight:500;}
#onboard .ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
#onboard .ob-grid.col1{grid-template-columns:1fr;}
#onboard .ob-card{
  text-align:left;border:1.5px solid #e4e7ef;background:#fff;border-radius:16px;padding:14px 13px;
  cursor:pointer;font-family:inherit;box-shadow:0 2px 10px rgba(30,40,80,.04);
  transition:border-color .12s,background .12s,box-shadow .12s,color .12s;
  -webkit-tap-highlight-color:transparent;
}
#onboard .ob-card:hover{border-color:#c9d2ff;}
#onboard .ob-card.on{
  background:var(--indigo);border-color:var(--indigo);color:#fff;
  box-shadow:0 10px 24px rgba(76,99,246,.28);
}
#onboard .ob-card .ot{display:block;font-size:14.5px;font-weight:900;letter-spacing:-.02em;line-height:1.3;}
#onboard .ob-card .os{display:block;font-size:12px;font-weight:600;margin-top:4px;opacity:.78;line-height:1.35;}
#onboard .ob-card.on .os{opacity:.92;}
#onboard .ob-hint{
  display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 12px;
  border-radius:14px;background:#eef0fa;border:1px solid #e4e7f2;
  font-size:12.5px;line-height:1.5;color:var(--sub);font-weight:600;
}
#onboard .ob-hint .oh-ico{
  width:34px;height:34px;border-radius:10px;background:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--indigo);font-size:15px;font-weight:900;
}
#onboard .ob-body{flex:1;min-height:0;}
#onboard .ob-foot{padding-top:14px;margin-top:auto;}
#onboard .ob-cta{
  width:100%;border:0;border-radius:999px;padding:15px 16px;font-family:inherit;
  font-size:15.5px;font-weight:900;letter-spacing:-.02em;cursor:pointer;
  background:var(--indigo);color:#fff;box-shadow:0 10px 26px rgba(76,99,246,.32);
  -webkit-tap-highlight-color:transparent;
}
#onboard .ob-cta:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
#onboard .ob-step2{display:none;}
#onboard.step2 .ob-step1{display:none;}
#onboard.step2 .ob-step2{display:block;}
body.onboard-open{overflow:hidden;position:fixed;width:100%;touch-action:none;}
@media(min-width:480px){
  #onboard .ob-h1{font-size:1.7rem;}
  #onboard .onboard-panel{padding-top:max(28px,env(safe-area-inset-top));}
}
.envwarn{background:#fff8e6;border:1px solid #f2d791;color:#7c5c00;border-radius:var(--radius-sm);padding:8px 12px;font-size:12px;margin-bottom:.6rem;display:none;}
.envwarn.show{display:block;}
/* Google OAuth 번호·메일 인증 후 Gmail에 남는 경우 복구 안내 */
.oauth-help{
  display:none;position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));
  z-index:95;max-width:520px;margin:0 auto;padding:14px 16px 12px;
  background:#fff;border:1.5px solid #c9d2ff;border-radius:16px;
  box-shadow:0 12px 40px rgba(40,50,120,.18);color:var(--text);
}
.oauth-help.show{display:block;}
.oauth-help h3{margin:0 0 6px;font-size:14.5px;font-weight:900;color:var(--indigo);letter-spacing:-.02em;}
.oauth-help p{margin:0 0 10px;font-size:13px;line-height:1.55;font-weight:600;color:var(--sub);}
.oauth-help p b{color:var(--text);font-weight:800;}
.oauth-help .oh-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.oauth-help .oh-acts button{font-family:inherit;cursor:pointer;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:800;}
.oauth-help .oh-go{border:0;background:var(--indigo);color:#fff;}
.oauth-help .oh-close{border:1px solid var(--border);background:#fff;color:var(--sub);}

/* 앱 상단 — 랜딩형 계정 드롭다운 (fixed 배치로 잘림 방지) */
.app-user-menu{position:relative;display:inline-flex;align-items:center;flex-shrink:0;z-index:10;}
/* open 시 body 포탈 + 타이머 가림 */
.app-user-menu.open{z-index:260;}
body.app-user-menu-open .side-dock,
body.app-user-menu-open .exam-timer-mobile{
  visibility:hidden !important;
  pointer-events:none !important;
}
/* iOS Safari: overflow:hidden 만으로는 배경 스크롤이 안 막힘 → position:fixed 잠금 */
html.body-scroll-locked,
body.body-scroll-locked{
  overflow:hidden !important;
  overscroll-behavior:none;
  height:100%;
}
body.body-scroll-locked{
  position:fixed !important;
  left:0;right:0;width:100%;
  touch-action:none;
}
/* 잠금 중에도 메뉴·모달 내부는 스크롤 허용 */
body.body-scroll-locked .app-user-dropdown,
body.body-scroll-locked .studyroom-body,
body.body-scroll-locked .studyroom-panel,
body.body-scroll-locked .shop-overlay,
body.body-scroll-locked .shop-body,
body.body-scroll-locked .shop-panel,
body.body-scroll-locked .legal-overlay,
body.body-scroll-locked .legal-body,
body.body-scroll-locked .legal-panel,
body.body-scroll-locked .pts-hist-modal,
body.body-scroll-locked .pts-hist-body,
body.body-scroll-locked .admin-overlay,
body.body-scroll-locked .admin-panel,
body.body-scroll-locked .login-gate-panel,
body.body-scroll-locked .exam-picker-sheet,
body.body-scroll-locked .guide{
  touch-action:pan-y;
  overscroll-behavior:contain;
}
/* 계정 메뉴 열림 시 전체 터치 배경 흡수 (스크롤 전달 방지) */
body.app-user-menu-open::before{
  content:"";position:fixed;inset:0;z-index:250;background:transparent;
}
.app-user-dropdown.portaled{display:none;position:fixed;z-index:320 !important;}
.app-user-dropdown.portaled.is-open{display:block;}
.nav-dd-stats{display:flex;gap:8px;flex-wrap:nowrap;margin:0 12px 8px;padding:0;}
.nav-dd-stat{
  flex:1;min-width:0;border:0;background:#f3f4fb;
  border-radius:14px;padding:12px 12px 11px;cursor:pointer;text-align:left;font-family:inherit;
}
.nav-dd-stat:hover{background:#e9ebf8;}
.nav-dd-stat .k{display:block;font-size:11.5px;font-weight:700;color:#8b90a5;margin-bottom:4px;}
.nav-dd-stat .v{display:block;font-size:17px;font-weight:900;color:#1b1f2e;letter-spacing:-.03em;line-height:1.2;}
.nav-dd-stat .h{display:block;font-size:11px;font-weight:600;color:#9196a8;margin-top:3px;line-height:1.3;}
.nav-dd-stat.pwa .v{font-size:14px;font-weight:800;color:var(--indigo);}
.nav-dd-stat.pwa.done{background:#ecfdf5;}
.nav-dd-stat.pwa.done .v{color:#047857;}
.nav-dd-ref{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:calc(100% - 24px);margin:0 12px 4px;padding:11px 14px;box-sizing:border-box;
  border:1px solid #e8eaf2;border-radius:999px;background:#fff;
  font-size:13.5px;font-weight:700;color:#2a2d3a;cursor:pointer;font-family:inherit;
}
.nav-dd-ref:hover{border-color:#c9d2ff;background:#f8f9ff;color:var(--indigo);}
.nav-dd-ref-ico{font-size:15px;line-height:1;opacity:.85;}
.nav-dd-sec-lab{
  padding:10px 16px 4px;font-size:11.5px;font-weight:800;color:#9aa0b4;
  letter-spacing:.02em;
}
.pwa-install-backdrop{
  display:none;position:fixed;inset:0;z-index:99999;background:rgba(20,22,40,.55);
  align-items:center;justify-content:center;padding:20px;box-sizing:border-box;
  -webkit-overflow-scrolling:touch;
}
.pwa-install-backdrop.show{display:flex !important;}
body.studyroom-open .pwa-install-backdrop.show,
body.shop-open .pwa-install-backdrop.show{display:flex !important;z-index:99999;}
.pwa-install-modal{
  background:#fff;border-radius:16px;max-width:400px;width:100%;padding:18px 18px 16px;
  box-shadow:0 20px 50px rgba(20,24,50,.28);max-height:min(80vh,520px);overflow-y:auto;
  position:relative;z-index:1;
}
.pwa-install-modal h3{margin:0 0 8px;font-size:1.05rem;font-weight:900;}
.pwa-install-modal ol{margin:8px 0 0;padding-left:1.2em;font-size:13.5px;line-height:1.55;color:var(--sub);font-weight:600;}
.pwa-install-modal .mrow{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap;}
/* 학습실 안 iOS 리마인드 안내 (모달 없이 바로 보임) */
.sr-ios-pwa-hint{
  margin:0 0 12px;padding:12px 12px 10px;border-radius:12px;
  background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;
}
.sr-ios-pwa-hint p{margin:0 0 8px;font-size:13px;font-weight:800;line-height:1.45;}
.sr-ios-pwa-hint ol{margin:0 0 10px;padding-left:1.25em;font-size:12.5px;font-weight:700;line-height:1.55;color:#9a3412;}
.sr-ios-pwa-hint li{margin:3px 0;}
.sr-ios-pwa-hint .scorebtn{width:100%;margin-top:2px;}

/* 상단 계정: 아바타 원형 + 이니셜만 (이름·chevron 숨김 → 메뉴 밀림 방지) */
.app-user-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0;
  width:36px;height:36px;padding:0;border-radius:999px;
  border:1.5px solid var(--border);background:#fff;
  color:var(--text);font-weight:800;font-size:13px;line-height:1;cursor:pointer;
  font-family:inherit;max-width:36px;flex-shrink:0;
  box-shadow:0 1px 3px rgba(30,40,80,.04);
  -webkit-tap-highlight-color:transparent;
}
.app-user-btn:hover,.app-user-menu.open .app-user-btn{
  border-color:#C9D2FF;color:var(--indigo);background:#F8F9FF;
}
.app-user-btn .authav-wrap{
  position:relative;width:28px;height:28px;border-radius:50%;flex-shrink:0;
  overflow:hidden;background:linear-gradient(145deg,#c7d2fe,#818cf8);
  display:inline-flex;align-items:center;justify-content:center;
}
.app-user-btn .authav{
  width:28px;height:28px;border-radius:50%;object-fit:cover;background:#eef1ff;
  flex-shrink:0;border:0;display:none;position:absolute;inset:0;
}
.app-user-btn .authav.has-src{display:block;}
.app-user-btn .authav-letter{
  font-size:13px;font-weight:900;color:#fff;letter-spacing:-0.02em;
  line-height:1;user-select:none;text-transform:uppercase;
}
.app-user-btn .authav.has-src + .authav-letter{display:none;}
/* 이름·화살표는 상단 칩에서 숨김 (드롭다운에 전체 표시) */
.app-user-btn .app-user-name,
.app-user-btn .app-user-chevron{display:none !important;}
.app-user-menu{flex-shrink:0;}
.app-user-dropdown{
  display:none;position:fixed;top:0;left:0;z-index:260;
  width:min(92vw,320px);max-width:calc(100vw - 20px);padding:0;border-radius:18px;background:#fff;
  border:1px solid #e8e8ee;box-shadow:0 16px 48px rgba(20,24,40,.18),0 2px 8px rgba(20,24,40,.06);
  overflow-x:hidden;overflow-y:auto;max-height:min(82vh,620px);-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.app-user-menu.open .app-user-dropdown{display:block;}
/* ⛔ 계정 드롭다운 **내용** 스타일(.nav-dd-* · .rank-badge)은 여기 있지 않다 —
 *   `assets/site-nav-auth.css` 의 `.acct-dd …` 한 벌이 앱·허브·랜딩을 함께 그린다
 *   (2026-08-22). 여기 다시 쓰면 「허브는 빨간 로그아웃, 앱은 주황」으로 되돌아간다.
 *   여기 남는 건 **배치**뿐 — 위 `.app-user-dropdown{position:fixed…}` 와 `.portaled`. */
/* 레거시 topbar 관리자 칩(있을 경우 숨김 유지) */
.adminbtn{display:none !important;}

@media(max-width:420px){
  .app-user-btn{width:34px;height:34px;max-width:34px;}
  .app-user-btn .authav-wrap,.app-user-btn .authav{width:26px;height:26px;}
  .app-user-btn .authav-letter{font-size:12px;}
}

/* 인증 UI는 상단 app-topbar 로 통합 (별도 authbar 카드 없음) */
.authav{width:28px;height:28px;border-radius:50%;object-fit:cover;border:0;background:#eef1ff;}
.authhint{display:none !important;}
.localprof{opacity:.85;}
.localprof.disabled-by-auth{opacity:.45;pointer-events:none;}
.adminbtn{border:1px solid #f59e0b;background:#fffbeb;color:#b45309;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:800;cursor:pointer;flex-shrink:0;}
.adminbtn:hover{background:#fef3c7;}
.admin-overlay{position:fixed;inset:0;background:rgba(20,22,40,.5);z-index:120;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(12px,env(safe-area-inset-top)) 12px 20px;display:none;box-sizing:border-box;}
.admin-overlay.show{display:block;}
.admin-panel{background:#fff;border-radius:16px;max-width:920px;width:100%;margin:16px auto;box-shadow:0 16px 48px rgba(20,20,50,.28);overflow:hidden;}
/* 관리자 패널은 전 탭 동일하게 넓은 화면을 쓴다 (예전엔 920/960px 고정이라
   27인치에서도 가운데 좁은 기둥이었다). 표·폼이 과하게 늘어나지 않게 상한을 둔다. */
.admin-panel{max-width:min(1680px,calc(100vw - 24px));}
/* 중복 선지 검수 — 원본 PDF 없이 판정하는 계열(130건) */
.dupq{border:1px solid var(--border);border-radius:12px;background:#fff;padding:12px 14px;}
.dupq-hd{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-bottom:8px;}
.dupq-stem{font-size:13.5px;color:var(--sub);line-height:1.5;margin:0 0 10px;}
.dupq-ch{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:start;}
.dupq-ch .num{font-weight:800;color:var(--muted);font-variant-numeric:tabular-nums;}
.dupq-ch .val{font-size:15px;line-height:1.5;word-break:break-word;}
.dupq-ch .row.dup .val{background:#fff1f2;box-shadow:inset 0 0 0 1px #fda4af;border-radius:6px;padding:1px 5px;}
.dupq-ch .row.ansrow .num{color:var(--ok);}
.dupq-ch mark{background:#fde68a;color:inherit;border-radius:3px;padding:0 2px;font-weight:800;}
.dupq-badge{font-size:11.5px;font-weight:800;border-radius:999px;padding:2px 8px;background:#fff1f2;color:#be123c;}
/* 파싱큐 2단 — 좌 목록 · 우 검수. ⛔ 좁은 화면에서 반드시 1단으로 풀 것:
   minmax(320px,·) 를 그대로 두면 375px 화면에서 가로가 터지고 페이지 스크롤이 막힌다. */
.qa-split{display:grid;grid-template-columns:minmax(300px,26%) 1fr;gap:12px;align-items:start;}
.qa-split > #qaRows{max-height:62vh;overflow-y:auto;border:1px solid var(--border);border-radius:8px;background:#fff;}
@media (max-width:900px){
  .qa-split{grid-template-columns:1fr;}
  /* 안쪽 스크롤 상자를 없애 페이지가 통째로 스크롤되게 한다 */
  .qa-split > #qaRows{max-height:46vh;}
}
/* 좌우 대조 — 원본 문항 밴드 | 사이트에 실린 문항 */
.qacmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start;}
@media (max-width:1100px){ .qacmp{grid-template-columns:1fr;} }
@media (max-width:900px){ .qacmp-body{max-height:none;} .qacmp-pane{min-height:0;} }
.qacmp-pane{border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden;display:flex;flex-direction:column;min-height:280px;}
.qacmp-hd{font-size:12px;font-weight:800;padding:6px 10px;border-bottom:1px solid var(--border);background:#f7f8ff;color:var(--sub);}
.qacmp-body{padding:10px;overflow:auto;max-height:66vh;}
/* 캔버스 위에 크롭 사각형을 겹쳐 그린다 — 「우리가 어디를 잘랐나」가 한눈에 보인다 */
.qacmp-canvaswrap{position:relative;display:inline-block;max-width:100%;}
.qacmp-canvaswrap canvas{max-width:100%;height:auto;display:block;}
/* 단 경계에서 잘린 문항 — 두 조각을 **딱 붙여 한 장처럼** 보이게 한다.
   ⛔ inline-block 끼리는 사이의 공백 문자가 틈으로 보인다. block 으로 바꿔 없앤다.
   (두 조각의 폭 차이는 실측 전량 0.76% — 눈에 띄지 않는다.) */
.qacmp-canvaswrap.is-join,.qacmp-canvaswrap.is-joincont{display:block;}
.qacmp-canvaswrap.is-joincont{margin-top:0;}
.qacmp-rect{position:absolute;border:2px solid rgba(220,38,38,.9);background:rgba(220,38,38,.08);pointer-events:none;box-sizing:border-box;}
.qacmp-rect.ch{border-color:rgba(37,99,235,.9);background:rgba(37,99,235,.08);}
.qacmp-rect > span{position:absolute;top:-9px;left:-2px;font-size:10px;font-weight:800;color:#fff;background:rgba(220,38,38,.92);border-radius:3px;padding:0 4px;white-space:nowrap;}
.qacmp-rect.ch > span{background:rgba(37,99,235,.92);}
.qacmp-ch{display:grid;grid-template-columns:auto 1fr;gap:5px 9px;margin-top:8px;}
.qacmp-ch .num{font-weight:800;color:var(--muted);}
.qacmp-ch .ansmark{color:var(--ok);}
.qa-keys{font-size:11.5px;color:var(--muted);margin-top:8px;}
.qa-keys kbd{border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 4px;font-size:11px;background:#fafafa;}
.admin-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fffdf7,#fff);}
.admin-hd h2{margin:0;font-size:1.15rem;font-weight:800;}
.admin-tabs{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--border);flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;background:#fafaff;scrollbar-width:thin;}
.admin-tab{border:1px solid var(--border);background:#fff;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700;color:var(--sub);cursor:pointer;flex-shrink:0;white-space:nowrap;}
.admin-tab.on{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.admin-tab.tab-reports{border-color:#f59e0b;color:#b45309;background:#fffbeb;}
.admin-tab.tab-reports.on{background:#b45309;color:#fff;border-color:#b45309;}
.admin-quick{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px;}
.admin-quick button{border:1px solid #f59e0b;background:#fffbeb;color:#b45309;border-radius:12px;padding:12px 16px;font-size:14px;font-weight:800;cursor:pointer;flex:1;min-width:140px;text-align:left;}
.admin-quick button:hover{background:#fef3c7;}
.admin-quick button small{display:block;font-weight:600;font-size:12px;opacity:.85;margin-top:4px;}
.admin-body{padding:14px 16px 20px;min-height:280px;}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px;}
.admin-stat{background:#f7f6fb;border:1px solid var(--border);border-radius:12px;padding:12px;}
.admin-stat .n{font-size:1.35rem;font-weight:800;color:var(--indigo);line-height:1.2;}
.admin-stat .l{font-size:12px;color:var(--sub);margin-top:4px;font-weight:600;}
.admin-expboard{margin:16px 0 8px;}
.admin-expboard h3{margin:0 0 10px;font-size:15px;font-weight:800;}
.admin-expboard .subh{margin:16px 0 8px;font-size:13.5px;font-weight:800;color:var(--indigo);}
.admin-barwrap{display:flex;align-items:center;gap:8px;min-width:120px;}
.admin-bar{flex:1;height:8px;background:#e8eaf6;border-radius:99px;overflow:hidden;min-width:60px;}
.admin-bar>i{display:block;height:100%;background:linear-gradient(90deg,#3D5AFE,#7c4dff);border-radius:99px;}
.admin-pct{font-size:12px;font-weight:800;color:var(--indigo);min-width:42px;text-align:right;}
.admin-exp-row{cursor:pointer;}
.admin-exp-row:hover td{background:#f5f7ff;}
.admin-exp-row.open td{background:#eef2ff;}
.admin-exp-drill{margin-top:12px;border:1px solid #c7d2fe;border-radius:14px;background:#f8faff;padding:12px 12px 14px;}
.admin-exp-drill .drill-hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;}
.admin-exp-drill .drill-hd h4{margin:0;font-size:14.5px;font-weight:800;color:#312e81;}
.admin-exp-exam{border:1px solid var(--border);border-radius:12px;background:#fff;padding:10px 12px;margin-bottom:10px;}
.admin-exp-exam:last-child{margin-bottom:0;}
.admin-exp-exam .eh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;}
.admin-exp-exam .eh b{font-size:13.5px;font-weight:800;color:var(--text);}
.admin-exp-exam .emeta{font-size:12px;color:var(--sub);font-weight:700;}
.admin-exp-grid{display:flex;flex-wrap:wrap;gap:6px;}
.admin-exp-chip{width:36px;height:36px;border-radius:10px;border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;cursor:default;user-select:none;}
.admin-exp-chip.ok{background:#ecfdf5;border-color:#6ee7b7;color:#047857;}
.admin-exp-chip.no{background:#fef2f2;border-color:#fca5a5;color:#b91c1c;cursor:pointer;}
.admin-exp-chip.no:hover{background:#fee2e2;box-shadow:0 0 0 2px rgba(185,28,28,.15);}
.admin-exp-chip.sel{outline:2px solid var(--indigo);outline-offset:1px;}
.admin-exp-miss{margin-top:10px;border-top:1px dashed var(--border);padding-top:8px;}
.admin-exp-miss>summary{cursor:pointer;font-size:12.5px;font-weight:800;color:var(--sub);list-style:none;padding:6px 4px;border-radius:8px;user-select:none;}
.admin-exp-miss>summary::-webkit-details-marker{display:none;}
.admin-exp-miss>summary::before{content:'▸ ';color:var(--indigo);}
.admin-exp-miss[open]>summary::before{content:'▾ ';}
.admin-exp-miss>summary:hover{background:#eef2ff;color:#312e81;}
.admin-exp-miss-body{padding:4px 0 2px;}
.admin-exp-miss-item{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #f0f0f5;}
.admin-exp-miss-item:last-child{border-bottom:0;}
.admin-exp-miss-item .ql{flex:1;min-width:140px;font-size:13px;font-weight:700;line-height:1.4;}
.admin-exp-miss-item .acts{display:flex;gap:6px;flex-wrap:wrap;}
.admin-exp-miss-item .acts button{border-radius:8px;padding:6px 10px;font-size:12px;font-weight:800;cursor:pointer;border:1px solid var(--border);background:#fff;}
.admin-exp-miss-item .acts .gen{border-color:#a7f3d0;background:#ecfdf5;color:#047857;}
.admin-exp-miss-item .acts .go{border-color:#c7d2fe;background:#eef2ff;color:#3730a3;}
.admin-exp-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--sub);font-weight:700;margin:0 0 10px;}
.admin-exp-legend span{display:inline-flex;align-items:center;gap:5px;}
.admin-exp-legend i{width:12px;height:12px;border-radius:4px;display:inline-block;}
.admin-exp-legend .lg-ok{background:#6ee7b7;}
.admin-exp-legend .lg-no{background:#fca5a5;}
.admin-sched-card{background:#f7f6fb;border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin:12px 0;line-height:1.55;}
.admin-sched-card h4{margin:0 0 8px;font-size:14px;font-weight:800;}
.admin-runlog{max-height:280px;overflow-y:auto;margin-top:8px;}
.admin-runlog tr.fail td{background:#fef2f2;}
.admin-runlog tr.partial td{background:#fffbeb;}
.admin-runlog tr.ok td{background:#f0fdf4;}
.admin-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center;}
.admin-tools input{border:1px solid var(--border);border-radius:8px;padding:7px 10px;font-size:13px;outline:none;background:#fff;}
.admin-table{width:100%;border-collapse:collapse;font-size:13px;}
.admin-table th,.admin-table td{border-bottom:1px solid var(--border);padding:8px 6px;text-align:left;vertical-align:top;}
.admin-table th{color:var(--sub);font-weight:700;font-size:12px;background:#fff;}
.admin-table td{overflow-wrap:anywhere;word-break:keep-all;}
.admin-actions{display:flex;gap:6px;flex-wrap:wrap;}.admin-actions .admin-q-link,.admin-actions a.admin-q-link{border:1px solid var(--border);background:#fff;border-radius:8px;padding:4px 8px;font-size:12px;cursor:pointer;font-weight:600;color:var(--indigo);text-decoration:none;display:inline-flex;align-items:center;}.admin-actions .admin-q-link:hover{background:#edefff;border-color:#c5c9ff;}
.admin-actions button{border:1px solid var(--border);background:#fff;border-radius:8px;padding:4px 8px;font-size:12px;cursor:pointer;font-weight:600;}
.admin-actions button.danger{color:var(--no);border-color:#f5c2be;}
.admin-actions button.ent-grant,
.admin-actions button.scorebtn,
.admin-actions button.primary{
  background:var(--indigo)!important;color:#fff!important;border-color:var(--indigo)!important;
  font-weight:800;padding:8px 14px;box-shadow:0 2px 8px rgba(76,99,246,.25);
}
.admin-actions button.ent-grant:hover,
.admin-actions button.scorebtn:hover,
.admin-actions button.primary:hover{filter:brightness(1.06);}
/* 이용권 지급 폼 */
.admin-ent-form{max-width:520px;}
.admin-ent-form .ent-hd{margin:0 0 6px;font-size:1.15rem;font-weight:900;letter-spacing:-.02em;color:var(--text);}
.admin-ent-form .ent-lead{margin:0 0 14px;font-size:13px;line-height:1.5;color:var(--sub);font-weight:600;}
.admin-ent-form .ent-card{
  background:#f8fafc;border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:16px;
}
.admin-ent-form .ent-card .k{font-size:11.5px;font-weight:800;color:var(--sub);margin:0 0 8px;letter-spacing:.02em;}
.admin-ent-form .ent-chips{display:flex;flex-wrap:wrap;gap:6px;}
.admin-ent-form .ent-chip{
  display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;
  background:#fff;border:1px solid #c9d2ff;font-size:12px;font-weight:700;color:var(--text);
}
.admin-ent-form .ent-chip .t{color:var(--indigo);font-weight:800;}
.admin-ent-form .ent-chip .d{color:var(--muted);font-weight:600;font-size:11px;}
.admin-ent-form .ent-empty{font-size:13px;color:var(--muted);font-weight:600;}
.admin-ent-form .ent-field{margin:0 0 14px;}
.admin-ent-form .ent-field>label{
  display:block;font-size:12.5px;font-weight:800;color:var(--text);margin:0 0 6px;
}
.admin-ent-form .ent-field select,
.admin-ent-form .ent-field input[type="number"],
.admin-ent-form .ent-field input[type="date"],
.admin-ent-form .ent-field input[type="text"]{
  display:block;width:100%;box-sizing:border-box;
  border:1.5px solid var(--border);border-radius:10px;padding:10px 12px;
  font-size:14px;font-weight:600;background:#fff;color:var(--text);font-family:inherit;
}
.admin-ent-form .ent-field select:focus,
.admin-ent-form .ent-field input:focus{outline:none;border-color:var(--indigo-soft);box-shadow:0 0 0 3px rgba(76,99,246,.12);}
.admin-ent-form .ent-seg{display:flex;gap:6px;flex-wrap:wrap;}
.admin-ent-form .ent-seg button{
  flex:1;min-width:88px;border:1.5px solid var(--border);background:#fff;border-radius:10px;
  padding:10px 8px;font-size:12.5px;font-weight:800;color:var(--sub);cursor:pointer;line-height:1.25;
}
.admin-ent-form .ent-seg button.on{background:#eef1ff;border-color:var(--indigo);color:var(--indigo);}
.admin-ent-form .ent-seg button.rev.on{background:#fef2f2;border-color:#f5c2be;color:#b91c1c;}
.admin-ent-form .ent-days{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.admin-ent-form .ent-days button{
  border:1px solid var(--border);background:#fff;border-radius:999px;padding:6px 12px;
  font-size:12.5px;font-weight:800;color:var(--sub);cursor:pointer;
}
.admin-ent-form .ent-days button.on{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.admin-ent-form .ent-preview{
  margin:4px 0 16px;padding:12px 14px;border-radius:12px;border:1px dashed #a5b4fc;background:#f8f9ff;
  font-size:13px;line-height:1.5;color:var(--text);font-weight:600;
}
.admin-ent-form .ent-preview b{color:var(--indigo);}
.admin-ent-form .ent-foot{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding-top:4px;
  position:sticky;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 28%);
  padding-bottom:4px;
}
.admin-ent-form .ent-foot .scorebtn{
  flex:1;min-width:140px;padding:12px 16px;font-size:15px;border-radius:12px;
  border:0;background:var(--indigo);color:#fff;font-weight:800;cursor:pointer;
  box-shadow:0 6px 16px rgba(76,99,246,.28);
}
.admin-ent-form .ent-foot .scorebtn:hover{filter:brightness(1.05);}
.admin-ent-form .ent-foot .scorebtn.danger{background:#b91c1c;box-shadow:0 6px 16px rgba(185,28,28,.25);}
.admin-ent-form .ent-foot .resetbtn{padding:12px 16px;border-radius:12px;}
.admin-empty{color:var(--sub);font-size:13.5px;padding:20px 8px;text-align:center;line-height:1.55;}
.admin-note{font-size:12.5px;color:var(--muted);line-height:1.55;margin-top:8px;}
.admin-badge{display:inline-block;font-size:11px;font-weight:800;color:#b45309;background:#fffbeb;border:1px solid #fcd34d;border-radius:999px;padding:2px 8px;}
.admin-memoprev{font-size:12px;line-height:1.45;color:var(--text);max-width:180px;}
.admin-memoprev .n{font-weight:800;color:#0f766e;font-size:11px;margin-bottom:2px;}
.admin-memoprev .t{color:var(--sub);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* 관리자 개인학습메모: 회원별 접기 */
.admin-usermemo-fold{border:1px solid #a7f3d0;border-radius:12px;background:#fff;margin-bottom:8px;overflow:hidden;}
.admin-usermemo-fold>summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 14px;user-select:none;background:linear-gradient(180deg,#f0fdf4,#fff);}
.admin-usermemo-fold>summary::-webkit-details-marker{display:none;}
.admin-usermemo-fold>summary::before{content:'▸'; color:#047857;font-weight:800;margin-right:2px;}
.admin-usermemo-fold[open]>summary::before{content:'▾';}
.admin-usermemo-fold>summary:hover{background:#ecfdf5;}
.admin-usermemo-fold .um-name{font-weight:800;font-size:14px;color:var(--text);}
.admin-usermemo-fold .um-mail{font-size:12px;color:var(--muted);font-weight:600;}
.admin-usermemo-fold .um-cnt{font-size:12px;font-weight:800;color:#047857;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:999px;padding:2px 9px;}
.admin-usermemo-fold .um-prev{flex:1 1 100%;font-size:12.5px;color:var(--sub);line-height:1.4;margin:0;}
.admin-usermemo-body{padding:4px 12px 12px;border-top:1px solid #d1fae5;}
.admin-memopanel{max-width:560px;}

/* 상단 공지 배너 */
.site-notice-bar{margin:0 0 10px;display:flex;flex-direction:column;gap:8px;}
.site-notice{
  display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:12px;
  border:1px solid #c9d2ff;background:#eef1ff;font-size:13.5px;line-height:1.45;font-weight:600;
  color:var(--text);box-shadow:var(--shadow-sm);
}
.site-notice.warn{background:#fff7ed;border-color:#fed7aa;color:#9a3412;}
.site-notice.promo{background:#ecfdf5;border-color:#a7f3d0;color:#065f46;}
.site-notice.success{background:#ecfdf5;border-color:#6ee7b7;color:#047857;}
.site-notice .sn-body{flex:1;min-width:0;}
.site-notice .sn-title{font-weight:900;margin:0 0 2px;font-size:14px;}
.site-notice .sn-text{margin:0;color:inherit;opacity:.92;font-weight:600;}
.site-notice .sn-link{display:inline-block;margin-top:4px;font-weight:800;color:var(--indigo);text-decoration:underline;}
.site-notice.warn .sn-link{color:#c2410c;}
.site-notice .sn-x{
  flex-shrink:0;border:0;background:rgba(255,255,255,.7);border-radius:999px;width:28px;height:28px;
  font-size:16px;font-weight:700;cursor:pointer;line-height:1;color:inherit;
}
/* 회원 등급 배지 */
.sr-rank-chip{
  display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:2px 8px;
  font-size:11px;font-weight:800;border-radius:999px;vertical-align:middle;
  background:#fff7ed;color:#c2410c;border:1px solid #fed7aa;line-height:1.3;
}
.sr-rank-chip.master{background:#f5f3ff;color:#6d28d9;border-color:#d8b4fe;}
.sr-week.vip{border-color:#fdba74;background:linear-gradient(160deg,#fffbf5,#fff7ed);}
.sr-week.vip h4{color:#c2410c;}
.sr-week.master{border-color:#c4b5fd;background:linear-gradient(160deg,#faf8ff,#f5f3ff);}
.sr-week.master h4{color:#6d28d9;}
.sr-weak.vip .sr-sec::after{content:' · 확장';font-weight:800;color:#c2410c;font-size:12px;}
.sr-weak.master .sr-sec::after{content:' · 마스터';font-weight:800;color:#6d28d9;font-size:12px;}
.sr-hero.master-hero{box-shadow:inset 0 0 0 1px rgba(167,139,250,.35);}
.cmtitem.rank-hi.rank-vet{border-left-color:#ea580c;}
.cmtitem.rank-master{box-shadow:0 0 0 1px rgba(124,58,237,.12);}
.admin-qrow.quality-hot{background:#fff7ed;}

/* 관리자 매뉴얼 */
.admin-manual{max-width:820px;}
.admin-manual h3{margin:0 0 8px;font-size:16px;}
.admin-manual h4{margin:18px 0 8px;font-size:14px;font-weight:900;color:var(--indigo);border-bottom:1px solid var(--border);padding-bottom:6px;}
.admin-manual p,.admin-manual li{font-size:13.5px;line-height:1.55;color:var(--text);}
.admin-manual .am-lead{color:var(--sub);font-weight:600;margin:0 0 14px;}
.admin-manual .am-card{border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:#fafbff;margin:0 0 12px;}
.admin-manual .am-card b{font-weight:800;}
.admin-manual code{font-size:12px;background:#eef1ff;padding:1px 6px;border-radius:6px;}
.admin-manual .am-steps{margin:0;padding-left:1.2em;}
.admin-manual .am-steps li{margin:4px 0;}
.admin-manual .am-check{border:1px solid #c9d2ff;border-radius:12px;padding:12px;background:#fff;margin:10px 0 16px;}
.admin-manual .am-check-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
.admin-manual .am-row{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px solid #f1f5f9;font-size:13px;}
.admin-manual .am-row:last-child{border-bottom:0;}
.admin-manual .am-ok{color:#047857;font-weight:800;min-width:52px;}
.admin-manual .am-fail{color:#b91c1c;font-weight:800;min-width:52px;}
.admin-manual .am-warn{color:#b45309;font-weight:800;min-width:52px;}
.admin-manual .am-skip{color:var(--muted);font-weight:800;min-width:52px;}
.admin-manual .am-lab{flex:1;min-width:0;font-weight:600;}
.admin-manual .am-detail{font-size:12px;color:var(--sub);font-weight:600;margin-top:2px;}
.admin-manual table.am-tbl{width:100%;border-collapse:collapse;font-size:12.5px;margin:8px 0;}
.admin-manual table.am-tbl th,.admin-manual table.am-tbl td{border:1px solid var(--border);padding:7px 8px;text-align:left;vertical-align:top;}
.admin-manual table.am-tbl th{background:#f8fafc;font-weight:800;color:var(--sub);}
.admin-manual .am-toc{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;}
.admin-manual .am-toc button{border:1px solid var(--border);background:#fff;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--sub);cursor:pointer;}
.admin-manual .am-toc button:hover{border-color:var(--indigo);color:var(--indigo);}

/* 주간 리포트 · 취약 추천 · 리마인드 */
.sr-week{border:1px solid #c9d2ff;background:linear-gradient(160deg,#f8f9ff,#eef1ff);border-radius:14px;padding:12px 14px;margin:0 0 14px;}
.sr-week h4{margin:0 0 6px;font-size:14px;font-weight:900;color:var(--indigo);}
.sr-week .sr-week-meta{font-size:12.5px;color:var(--sub);font-weight:600;margin:0 0 10px;line-height:1.45;}
.sr-week-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 10px;}
@media(max-width:420px){.sr-week-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.sr-week-tile{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:8px 8px 7px;text-align:center;}
.sr-week-tile .n{font-size:1.15rem;font-weight:900;color:var(--indigo);line-height:1.1;}
.sr-week-tile .n.warn{color:#b45309;}
.sr-week-tile .n.ok{color:#047857;}
.sr-week-tile .l{font-size:11px;font-weight:700;color:var(--sub);margin-top:2px;}
.sr-week-bars{display:flex;align-items:flex-end;gap:4px;height:42px;margin:4px 0 2px;}
.sr-week-bars .b{flex:1;background:#c7d2fe;border-radius:4px 4px 2px 2px;min-height:3px;position:relative;}
.sr-week-bars .b.today{background:var(--indigo);}
.sr-week-days{display:flex;gap:4px;font-size:10px;font-weight:700;color:var(--muted);justify-content:space-between;}
.sr-week-days span{flex:1;text-align:center;}
.sr-weak{margin:0 0 14px;}
.sr-weak-list{display:flex;flex-direction:column;gap:8px;}
.sr-weak-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid #fed7aa;background:#fffbeb;text-align:left;width:100%;cursor:pointer;font:inherit;color:inherit;}
.sr-weak-item:hover{border-color:#fdba74;background:#fff7ed;}
.sr-weak-item .wi{flex:1;min-width:0;}
.sr-weak-item .wi b{display:block;font-size:13.5px;font-weight:800;}
.sr-weak-item .wi span{font-size:12px;color:var(--sub);font-weight:600;}
.sr-weak-item .wa{font-size:1.05rem;font-weight:900;color:#c2410c;white-space:nowrap;}
.sr-weak-item .wa.mid{color:#b45309;}
.sr-weak-item .wa.ok{color:#047857;}
.sr-weak-empty{font-size:13px;color:var(--sub);font-weight:600;padding:8px 2px;}
.sr-todaypack{border:1px solid #a7f3d0;background:linear-gradient(160deg,#ecfdf5,#f0fdf4);border-radius:14px;padding:12px 14px;margin:0 0 14px;}
.sr-todaypack h4{margin:0 0 4px;font-size:14px;font-weight:900;color:#047857;}
.sr-todaypack .tp-meta{font-size:12.5px;color:#065f46;font-weight:600;margin:0 0 10px;line-height:1.45;}
.sr-todaypack .tp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px;}
.sr-todaypack .tp-chip{font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:999px;background:#fff;border:1px solid #a7f3d0;color:#047857;}
.sr-todaypack .tp-btns{display:flex;flex-wrap:wrap;gap:8px;}
/* 맞춤 학습 허브 */
.sr-smart{display:flex;flex-direction:column;gap:8px;margin:0 0 14px;}
.sr-smart-card{
  display:block;width:100%;text-align:left;border:1px solid var(--border);background:#fff;
  border-radius:14px;padding:14px 14px 12px;cursor:pointer;font-family:inherit;box-sizing:border-box;
  box-shadow:var(--shadow-sm);
}
.sr-smart-card:hover{border-color:var(--indigo-soft);background:#fafbff;}
.sr-smart-card.primary{
  border-color:#c9d2ff;background:linear-gradient(145deg,#f4f6ff,#eef1ff);
  box-shadow:0 6px 18px rgba(76,99,246,.10);
}
.sr-smart-card .sk{font-size:11px;font-weight:800;color:var(--indigo);letter-spacing:.02em;margin:0 0 4px;}
.sr-smart-card .st{font-size:15px;font-weight:900;color:var(--text);margin:0 0 4px;letter-spacing:-.02em;}
.sr-smart-card .sm{font-size:12.5px;font-weight:600;color:var(--sub);line-height:1.45;margin:0;}
.sr-smart-card .sm b{color:var(--indigo);font-weight:800;}
.sr-smart-card .schips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;}
.sr-smart-card .schip{
  font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px;
  background:#fff;border:1px solid #dfe3f0;color:#5b6178;
}
.sr-smart-card.primary .schip{border-color:#c9d2ff;color:var(--indigo);background:rgba(255,255,255,.85);}
.sr-manual-grid{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;}
.sr-manual-grid button{
  width:100%;text-align:left;border:1px solid var(--border);background:#fff;border-radius:12px;
  padding:12px 14px;font-family:inherit;cursor:pointer;font-weight:700;font-size:14px;color:var(--text);
}
.sr-manual-grid button:hover{border-color:var(--indigo-soft);background:#f8f9ff;}
.sr-manual-grid button span{display:block;font-size:12px;font-weight:600;color:var(--sub);margin-top:3px;}
.coupon-box{border:1px dashed #c9d2ff;border-radius:12px;padding:12px;margin:10px 0;background:#f8f9ff;}
.coupon-box label{display:block;font-size:12.5px;font-weight:800;margin-bottom:6px;color:var(--sub);}
.pay-summary{margin:0 0 12px;}
.pay-summary .pay-balance{font-size:12.5px;font-weight:700;color:var(--sub);margin:0 0 10px;line-height:1.45;}
.pay-summary .pay-balance .exp{color:#b45309;font-weight:800;}
.pay-summary .pay-row{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:var(--text);margin:4px 0;}
.pay-summary .pay-row.mute{color:var(--muted);font-weight:600;font-size:13px;}
.pay-summary .pay-row.total{margin-top:10px;padding-top:10px;border-top:1px dashed #cbd5e1;font-size:1.15rem;font-weight:900;color:var(--indigo);}
.pay-summary .pay-check{display:flex;align-items:center;gap:8px;margin:10px 0 6px;font-size:13.5px;font-weight:800;color:var(--text);cursor:pointer;user-select:none;}
.pay-summary .pay-check input{width:18px;height:18px;accent-color:var(--indigo);}
.pay-summary .pay-adjust{display:none;margin:6px 0 8px;align-items:center;gap:8px;flex-wrap:wrap;}
.pay-summary .pay-adjust.show{display:flex;}
.pay-summary .pay-adjust input[type=number]{width:100px;padding:7px 8px;border:1px solid var(--border);border-radius:8px;font-weight:800;}
.pay-coupon-fold{margin-top:8px;border-top:1px dashed #e2e8f0;padding-top:10px;}
.pay-coupon-fold>summary{cursor:pointer;font-size:13px;font-weight:800;color:var(--indigo);list-style:none;user-select:none;}
.pay-coupon-fold>summary::-webkit-details-marker{display:none;}
.pay-coupon-fold>summary::before{content:'▸ '; }
.pay-coupon-fold[open]>summary::before{content:'▾ '; }
.pay-coupon-fold .pay-coupon-body{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.pay-coupon-fold .pay-coupon-body input[type=text]{flex:1;min-width:140px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font-weight:700;text-transform:uppercase;}
.pay-coupon-fold .pay-coupon-body select{padding:8px;border:1px solid var(--border);border-radius:8px;font-weight:700;display:none;}
.pay-coupon-fold .pay-coupon-body select.show{display:inline-block;}

.funnel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;margin:10px 0;}
.funnel-tile{border:1px solid var(--border);border-radius:12px;padding:10px;background:#fafbff;text-align:center;}
.funnel-tile .n{font-size:1.25rem;font-weight:900;color:var(--indigo);}
.funnel-tile .l{font-size:11px;font-weight:700;color:var(--sub);margin-top:2px;}

.cmtitem.rank-hi{border-left:3px solid #c2410c;background:linear-gradient(90deg,#fff7ed,#fff);}
.cmtitem.rank-master{border-left:3px solid #7c3aed;background:linear-gradient(90deg,#f5f3ff,#fff);}
.cmtmeta .rank-badge{margin-left:4px;font-size:10px;padding:1px 6px;}
.sr-priv{font-size:12.5px;line-height:1.5;color:var(--sub);margin:0;padding-left:0;list-style:none;}
.sr-priv li{margin:4px 0;padding-left:2px;}
.sr-priv .on{color:#047857;font-weight:800;}
.sr-priv .off{color:var(--muted);}
/* 활동 등급 카드 */
.sr-rankcard{border:1px solid #c9d2ff;background:linear-gradient(180deg,#f7f8ff 0%,#fff 48px);}
.sr-rankcard .sr-set-title{font-size:14px;font-weight:900;color:var(--indigo-deep);margin:0 0 6px;display:block;}
.sr-rank-now{display:flex;align-items:center;gap:12px;padding:10px 12px;margin:0 0 10px;border-radius:12px;background:#fff;border:1px solid var(--border-soft);}
.sr-rank-now .rank-badge{font-size:13px;padding:4px 12px;}
.sr-rank-now-meta{min-width:0;flex:1;}
.sr-rank-now-label{font-size:14px;font-weight:800;color:var(--text);line-height:1.3;}
.sr-rank-now-stats{font-size:12px;color:var(--sub);font-weight:600;margin-top:3px;line-height:1.4;}
.sr-rank-ladder{display:flex;flex-wrap:wrap;align-items:center;gap:4px 2px;margin:0 0 12px;padding:8px 4px;justify-content:center;}
.sr-rank-step{font-size:11.5px;font-weight:700;color:var(--muted);padding:3px 7px;border-radius:999px;border:1px solid transparent;line-height:1.3;}
.sr-rank-step.past{color:var(--indigo);background:#eef1ff;border-color:#d4dbff;}
.sr-rank-step.on{color:#fff;background:var(--indigo);border-color:var(--indigo);font-weight:900;box-shadow:0 2px 8px rgba(61,90,254,.28);}
.sr-rank-arrow{color:#c5cae9;font-size:12px;font-weight:700;padding:0 1px;}
.sr-rank-next{margin:0 0 12px;padding:12px;border-radius:12px;background:#fafbff;border:1px solid var(--border-soft);}
.sr-rank-next-title{font-size:13px;font-weight:800;color:var(--text);margin:0 0 10px;line-height:1.45;}
.sr-rank-or{display:inline;font-size:12px;font-weight:700;color:var(--indigo);}
.sr-rank-metric{margin:0 0 10px;}
.sr-rank-metric:last-child{margin-bottom:0;}
.sr-rank-metric-hd{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;font-weight:700;color:var(--sub);margin-bottom:4px;flex-wrap:wrap;}
.sr-rank-metric-hd .ok{color:#047857;font-weight:800;}
.sr-rank-bar{height:8px;border-radius:999px;background:#e8ecf8;overflow:hidden;}
.sr-rank-bar>i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--indigo),#7c8cff);min-width:0;transition:width .25s ease;}
.sr-rank-perks{margin:0 0 4px;}
.sr-rank-perks-title{font-size:12.5px;font-weight:900;color:var(--text);margin:10px 0 6px;}
.sr-rank-perks-title.muted{color:var(--muted);font-weight:800;}
.sr-rank-from{font-size:11px;font-weight:700;color:var(--muted);margin-left:4px;}
.sr-rank-table{width:100%;border-collapse:collapse;font-size:11.5px;margin:8px 0 0;}
.sr-rank-table th,.sr-rank-table td{padding:7px 6px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top;line-height:1.4;}
.sr-rank-table th{font-weight:800;color:var(--sub);background:#f7f8fc;font-size:11px;}
.sr-rank-table tr.me td{background:#eef1ff;font-weight:700;}
.sr-rank-table .cond{color:var(--sub);font-weight:600;white-space:normal;}
.sr-rank-table .perk{color:var(--text);font-weight:600;}
.sr-rank-fold{margin-top:10px;border-top:1px dashed #e2e8f0;padding-top:8px;}
.sr-rank-fold>summary{cursor:pointer;font-size:12.5px;font-weight:800;color:var(--indigo);list-style:none;user-select:none;}
.sr-rank-fold>summary::-webkit-details-marker{display:none;}
.sr-rank-fold>summary::before{content:'▸ ';}
.sr-rank-fold[open]>summary::before{content:'▾ ';}
.sr-rank-honest{font-size:12px;line-height:1.5;color:var(--muted);margin:8px 0 0;padding:8px 10px;background:#f8fafc;border-radius:8px;border:1px solid #eef2f7;}
.sn-target{font-size:11px;font-weight:700;color:var(--muted);margin-top:2px;}

/* 관리자 · 회원 학습내역 */
.admin-learn-sum{font-size:12px;line-height:1.4;color:var(--text);}
.admin-learn-sum .n{font-weight:800;color:var(--indigo);}
.admin-learn-sum .m{font-size:11px;color:var(--muted);font-weight:600;margin-top:2px;}
.admin-learn-sum .empty{color:var(--muted);}
.admin-learn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin:10px 0 14px;}
.admin-learn-tile{border:1px solid var(--border);background:#fafbff;border-radius:12px;padding:10px 10px 8px;}
.admin-learn-tile .tn{font-size:1.2rem;font-weight:900;color:var(--indigo);line-height:1.15;}
.admin-learn-tile .tn.warn{color:#b45309;}
.admin-learn-tile .tn.ok{color:#047857;}
.admin-learn-tile .tl{font-size:11px;font-weight:700;color:var(--sub);margin-top:3px;}
.admin-learn-sec{margin:14px 0 6px;font-size:12.5px;font-weight:800;color:var(--sub);}
.admin-learn-meta{font-size:12.5px;color:var(--sub);line-height:1.5;margin:0 0 8px;}
.admin-learn-list{max-height:220px;overflow-y:auto;border:1px solid var(--border);border-radius:10px;background:#fff;}
.admin-learn-list table{margin:0;}
.admin-learn-list th{position:sticky;top:0;z-index:1;}
.admin-learn-panel{max-width:720px;}
.admin-memolist{display:flex;flex-direction:column;gap:8px;max-height:42vh;overflow-y:auto;margin:10px 0 12px;}
.admin-memoitem{background:#f6fffb;border:1px solid #a7f3d0;border-radius:10px;padding:10px 12px;}
.admin-memometa{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:4px;font-size:11.5px;color:var(--muted);}
.admin-memometa .d{font-weight:700;color:#0f766e;}
.admin-memotext{font-size:13.5px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;color:var(--text);}
.admin-memoform textarea{width:100%;border:1px solid #a7f3d0;border-radius:10px;padding:10px;font-size:13.5px;min-height:72px;font-family:inherit;resize:vertical;outline:none;box-sizing:border-box;}
.admin-memoform textarea:focus{border-color:#34d399;box-shadow:0 0 0 3px rgba(16,185,129,.12);}
.admin-memoform .row{display:flex;gap:8px;justify-content:flex-end;margin-top:8px;flex-wrap:wrap;}
/* 포인트·메일 탭: 긴 로그 접기 */
.admin-pts-fold{margin:12px 0 14px;border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden;}
.admin-pts-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;font-size:14px;font-weight:800;color:var(--ink);user-select:none;background:linear-gradient(180deg,#fafbff,#fff);}
.admin-pts-fold>summary::-webkit-details-marker{display:none;}
.admin-pts-fold>summary::before{content:'▶';font-size:10px;color:var(--muted);margin-right:2px;transition:transform .15s;}
.admin-pts-fold[open]>summary::before{transform:rotate(90deg);}
.admin-pts-fold-title{font-weight:900;}
.admin-pts-fold-sum{font-size:12.5px;font-weight:700;color:var(--muted);}
.admin-pts-fold-body{padding:0 12px 12px;border-top:1px solid var(--border);}
.admin-pts-fold-body .admin-empty{margin:10px 0 0;}
.admin-pts-fold-body .admin-table{margin-top:10px;}
body.admin-open{overflow:hidden;position:fixed;width:100%;}
/* 관리자 전용 페이지 (?admin=...) — 오버레이가 아니라 전체 화면 페이지 */
body.admin-page{overflow:auto;position:static;width:auto;padding:0;background:#f0f1f8;}
/* ⛔ 화이트리스트(.wrap/.overlay)로 숨기면 body 직계에 붙은 나머지
   (#solveShell · .count · #siteFooter …)가 그대로 남아 관리자 패널을
   화면 밖 아래로 밀어낸다 = 「패널이 안 열린다」. 반대로 필요한 것만 남긴다
   (html.shop-landing-boot 과 동일 패턴). 새 요소를 여기 추가할 때만 예외 등록. */
body.admin-page > *:not(#adminOverlay):not(.toast):not(.ia-backdrop){display:none !important;}
/* 관리자 전용 페이지에서도 토스트는 보이게 (버튼 피드백) */
body.admin-page > .toast{display:block !important;z-index:400;}
/* admin URL 부트: body.admin-page 붙기 전에도 목록 숨김 */
html.admin-boot body:not(.admin-page) > *:not(.toast):not(#adminOverlay){visibility:hidden !important;}
html.admin-boot body.admin-page{visibility:visible;}
/* 랜딩→이용권만: 문항 목록 숨김 (닫으면 랜딩 복귀) */
/* 랜딩·embed 이용권: shop 외 전부 제거
   ⛔ body.solve-play #solveMini.solve-mini {display:flex!important} 보다
   특이도·범위를 강하게 잡아 풀이 UI가 남지 않게 함 */
html.shop-landing-boot,
html.shop-landing-boot body{
  background:#eef0f6 !important;
  min-height:100% !important;
  overflow:hidden !important;
}
/* 핵: body 직계 자식 중 shop 오버레이만 남김 */
html.shop-landing-boot body > *:not(#shopOverlay):not(.shop-overlay){
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  max-height:0 !important;
  overflow:hidden !important;
}
/* 풀이 강제표시 규칙 완전 무력화 (id 포함) */
html.shop-landing-boot body.solve-play #solveShell,
html.shop-landing-boot body.solve-play #solveShell.solve-shell,
html.shop-landing-boot body.solve-play #solveMini,
html.shop-landing-boot body.solve-play #solveMini.solve-mini,
html.shop-landing-boot body.solve-play #solveNav,
html.shop-landing-boot body.solve-play #solveNav.solve-nav,
html.shop-landing-boot body.solve-play #list,
html.shop-landing-boot body.solve-play #listModeBar,
html.shop-landing-boot body.solve-play .solve-mini,
html.shop-landing-boot body.solve-play .solve-nav,
html.shop-landing-boot body.solve-play .solve-mini-prog,
html.shop-landing-boot body.solve-play .solve-ink-bar,
html.shop-landing-boot body.solve-play .wrap,
html.shop-landing-boot body.solve-hub .wrap,
html.shop-landing-boot #solveShell,
html.shop-landing-boot #solveMini,
html.shop-landing-boot #list{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
/* 폰에서는 필기 UI 자체를 띄우지 않는다 (S2-INK-M).
   ⛔ 버튼이 본문 위에 뜨면 선지 중앙 탭을 가로챈다 — 그림 문항에서 실측됐다.
      손가락 하나로는 스크롤과도 겹친다. 데이터는 그대로 두고 큰 화면에서만 쓴다.
   ⛔ 이 블록은 `body.solve-play .solve-ink-bar{display:inline-flex!important}` 류보다
      **뒤에** 있어야 한다 — 특이도가 같으면 순서가 이긴다. 위로 옮기지 말 것. */
@media (max-width:767px){
  body .solve-ink-bar,
  body #solveInkBar,
  body #inkToggleBtn,
  body #solveInkMiniBtn,
  body .ink-tools,
  body .q-ink-canvas{display:none !important;pointer-events:none !important;}
}
html.shop-landing-boot body.shop-open #shopOverlay,
html.shop-landing-boot body.shop-open #shopOverlay.shop-overlay,
html.shop-landing-boot body.shop-open .shop-overlay{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  background:#eef0f6 !important;
  position:fixed !important;
  inset:0 !important;
  z-index:100000 !important;
  max-height:none !important;
  overflow:auto !important;
}
html.shop-landing-boot body.shop-open .shop-overlay .shop-panel{
  margin:auto;
  max-height:min(96vh,920px);
}

body.admin-page .admin-overlay{
  display:block !important; position:relative; inset:auto; background:transparent;
  padding:max(10px, env(safe-area-inset-top)) 12px max(16px, env(safe-area-inset-bottom));
  min-height:100vh; z-index:1; overflow:visible;
}
body.admin-page .admin-panel{
  max-width:960px; margin:0 auto 24px; border-radius:16px; min-height:calc(100vh - 40px);
  box-shadow:0 8px 28px rgba(20,20,50,.12);
}
/* ⛔ body.admin-page .admin-panel{max-width:960px}(위) 가 특이도 0-2-1 이라
   .admin-panel(0-1-0) 규칙으로는 못 이긴다 — 같은 특이도로 덮어써야 한다.
   검수 탭만 더 넓게 (좌우 대조에 폭이 필요하다). */
body.admin-page .admin-panel{ max-width:min(1680px, calc(100vw - 24px)); }
body.admin-page .admin-panel.admin-panel-wide{ max-width:min(2100px, calc(100vw - 24px)); }
.card.card-hl{outline:3px solid var(--indigo); box-shadow:0 0 0 6px rgba(61,90,254,.18); animation:cardHl 1.8s ease;}
@keyframes cardHl{0%{box-shadow:0 0 0 10px rgba(61,90,254,.35)}100%{box-shadow:0 0 0 0 rgba(61,90,254,0)}}


/* 내 학습실 — 랜딩과 같은 소프트 인디고 톤 */
.studyroom-btn{border:1px solid var(--border-soft);background:#eef1ff;color:var(--indigo);border-radius:var(--radius-pill);padding:8px 13px;font-size:13px;font-weight:800;cursor:pointer;flex-shrink:0;box-shadow:var(--shadow-sm);}
.studyroom-btn:hover{background:#e4e9ff;border-color:var(--indigo-soft);}
/* ⛔ `.studyroom-overlay` 는 **학습실과 학습 설정 두 오버레이가 공유**하는 클래스다.
   `body.studyroom-open .studyroom-overlay` 로 쓰면 학습실을 여는 순간 **빈 학습 설정
   오버레이까지 display:flex** 가 되어, 같은 z-index·같은 자리에 DOM 뒤라서 위에 깔린다.
   그러면 ① 한 번도 렌더 안 된 자리표(「불러오는 중…」)가 모달처럼 보이고
   ② 학습실 X 를 눌러도 겹친 껍데기의 X 가 먹어 `acctset-open` 이 없으니 아무 일도 안 하고
   ③ 그 아래 화면 전체가 조작 불가가 된다 (2026-08-11 운영자 「닫힘버튼 안눌림」).
   ⛔ 이 자리에 클래스 선택자를 다시 쓰지 말 것 — **id 로 가리킨다**. */
.studyroom-overlay{
  position:fixed;inset:0;z-index:115;background:rgba(30,40,90,.42);display:none;
  overflow:hidden;box-sizing:border-box;
  /* iOS: 주소창 포함 가시 영역 */
  height:100%;max-height:100dvh;max-height:100svh;
}
.studyroom-overlay.show,
body.studyroom-open #studyRoomOverlay{
  display:flex;align-items:stretch;justify-content:center;
  padding:max(8px,env(safe-area-inset-top)) 10px max(8px,env(safe-area-inset-bottom));
}
.studyroom-panel{
  background:#fff;border-radius:22px;max-width:440px;width:100%;
  max-height:100%;display:flex;flex-direction:column;
  box-shadow:var(--shadow-lg);overflow:hidden;min-height:0;box-sizing:border-box;
}
/* 모바일: 하단 시트 · 화면 밖으로 넘치지 않게 높이 고정 + 본문만 스크롤 */
@media (max-width:719px){
  .studyroom-overlay.show,
  body.studyroom-open #studyRoomOverlay{
    align-items:flex-end;
    justify-content:center;
    padding:max(10px,env(safe-area-inset-top,0px)) 0 0;
    height:100%;
    max-height:100dvh;
    max-height:100svh;
  }
  .studyroom-panel{
    width:100%;
    max-width:100%;
    /* 가시 화면의 ~92% — 상단 여백 확보, 홈 인디케이터 포함 */
    height:min(92dvh, calc(100dvh - max(10px, env(safe-area-inset-top, 0px))));
    max-height:min(92dvh, calc(100dvh - max(10px, env(safe-area-inset-top, 0px))));
    height:min(92svh, calc(100svh - max(10px, env(safe-area-inset-top, 0px))));
    max-height:min(92svh, calc(100svh - max(10px, env(safe-area-inset-top, 0px))));
    border-radius:18px 18px 0 0;
    margin:0;
    flex-shrink:0;
  }
  .studyroom-hd{padding:12px 14px 10px;flex-shrink:0;}
  .studyroom-body{
    flex:1 1 auto;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:12px 14px 10px;
  }
  .studyroom-nav{
    flex-shrink:0;
    padding:6px 4px max(10px, env(safe-area-inset-bottom, 0px));
  }
}
/* PC: 상단 고정 여백 + 클릭 근처(미세 조정). 세로 중앙 처짐 방지 */
@media (min-width:720px){
  .studyroom-overlay.show,
  body.studyroom-open #studyRoomOverlay{
    align-items:flex-start;
    justify-content:center;
    /* 기본 상단 여백 조금 여유 (툴바 아래 자연스럽게) */
    padding:max(20px,env(safe-area-inset-top)) 28px max(20px,env(safe-area-inset-bottom));
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    height:auto;
    max-height:none;
  }
  .studyroom-panel{
    max-width:min(780px,94vw);
    max-height:min(900px,calc(100vh - 48px));
    max-height:min(900px,calc(100dvh - 48px));
    height:auto;
    border-radius:24px;
    margin-top:0;
    flex-shrink:0;
  }
  .studyroom-hd{padding:18px 22px 14px;}
  .studyroom-hd h2{font-size:1.22rem;}
  .studyroom-hd .subwho{font-size:13px;}
  .studyroom-body{padding:16px 22px 14px;}
  .studyroom-nav{padding:10px 12px max(12px,env(safe-area-inset-bottom));gap:4px;}
  .studyroom-nav button{font-size:13px;padding:10px 4px 8px;}
}
@media (min-width:1100px){
  .studyroom-panel{max-width:min(880px,90vw);}
}

.studyroom-hd{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:14px 16px 12px;border-bottom:1px solid #eceef2;background:#fff;flex-shrink:0;}
.studyroom-hd h2{margin:0;font-size:1.15rem;font-weight:900;color:var(--text);letter-spacing:-.03em;}
.studyroom-hd .subwho{margin:4px 0 0;font-size:12.5px;color:var(--muted);line-height:1.4;font-weight:600;}
.studyroom-hd .subwho b{color:var(--text);font-weight:800;}
.studyroom-hd .sr-close{
  flex-shrink:0;width:36px;height:36px;border-radius:999px;border:1px solid #e8eaef;
  background:#fff;font-size:20px;font-weight:500;color:#6b7280;cursor:pointer;
  font-family:inherit;line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0;
}
.studyroom-hd .sr-close:hover{background:#f9fafb;color:var(--text);}
.studyroom-hd .resetbtn.sr-close-legacy{display:none;}
.studyroom-sync{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-size:11px;font-weight:700;color:var(--indigo);background:#f3f4f6;border:1px solid #e5e7eb;border-radius:var(--radius-pill);padding:2px 8px;}
.studyroom-sync.off{color:#92400e;background:#fffbeb;border-color:#fcd34d;}
.studyroom-body{padding:14px 16px 12px;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0;background:#fff;overscroll-behavior:contain;}
/* 탭 4개: 오늘 · 복습 · 기록 · 환경 */
.studyroom-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:6px 4px max(10px,env(safe-area-inset-bottom));border-top:1px solid #eceef2;background:#fff;flex-shrink:0;}
.studyroom-nav button{border:0;background:transparent;border-radius:10px;padding:10px 2px 8px;font-size:12.5px;font-weight:700;color:#9196a8;cursor:pointer;line-height:1.2;}
.studyroom-nav button .ni{display:none;}
.studyroom-nav button .nl{display:block;font-size:12.5px;font-weight:800;}
.studyroom-nav button .ns{display:none;} /* 오르조형: 라벨 한 줄 */
/* 필기 노트 갤러리 */
.sr-ink-card{border:1px solid #e2e4ee;border-radius:14px;background:#fff;margin:0 0 10px;overflow:hidden;}
.sr-ink-card .sr-ink-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:10px 12px 6px;}
.sr-ink-card .sr-ink-hd b{font-size:13px;font-weight:800;color:var(--text);line-height:1.35;}
.sr-ink-card .sr-ink-hd span{display:block;font-size:11.5px;color:var(--muted);font-weight:600;margin-top:2px;}
.sr-ink-card .sr-ink-prev{display:block;width:100%;max-height:160px;object-fit:contain;background:#fafbff;border-top:1px solid #f0f1f5;border-bottom:1px solid #f0f1f5;}
.sr-ink-card .sr-ink-acts{display:flex;gap:8px;flex-wrap:wrap;padding:8px 12px 10px;}
.sr-ink-card .sr-ink-acts button{padding:6px 12px;font-size:12.5px;}
.studyroom-nav button.on{background:#f3f4f6;color:var(--indigo);}
.studyroom-nav button.on .ns{color:var(--indigo);opacity:.85;}
.studyroom-nav button .badge{display:inline-block;min-width:1.1em;padding:0 5px;margin-left:2px;border-radius:var(--radius-pill);background:var(--indigo);color:#fff;font-size:10px;line-height:1.35;}
/* 학습실 본문 카드 톤 */
.studyroom-body .sr-hero{
  background:#f8f9fb;border:1px solid #eceef2;border-radius:16px;
  box-shadow:none;
}
.studyroom-body .sr-action{
  border:1px solid #eceef2;box-shadow:none;border-radius:14px;
}
.studyroom-body .sr-action.primary{
  background:#f4f6ff;border-color:#e0e6ff;box-shadow:none;
}
.studyroom-body .sr-tile{box-shadow:none;border-color:#eceef2;border-radius:14px;}
.studyroom-body .sr-week{
  background:#f8f9fb;border-color:#eceef2;
}
.studyroom-body .sr-todaypack{
  background:#f0fdf4;border-color:#bbf7d0;
}
.studyroom-body .sr-disc{
  background:#fff;border-color:#eceef2;
}
.sr-disc{border:1px solid var(--border-soft);background:#f8faff;border-radius:var(--radius-sm);padding:12px 12px;margin-bottom:8px;}
.sr-disc .meta{font-size:11.5px;color:var(--muted);margin-bottom:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.sr-disc .meta b{color:var(--indigo-deep);font-size:12.5px;}
.sr-disc .meta .new{color:#b45309;background:#fffbeb;border:1px solid #fcd34d;border-radius:var(--radius-pill);padding:1px 7px;font-weight:800;font-size:11px;}
.sr-disc .snip{font-size:13.5px;line-height:1.55;color:var(--text);margin:0 0 6px;overflow-wrap:anywhere;word-break:keep-all;}
.sr-disc .snip .who{font-weight:800;color:var(--indigo);}
.sr-disc .snip.mine .who{color:var(--ok);}
.sr-disc .stats{font-size:11.5px;color:var(--sub);font-weight:700;margin-bottom:8px;}
.sr-disc .actions{display:flex;gap:8px;flex-wrap:wrap;}
.sr-hero{background:linear-gradient(135deg,#eef1ff,#e8edff);border:1px solid var(--border-soft);border-radius:var(--radius);padding:14px 14px 12px;margin-bottom:12px;}
.sr-hero h3{margin:0 0 4px;font-size:15px;font-weight:800;color:var(--text);}
.sr-hero p{margin:0;font-size:12.5px;color:var(--sub);line-height:1.45;}
.sr-actions{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;}
.sr-action{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);padding:12px 12px;cursor:pointer;box-sizing:border-box;box-shadow:var(--shadow-sm);}
.sr-action:active{transform:scale(.99);}
.sr-action:hover{border-color:var(--indigo-soft);background:#fafbff;}
.sr-action.primary{border-color:var(--border-soft);background:#f3f5ff;box-shadow:0 4px 14px rgba(76,99,246,.10);}
.sr-action .ai{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:900;color:var(--indigo);background:#eef1ff;flex-shrink:0;}
.sr-action .at{flex:1;min-width:0;}
.sr-action .at b{display:block;font-size:var(--fs-md);font-weight:800;color:var(--text);}
.sr-action .at span{display:block;font-size:var(--fs-sm);color:var(--sub);margin-top:2px;font-weight:600;line-height:1.4;}
.sr-action .an{font-size:1.35rem;font-weight:800;color:var(--indigo);min-width:2ch;text-align:right;}
.sr-action .an.warn{color:#b45309;}
.sr-action .an.zero{color:var(--muted);font-weight:700;font-size:1.1rem;}
.sr-action .chev{color:var(--muted);font-size:18px;font-weight:700;}
.sr-sec{margin:4px 0 8px;font-size:12px;font-weight:800;color:var(--sub);letter-spacing:.02em;}
.sr-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;}
.sr-tile{border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);padding:10px 12px;cursor:pointer;text-align:left;box-shadow:var(--shadow-sm);}
.sr-tile:hover{border-color:var(--indigo-soft);background:#fafbff;}
.sr-tile .tn{font-size:1.15rem;font-weight:800;color:var(--indigo);}
.sr-tile .tl{font-size:11.5px;color:var(--sub);font-weight:700;margin-top:2px;}
.sr-login{background:#fffbeb;border:1px solid #fcd34d;border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:12px;}
.sr-login b{display:block;font-size:13.5px;margin-bottom:4px;color:#92400e;}
.sr-login p{margin:0 0 10px;font-size:12.5px;color:var(--sub);line-height:1.45;}
.studyroom-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px;position:sticky;top:0;background:#fff;padding:4px 0 8px;z-index:1;}
.studyroom-tools input{flex:1;min-width:140px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 12px;font-size:14px;box-sizing:border-box;}
.studyroom-memo{border:1px solid var(--border-soft);background:#f8faff;border-radius:var(--radius-sm);padding:12px 12px;margin-bottom:8px;}
.studyroom-memo .meta{font-size:11.5px;color:var(--muted);margin-bottom:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.studyroom-memo .meta b{color:var(--indigo);font-size:12.5px;}
.studyroom-memo .body{font-size:14px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;color:var(--text);margin-bottom:8px;}
.studyroom-memo .actions{display:flex;gap:8px;flex-wrap:wrap;}
.studyroom-empty{text-align:center;padding:32px 14px;color:var(--sub);font-size:14px;line-height:1.6;}
.sr-setrow{display:flex;flex-direction:column;gap:10px;}
.sr-setcard{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;background:#fff;box-shadow:var(--shadow-sm);}
.sr-setcard > label:first-child,.sr-setcard .sr-set-title{display:block;font-size:13px;font-weight:800;color:var(--sub);margin-bottom:8px;}
.sr-setcard input[type="text"],.sr-setcard input[type="date"],.sr-setcard input[type="password"],.sr-setcard input[type="search"],.sr-setcard input[type="email"],.sr-setcard input:not([type]){
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:15px;font-family:inherit;
}
.sr-setcard input[type="date"]{-webkit-appearance:none;appearance:none;min-height:44px;background:#f8f9fc;cursor:pointer;}
.sr-setcard .chip-field-hint{margin:6px 0 0;font-size:11.5px;font-weight:600;color:#9196a8;line-height:1.4;}
.sr-setcard input[type="number"]{width:auto;min-width:64px;max-width:100%;box-sizing:border-box;border:1px solid var(--border);border-radius:10px;padding:8px 10px;font-size:15px;font-weight:800;}
.sr-setcard input[type="checkbox"],.sr-setcard input[type="radio"]{width:20px !important;height:20px !important;min-width:20px !important;max-width:20px !important;flex-shrink:0;margin:0;padding:0;border:0;border-radius:4px;accent-color:var(--indigo);cursor:pointer;}
.sr-setcard label.sr-check{display:flex !important;align-items:flex-start;gap:12px;width:100%;box-sizing:border-box;font-size:14.5px !important;font-weight:700 !important;color:var(--text) !important;margin:10px 0 !important;line-height:1.5;cursor:pointer;}
.sr-setcard label.sr-check span{flex:1;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:keep-all;}
/* 리마인드 메인 토글 */
.sr-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;margin:4px 0 0;border-radius:12px;border:1px solid var(--border-soft);background:#fafbff;}
.sr-toggle-meta{min-width:0;flex:1;}
.sr-toggle-meta b{display:block;font-size:14.5px;font-weight:900;color:var(--text);line-height:1.3;}
.sr-toggle-meta span{display:block;font-size:12px;font-weight:600;color:var(--sub);margin-top:3px;line-height:1.4;}
.sr-toggle-meta span.em{color:#047857;font-weight:800;}
.sr-toggle-meta span.mute{color:var(--muted);}
.sr-switch{
  flex-shrink:0;position:relative;width:52px;height:30px;border-radius:999px;border:0;
  background:#cbd5e1;cursor:pointer;padding:0;transition:background .18s ease;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.08);
}
.sr-switch>i{
  position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.2);transition:transform .18s ease;pointer-events:none;
}
.sr-switch.on{background:var(--indigo);}
.sr-switch.on>i{transform:translateX(22px);}
.sr-switch:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;}
.sr-remind-fold{margin-top:10px;border-top:1px dashed #e2e8f0;padding-top:8px;}
.sr-remind-fold>summary{cursor:pointer;font-size:12.5px;font-weight:800;color:var(--indigo);list-style:none;user-select:none;}
.sr-remind-fold>summary::-webkit-details-marker{display:none;}
.sr-remind-fold>summary::before{content:'▸ ';}
.sr-remind-fold[open]>summary::before{content:'▾ ';}
.sr-setcard .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;align-items:center;}
/* 추천 초대 UI */
.sr-refcard .sr-ref-block{border:1px solid var(--border-soft);border-radius:14px;padding:12px 14px;margin:0 0 12px;background:#f8faff;}
.sr-refcard .sr-ref-invite{background:linear-gradient(135deg,#eef1ff,#f8faff);border-color:#c9d2ff;}
.sr-refcard .sr-ref-claim{background:#fafbff;}
.sr-refcard .sr-ref-kicker{font-size:13.5px;font-weight:900;color:var(--indigo-deep);margin:0 0 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;letter-spacing:-.02em;}
.sr-refcard .sr-ref-pill{display:inline-block;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;background:var(--indigo);color:#fff;letter-spacing:0;}
.sr-refcard .sr-ref-pill.mute{background:#e2e8f0;color:#475569;}
.sr-refcard .sr-ref-codewrap{margin:0 0 8px;}
.sr-refcard .sr-ref-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.35rem;font-weight:900;letter-spacing:.08em;color:var(--indigo-deep);padding:12px 14px;background:#fff;border:2px dashed #c9d2ff;border-radius:12px;text-align:center;word-break:break-all;}
.sr-refcard .sr-ref-muted{font-size:14px;font-weight:700;color:var(--muted);letter-spacing:0;font-family:inherit;}
.sr-refcard .sr-ref-stats{font-size:13px;font-weight:700;color:var(--sub);margin:0 0 10px;line-height:1.45;}
.sr-refcard .sr-ref-stats b{color:var(--indigo-deep);}
.sr-refcard .sr-ref-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.sr-refcard .sr-ref-actions input[type="text"]{box-sizing:border-box;border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:15px;background:#fff;}
.sr-refcard .sr-ref-done{background:#ecfdf5;border:1px solid #a7f3d0;border-radius:12px;padding:12px 14px;color:#047857;font-size:13.5px;font-weight:700;line-height:1.5;}
.sr-refcard .sr-ref-done b{font-weight:900;}
.sr-refcard .sr-ref-done-sub{margin-top:4px;font-size:12px;font-weight:600;color:#059669;}
.studyroom-note{font-size:13.5px;color:var(--sub);line-height:1.55;margin:8px 0 0;}
.admin-manual .am-search{width:100%;box-sizing:border-box;border:1.5px solid var(--border);border-radius:12px;padding:10px 12px;font-size:14px;font-weight:600;margin:0 0 12px;}
.admin-manual details.am-feat{border:1px solid var(--border);border-radius:12px;background:#fafbff;margin:0 0 10px;overflow:hidden;}
.admin-manual details.am-feat>summary{list-style:none;cursor:pointer;padding:12px 14px;font-weight:800;font-size:13.5px;color:var(--text);display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;}
.admin-manual details.am-feat>summary::-webkit-details-marker{display:none;}
.admin-manual details.am-feat>summary .am-chev{flex-shrink:0;width:18px;height:18px;border-radius:6px;background:#eef1ff;color:var(--indigo);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;margin-top:1px;transition:transform .15s;}
.admin-manual details.am-feat[open]>summary .am-chev{transform:rotate(90deg);}
.admin-manual details.am-feat>summary .am-sum{flex:1;min-width:0;}
.admin-manual details.am-feat>summary .am-sum b{display:block;font-size:14px;font-weight:900;color:var(--indigo-deep);margin-bottom:2px;}
.admin-manual details.am-feat>summary .am-sum span{display:block;font-size:12.5px;font-weight:600;color:var(--sub);line-height:1.4;}
.admin-manual details.am-feat .am-body{padding:0 14px 14px;border-top:1px solid #eef1f6;}
.admin-manual details.am-feat .am-body p{margin:10px 0 6px;font-size:13.5px;line-height:1.55;}
.admin-manual details.am-feat .am-tags{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0 0;}
.admin-manual details.am-feat .am-tags i{font-style:normal;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;background:#eef1ff;color:var(--indigo);border:1px solid #c9d2ff;}
.admin-manual .am-empty{text-align:center;padding:20px;color:var(--sub);font-weight:700;}
.pts-hist-backdrop{display:none;position:fixed;inset:0;z-index:410;background:rgba(20,22,40,.48);align-items:center;justify-content:center;padding:16px;box-sizing:border-box;}
.pts-hist-backdrop.show{display:flex;}
.pts-hist-modal{background:#fff;border-radius:16px;max-width:420px;width:100%;max-height:min(80vh,560px);display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(20,24,50,.28);overflow:hidden;}
.pts-hist-modal .ph-hd{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#f8f9ff,#fff);}
.pts-hist-modal .ph-hd h3{margin:0;font-size:1.05rem;font-weight:900;}
.pts-hist-modal .ph-body{overflow-y:auto;padding:12px 14px;flex:1;min-height:0;}
.pts-hist-row{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #f1f5f9;font-size:13px;}
.pts-hist-row:last-child{border-bottom:0;}
.pts-hist-row .ph-meta{color:var(--sub);font-size:12px;font-weight:600;margin-top:2px;}
.pts-hist-row .ph-delta{font-weight:900;white-space:nowrap;}
.pts-hist-row .ph-delta.plus{color:#047857;}
.pts-hist-row .ph-delta.minus{color:#b91c1c;}
body.studyroom-open{overflow:hidden;}

/* D-day / 목표 팝업 · 다음 회차 확인 (풀이 셸 z-index 55·네비 위)
 * ⛔ .show[hidden] 을 다시 그리면 안 된다 — 닫을 때 hidden 만 남고 show 가
 *    남는 레이스에서 투명/반투명 막이 「다음 문제」클릭을 삼킨다 (S2-P172).
 *    열 때는 hidden 속성을 반드시 제거한다. */
.chip-modal-backdrop{
  position:fixed;inset:0;z-index:320;background:rgba(30,40,90,.42);
  display:none;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;
  pointer-events:auto;
}
.chip-modal-backdrop.show{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.chip-modal-backdrop.show[hidden],
.chip-modal-backdrop[hidden]{
  display:none !important;
  pointer-events:none !important;
}
.chip-modal-backdrop.show .chip-modal,
.chip-modal-backdrop.show .chip-modal button{
  pointer-events:auto !important;
  position:relative;
  z-index:1;
}
/* 다음 회차 확인 — 하단 네비·필기바 위에 확실히 */
#nextRoundModal.chip-modal-backdrop.show{
  z-index:340 !important;
}
/* 회차 재진입 선택 전에는 주소/동기화 잔여 문항을 배경에 노출하지 않는다. */
#studyEnterResumeModal.chip-modal-backdrop.show{
  background:var(--bg,#f6f7fc);
}
/* 우상단 X — 「취소」를 대신한다 (S2-P93). 눌러도 풀이로 안 들어가고 화면을 벗어난다.
   ⛔ .chip-modal 전역이 아니라 이 모달로만 한정 — 다른 칩 모달의 배치를 건드리지 않는다. */
#studyEnterResumeModal .chip-modal{position:relative}
#studyEnterResumeModal .ser-x{
  position:absolute;top:10px;right:10px;
  width:34px;height:34px;min-height:34px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:10px;background:transparent;
  font-size:20px;line-height:1;color:var(--muted,#8a90a2);cursor:pointer;
}
#studyEnterResumeModal .ser-x:hover{background:var(--bg,#f2f3f8);color:var(--text,#1b1f2a)}
#studyEnterResumeModal h3{padding-right:38px}
.chip-modal{
  background:#fff;border-radius:20px;max-width:min(360px,calc(100vw - 32px));width:100%;
  padding:20px 18px 16px;box-shadow:var(--shadow-lg);box-sizing:border-box;overflow:hidden;
}
.chip-modal h3{margin:0 0 4px;font-size:1.05rem;font-weight:900;color:var(--text);letter-spacing:-0.02em;}
.chip-modal .chip-sub{margin:0 0 12px;font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.45;}
.chip-modal .chip-field{margin:0 0 12px;min-width:0;max-width:100%;}
.chip-modal label{display:block;font-size:12px;font-weight:800;color:var(--sub);margin:0 0 6px;}
.chip-modal input[type=text],.chip-modal input[type=date],.chip-modal input[type=number]{
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;
  border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;font-size:15px;
  font-family:inherit;font-weight:600;color:var(--text);background:#f8f9fc;
  display:block;line-height:1.3;
}
.chip-modal input[type=text]::placeholder{color:#a0a6b8;font-weight:600;}
.chip-modal input[type=text]:focus,.chip-modal input[type=date]:focus,.chip-modal input[type=number]:focus{
  outline:0;border-color:var(--indigo);background:#fff;box-shadow:0 0 0 3px rgba(76,99,246,.14);
}
/* iOS date: 기본 min-width로 카드 밖으로 삐져나오던 문제 방지 */
.chip-modal input[type=date]{
  -webkit-appearance:none;appearance:none;
  min-height:48px;cursor:pointer;
  color-scheme:light;
}
.chip-modal input[type=date]::-webkit-date-and-time-value{text-align:left;min-height:1.2em;}
.chip-modal input[type=date]:invalid,
.chip-modal input[type=date].is-empty{color:#a0a6b8;}
.chip-modal .chip-field-hint{
  margin:7px 0 0;font-size:12px;font-weight:600;color:#9196a8;line-height:1.45;word-break:keep-all;
}
.chip-modal .chip-field-hint b{color:#6b7280;font-weight:700;}
.chip-modal .mrow{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap;}
.chip-modal .mrow.stack{flex-direction:column-reverse;align-items:stretch;}
.chip-modal .mrow.stack .scorebtn,.chip-modal .mrow.stack .resetbtn{width:100%;justify-content:center;}
.chip-modal .nr-body{margin:0 0 4px;font-size:14.5px;line-height:1.55;color:var(--sub);font-weight:600;word-break:keep-all;}
.chip-modal .nr-body b{color:var(--text);font-weight:900;}
.chip-modal .stepper{display:flex;align-items:center;gap:10px;}
.chip-modal .stepper button{width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:#eef1ff;font-size:20px;font-weight:800;cursor:pointer;color:var(--indigo);}
.chip-modal .stepper .val{font-size:1.4rem;font-weight:800;color:var(--indigo);min-width:3ch;text-align:center;}
.sr-qlist{display:flex;flex-direction:column;gap:6px;margin:8px 0 12px;max-height:42vh;overflow-y:auto;}
.sr-qitem{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:12px;padding:10px 10px;background:#fff;text-align:left;width:100%;cursor:pointer;box-sizing:border-box;}
.sr-qitem:hover{border-color:var(--indigo-soft);background:#fafbff;}
.sr-qitem .ql{flex:1;min-width:0;font-size:13px;font-weight:700;color:var(--text);line-height:1.35;}
.sr-qitem .qm{font-size:11px;color:var(--muted);font-weight:600;margin-top:2px;}
.sr-stat-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px;}
.sr-stat-table th,.sr-stat-table td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left;}
.sr-stat-table th{color:var(--sub);font-size:12px;}
.sr-stat-table .acc-hi{color:var(--ok);font-weight:800;}
.sr-stat-table .acc-lo{color:var(--no);font-weight:800;}
/* 학습실 · 과목 허브 카드 */
.sr-sublist{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.sr-subcard{border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);padding:12px 12px 10px;box-shadow:var(--shadow-sm);}
.sr-subcard.prem{border-color:var(--border-soft);background:linear-gradient(180deg,#f8faff 0%,#fff 55%);box-shadow:0 4px 14px rgba(76,99,246,.08);}
.sr-subcard .sr-subtop{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px;}
.sr-subcard .sr-subname{margin:0;font-size:15px;font-weight:900;color:var(--text);letter-spacing:-.02em;}
.sr-subcard .sr-submeta{margin:3px 0 0;font-size:11.5px;color:var(--sub);font-weight:650;line-height:1.4;}
.sr-subcard .sr-badge{flex-shrink:0;font-size:11px;font-weight:800;border-radius:var(--radius-pill);padding:3px 8px;line-height:1.3;}
.sr-subcard .sr-badge.prem{background:#eef1ff;color:var(--indigo);border:1px solid var(--border-soft);}
.sr-subcard .sr-badge.free{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0;}
.sr-subcard .sr-badge.lock{background:#f8fafc;color:var(--muted);border:1px solid var(--border);}
.sr-subcard .sr-substats{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 10px;font-size:12px;font-weight:700;color:var(--sub);}
.sr-subcard .sr-substats b{color:var(--indigo);}
.sr-subcard .sr-substats .warn{color:#b45309;}
.sr-subcard .sr-subbtns{display:flex;gap:6px;flex-wrap:wrap;}
.sr-subcard .sr-subbtns button{flex:1;min-width:88px;border:1px solid var(--border);background:#fff;border-radius:10px;padding:9px 8px;font-size:12.5px;font-weight:800;color:var(--text);cursor:pointer;}
.sr-subcard .sr-subbtns button.primary{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.sr-subcard .sr-subbtns button:hover{border-color:var(--indigo-soft);background:#fafbff;}
.sr-subcard .sr-subbtns button.primary:hover{background:#2f49e0;border-color:#2f49e0;color:#fff;}
.sr-subcard .sr-subbtns button.ghost{background:transparent;color:var(--indigo);border-color:var(--border-soft);}

body.admin-page .studyroom-overlay{display:none !important;}
.sr-return{position:fixed;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:90;display:none;align-items:center;gap:8px;border:0;border-radius:var(--radius-pill);padding:12px 18px;font-size:14px;font-weight:800;color:#fff;background:var(--indigo);box-shadow:0 8px 24px rgba(76,99,246,.35);cursor:pointer;}
.sr-return.show{display:inline-flex;}
/* ⭐ S2-P130 ⑤ 개정 (2026-08-20 운영자 지시) — 「비우기」는 화면 아래 알약이 아니라
   풀이 화면 ⋯ 메뉴 항목(#menuReviewClear). 알약은 하나뿐이라 서로 밀어 줄 일도 없다. */
body.studyroom-open .sr-return,body.admin-page .sr-return,body.admin-open .sr-return{display:none !important;}

/* ---------- 토스 심사 · 이용권 · 약관 · 사업자 푸터 ---------- */
/* ---------- 고객지원 — 오버레이 스타일은 /support/ 로 나갔다 (S2-P209) ----------
 * .cs-overlay/.cs-panel/.cs-hd/.cs-tabs/.cs-body/.cs-faq/.cs-cta/.cs-foot/.cs-warn/
 * .cs-chat-list/.cs-ticket/.cs-thread/.cs-bubble/.cs-compose/.cs-form/.cs-actions/.cs-empty
 * 를 전부 지웠다. 새 자리는 assets/support.css 의 `.sup-*` 다.
 * ⛔ `.cs-badge` 만 남긴다 — **관리자 패널**이 문의·환불 상태 배지에 쓴다
 *    (assets/admin-panel.js). 이름이 cs 라고 같이 지우면 관리자 화면이 깨진다. */
.cs-badge{display:inline-block;font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:999px;background:#eef1ff;color:var(--indigo);}
.cs-badge.open{background:#ecfdf5;color:#047857;}
.cs-badge.answered{background:#eff6ff;color:#1d4ed8;}
.cs-badge.closed,.cs-badge.rejected{background:#f1f5f9;color:#64748b;}
.cs-badge.pending,.cs-badge.reviewing{background:#fffbeb;color:#b45309;}
.cs-badge.approved{background:#ecfdf5;color:#047857;}
/* 환불·청약철회: 법적 경로 유지, UI는 눈에 덜 띄게 */
.sr-misc-fold{
  margin:8px 0 4px;border:0;background:transparent;padding:0;
}
.sr-misc-fold>summary{
  list-style:none;cursor:pointer;font-size:12px;font-weight:700;color:var(--muted);
  padding:6px 2px;user-select:none;
}
.sr-misc-fold>summary::-webkit-details-marker{display:none;}
.sr-misc-fold>summary::before{content:'▸ ';font-size:10px;opacity:.7;}
.sr-misc-fold[open]>summary::before{content:'▾ ';}
.sr-misc-fold .sr-misc-body{
  margin:4px 0 8px;padding:10px 12px;border-radius:10px;border:1px solid #eef0f6;
  background:#fafafa;font-size:12px;line-height:1.5;color:var(--muted);font-weight:600;
}
.sr-misc-fold .sr-misc-body .row{margin-top:8px;gap:8px;flex-wrap:wrap;}
.sr-misc-fold .sr-misc-body button{
  font-size:12px !important;padding:6px 10px !important;font-weight:700 !important;
  color:var(--muted) !important;border-color:#e2e8f0 !important;background:#fff !important;
  box-shadow:none !important;
}
.shop-cs{margin-top:14px;padding:12px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:#f7f8ff;font-size:13px;line-height:1.55;}
.site-footer{margin:28px 0 12px;padding:18px 14px 28px;border-top:1px solid var(--border);color:var(--sub);font-size:12px;line-height:1.65;}
.site-footer .flinks{display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:12px;}
.site-footer .flinks button,.site-footer .flinks a{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--indigo);cursor:pointer;text-decoration:none;}
.site-footer .flinks button:hover,.site-footer .flinks a:hover{text-decoration:underline;}
.site-footer .fcorp{font-weight:800;color:var(--text);font-size:13px;margin-bottom:6px;}
.site-footer .fmeta{word-break:keep-all;overflow-wrap:anywhere;}
.site-footer .flegal{
  margin-top:10px;font-size:11px;line-height:1.55;color:#a8aebc;font-weight:600;
}
.site-footer .flegal button,.site-footer .flegal a{
  background:none;border:0;padding:0;font:inherit;font-weight:600;color:#9aa3b5;
  cursor:pointer;text-decoration:none;
}
.site-footer .flegal button:hover,.site-footer .flegal a:hover{text-decoration:underline;color:#7c8499;}
.site-footer .fcopy{margin-top:10px;color:var(--muted);font-size:11.5px;}
.shop-mine-foot .shop-legal-quiet{
  display:block;width:100%;margin-top:8px;padding:6px 0;border:0;background:none;
  font-size:11.5px;font-weight:600;color:#a8aebc;cursor:pointer;text-align:center;font-family:inherit;
}
.shop-mine-foot .shop-legal-quiet:hover{color:#7c8499;text-decoration:underline;}
.shop-overlay,.legal-overlay{
  position:fixed;inset:0;z-index:125;background:rgba(30,40,90,.42);display:none;
  overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:max(12px,env(safe-area-inset-top)) 12px max(20px,env(safe-area-inset-bottom));
  box-sizing:border-box;
  touch-action:pan-y;
}
.shop-overlay.show,.legal-overlay.show{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
}
.shop-panel,.legal-panel{
  background:#fff;border-radius:18px;max-width:720px;width:100%;
  margin:12px auto;box-shadow:0 12px 40px rgba(20,24,40,.14);
  border:1px solid #eceef2;
  /* 본문 스크롤: 헤더 고정 + body 만 세로 스크롤 (이용권 안내 스크롤 불가 수정) */
  display:flex;flex-direction:column;
  max-height:min(92dvh, 920px);
  max-height:min(92vh, 920px);
  overflow:hidden;
  flex-shrink:0;
  box-sizing:border-box;
}
/*
 * 풀이 다크(bg-eye-dark) 시 body --text 가 연한색(#e8eaef)으로 바뀌는데
 * 이용권·약관 패널은 흰 배경 고정 → 연한 글자 = 사실상 안 보임.
 * 패널 루트에서 라이트 토큰을 재정의해 제목·본문·리스트 대비를 보장.
 */
.shop-panel,.legal-panel,.login-gate-panel{
  --bg:#f6f7fc;--bg-soft:#eef1ff;--card:#fff;
  --border:#e8eaf2;--border-soft:#dde3ff;
  --text:#1b1f2e;--sub:#5e6478;--muted:#9196a8;
  --shadow-sm:0 2px 10px rgba(60,80,180,.06);
  --shadow:0 8px 28px rgba(60,80,180,.10);
  color:#1b1f2e;
}
.shop-hd,.legal-hd{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:18px 18px 14px;border-bottom:1px solid #e8eaf2;
  background:linear-gradient(180deg,#f7f8ff,#fff);
  flex-shrink:0;
}
.shop-hd h2,.legal-hd h2{margin:0;font-size:1.15rem;font-weight:900;letter-spacing:-0.02em;color:#1b1f2e !important;}
.shop-hd .sub,.legal-hd .sub{color:#5e6478 !important;}
.shop-body,.legal-body{
  color:#1b1f2e !important;
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}
/* 다크 테마 body color 상속 차단 — 제목·카드 제목·혜택 리스트 강제 대비 */
.shop-panel .shop-card h3,
.shop-panel .shop-card ul,
.shop-panel .shop-card li,
.shop-panel .shop-note b,
.shop-panel .shop-trackcard h3,
.shop-panel .shop-subcard h3,
.shop-panel .shop-mine-card .subname,
.shop-panel .shop-mine-hero h3,
.shop-panel .checkout-box .sum,
.shop-panel .pay-summary,
.shop-panel .pay-row,
.legal-panel .legal-body{
  color:#1b1f2e !important;
}
.shop-panel .shop-card .period,
.shop-panel .shop-note,
.shop-panel .shop-steps,
.shop-panel .shop-trackcard p,
.shop-panel .shop-subcard p,
.shop-panel .shop-mine-hero p,
.shop-panel .shop-mine-card .meta{
  color:#5e6478 !important;
}
.shop-panel .shop-card .price{color:var(--indigo) !important;}
.shop-panel .shop-card .price small{color:#5e6478 !important;}
.shop-panel .shop-card .buy,
.shop-panel .shop-card .badge,
.shop-panel .scorebtn{color:#fff !important;}
.shop-panel .shop-tierbtn{color:#5e6478;}
.shop-panel .shop-tierbtn.on{color:#3A4FE0;}
.shop-panel .shop-tierbtn.on.super{color:#92400e;}
.shop-panel .shop-hd .resetbtn,
.legal-panel .legal-hd .resetbtn{
  color:#5e6478 !important;background:#fff !important;border-color:#e8eaf2 !important;
}

/* 내 이용권 (샵 mine 뷰) */
.shop-mine-hero{margin:0 0 14px;padding:14px 16px;border-radius:14px;background:linear-gradient(135deg,#eef1ff,#f8faff);border:1px solid #c9d2ff;}
.shop-mine-hero .k{font-size:12px;font-weight:800;color:var(--indigo);margin:0 0 4px;}
.shop-mine-hero h3{margin:0 0 6px;font-size:1.05rem;font-weight:900;letter-spacing:-0.02em;}
.shop-mine-hero p{margin:0;font-size:13px;color:var(--sub);line-height:1.45;font-weight:600;}
.shop-mine-card{border:1px solid var(--border);border-radius:14px;padding:14px 14px 12px;margin:0 0 10px;background:#fff;box-shadow:var(--shadow-sm);}
.shop-mine-card.prem{border-color:#c9d2ff;background:linear-gradient(180deg,#fbfcff,#fff);}
.shop-mine-card.free{opacity:.95;background:#fafbfc;}
.shop-mine-card .top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px;}
.shop-mine-card .subname{font-size:15px;font-weight:900;color:var(--text);letter-spacing:-0.02em;}
.shop-mine-card .badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:800;line-height:1.2;}
.shop-mine-card .badge.free{background:#f1f5f9;color:#64748b;}
.shop-mine-card .badge.light{background:#ecfeff;color:#0e7490;border:1px solid #a5f3fc;}
.shop-mine-card .badge.standard{background:#eef1ff;color:var(--indigo);border:1px solid #c9d2ff;}
.shop-mine-card .badge.super{background:#fff7ed;color:#c2410c;border:1px solid #fed7aa;}
.shop-mine-card .meta{font-size:13px;color:var(--sub);font-weight:700;line-height:1.45;margin:0 0 10px;}
.shop-mine-card .meta b{color:var(--text);}
.shop-mine-card .meta .warn{color:#b45309;}
.shop-mine-card .acts{display:flex;flex-wrap:wrap;gap:6px;}
.shop-mine-card .acts button,.shop-mine-card .acts .scorebtn,.shop-mine-card .acts .resetbtn{font-size:12.5px;padding:7px 11px;}
.shop-mine-foot{margin-top:12px;display:flex;flex-direction:column;gap:8px;}

.shop-hd .sub,.legal-hd .sub{font-size:12.5px;color:var(--sub);margin-top:4px;line-height:1.45;font-weight:500;}
/* 모달 헤더 닫기: 모바일에서 원형으로 찌그러져 "닫/기" 세로 줄바꿈 방지 */
.shop-hd>div:first-child,.legal-hd>div:first-child{flex:1;min-width:0;}
.shop-hd .resetbtn,.legal-hd .resetbtn,
.print-modal .resetbtn,.print-modal-backdrop .resetbtn{
  flex-shrink:0;width:auto!important;min-width:3.25rem;margin-top:0!important;
  white-space:nowrap;padding:8px 14px;line-height:1.2;align-self:flex-start;
}
.shop-body,.legal-body{
  padding:16px 18px 20px;font-size:14px;line-height:1.7;color:var(--text);
  /* flex·overflow 는 위 shop-panel 블록과 합쳐 유지 */
}
.shop-intro{background:#eef1ff;border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:14px;font-size:13.5px;line-height:1.6;color:var(--sub);}
.shop-grid{display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:560px){.shop-grid{grid-template-columns:1fr 1fr;}}
.shop-card{border:1px solid var(--border);border-radius:var(--radius);padding:16px 15px 14px;background:#fff;display:flex;flex-direction:column;gap:8px;position:relative;box-shadow:var(--shadow-sm);}
.shop-card.featured{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(145deg,var(--indigo-soft),var(--indigo)) border-box;border:2px solid transparent;box-shadow:0 10px 28px rgba(76,99,246,.12);}
.shop-card .badge{position:absolute;top:12px;right:12px;font-size:11px;font-weight:800;background:var(--indigo);color:#fff;border-radius:var(--radius-pill);padding:4px 9px;}
.shop-card h3{margin:0;font-size:1.05rem;font-weight:800;padding-right:72px;}
.shop-card .price{font-size:1.35rem;font-weight:900;color:var(--indigo);letter-spacing:-0.03em;}
.shop-card .price small{font-size:13px;font-weight:700;color:var(--sub);}
.shop-card .period{font-size:12.5px;color:var(--sub);font-weight:600;}
.shop-card ul{margin:0;padding:0 0 0 1.1em;font-size:13.5px;line-height:1.55;color:var(--text);}
.shop-card .buy{margin-top:auto;width:100%;border:0;border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;font-weight:800;cursor:pointer;background:var(--indigo);color:#fff;box-shadow:0 6px 16px rgba(76,99,246,.26);}
.shop-card .buy:hover{filter:brightness(1.05);}
.shop-card .buy:disabled{opacity:.55;cursor:not-allowed;}
.shop-note{margin-top:14px;font-size:12.5px;color:var(--sub);line-height:1.55;}
.shop-note b{color:var(--text);}
.shop-cs{margin-top:14px;padding:12px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:#f7f8ff;font-size:13px;line-height:1.55;}
.legal-body h3{font-size:15px;font-weight:800;margin:18px 0 8px;color:var(--text);}
.legal-body h3:first-child{margin-top:0;}
.legal-body p,.legal-body li{font-size:13.5px;line-height:1.7;color:#333;word-break:keep-all;}
.legal-body ul{margin:6px 0 10px;padding-left:1.2em;}
.legal-body .upd{font-size:12px;color:var(--muted);margin-bottom:12px;}

.checkout-box{border:1px solid var(--border);border-radius:12px;padding:14px;margin-top:12px;background:#fafbff;}
.checkout-box .rowl{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;font-weight:600;margin:10px 0;cursor:pointer;line-height:1.55;}
.checkout-box .rowl input[type="checkbox"],.checkout-box .rowl input[type="radio"]{
  width:20px !important;height:20px !important;min-width:20px !important;max-width:20px !important;
  margin-top:2px;flex-shrink:0;accent-color:var(--indigo);
}
.checkout-box .rowl span{flex:1;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:keep-all;}
.checkout-box .sum{font-size:14px;font-weight:700;margin-bottom:8px;}
.checkout-box .sum .amt{color:var(--indigo);font-size:1.15rem;font-weight:800;}
body.shop-open,body.legal-open{overflow:hidden;}
body.is-printing .site-footer{display:none !important;}
.shop-compare{width:100%;border-collapse:collapse;font-size:13px;margin:0 0 16px;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.shop-compare th,.shop-compare td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;}
.shop-compare th{background:#f5f6ff;font-size:12px;font-weight:800;color:var(--sub);}
.shop-compare tr:last-child td{border-bottom:0;}
.shop-compare .ok{color:#047857;font-weight:800;}
.shop-compare .no{color:#94a3b8;font-weight:700;}
.shop-compare .feat{font-weight:600;color:var(--text);}
.shop-tierpill{display:inline-block;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;margin-left:6px;vertical-align:middle;}
.shop-tierpill.free{background:#ecfdf5;color:#047857;}

.shop-tierpill.lock{background:#f1f5f9;color:#64748b;}
/* Light / Standard / Super 선택 — 모바일 전폭·큰 터치 */
.shop-tierbar{display:flex;gap:8px;margin:0 0 14px;width:100%;}
.shop-tierbtn{
  flex:1 1 0;min-width:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:12px 8px;min-height:56px;
  border:2px solid var(--border);background:#fafbff;color:var(--sub);
  border-radius:16px;font-size:15px;font-weight:900;cursor:pointer;
  line-height:1.15;box-shadow:var(--shadow-sm);
  transition:border-color .12s,background .12s,color .12s,box-shadow .12s;
}
.shop-tierbtn .tb-short{font-size:11.5px;font-weight:700;opacity:.9;letter-spacing:-0.01em;}
.shop-tierbtn:hover{border-color:var(--indigo-soft);color:var(--indigo-deep);}
.shop-tierbtn.on{
  background:linear-gradient(135deg,#eef1ff,#e8edff);
  border-color:var(--indigo);color:var(--indigo-deep);
  box-shadow:0 4px 14px rgba(61,90,254,.18);
}
.shop-tierbtn.on.super{
  background:linear-gradient(135deg,#fffbeb,#fff7ed);
  border-color:#f59e0b;color:#92400e;
  box-shadow:0 4px 14px rgba(245,158,11,.2);
}
@media(min-width:520px){
  .shop-tierbtn{padding:14px 12px;min-height:60px;font-size:16px;border-radius:18px;}
  .shop-tierbtn .tb-short{font-size:12.5px;}
}

.plan-chip{border:1.5px solid var(--border-soft);background:#eef1ff;color:var(--indigo-deep);border-radius:var(--radius-pill);padding:7px 12px;font-size:12.5px;font-weight:800;cursor:pointer;line-height:1.2;white-space:nowrap;flex-shrink:0;box-shadow:var(--shadow-sm);}
.plan-chip:hover{border-color:var(--indigo);filter:brightness(1.02);}
.plan-chip.prem{background:linear-gradient(135deg,#eef1ff,#e8edff);border-color:var(--indigo-soft);color:var(--indigo-deep);}
.plan-chip.pending{background:#fffbeb;border-color:#fcd34d;color:#b45309;}
/* 이용권: 과목 선택 카드 */
.shop-steps{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 16px;font-size:13px;font-weight:800;color:var(--sub);}
.shop-steps .st{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-pill);background:#f1f3f9;}
.shop-steps .st.on{background:#eef1ff;color:var(--indigo);}
.shop-steps .st .num{width:22px;height:22px;border-radius:var(--radius-pill);background:#c5cde8;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;}
.shop-steps .st.on .num{background:var(--indigo);}
.shop-trackgrid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:14px;}
@media(min-width:520px){.shop-trackgrid{grid-template-columns:1fr 1fr;}}
.shop-trackcard{border:2px solid var(--border);border-radius:16px;padding:16px 16px 14px;background:#fff;text-align:left;cursor:pointer;width:100%;font:inherit;box-shadow:var(--shadow-sm);transition:border-color .12s,box-shadow .12s;}
.shop-trackcard:hover{border-color:var(--indigo-soft);box-shadow:0 6px 18px rgba(61,90,254,.12);}
.shop-trackcard h3{margin:0 0 4px;font-size:1.15rem;font-weight:900;color:var(--text);letter-spacing:-0.02em;}
.shop-trackcard p{margin:0;font-size:12.5px;color:var(--sub);line-height:1.45;}
.shop-trackcard .go{margin-top:10px;font-size:12.5px;font-weight:800;color:var(--indigo);}
.sr-track-sec{margin:14px 0 6px;font-size:13px;font-weight:900;color:var(--indigo-deep);letter-spacing:-0.02em;}
.sr-track-sec:first-child{margin-top:0;}
.shop-subgrid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:8px;}
@media(min-width:520px){.shop-subgrid{grid-template-columns:1fr 1fr;}}
.shop-subcard{
  border:2px solid var(--border);border-radius:var(--radius);padding:18px 16px;background:#fff;cursor:pointer;text-align:left;
  transition:border-color .15s,box-shadow .15s,transform .12s;width:100%;font:inherit;color:inherit;box-shadow:var(--shadow-sm);
}
.shop-subcard:hover{border-color:var(--indigo-soft);box-shadow:0 10px 28px rgba(76,99,246,.14);transform:translateY(-1px);}
.shop-subcard .si{
  width:40px;height:40px;border-radius:12px;margin-bottom:10px;
  background:linear-gradient(145deg,#eef1ff,#e0e6ff);color:var(--indigo);font-size:12px;font-weight:900;
  display:flex;align-items:center;justify-content:center;letter-spacing:-0.04em;
}
.shop-subcard h3{margin:0 0 6px;font-size:1.15rem;font-weight:900;color:var(--text);letter-spacing:-0.02em;}
.shop-subcard p{margin:0;font-size:13px;color:var(--sub);line-height:1.45;font-weight:600;}
.shop-subcard .stt{margin-top:12px;font-size:13px;font-weight:800;}
.shop-subcard .stt.ok{color:var(--ok);}
.shop-subcard .stt.free{color:var(--sub);}
.shop-subcard .go{margin-top:14px;display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:800;color:var(--indigo);}
.shop-back{border:0;background:none;color:var(--indigo);font-weight:800;font-size:13.5px;cursor:pointer;padding:0;margin:0 0 12px;font-family:inherit;}
.shop-back:hover{text-decoration:underline;}
.shop-benefit{
  margin:0 0 16px;padding:14px 16px;border-radius:14px;
  border:2px solid #a5b4fc;background:linear-gradient(135deg,#eef2ff 0%,#f5f3ff 55%,#fff 100%);
  box-shadow:0 4px 16px rgba(61,90,254,.1);
}
.shop-benefit .sb-kicker{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--indigo);margin:0 0 4px;text-transform:uppercase;}
.shop-benefit h3{margin:0 0 6px;font-size:16px;font-weight:900;color:var(--text);line-height:1.35;}
.shop-benefit .sb-desc{margin:0 0 12px;font-size:13px;line-height:1.55;color:var(--sub);}
.shop-benefit .sb-desc b{color:var(--text);}
.shop-benefit .sb-status{margin:0;font-size:14px;font-weight:800;}
.shop-benefit .sb-status.ok{color:#047857;}
.shop-benefit .sb-status.pend{color:#b45309;}
/* 혜택 신청: 동의 문구와 버튼 겹침 방지 */
.shop-benefit-check{
  display:flex !important;
  flex-direction:row;
  align-items:flex-start;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  margin:12px 0;
  gap:8px;
}
.shop-benefit-check span{
  flex:1 1 auto;
  min-width:0;
  white-space:normal !important;
  overflow-wrap:anywhere;
  word-break:keep-all;
  line-height:1.45;
}
.shop-benefit-actions{
  display:block;
  width:100%;
  max-width:100%;
  clear:both;
  margin:4px 0 2px;
}
.shop-benefit .shop-benefit-cta.scorebtn,
.shop-benefit-cta{
  display:flex !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box;
  justify-content:center;
  align-items:center;
  white-space:normal;
  text-align:center;
  line-height:1.35;
  padding:12px 16px !important;
  margin:0 !important;
  float:none !important;
  position:static !important;
}
.shop-paid-sep{margin:18px 0 10px;font-size:12px;font-weight:800;color:var(--sub);display:flex;align-items:center;gap:10px;}
.shop-paid-sep::before,.shop-paid-sep::after{content:"";flex:1;height:1px;background:var(--border);}
.shop-plan-benefit-hint{margin:0 0 12px;padding:10px 12px;border-radius:10px;border:1px dashed #a5b4fc;background:#f8f9ff;font-size:13px;line-height:1.5;color:var(--sub);}
.shop-plan-benefit-hint button{margin-left:4px;font-weight:800;color:var(--indigo);background:none;border:none;cursor:pointer;text-decoration:underline;padding:0;font-size:13px;}
.shop-fold{margin:12px 0;border:1px solid var(--border);border-radius:var(--radius-sm);background:#f7f8ff;overflow:hidden;}
.shop-fold summary{padding:12px 14px;font-weight:800;font-size:13.5px;cursor:pointer;color:var(--text);list-style:none;}
.shop-fold summary::-webkit-details-marker{display:none;}
.shop-fold summary::before{content:'▸ ';color:var(--indigo);}
.shop-fold[open] summary::before{content:'▾ ';}
.shop-fold .fold-body{padding:0 14px 14px;}

.examicon:empty{display:none;}
.examicon{display:none;}
/* 앱 상단 바 — 브랜드 + 계정만 */
.app-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  flex-wrap:nowrap;margin-bottom:0;position:relative;z-index:40;
  min-height:40px;padding-bottom:10px;
  overflow:visible;
}
/* 10a 경로: 로고/본문과 같은 좌우 여백 (구석 붙음 방지) */
.site-path-wrap{
  display:flex;align-items:center;justify-content:center;box-sizing:border-box;
  margin:0 0 12px;min-height:48px;padding:0 22px;
  border-top:1px solid var(--border-soft);
  border-bottom:1px solid var(--border-soft);
}
.site-path{
  display:flex;align-items:center;flex-wrap:wrap;gap:0;
  width:100%;max-width:var(--page-max,1200px);margin:0 auto;
  min-height:48px;padding:14px 0;
  box-sizing:border-box;
  font-size:13.5px;font-weight:600;color:#8990a3;line-height:1.45;
}
.site-path a{color:#8990a3;font-weight:600;text-decoration:none;line-height:1.45}
.site-path a:hover{color:#1B6FB4;text-decoration:underline}
.site-path .sep{color:#c2c6d2;margin:0 6px;font-weight:500;user-select:none;line-height:1.45}
.site-path .here{color:#1B1F2E;font-weight:800;line-height:1.45}
.site-path .dot{display:none}
.site-path button.linkish{
  border:0;background:none;padding:0;font:inherit;color:var(--indigo);font-weight:700;cursor:pointer;line-height:1.45;
}
.site-path button.linkish:hover{text-decoration:underline}
.app-topbar > .app-brand{order:1;min-width:0;}
.app-topbar > .app-top-account{order:2;margin-left:auto;flex-shrink:0;}
.app-top-account{
  display:inline-flex;align-items:center;justify-content:flex-end;
  gap:0;position:relative;z-index:3;
}
.app-top-account #authGuest{display:inline-flex;align-items:center;flex-shrink:0;}
.app-top-account #authUser{display:none;align-items:center;flex-shrink:0;}
/* 로그인 상태 = body 클래스 정본 (인라인 style 레이스·잔존 덮어쓰기 방지) */
body.qb-logged-in .app-top-account #authGuest{display:none !important;}
body.qb-logged-in .app-top-account #authUser{display:inline-flex !important;}
body.qb-guest .app-top-account #authGuest{display:inline-flex !important;}
body.qb-guest .app-top-account #authUser{display:none !important;}
/* 레거시 클래스 유지(다른 스타일 참조 대비) — 미사용 */
.app-top-actions,.nav-core-btns{display:none !important;}
/* top-nav-btn: 랜딩 index 와 동일 클래스명·순서 */
.top-nav-btn,.app-home-btn,.app-shop-btn,.app-bank-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  flex-shrink:0;height:38px;padding:0 13px;border-radius:999px;
  border:1.5px solid #c9d2ff;background:#eef1ff;color:var(--indigo);
  text-decoration:none;font-weight:800;font-size:var(--fs-md);line-height:1;
  font-family:inherit;cursor:pointer;box-shadow:0 1px 4px rgba(61,90,254,.08);
  transition:background .12s,border-color .12s,color .12s,box-shadow .12s;
  white-space:nowrap;-webkit-tap-highlight-color:transparent;
}
.top-nav-btn:hover,.app-home-btn:hover,.app-shop-btn:hover,.app-bank-btn:hover{
  background:#e0e7ff;border-color:var(--indigo-soft,#a5b4fc);
  color:var(--indigo-deep,#312e81);text-decoration:none;
}
.top-nav-btn.ghost,.app-shop-btn{
  border-color:var(--border);background:#fff;color:var(--text);
  box-shadow:0 1px 3px rgba(30,40,80,.04);
}
.top-nav-btn.ghost:hover,.app-shop-btn:hover{background:#F8F9FF;color:var(--indigo);border-color:#C9D2FF;}
.top-nav-btn.primary,.app-bank-btn{
  background:var(--indigo);border-color:var(--indigo);color:#fff !important;
  box-shadow:0 4px 12px rgba(76,99,246,.28);
}
.top-nav-btn.primary:hover,.app-bank-btn:hover{filter:brightness(1.05);color:#fff !important;}
.top-nav-btn.is-here,.app-bank-btn.is-here,.app-home-btn.is-here{
  background:var(--indigo);border-color:var(--indigo);color:#fff !important;
  box-shadow:0 4px 12px rgba(76,99,246,.22);
}
.app-login-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  flex-shrink:0;height:38px;padding:0 15px;
  border-radius:999px;border:1.5px solid var(--border);background:#fff;
  color:var(--text);font-weight:800;font-size:var(--fs-md);line-height:1;cursor:pointer;
  font-family:inherit;box-shadow:0 1px 4px rgba(30,40,80,.05);
  transition:border-color .12s,background .12s,color .12s;
}
.app-login-btn:hover{border-color:#C9D2FF;color:var(--indigo);background:#F8F9FF;}
.app-login-btn:disabled{opacity:.6;cursor:wait;}
.app-login-btn .gicon{width:16px;height:16px;flex-shrink:0;display:block;}
@media(max-width:420px){
  .top-nav-btn,.app-home-btn,.app-shop-btn,.app-bank-btn{padding:0 11px;font-size:13px;height:36px;}
  .app-login-btn{padding:0 12px;font-size:13px;height:36px;}
  .app-top-actions{gap:8px;}
  .app-top-actions .nav-core-btns{gap:6px;}
}
.card.card-hl{outline:2px solid var(--indigo);box-shadow:0 0 0 5px rgba(76,99,246,.16);}
@media (prefers-reduced-motion:reduce){
  .card,.choice,.iconbtn,.subtab,.pill,.shop-subcard{transition:none;}
  .card:hover,.shop-subcard:hover{transform:none;}
}

/* 10a lockup: [icon] CHEMTOP | [문제은행 배지] */
.app-brand{
  display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit;
  flex:1 1 auto;min-width:0;max-width:100%;margin-right:6px;
  -webkit-tap-highlight-color:transparent;
}
.app-brand:hover{text-decoration:none;}
.app-brand .brand-icon{
  width:34px;height:34px;display:block;object-fit:contain;flex-shrink:0;
  background:transparent;/* 흰 박스 배경 없이 벤젠 고리만 */
}
.app-brand .brand-word{
  font-size:19px;font-weight:800;color:#1B6FB4;letter-spacing:.5px;
  white-space:nowrap;line-height:1;flex-shrink:0;
}
.app-brand .brand-divider{
  width:1px;height:28px;background:#dfe3ea;flex-shrink:0;display:block;
}
.app-brand .brand-badge{
  font-size:14.5px;font-weight:800;color:#1B6FB4;background:#eaf3fb;
  padding:6px 12px;border-radius:8px;white-space:nowrap;line-height:1.2;flex-shrink:0;
}
.app-brand:hover .brand-word,.app-brand:hover .brand-badge{filter:brightness(.96);}
.app-brand .brand-logo,.app-brand .brand-mark,.app-brand .brand-product{display:none !important;}
/* 모바일: 아이콘 + 문제은행 배지만 (CHEMTOP 숨김) */
@media(max-width:720px){
  .app-brand{gap:8px;flex:0 0 auto;max-width:none;}
  .app-brand .brand-word{display:none !important;}
  .app-brand .brand-divider{display:none !important;}
  .app-brand .brand-badge{font-size:13px;padding:5px 10px;}
  .app-brand .brand-icon{width:30px;height:30px;}
}
@media(min-width:721px) and (max-width:900px){
  .app-brand .brand-word{font-size:16px;letter-spacing:.3px;}
  .app-brand .brand-badge{font-size:13.5px;padding:5px 10px;}
}



/* ===== design_handoff_chemtop_home · 허브 1a ===== */
:root{
  --hub-accent:#4d5bf0;--hub-accent-dark:#3b48d8;--hub-accent-soft:#eef0fe;
  --hub-ink:#1b1f2a;--hub-sub:#6b7180;--hub-muted:#8990a3;--hub-faint:#a4a9b8;
  --hub-bg:#f4f5f8;--hub-card:#fff;--hub-border:#ececf2;--hub-border2:#e6e8ef;
  --hub-ok:#118049;--hub-ok2:#159a5b;--hub-fire:#c85a1c;--hub-dday:#5b45c9;
}
body.solve-hub{
  background:var(--hub-bg) !important;
  font-family:var(--font-sans);
  color:var(--hub-ink);
  padding:0 !important;
  padding-bottom:calc(88px + env(safe-area-inset-bottom,0px)) !important;
}
body.solve-hub .wrap{
  max-width:var(--page-max,1200px);margin:0 auto;width:100%;padding-left:var(--page-pad,22px);padding-right:var(--page-pad,22px);box-sizing:border-box;
  padding:0 16px 40px !important;
}
@media(min-width:760px){
  body.solve-hub .wrap{padding:0 28px 48px !important;}
}
body.solve-hub .app-topbar{
  position:sticky;top:0;z-index:80 !important;margin:0 -16px 0;padding:10px 16px;
  min-height:60px;height:auto;align-items:center;
  background:rgba(244,245,248,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hub-border);padding-bottom:10px !important;margin-bottom:0 !important;
  pointer-events:auto !important;
}
/* 허브 상단 로그인·계정 — 카드/필터 레이어에 클릭 먹히지 않게 */
body.solve-hub .app-topbar .app-top-account,
body.solve-hub .app-topbar .app-login-btn,
body.solve-hub .app-topbar #googleBtn,
body.solve-hub .app-topbar #authGuest{
  pointer-events:auto !important;
  position:relative;
  z-index:2;
}
body.solve-hub .hub-guest-banner,
body.solve-hub .hub-guest-banner .gb-login,
body.solve-hub .hub-guest-banner .gb-acts{
  pointer-events:auto !important;
  position:relative;
  z-index:2;
}
@media(min-width:760px){
  body.solve-hub .app-topbar{margin:0 -28px;padding:10px 28px;min-height:60px;}
}
@media(max-width:720px){
  body.solve-hub .app-topbar{
    height:auto;min-height:0;padding-top:10px;padding-bottom:10px !important;
  }
}
body.solve-hub .app-topbar .top-nav-btn.ghost,
body.solve-hub .app-topbar .top-nav-btn{box-shadow:none;height:36px;font-weight:600;}
body.solve-hub .app-topbar .top-nav-btn.primary,
body.solve-hub .app-topbar .app-bank-btn.is-here{
  background:var(--hub-accent-soft)!important;color:var(--hub-accent-dark)!important;
  border-color:transparent!important;box-shadow:none!important;
}
/* hide old section chrome */
body.solve-hub .ui-sec-label{display:none;}
body.solve-hub #hubToolsSec{display:none!important;}
body.solve-hub .count{display:none!important;}
body.solve-hub .examblock{
  background:transparent!important;border:0!important;box-shadow:none!important;
  padding:0!important;margin:0!important;
}
body.solve-hub .examrow{display:none!important;}
body.solve-hub .subtabs{display:none!important;} /* 과목은 필터 시트 */

/* main grid */
.hub-main-grid{display:flex;flex-direction:column;gap:0;padding-top:16px;}
.hub-hero-wrap{order:-1;margin-bottom:14px;}
.hub-content{min-width:0;}
@media(min-width:1000px){
  .hub-main-grid{
    display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start;
    padding-top:20px;
  }
  .hub-hero-wrap{order:0;margin-bottom:0;}
  .hub-hero-shell{position:sticky;top:88px;}
}

/* hero — 상단 파란 카드 + 하단 다른 과목 이어서 행 (한 카드) */
.hub-hero-shell{
  border-radius:22px;overflow:hidden;
  box-shadow:0 16px 34px -14px rgba(77,91,240,.55);
  background:#fff;
}
.hub-hero{
  padding:22px;border-radius:0;color:#fff;
  background:linear-gradient(150deg,var(--hub-accent),var(--hub-accent-dark));
  box-shadow:none;
}
.hub-hero-shell:not(:has(.hub-hero-more:not([hidden]))) .hub-hero,
.hub-hero-shell.hh-solo .hub-hero{border-radius:22px;}
.hub-hero .hh-lab{font-size:12.5px;font-weight:600;opacity:.85;letter-spacing:.2px;}
.hub-hero .hh-title{font-size:22px;font-weight:800;margin-top:6px;letter-spacing:-.5px;line-height:1.25;}
.hub-hero .hh-sub{font-size:13.5px;opacity:.88;margin-top:3px;font-weight:600;}
.hub-hero .hh-prog{margin-top:18px;display:flex;align-items:center;gap:11px;}
.hub-hero .hh-bar{flex:1;height:9px;background:rgba(255,255,255,.28);border-radius:99px;overflow:hidden;}
.hub-hero .hh-fill{height:100%;background:#fff;border-radius:99px;width:0;transition:width .6s ease;}
.hub-hero .hh-num{font-size:13px;font-weight:700;white-space:nowrap;}
.hub-hero .hh-acts{display:flex;gap:10px;margin-top:18px;}
.hub-hero .hh-go{
  flex:1;border:0;background:#fff;color:var(--hub-accent-dark);font-weight:800;font-size:15px;
  padding:15px;border-radius:14px;cursor:pointer;font-family:inherit;
}
.hub-hero .hh-restart{
  border:1.5px solid rgba(255,255,255,.55);background:transparent;color:#fff;font-weight:600;font-size:13px;
  padding:0 18px;border-radius:999px;cursor:pointer;font-family:inherit;white-space:nowrap;
}
.hub-hero.empty{opacity:.95;}
.hub-hero.empty .hh-go{opacity:.9;}
/* 다른 과목 이어서 (히어로 하단 흰 행) */
.hub-hero-more{
  background:#fff;margin:0;padding:0;list-style:none;
}
.hub-hero-more[hidden]{display:none !important;}
.hub-hero-more-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;margin:0;padding:15px 18px;
  border:0;border-top:1px solid #eef0f4;
  background:#fff;cursor:pointer;font-family:inherit;text-align:left;
  transition:background .15s ease;
}
.hub-hero-more-row:first-child{border-top:1px solid #e8eaf2;}
.hub-hero-more-row:hover,
.hub-hero-more-row:focus-visible{background:#f7f8fc;outline:none;}
.hub-hero-more-lab{
  flex:1;min-width:0;font-size:14px;font-weight:700;color:#1f2333;
  letter-spacing:-.2px;line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.hub-hero-more-lab .hh-m-pct{font-weight:700;color:#1f2333;}
.hub-hero-more-go{
  flex-shrink:0;font-size:13.5px;font-weight:700;color:var(--hub-accent,#4d5bf0);
  white-space:nowrap;
}
body.bg-eye-dark .hub-hero-shell{background:#1a1c24;box-shadow:0 16px 34px -14px rgba(0,0,0,.45);}
body.bg-eye-dark .hub-hero-more{background:#1a1c24;}
body.bg-eye-dark .hub-hero-more-row{background:#1a1c24;border-top-color:#2a2d38;}
body.bg-eye-dark .hub-hero-more-row:hover,
body.bg-eye-dark .hub-hero-more-row:focus-visible{background:#22252f;}
body.bg-eye-dark .hub-hero-more-lab,
body.bg-eye-dark .hub-hero-more-lab .hh-m-pct{color:#e8eaef;}
body.bg-eye-dark .hub-hero-more-go{color:#9aa6ff;}

/* dash */
.hub-dash{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 4px;
}
@media(min-width:760px){
  .hub-dash{grid-template-columns:repeat(4,1fr);}
}
/* 비로그인: 개인 대시보드 숨김 · 게스트 배너 표시 / 로그인: 반대 */
body.qb-guest .hub-dash{display:none;}
/* 비로그인: 허브 독 복습 탭도 계정 UI와 동일하게 로그인 유도만 */
body.qb-guest #hubTabReview{opacity:.55;}
body.qb-logged-in .hub-guest-banner{display:none !important;}
/* 앱 v2: 비회원 슬림 스트립 */
.hub-guest-banner{
  display:none;margin:0 0 0;padding:11px 16px;border-radius:12px;
  background:#eef0fe;border:1px solid #dfe2fb;color:var(--hub-ink);
}
body.qb-guest .hub-guest-banner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.hub-guest-banner .gb-k{display:none;}
.hub-guest-banner .gb-t{
  margin:0;font-size:12.5px;font-weight:600;color:#3b3f4b;line-height:1.4;
  white-space:normal;flex:1;min-width:0;
}
.hub-guest-banner .gb-t b{color:#3b48d8;font-weight:800}
.hub-guest-banner .gb-s{display:none;}
.hub-guest-banner .gb-acts{display:flex;flex-shrink:0;gap:0;margin:0;}
.hub-guest-banner .gb-acts button,.hub-guest-banner .gb-acts a{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border-radius:9px;padding:8px 14px;font-size:12px;font-weight:700;
  font-family:inherit;cursor:pointer;text-decoration:none;white-space:nowrap;border:0;
}
.hub-guest-banner .gb-login{background:#4d5bf0;color:#fff;}
.hub-guest-banner .gb-login:hover{filter:brightness(1.05);color:#fff;text-decoration:none;}
.hub-guest-banner .gb-free{display:none !important;}
.hub-hero .hh-note{
  margin:10px 0 0;font-size:11.5px;font-weight:600;color:var(--hub-muted);line-height:1.4;
}
body.qb-logged-in .hub-hero .hh-note{display:none;}
.hub-dash-card{
  background:var(--hub-card);border:1px solid var(--hub-border);border-radius:16px;padding:14px 15px;
  cursor:pointer;text-align:left;font-family:inherit;width:100%;
}
.hub-dash-card .dl{font-size:12px;color:var(--hub-muted);font-weight:600;}
.hub-dash-card .dv{display:flex;align-items:baseline;gap:6px;margin-top:5px;}
.hub-dash-card .dn{font-size:20px;font-weight:800;letter-spacing:-.5px;color:var(--hub-ink);}
.hub-dash-card .du{font-size:12.5px;color:var(--hub-muted);font-weight:600;}
.hub-dash-card .dx{font-size:11.5px;font-weight:700;margin-left:auto;}
.hub-dash-card .dh{font-size:11.5px;color:var(--hub-muted);margin-top:9px;font-weight:600;}
.hub-dash-card .dbar{margin-top:9px;height:6px;background:#eef0f4;border-radius:99px;overflow:hidden;}
.hub-dash-card .dfill{height:100%;background:var(--hub-ok2);border-radius:99px;}
.hub-dash-card.due .dn{color:var(--hub-ok);}
.hub-dash-card.fire .dn{color:var(--hub-fire);}
.hub-dash-card.dday .dn{color:var(--hub-dday);}

/* section head */
.hub-sec-hd{
  display:flex;align-items:center;justify-content:space-between;padding:26px 0 0;gap:10px;
}
.hub-sec-hd h2{margin:0;font-size:20px;font-weight:900;letter-spacing:-.4px;color:var(--hub-ink);}
.hub-filter-btn{
  display:inline-flex;align-items:center;gap:6px;border:1px solid #e2e4ee;background:#fff;
  color:#6b7180;font-size:12px;font-weight:700;padding:7px 13px;border-radius:999px;
  cursor:pointer;font-family:inherit;white-space:nowrap;
}

/* 앱 v2: 연도 필터 + 검색 한 줄 → 트랙 칩 */
.hub-filter-toolbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding:0 0 0;
}
.hub-year-scope{
  display:flex;flex-wrap:wrap;gap:6px;padding:0;justify-content:flex-start;
}
.hub-year-scope button{
  border:1px solid #e2e4ee;background:#fff;color:#6b7180;
  font-size:12px;font-weight:600;padding:7px 13px;border-radius:999px;
  cursor:pointer;font-family:inherit;line-height:1.2;
}
.hub-year-scope button.on{
  border-color:#1B1F2E;background:#1B1F2E;color:#fff;font-weight:700;
}
.hub-year-scope button:not(.on):hover{background:#f4f5fb;color:#1B1F2E;}
body.bg-eye-dark .hub-year-scope button{background:#1a1c24;border-color:#2a2d38;color:#a0a6b5;}
body.bg-eye-dark .hub-year-scope button.on{background:#e8eaef;border-color:#e8eaef;color:#1a1d27;}
.hub-exam-search-wrap{
  display:flex;justify-content:flex-start;padding:0;flex:1;min-width:200px;
}
.hub-exam-search{
  display:flex;align-items:center;gap:8px;width:100%;max-width:none;
  padding:9px 16px;border-radius:999px;background:#fff;
  border:1px solid #e2e4ee;box-shadow:none;color:#a4a9b8;
}
.hub-exam-search:focus-within{border-color:#a8b0f0;box-shadow:0 0 0 3px rgba(77,91,240,.12);}
.hub-exam-search input{
  flex:1;min-width:0;border:0;outline:0;background:transparent;
  font-size:12.5px;font-weight:600;color:#1a1d27;font-family:inherit;
}
.hub-exam-search input::placeholder{color:#a4a9b8;font-weight:500;}
body.bg-eye-dark .hub-exam-search{background:#1a1c24;border-color:#2a2d38;color:#9aa0b0;}
body.bg-eye-dark .hub-exam-search input{color:#e8eaef;}

body.solve-hub .tracktabs{
  display:flex;gap:7px;padding:12px 0 0;margin:0;border:0;overflow-x:auto;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:wrap;
}
body.solve-hub .tracktabs::-webkit-scrollbar{display:none;}
body.solve-hub .tracktab{
  flex:none;white-space:nowrap;padding:8px 15px;border-radius:999px;font-size:12.5px;
  font-weight:700;cursor:pointer;border:0;background:#eef0fe;color:#4d5bf0;
  box-shadow:none;margin:0;line-height:1.2;
}
body.solve-hub .tracktab .tcnt{display:none;}
body.solve-hub .tracktab[data-track="g9"],
body.solve-hub .tracktab[data-qb-track="g9"]{background:#eef0fe;color:#4d5bf0}
body.solve-hub .tracktab[data-track="g7"],
body.solve-hub .tracktab[data-qb-track="g7"]{background:#e7f5ee;color:#118049}
body.solve-hub .tracktab[data-track="haegyeong"],
body.solve-hub .tracktab[data-qb-track="haegyeong"]{background:#e6f2fb;color:#0369a1}
body.solve-hub .tracktab[data-track="gisa"],
body.solve-hub .tracktab[data-qb-track="gisa"]{background:#f3ebfe;color:#7c3aed}
body.solve-hub .tracktab[data-track="energy"],
body.solve-hub .tracktab[data-qb-track="energy"]{background:#fdefe4;color:#c85a1c}
body.solve-hub .tracktab.on{color:#fff !important;font-weight:800;box-shadow:none}
body.solve-hub .tracktab.on[data-track="g9"],
body.solve-hub .tracktab.on[data-qb-track="g9"]{background:#4d5bf0}
body.solve-hub .tracktab.on[data-track="g7"],
body.solve-hub .tracktab.on[data-qb-track="g7"]{background:#118049}
body.solve-hub .tracktab.on[data-track="haegyeong"],
body.solve-hub .tracktab.on[data-qb-track="haegyeong"]{background:#0369a1}
body.solve-hub .tracktab.on[data-track="gisa"],
body.solve-hub .tracktab.on[data-qb-track="gisa"]{background:#7c3aed}
body.solve-hub .tracktab.on[data-track="energy"],
body.solve-hub .tracktab.on[data-qb-track="energy"]{background:#c85a1c}

/* ── 9급·7급: 연도 블록 + 과목 카드 그리드 ── */
.hub-civil-year{
  background:#f3f4f8;border-radius:22px;padding:18px 16px 16px;margin:0 0 16px;
}
.hub-civil-year .hcy-hd{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 10px;
  margin:0 0 14px;padding:0 2px;
}
.hub-civil-year .hcy-year{
  font-size:26px;font-weight:900;color:var(--hub-accent,#4C63F6);
  letter-spacing:-.05em;line-height:1.1;font-variant-numeric:tabular-nums;
}
.hub-civil-year .hcy-year .hcy-unit{
  font-size:15px;font-weight:800;margin-left:1px;
}
.hub-civil-year .hcy-meta{
  font-size:13.5px;font-weight:700;color:var(--hub-muted,#8b90a0);
  letter-spacing:-.02em;
}
.hub-civil-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
@media(max-width:380px){
  .hub-civil-grid{grid-template-columns:1fr;}
}
.hub-sub-card{
  background:#fff;border:1px solid #e8eaf0;border-radius:18px;
  padding:16px 14px 14px;display:flex;flex-direction:column;gap:0;
  box-shadow:0 1px 0 rgba(20,24,40,.03);min-width:0;
}
.hub-sub-card .hsc-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:8px;
  margin:0 0 10px;
}
.hub-sub-card .hsc-name{
  font-size:15.5px;font-weight:800;color:var(--hub-ink,#1a1d27);
  letter-spacing:-.03em;line-height:1.3;word-break:keep-all;
}
.hub-sub-card .hsc-pct{
  font-size:14px;font-weight:800;color:var(--hub-accent,#4C63F6);
  white-space:nowrap;flex-shrink:0;letter-spacing:-.02em;
}
.hub-sub-card .hsc-pct.done{color:#0d9f6e;}
.hub-sub-card .hsc-pct.zero{color:#9aa0b0;}
.hub-sub-card .hsc-bar{
  height:7px;background:#e9ebf1;border-radius:99px;overflow:hidden;margin:0 0 14px;
}
.hub-sub-card .hsc-fill{
  height:100%;border-radius:99px;background:var(--hub-accent,#4C63F6);
  width:0;transition:width .45s ease;
}
.hub-sub-card .hsc-fill.done{background:#12b76a;}
.hub-sub-card .hsc-go{
  width:100%;border:0;border-radius:14px;padding:13px 12px;
  font-size:14.5px;font-weight:800;font-family:inherit;cursor:pointer;
  background:var(--hub-accent,#4C63F6);color:#fff;line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
.hub-sub-card .hsc-go:active{transform:scale(.98);}
.hub-sub-card .hsc-go.review{
  background:#fff;color:#6b7280;border:1.5px solid #e5e7eb;font-weight:700;
}
.hub-sub-card.lock{opacity:.72;}
.hub-sub-card.lock .hsc-go{background:#c5c9d6;cursor:default;}
body.bg-eye-dark .hub-civil-year{background:#22252f;}
body.bg-eye-dark .hub-civil-year .hcy-year{color:#a8b4ff;}
body.bg-eye-dark .hub-civil-year .hcy-meta{color:#9aa0b0;}
body.bg-eye-dark .hub-sub-card{background:#1a1c24;border-color:#2a2d38;}
body.bg-eye-dark .hub-sub-card .hsc-name{color:#e8eaef;}
body.bg-eye-dark .hub-sub-card .hsc-bar{background:#2e323c;}
body.bg-eye-dark .hub-sub-card .hsc-go.review{background:#1a1c24;border-color:#3a3f4c;color:#a0a6b5;}

/* ── 앱 v2 연도 카드 (세로 과목 · 무료/이용권 배지 · 잠금 버튼) ── */
.hub-lic-year{
  background:#fff;border:1px solid #e6e8ef;border-radius:16px;
  padding:16px;margin:0;
  box-shadow:none;min-width:0;
}
.hub-lic-year.is-latest{
  box-shadow:0 14px 28px -22px rgba(30,40,90,.25);
}
.hub-lic-year .hly-title{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:5px;
  margin:0 0 2px;line-height:1.15;
}
.hub-lic-year .hly-title .hly-y{
  font-size:22px;font-weight:900;color:#4d5bf0;
  letter-spacing:-.04em;line-height:1.05;font-variant-numeric:tabular-nums;
}
.hub-lic-year.is-locked .hly-title .hly-y{color:#1B1F2E}
.hub-lic-year .hly-title .hly-unit{
  font-size:12px;font-weight:700;color:#9196a3;
  letter-spacing:-.02em;margin-left:0;
}
.hub-lic-year .hly-title .hly-lab{
  display:none; /* 제목 라벨은 별도 행 */
}
.hub-lic-year .hly-badge{
  margin-left:auto;font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:999px;
  white-space:nowrap;line-height:1.3;
}
.hub-lic-year .hly-badge.free{color:#118049;background:#e7f5ee}
.hub-lic-year .hly-badge.lock{color:#c85a1c;background:#fdefe4}
.hub-lic-year .hly-series{
  font-size:13px;font-weight:800;color:#1B1F2E;margin:0 0 0;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
}
.hub-lic-year .hly-sess{
  display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;
}
.hub-lic-year .hly-sess button{
  border:0;border-radius:999px;padding:7px 12px;min-width:0;
  font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;
  background:#eef0f4;color:#6b7280;line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
.hub-lic-year .hly-sess button.on{
  background:#4d5bf0;color:#fff;box-shadow:none;
}
.hub-lic-year .hly-sess button.lock{opacity:.5;}
.hub-lic-year .hly-sublab{
  font-size:10.5px;font-weight:700;color:#9196a3;
  margin:10px 0 6px;letter-spacing:-.02em;
}
/* 과목 칩 — 세로 스택 · 풀네임 */
.hub-lic-year .hly-subs{
  display:flex;flex-direction:column;gap:6px;margin:0 0 11px;
}
.hub-lic-year .hly-sub{
  display:flex;align-items:center;gap:7px;width:100%;
  border:0;border-radius:9px;padding:9px 11px;
  background:#f1f2f6;color:#a4a9b8;font-family:inherit;cursor:pointer;
  text-align:left;font-size:11.5px;font-weight:700;line-height:1.25;
  -webkit-tap-highlight-color:transparent;min-width:0;
}
.hub-lic-year .hly-sub .hly-num{
  flex-shrink:0;width:17px;height:17px;border-radius:5px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:9.5px;font-weight:800;background:#e2e4ee;color:#a4a9b8;
}
.hub-lic-year .hly-sub .hly-sn{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  letter-spacing:-.02em;
}
.hub-lic-year .hly-sub.on{
  background:#4d5bf0;color:#fff;font-weight:800;box-shadow:none;
}
.hub-lic-year .hly-sub.on .hly-num{
  background:rgba(255,255,255,.25);color:#fff;
}
/* 잠긴 카드의 선택 칩 = 옅은 인디고 */
.hub-lic-year.is-locked .hly-sub.on{
  background:#eef0fe;color:#3b48d8;
}
.hub-lic-year.is-locked .hly-sub.on .hly-num{
  background:#dfe2fb;color:#4d5bf0;
}
.hub-lic-year .hly-sub.lock{opacity:1;}
.hub-lic-year .hly-acts{
  display:flex;gap:7px;
}
.hub-lic-year .hly-acts button{
  flex:1;border-radius:10px;padding:9px 8px;font-size:12px;
  font-weight:800;font-family:inherit;cursor:pointer;line-height:1.2;
  border:1px solid #e6e8ef;background:#fff;color:#5b6070;
  -webkit-tap-highlight-color:transparent;white-space:nowrap;
}
.hub-lic-year .hly-acts button.study-on{
  border:1px solid #dfe2fb;background:#eef0fe;color:#3b48d8;
}
.hub-lic-year .hly-acts button.test-on{
  border:1px solid #e6e8ef;background:#fff;color:#5b6070;
}
/* 잠금: 학습·시험 동일 — 🔒 + 회색 필 (전 과목 통일) */
.hub-lic-year .hly-acts button.is-lock,
.hub-lic-year .hly-acts button.is-lock-ghost{
  border:0;background:#f1f2f6;color:#8990a3;font-weight:700;cursor:pointer;
}
.hub-lic-year .hly-acts button:disabled{opacity:1;cursor:default;}
body.bg-eye-dark .hub-lic-year .hly-acts button.is-lock,
body.bg-eye-dark .hub-lic-year .hly-acts button.is-lock-ghost{
  background:#2a2d38;color:#8b90a0;border:0;
}
body.bg-eye-dark .hub-lic-year{background:#1a1c24;border-color:#2a2d38;}
body.bg-eye-dark .hub-lic-year .hly-title .hly-y{color:#a8b4ff;}
body.bg-eye-dark .hub-lic-year.is-locked .hly-title .hly-y{color:#e8eaef;}
body.bg-eye-dark .hub-lic-year .hly-title .hly-unit{color:#9aa0b0;}
body.bg-eye-dark .hub-lic-year .hly-series{color:#e8eaef;}
body.bg-eye-dark .hub-lic-year .hly-sess button{background:#2a2d38;color:#a0a6b5;}
body.bg-eye-dark .hub-lic-year .hly-sub{background:#22252f;color:#c8cdd8;}
body.bg-eye-dark .hub-lic-year .hly-sub .hly-num{background:#2e323c;color:#9aa0b0;}
body.bg-eye-dark .hub-lic-year .hly-acts button{background:#1a1c24;border-color:#3a3f4c;color:#a0a6b5;}
body.bg-eye-dark .hub-lic-year .hly-acts button.study-on{background:#252a45;color:#a8b4ff;}

/* ── 해경: 연도 + 과목 가로 행 (학습 →) ── */
.hub-hae-year{margin:0 0 20px;}
.hub-hae-year .hhy-hd{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 10px;
  margin:0 0 12px;padding:0 2px;
}
.hub-hae-year .hhy-year{
  font-size:26px;font-weight:900;color:var(--hub-accent,#4C63F6);
  letter-spacing:-.05em;line-height:1.1;font-variant-numeric:tabular-nums;
}
.hub-hae-year .hhy-year .hhy-unit{
  font-size:15px;font-weight:800;margin-left:1px;
}
.hub-hae-year .hhy-meta{
  font-size:14px;font-weight:700;color:var(--hub-muted,#8b90a0);
  letter-spacing:-.02em;
}
.hub-hae-list{
  background:#eef0f5;border-radius:22px;padding:12px;display:flex;flex-direction:column;gap:10px;
}
.hub-hae-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border-radius:16px;padding:16px 14px 16px 18px;
  box-shadow:0 1px 0 rgba(20,24,40,.04);min-width:0;
}
.hub-hae-row .hhr-name{
  font-size:16px;font-weight:800;color:var(--hub-ink,#1a1d27);
  letter-spacing:-.03em;line-height:1.3;word-break:keep-all;
}
.hub-hae-row .hhr-go{
  flex-shrink:0;border:0;border-radius:999px;padding:11px 16px;
  font-size:14px;font-weight:800;font-family:inherit;cursor:pointer;
  background:#2f5f9e;color:#fff;line-height:1.2;white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.hub-hae-row .hhr-go:active{transform:scale(.98);}
.hub-hae-row .hhr-go.review{
  background:#fff;color:#5b6475;border:1.5px solid #e5e7eb;
}
.hub-hae-row .hhr-go.cont{background:var(--hub-accent,#4C63F6);}
.hub-hae-row.lock{opacity:.72;}
.hub-hae-row.lock .hhr-go{background:#c5c9d6;cursor:default;}
body.bg-eye-dark .hub-hae-year .hhy-year{color:#a8b4ff;}
body.bg-eye-dark .hub-hae-list{background:#22252f;}
body.bg-eye-dark .hub-hae-row{background:#1a1c24;}
body.bg-eye-dark .hub-hae-row .hhr-name{color:#e8eaef;}
body.bg-eye-dark .hub-hae-row .hhr-go.review{background:#1a1c24;border-color:#3a3f4c;color:#a0a6b5;}


/* 앱 v2: 연도 카드 그리드 — PC 4열 */
#examCardGrid.hub-year-grid{
  display:grid;grid-template-columns:1fr;gap:14px;margin-top:18px;
}
@media(min-width:640px){
  #examCardGrid.hub-year-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(min-width:960px){
  #examCardGrid.hub-year-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(min-width:1200px){
  #examCardGrid.hub-year-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}
#examCardGrid.hub-year-grid > section{margin:0;min-width:0;}

/* round cards — 연도 카드 + 회차 칩(기사 1·2·3회 / 공무원 국가·지방) */
.hub-rounds{display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:760px){
  .hub-rounds{grid-template-columns:1fr 1fr;}
}
.hub-round{
  background:#fff;border:1px solid var(--hub-border);border-radius:18px;padding:16px 16px 14px;
  box-shadow:0 1px 0 rgba(20,24,40,.03);
}
.hub-round .hr-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
/* 제목 가독성 — 연도·시리즈명 강조 */
.hub-round .hr-title{
  font-size:17px;font-weight:900;color:var(--hub-ink);line-height:1.35;
  letter-spacing:-0.03em;word-break:keep-all;
}
.hub-round .hr-tag{font-weight:500;color:var(--hub-muted);font-size:12.5px;margin-left:4px;}
.hub-round .hr-st{font-size:11.5px;color:var(--hub-muted);font-weight:600;white-space:nowrap;}
.hub-round .hr-st.done{color:var(--hub-ok2);font-weight:700;}
.hub-round .hr-st.lock{color:#b91c1c;}
/* 회차 칩 행 */
.hub-round .hr-sess{
  display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 8px;
}
.hub-round .hr-sess button{
  border:0;border-radius:999px;padding:8px 14px;min-width:48px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;
  background:#eef0f4;color:#6b7280;line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
.hub-round .hr-sess button.on{
  background:var(--hub-accent,#4C63F6);color:#fff;
  box-shadow:0 4px 12px rgba(76,99,246,.28);
}
.hub-round .hr-sess button.lock{opacity:.55;}
.hub-round .hr-meta{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:0 0 2px;min-height:18px;
}
.hub-round .hr-date{
  font-size:12.5px;font-weight:600;color:var(--hub-muted,#9196a8);
  letter-spacing:-0.01em;
}
.hub-round .hr-acts{display:flex;gap:8px;margin-top:12px;}
.hub-round .hr-acts button{
  flex:1;padding:11px 10px;border-radius:12px;font-size:14px;cursor:pointer;font-family:inherit;
  border:1px solid #e6e8ef;background:#fff;color:var(--hub-sub);font-weight:700;
  line-height:1.25;
}
.hub-round .hr-acts button .hr-prog{
  font-weight:800;font-size:12.5px;margin-left:4px;opacity:.85;
}
.hub-round .hr-acts button.on{
  border:none;background:var(--hub-accent-soft,#eef1ff);color:var(--hub-accent-dark,#3b48d8);font-weight:800;
}
.hub-round .hr-acts button.on .hr-prog{opacity:1;}
.hub-round .hr-acts button:disabled{opacity:.45;cursor:default;}
.hub-resume-inline{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:0 0 10px;padding:13px 16px;border:1.5px dashed #b9c0f6;background:#f4f6ff;
  border-radius:14px;font-family:inherit;cursor:pointer;width:100%;text-align:left;
}
.hub-resume-inline b{font-size:13px;font-weight:600;color:var(--hub-accent-dark);}
.hub-resume-inline span{font-size:13px;font-weight:800;color:var(--hub-accent-dark);white-space:nowrap;}
.hub-all-row{
  grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border:1px dashed #c9d2ff;border-radius:14px;background:#f8f9ff;
  font-family:inherit;cursor:pointer;width:100%;text-align:left;margin-top:4px;
}
.hub-all-row b{font-size:13.5px;font-weight:800;color:var(--hub-accent-dark);}
.hub-all-row span{font-size:12px;color:var(--hub-muted);font-weight:600;}

/* hide dual CTA on hub — entry from cards/hero */
body.solve-hub .hub-dock-cta,
body.solve-hub .hub-select-bar{display:none!important;}
body.solve-hub .hub-dock{
  max-width:100%;border-top:1px solid #eceef3;background:#fff;
  padding:9px 0 max(18px,env(safe-area-inset-bottom));
  box-shadow:none;
}
body.solve-hub .hub-dock-tabs button{color:var(--hub-faint);font-size:11px;font-weight:600;gap:3px;padding:4px;}
body.solve-hub .hub-dock-tabs button.on{color:var(--hub-accent);font-weight:700;}
body.solve-hub .hub-dock-tabs button .ico{width:23px;height:23px;}
body.solve-hub .hub-dock-tabs button .ico svg{width:23px;height:23px;stroke-width:1.9;}
@media(min-width:1000px){
  body.solve-hub .hub-dock{display:none!important;}
  body.solve-hub{padding-bottom:24px!important;}
}

/* filter dropdown (버튼 바로 아래) */
.hub-filter-wrap{position:relative;flex-shrink:0;}
.hub-filter-btn.on{border-color:var(--hub-accent);color:var(--hub-accent-dark);background:var(--hub-accent-soft);}
.hub-filter-drop{
  display:none;position:absolute;right:0;top:calc(100% + 8px);z-index:60;
  width:min(320px,calc(100vw - 32px));background:#fff;border:1px solid #e2e4ee;
  border-radius:16px;padding:14px 14px 12px;
  box-shadow:0 12px 36px rgba(20,24,44,.14);
}
.hub-filter-drop.show{display:block;}
.hub-filter-lab{font-size:12px;font-weight:700;color:var(--hub-muted);margin:0 0 8px;}
.hub-filter-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.hub-filter-chips button{
  padding:7px 12px;border-radius:999px;font-size:12.5px;font-weight:600;cursor:pointer;
  font-family:inherit;border:1px solid #e6e8ef;background:#fff;color:var(--hub-sub);
}
.hub-filter-chips button.on{background:var(--hub-accent);color:#fff;border-color:var(--hub-accent);font-weight:700;}
.hub-filter-chips button.on-soft{background:var(--hub-accent-soft);color:var(--hub-accent-dark);border-color:transparent;font-weight:700;}
.hub-filter-apply{
  width:100%;border:0;background:var(--hub-accent);color:#fff;font-weight:800;font-size:14px;
  padding:11px;border-radius:12px;cursor:pointer;font-family:inherit;margin-top:2px;
}


/* keep year scope UI inside filter only — hide old scope bar in card grid when redesign */
body.solve-hub .exam-scope-bar,
body.solve-hub .exam-year-chips,
body.solve-hub .exam-year-block,
body.solve-hub .exam-row,
body.solve-hub .exam-row-all,
body.solve-hub .exam-resume-chip{display:none!important;}

/* hide old quickbar chips visual — replaced by dash */
body.solve-hub #hubQuickSec .ui-sec-label,
body.solve-hub #quickbar{display:none!important;}
body.solve-hub #hubQuickSec{margin:0;padding:0;min-height:0;}

/*
 * 다크 테마 최종 고정 (스타일시트 맨 끝)
 * — 소프트 필 선지(밝은 !important) / 흰 캔버스 규칙이 다크를 덮어
 *   지문이 흰 배경+연한 글자로 안 보이던 사고 방지
 */
body.bg-eye-dark.solve-play,
body.solve-play.bg-eye-dark{
  background:#12151c !important;
  color:#e8eaef !important;
  --bg:#1c1f26;
  --bg-soft:#2a303c;
  --card:#252a33;
  --border:#3a4050;
  --text:#e8eaef;
  --sub:#a8b0c0;
  --muted:#8b93a7;
}
body.bg-eye-dark.solve-play .solve-shell,
body.bg-eye-dark.solve-play #solveShell,
body.bg-eye-dark.solve-play .solve-layout,
body.bg-eye-dark.solve-play .solve-scroll,
body.bg-eye-dark.solve-play .solve-main,
body.bg-eye-dark.solve-play .solve-side,
body.bg-eye-dark.solve-play .solve-mini,
body.bg-eye-dark.solve-play .solve-nav,
body.bg-eye-dark.solve-play #solveNav,
body.bg-eye-dark.solve-play .solve-mini-prog,
body.solve-play.bg-eye-dark .solve-shell,
body.solve-play.bg-eye-dark .solve-layout,
body.solve-play.bg-eye-dark .solve-scroll,
body.solve-play.bg-eye-dark .solve-main,
body.solve-play.bg-eye-dark .solve-side,
body.solve-play.bg-eye-dark .solve-mini,
body.solve-play.bg-eye-dark .solve-nav{
  background:#252a33 !important;
  color:#e8eaef !important;
  border-color:#3a4050 !important;
}
body.bg-eye-dark.solve-play .solve-main .card,
body.bg-eye-dark.solve-play .solve-main .stem,
body.bg-eye-dark.solve-play .solve-main .card-head,
body.bg-eye-dark.solve-play .solve-main .card-head-slim,
body.bg-eye-dark.solve-play .solve-main .tag-title,
body.bg-eye-dark.solve-play .solve-main .solve-card-exam,
body.bg-eye-dark.solve-play .solve-main .solve-card-prog,
body.solve-play.bg-eye-dark .solve-main .card,
body.solve-play.bg-eye-dark .solve-main .stem{
  background:transparent !important;
  color:#e8eaef !important;
  -webkit-text-fill-color:#e8eaef !important;
  opacity:1 !important;
}
body.bg-eye-dark.solve-play .solve-main .stem,
body.solve-play.bg-eye-dark .solve-main .stem{
  color:#e8eaef !important;
  -webkit-text-fill-color:#e8eaef !important;
  font-weight:700;
}
body.bg-eye-dark.solve-play .solve-main .solve-card-exam,
body.bg-eye-dark.solve-play .solve-main .solve-card-prog,
body.bg-eye-dark.solve-play .solve-main .tag-title{
  color:#a8b0c0 !important;
  -webkit-text-fill-color:#a8b0c0 !important;
}
/* 선지 — 소프트 다크 필 (밝은 f0f2f6 !important 덮기) */
body.bg-eye-dark.solve-play .solve-main .choice,
body.solve-play.bg-eye-dark .solve-main .choice,
body.bg-eye-dark.solve-play .choice{
  background:#2a303c !important;
  color:#e8eaef !important;
  border:0 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.picked,
body.solve-play.bg-eye-dark .solve-main .choice.picked{
  background:#2a3358 !important;
  color:#e8eaef !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct,
body.solve-play.bg-eye-dark .solve-main .choice.correct{
  background:#163a2c !important;
  color:#e8eaef !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong,
body.solve-play.bg-eye-dark .solve-main .choice.wrong{
  background:#3a2222 !important;
  color:#e8eaef !important;
}
body.bg-eye-dark.solve-play .solve-main .cnum,
body.solve-play.bg-eye-dark .solve-main .cnum{
  background:#3a4254 !important;
  color:#c5cdd8 !important;
  border:0 !important;
  box-shadow:none !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.picked .cnum{
  background:#4d5bf0 !important;
  color:#fff !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct .cnum{
  background:#14532d !important;
  color:transparent !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong .cnum{
  background:#450a0a !important;
  color:transparent !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.correct .cnum::after{
  color:#6ee7b7 !important;
}
body.bg-eye-dark.solve-play .solve-main .choice.wrong .cnum::after{
  color:#fca5a5 !important;
}
/* 하단 선지 점 · 이전 버튼 */
body.bg-eye-dark.solve-play .solve-nav .solve-choice-dot,
body.bg-eye-dark.solve-play .solve-choice-dot{
  background:#2a303c !important;
  border-color:#4a5164 !important;
  color:#c5cdd8 !important;
}
body.bg-eye-dark.solve-play .solve-nav .solve-choice-dot.picked,
body.bg-eye-dark.solve-play .solve-choice-dot.picked{
  background:#4d5bf0 !important;
  border-color:#4d5bf0 !important;
  color:#fff !important;
}
body.bg-eye-dark.solve-play .solve-nav #solvePrevBtn{
  background:#2a303c !important;
  border-color:#4a5164 !important;
  color:#c5cdd8 !important;
}
body.bg-eye-dark.solve-play .solve-side-tabs{
  background:#252a33 !important;
  border-bottom-color:#3a4050 !important;
}
body.bg-eye-dark.solve-play .solve-side .feedback{
  background:#2a303c !important;
  border-color:#3a4050 !important;
  color:#e8eaef !important;
}
body.bg-eye-dark.solve-play .diagram,
body.bg-eye-dark.solve-play .choicesImgWrap{
  background:#1c1f26 !important;
  border-color:#3a4050 !important;
}

/* ── 시안 9 「소프트 카드」 전면 적용 (2026-07-30 운영자: 「이대로 해」) ──
   학습 모드 한정 — 시험·CBT 는 기존 그대로. 워시 바탕 + 떠 있는 카드 한 장. */
body.solve-play.mode-study{--qb-wash:#EDF0F6;--qb-card:#FFFFFF;}
body.solve-play.mode-study.bg-eye-warm{--qb-wash:#F3EDE0;--qb-card:#FBF7EE;}
body.solve-play.mode-study.bg-eye-green{--qb-wash:#EDF6ED;--qb-card:#F8FCF8;}
/* ⛔ 셸까지 같은 지면색으로 칠한다 — 하단 네비가 position:fixed 라 흐름에서 빠져 있고,
 * 셸이 잡아 둔 여백(80px)이 실제 바 높이(65px)보다 커서 그 차이만큼 **흰 셸이 띠로 드러난다**
 * (2026-08-01 운영자 폰 캡처 · 실측 15px). 네비는 자기 배경을 따로 칠하므로 바는 영향 없다. */
body.solve-play.mode-study:not(.bg-eye-dark) .solve-shell,
body.solve-play.mode-study:not(.bg-eye-dark) #solveShell,
body.solve-play.mode-study:not(.bg-eye-dark) .solve-scroll,
body.solve-play.mode-study:not(.bg-eye-dark) .solve-layout,
body.solve-play.mode-study:not(.bg-eye-dark) .solve-main,
body.solve-play.mode-study:not(.bg-eye-dark) .solve-side{background:var(--qb-wash) !important;}
body.solve-play.mode-study:not(.bg-eye-dark) .solve-mini{background:var(--qb-wash) !important;}
body.solve-play.mode-study:not(.bg-eye-dark) .solve-main .card{
  background:var(--qb-card);border:0;border-radius:18px;
  box-shadow:0 8px 24px rgba(16,24,40,.08);padding:16px 16px 10px;margin-top:10px;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .card{
  border-radius:18px;box-shadow:0 8px 24px rgba(0,0,0,.4);padding:16px 16px 10px;margin-top:10px;
}
/* 상단: 원형 버튼 배경 제거 — 시안은 글리프만 */
body.solve-play.mode-study .solve-mini-exit,
body.solve-play.mode-study .solve-mini-more{
  background:transparent !important;box-shadow:none !important;border:0 !important;color:#5b6070;
}
body.solve-play.mode-study.bg-eye-dark .solve-mini-exit,
body.solve-play.mode-study.bg-eye-dark .solve-mini-more{color:#8A96A6;}
/* 순번 분리 표기 */
.card-head-3t .solve-card-prog b{
  font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1;
  font-variant-numeric:tabular-nums;flex:0 0 auto;
}
.card-head-3t .solve-card-prog .prog-rest{
  font-size:12px;color:#667085;font-weight:600;margin-left:3px;letter-spacing:-.01em;
}
.card-head-3t #solveCardExamLab{font-size:12px;color:#667085;font-weight:600;}
.card-head-3t #solveCardExamLab::before{content:'· ';}
body.bg-eye-dark .card-head-3t .solve-card-prog .prog-rest,
body.bg-eye-dark .card-head-3t #solveCardExamLab{color:#8A96A6;}
body.bg-eye-dark .solve-card-subj{color:#8A96A6;}
/* 회독 칸 — 시안의 넓은 알약 칸 */
.card-head-3t .seen-strip .seen-cells{display:inline-flex;gap:4px;border-radius:0;overflow:visible;}
.card-head-3t .seen-strip i{width:26px;height:7px;border-radius:3px;border-right:0;background:#E6EAF1;}
.card-head-3t .seen-strip i.ok{background:var(--ok);}
.card-head-3t .seen-strip i.no{background:#F0A9A0;}
.card-head-3t .seen-strip i.no::after{content:none;}
.card-head-3t .seen-strip i.now{background:var(--qb-card,#fff);box-shadow:inset 0 0 0 1.5px var(--indigo);}
body.bg-eye-dark .card-head-3t .seen-strip i{background:#343a47;}
body.bg-eye-dark .card-head-3t .seen-strip i.no{background:#7c3a32;}
/* 선지 — 카드 안 부드러운 행 + 사각 번호 배지 (O/X·선택 상태 색은 기존 규칙 유지) */
body.solve-play.mode-study .solve-main .choice{border-radius:12px;padding:13px 14px;}
/* 3770행 「소프트 필」의 background:#f0f2f6 !important 를 이기려면 여기도 !important */
body.solve-play.mode-study:not(.bg-eye-dark) .solve-main .choice:not(.picked):not(.correct):not(.wrong){background:#F4F6FA !important;}
body.solve-play.mode-study.bg-eye-warm .solve-main .choice:not(.picked):not(.correct):not(.wrong){background:#F2ECDD !important;}
body.solve-play.mode-study .solve-main .choice:not(.picked):not(.correct):not(.wrong) .cnum{
  width:22px;height:22px;border-radius:7px;background:var(--qb-card,#fff);color:#667085;
  font-size:11.5px;box-shadow:0 1px 2px rgba(16,24,40,.10);
  font-variant-numeric:tabular-nums;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice:not(.picked):not(.correct):not(.wrong) .cnum{
  background:#0F141B;box-shadow:none;color:#8A96A6;
}
/* 하단 바 — 이전·목록은 텍스트, 다음만 버튼 (시안 9) */
/* #solveNav.solve-nav ID 규칙(bg #fff !important)이 이겨서 여기도 ID 로 */
body.solve-play.mode-study:not(.bg-eye-dark) .solve-nav,
body.solve-play.mode-study:not(.bg-eye-dark) #solveNav.solve-nav{background:var(--qb-card,#fff) !important;}
/* 시력보호(녹): 선지·빈 회독 칸도 녹 계열 (청회색 F4F6FA 금지) */
body.solve-play.mode-study.bg-eye-green .solve-main .choice:not(.picked):not(.correct):not(.wrong){background:#EAF3EA !important;}
body.solve-play.mode-study.bg-eye-green .card-head-3t .seen-strip i:not(.ok):not(.no):not(.now){background:#DFE9DF;}
/* 학습지(크림): 빈 회독 칸 크림 계열 */
body.solve-play.mode-study.bg-eye-warm .card-head-3t .seen-strip i:not(.ok):not(.no):not(.now){background:#E6DECD;}
/* 정답 보기 칩·현재 칸 링은 테마 카드색을 따른다 */
body.solve-play.mode-study:not(.bg-eye-dark) .reveal-row .rv-chip{background:var(--qb-card,#fff);}
/* 학습지(크림) 악센트 = 잉크 남색 (시안 ㄴ · v9.t-warm --acc:#1C3D8F) */
body.solve-play.mode-study.bg-eye-warm #solveNextBtn{background:#1C3D8F !important;border-color:#1C3D8F !important;color:#F7F3EA !important;}
body.solve-play.mode-study.bg-eye-warm .solve-side-toolrow .expbtn{border-color:#1C3D8F !important;color:#1C3D8F !important;background:#FBF7EE !important;}
body.solve-play.mode-study.bg-eye-warm .solve-mini-prog i,
body.solve-play.mode-study.bg-eye-warm #solveMiniProgFill{background:#1C3D8F !important;}
body.solve-play.mode-study.bg-eye-warm .card-head-3t .seen-strip i.now{box-shadow:inset 0 0 0 1.5px #1C3D8F;}
body.solve-play.mode-study #solvePrevBtn,
body.solve-play.mode-study #solvePickBtn{
  background:none !important;border:0 !important;box-shadow:none !important;
  color:#68738A !important;font-size:13px;font-weight:600;
  min-width:0 !important;max-width:none !important;padding:10px 8px !important;flex:0 0 auto !important;
}
body.solve-play.mode-study .solve-nav{justify-content:flex-start !important;}
body.solve-play.mode-study .solve-nav-mid{flex:0 0 auto !important;}
/* 시안 1 슬롯 (S2-P45): [진도][목록] … [이전][다음].
   오른쪽 묶음의 **첫 요소**가 auto 여백을 갖는다 — 그래야 이전·다음이 붙어서 함께 밀린다.
   ⛔ auto 를 #solveNextBtn 으로 되돌리지 말 것: 「이전」만 왼쪽 무리에 남아
      시험 하단 바(이전·다음이 붙어 있음)와 다시 어긋난다. */
body.solve-play.mode-study #solvePrevBtn{margin-left:auto !important;}
body.solve-play.mode-study #solveNextBtn{margin-left:8px !important;border-radius:10px !important;}
/* 카드 머리에는 **문항 번호만**, 분모(/820)는 하단 바에서만 (S2-P48).
   2026-07-31 운영자: 카드 머리와 하단에 `1/820` 이 두 번 → 중복은 **분모**다.
   ⛔ 번호까지 지우지 말 것 — 시험 카드 머리에도 번호(`1.`)는 있다. 「시험엔 진도가 없다」로
      뭉뚱그려 `.solve-card-prog` 를 통째로 숨겼다가 번호가 사라졌다(운영자 지적으로 되돌림).
      두 모드의 공통은 「번호는 카드에, 분모는 하단에」다.
   ⛔ `.solve-card-prog` 는 살려 둘 것 — PC 는 회차 라벨이 숨겨져 있어 이 요소의
      margin-right:auto 가 오른쪽 묶음(북마크·정답보기)을 미는 **유일한 밀개**다. */
body.solve-play.mode-study .card-head-3t .solve-card-prog .prog-rest{display:none !important;}
/* 회차명은 좌우를 나누는 세로 구분선 위 — 두 판의 한가운데 (S2-P48, 시험 제목과 같은 규칙).
   ⛔ 흐름 배치(flex:1 + text-align)로는 ×·진도와 도구 묶음의 폭 차이만큼 밀려 628 에 놓인다
      (구분선은 720 · 실측). 절대 배치로 바의 한가운데에 못 박는다.
   ⛔ 판(.solve-layout)은 min(1560, 100vw-72) 를 가운데 두므로 판 중심 = 바 중심이다 —
      50% 가 곧 구분선이다. 별도 계산이 필요 없다.
   ⛔ 흐름에서 빠지면 오른쪽 도구가 왼쪽으로 붙는다 → 도구에 자동 여백을 준다. */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-mini-center{
  position:absolute;left:50%;transform:translateX(-50%);
  flex:none;width:auto;max-width:min(46%,560px);padding:0;
  justify-content:center;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-mini-right{margin-left:auto;}
/* ── 야간 테마 = 시안 ㄹ (2026-07-30 운영자 확정 · 판정색 포함) ──
   학습 모드 한정. 기존 다크 끝 블록(#163a2c 계열)보다 뒤라 순서로 이긴다. */
/* ⛔ .solve-layout·.solve-shell 을 빼지 말 것 — 앞선 다크 블록이 이 둘을 #252a33 로 칠해 두는데
 * 지면(#0F141B)과 달라서 **해설 밑에 띠**로 드러난다 (2026-08-01 좌표 훑기로 확인). */
body.solve-play.mode-study.bg-eye-dark .solve-shell,
body.solve-play.mode-study.bg-eye-dark #solveShell,
body.solve-play.mode-study.bg-eye-dark .solve-scroll,
body.solve-play.mode-study.bg-eye-dark .solve-layout,
body.solve-play.mode-study.bg-eye-dark .solve-main,
body.solve-play.mode-study.bg-eye-dark .solve-side,
body.solve-play.mode-study.bg-eye-dark .solve-mini{background:#0F141B !important;}
body.solve-play.mode-study.bg-eye-dark .solve-main .card{background:#171E27 !important;}
body.solve-play.mode-study.bg-eye-dark .solve-nav{background:#121820 !important;}
body.solve-play.mode-study.bg-eye-dark .solve-side-tabs{background:transparent !important;border-bottom-color:#26303C !important;}
/* 선지 — 발광 테두리 + 8% 틴트 (면을 꽉 칠하면 어두운 화면에서 부신다) */
body.solve-play.mode-study.bg-eye-dark .solve-main .choice{
  background:#1F2833 !important;color:#E7ECF3 !important;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.picked{
  background:rgba(140,155,255,.14) !important;color:#C7D0FF !important;
  box-shadow:inset 0 0 0 1.5px #8C9BFF !important;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.correct{
  background:rgba(67,214,154,.12) !important;color:#43D69A !important;
  box-shadow:inset 0 0 0 1.5px #43D69A !important;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.wrong{
  background:rgba(255,122,107,.12) !important;color:#FF7A6B !important;
  box-shadow:inset 0 0 0 1.5px #FF7A6B !important;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice:not(.picked):not(.correct):not(.wrong) .cnum{
  background:#0F141B !important;color:#8A96A6 !important;
}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.correct .cnum{background:#43D69A !important;}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.wrong .cnum{background:#FF7A6B !important;}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.correct .cnum::after{color:#0F141B !important;}
body.solve-play.mode-study.bg-eye-dark .solve-main .choice.wrong .cnum::after{color:#0F141B !important;}
/* 회독 칸 — 판정색 동일 계열 · 현재 칸 링은 다크 악센트 */
body.solve-play.mode-study.bg-eye-dark .card-head-3t .seen-strip i{background:#26303C;}
body.solve-play.mode-study.bg-eye-dark .card-head-3t .seen-strip i.ok{background:#43D69A;}
body.solve-play.mode-study.bg-eye-dark .card-head-3t .seen-strip i.no{background:#8A4038;}
body.solve-play.mode-study.bg-eye-dark .card-head-3t .seen-strip i.now{background:#171E27;box-shadow:inset 0 0 0 1.5px #8C9BFF;}
/* 하단 — 텍스트 이전·목록 뮤트, 다음은 다크 악센트 */
/* 기존 다크 블록의 #solvePrevBtn 알약(bg #2a303c · ID 특이도)을 이기려면 여기도 ID+다크 */
body.solve-play.mode-study.bg-eye-dark .solve-nav #solvePrevBtn,
body.solve-play.mode-study.bg-eye-dark .solve-nav #solvePickBtn,
body.solve-play.mode-study.bg-eye-dark #solvePrevBtn,
body.solve-play.mode-study.bg-eye-dark #solvePickBtn{
  background:none !important;border:0 !important;box-shadow:none !important;color:#8A96A6 !important;
}
body.solve-play.mode-study.bg-eye-dark #solveNextBtn{background:#8C9BFF !important;border-color:#8C9BFF !important;color:#0F141B !important;}
/* 도구 칩 — AI 해설만 채움, 나머지는 윤곽 */
body.solve-play.mode-study.bg-eye-dark .solve-side-toolrow .expbtn{background:#8C9BFF !important;border-color:#8C9BFF !important;color:#0F141B !important;}
body.solve-play.mode-study.bg-eye-dark .solve-side-toolrow .memobtn,
body.solve-play.mode-study.bg-eye-dark .solve-side-toolrow .ink-card-btn,
body.solve-play.mode-study.bg-eye-dark .solve-side-toolrow .toolmorebtn{
  background:transparent !important;border:1px solid #26303C !important;color:#8A96A6 !important;
}

/* ═══ PC 학습 화면 · 우측 해설 상시 (시안 방향 1 · 2026-07-30) ═══
   표시 여부는 JS(syncStudySideExplain)가 hidden 속성으로 정한다.
   좁은 화면에서도 hidden 이 걸리므로 여기서 미디어 쿼리로 또 가리지 않는다. */
.exp-lab{
  display:none !important; /* 칩 「AI 해설」과 같은 말 — 버튼 아래 라벨은 빼 둔다 */
  font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--muted);
  margin:2px 0 8px;text-transform:none;
}
.exp-lab[hidden]{display:none !important;}
.exp-gate{
  background:#EDF0F6;border:1px dashed #C6CCDA;border-radius:12px;
  padding:22px 16px;text-align:center;margin-top:2px;
}
.exp-gate[hidden]{display:none !important;}
.exp-gate b{display:block;font-size:13.5px;font-weight:800;color:var(--text);margin-bottom:5px;}
.exp-gate p{margin:0 0 13px;font-size:12.5px;color:var(--sub);line-height:1.6;}
.exp-gate-go{
  border:0;background:#3D5AFE;color:#fff;border-radius:10px;padding:10px 20px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;line-height:1.2;
}
.exp-gate-go:hover{filter:brightness(1.06);}
/* 테마별 바탕 — 해설 게이트는 「빈 자리」라 카드보다 한 단 어둡게 */
body.bg-eye-warm .exp-gate{background:#F3ECDD;border-color:#DDD0B4;}
body.bg-eye-warm .exp-gate-go{background:#1C3D8F;}
body.bg-eye-green .exp-gate{background:#E7F1E7;border-color:#C6D9C6;}
body.bg-eye-green .exp-gate-go{background:#2F6B4F;}
body.bg-eye-dark .exp-gate{background:#141A22;border-color:#26303C;}
body.bg-eye-dark .exp-gate b{color:#E6EAF0;}
body.bg-eye-dark .exp-gate p{color:#8A96A6;}
body.bg-eye-dark .exp-gate-go{background:#8C9BFF;color:#0F141B;}
body.bg-eye-dark .exp-lab{color:#8A96A6;}
/* AI 해설 박스 자체의 테마 대응 — 기존엔 테마 규칙이 아예 없어서 야간에 흰 박스·흰 글씨였다.
   눌러야 열리던 시절엔 잘 안 보였지만 방향 1 이후로는 매 문항 뜨므로 반드시 맞춰야 한다. */
body.bg-eye-dark .expbox{background:#141A22;border-color:#26303C;color:#C7D0DB;}
body.bg-eye-dark .expbox b{color:#E6EAF0;}
body.bg-eye-dark .expbox code{background:#1E2733;color:#A9B6C6;}
body.bg-eye-warm .expbox{background:#F6F0E3;border-color:#DDD0B4;}
body.bg-eye-warm .expbox code{background:#EDE2CB;}
body.bg-eye-green .expbox{background:#EDF6ED;border-color:#C6D9C6;}
body.bg-eye-green .expbox code{background:#DDEBDD;}
/* ═══════════ 시안 가 · 옅은 면 (2026-07-31 운영자 확정) ═══════════
 *
 * 골격: 풀블리드 2단 — 카드 껍데기를 벗기고 두 단이 화면 높이를 끝까지 쓴다.
 *       (떠 있는 흰 패널은 위아래가 남아서 폐기됐다 · 운영자 지적)
 * 구분: 본문은 흰색, 상·하단 바만 옅은 회색 면(#F6F7FA)+1px 경계.
 * 조판: 기존 시안 9 스킨 그대로 — 고딕 본문·소프트 선지.
 *   ⛔ 본문에 명조(세리프)를 쓰지 말 것. 2026-07-31 에 「시험지 조판」으로 한 번 넣었다가
 *      「폰트 가독성 안 좋다」로 되돌렸다 — 한글 명조는 화면에서 획이 가늘다.
 * 적용 범위: body.solve-pc-study = PC 좌우 분할 + 학습 **에서만**.
 *   ⛔ 모바일·한 화면(stack)·시험 CBT 는 한 글자도 건드리지 않는다.
 * 도구 칩: **우측 단**에 둔다 (좌측은 문제·선지만) — S2-PCSIDE-T.
 */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt){
  /* 시안 A · 워시 바탕 + 흰 판 — 바탕을 내리고 작업면만 밝힌다.
     ⛔ 바탕(--pc-ground)과 판(--pc-surf)을 같은 색으로 만들지 말 것.
        둘이 같으면 「면」이 성립하지 않아 콘텐츠가 흰 공간에 둥둥 뜬다 (2026-07-31 운영자 지적). */
  --pc-ground:#EDF0F5; --pc-surf:#FFFFFF; --pc-bar:#E4E8EF; --pc-ln:#D8DEE7;
  /* PC 학습만 스테이지를 넓힌다 (2026-07-31 운영자: 최대폭이 너무 작다).
     1100 은 2열에서 열당 550 이라 수식·도표가 계속 넘쳤다 → 1560 상한, 열당 ~770.
     ⛔ 전역 토큰(body.solve-play)을 바꾸지 말 것 — 시험 CBT·모바일까지 끌려간다.
     같은 요소(body)에 선언돼 있어 --solve-chrome-pad-* 가 자동으로 따라온다(바 정렬 유지).
     100vw-72 는 작은 노트북에서 좌우 여백이 사라지지 않게 하는 하한이다. */
  --solve-content-max:min(1560px, calc(100vw - 72px));
}
/* 좌우 독립 스크롤의 전제: 셸이 화면 높이에 갇혀야 한다.
   ⛔ 기존 PC 셸은 `display:block` + `min-height:100vh` 라 스크롤 컨테이너가 내용만큼
      늘어나고 **문서 전체**가 스크롤된다 (실측: 판은 안 구르고 document 가 1155px 굴렀다).
      ID 특이도(#solveShell.solve-shell)로 박혀 있어 여기도 ID 로 맞선다. */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) #solveShell.solve-shell{
  display:flex !important; flex-direction:column !important;
  /* ⛔ height 에 !important 를 빼지 말 것 — 없으면 셸이 내용만큼 늘어나
     (실측 624 → 1895) 문서가 대신 스크롤된다. max-height 로 한 번 더 못 박는다. */
  height:100vh !important; height:100dvh !important;
  max-height:100vh !important; max-height:100dvh !important;
  min-height:0 !important; overflow:hidden !important;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-scroll{
  background:var(--pc-ground) !important;
  /* 좌우 독립 스크롤 — 바깥은 안 구르고 판이 각자 구른다 (2026-07-31 운영자 요청) */
  flex:1 1 auto !important; min-height:0 !important;
  overflow-y:hidden !important;
  /* ⛔ 판 높이를 100vh 계산이나 100% 로 맞추려 하지 말 것 —
     vh 계산은 하단바 padding 과 이중으로 빠져 아래가 57px 떴고(실측),
     100% 는 스크롤 컨테이너에서 해소되지 않아 판이 444px 로 쪼그라들었다.
     flex 로 실제 레이아웃에 맡기는 게 유일하게 맞는 방법이다. */
  display:flex !important; flex-direction:column !important;
}
/* 두 단이 각각 흰 판 — 판이 밴드 높이를 꽉 채워 위아래가 남지 않는다 */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-main,
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-side{
  background:var(--pc-surf) !important;
  border:1px solid var(--pc-ln) !important; border-radius:10px !important;
  /* ⛔ min-height:0 을 빼지 말 것 — 그리드 아이템은 기본 min-height:auto 라
     콘텐츠만큼 늘어나 판이 스크롤되지 않고 화면 밖으로 나간다. */
  overflow-y:auto !important; overflow-x:hidden !important; min-height:0 !important;
  /* ⛔ 판 스크롤바는 숨기지도 꾸미지도 않는다 — 문제·해설을 위아래로 보려면 필요하다
     (2026-07-31 운영자: 「우측 긴 스크롤은 유지」). 꾸미면 macOS 오버레이가
     항상 보이는 고전 막대로 바뀌므로 플랫폼 기본 그대로 둔다. */
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-layout{
  /* ⛔ 폭을 하드코딩하지 말 것 — 기존 토큰 --solve-content-max(1100px) 가 정본이다.
     상·하단 바의 내용물도 그 토큰에서 나온 --solve-chrome-pad-* 로 정렬되므로,
     여기만 다른 값을 쓰면 바와 본문이 어긋난다 (2026-07-31 실측: 1380 하드코딩으로 어긋났다). */
  max-width:var(--solve-content-max, 1100px) !important; width:100% !important; margin:0 auto !important;
  background:transparent !important;
  /* 문제·해설 동일 폭 (운영자 요청) — 고정 440 이면 넓은 화면에서 해설만 좁게 남는다 */
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; align-items:stretch !important;
  /* 좌우 16px = 상·하단 바의 --solve-chrome-pad-* 와 같은 안쪽 여백.
     판의 **바깥선**이 바 내용물과 맞아야 세로로 정렬돼 보인다 (실측으로 5px 어긋났다). */
  gap:14px !important; padding:14px 16px !important; flex:1 1 auto !important;
  min-height:0 !important;

}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-main{
  padding:20px 20px 16px !important; margin:0 !important;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-main .card{
  background:transparent !important; box-shadow:none !important; border:0 !important;
  border-radius:0 !important; padding:0 !important; margin:0 !important;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-side{
  box-shadow:none !important; margin:0 !important; padding:0 18px 16px !important;
  position:static !important; top:auto !important;
  max-height:none !important;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-mini{
  background:var(--pc-bar) !important; border-bottom:1px solid var(--pc-ln) !important;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-nav,
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) #solveNav.solve-nav{
  background:var(--pc-bar) !important; border-top:1px solid var(--pc-ln) !important;
}
/* 회차명은 상단 바 가운데로 — 카드 머리의 중복 라벨은 뺀다 (시안 그대로) */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-mini-center,
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-mini-title{
  display:block !important; font-size:14px !important; font-weight:800 !important;
  color:var(--text) !important; text-align:center;
}
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .card-head-3t #solveCardExamLab{ display:none !important; }
/* 과목명은 번호와 한 묶음 — PC 에서 회차 라벨을 숨겨도 남긴다 */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .card-head-3t .solve-card-subj{ display:inline-block !important; }
/* 회차 라벨을 상단 바로 올리면서 「정답 보기」·북마크가 순번 바로 옆에 붙었다.
   모바일처럼 오른쪽 끝으로 — 순번 뒤를 자동 여백으로 밀어낸다 (2026-07-31 운영자 지적). */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .card-head-3t .card-title-row .solve-card-prog{
  margin-right:auto !important;
}
/* 중복 아이콘 제거 (운영자 지적) — 북마크는 카드 머리에 이미 있고, 필기는 우측 칩에 있다 */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) #solveInkMiniBtn{ display:none !important; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt):not(.solve-ink-on) .solve-ink-bar,
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt):not(.solve-ink-on) #solveInkBar{ display:none !important; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-side-tabs{ margin:0 -18px !important; padding:0 18px !important; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) #solveSideTools{ display:flex !important; padding-top:14px; }
/* 하단 바 — 진도·목록 좌 / 키보드 힌트 중앙 / 다음 우.
   ⛔ 기존 900px+ 규칙이 .solve-nav-mid 를 absolute 중앙에 박는다 — 목록이 힌트에 낀다 */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt) .solve-nav{ position:relative; }
body.solve-play.solve-pc-study .solve-nav-mid{
  position:static !important; transform:none !important;
  flex:0 0 auto !important; margin-right:auto; justify-content:flex-start;
}
.solve-kbd-hints{ display:none; }
body.solve-pc-study .solve-kbd-hints{
  display:flex; gap:16px; align-items:center;
  position:absolute; left:50%; transform:translateX(-50%);
  font-size:11px; font-weight:700; color:#98A0AC; white-space:nowrap; pointer-events:none;
}
.solve-kbd-hints kbd{
  font-family:inherit; background:#F1F3F8; border:1px solid #E4E7EC; border-bottom-width:2px;
  border-radius:5px; padding:1px 6px; font-size:10px; font-weight:800; color:#5E6478;
}
/* 테마별 — 면 색만 갈아 끼운다 (조판은 동일) */
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt).bg-eye-warm{ --pc-ground:#EFE7D6; --pc-surf:#FBF7EE; --pc-bar:#E9DFC9; --pc-ln:#DDD0B4; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt).bg-eye-green{ --pc-ground:#E7F1E7; --pc-surf:#F8FCF8; --pc-bar:#DDEBDD; --pc-ln:#C6D9C6; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt).bg-eye-dark{ --pc-ground:#0F141B; --pc-surf:#171E27; --pc-bar:#121820; --pc-ln:#26303C; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt).bg-eye-dark .solve-kbd-hints{ color:#5C6673; }
body.solve-play.mode-study.solve-pc-study:not(.exam-cbt).bg-eye-dark .solve-kbd-hints kbd{ background:#1E2733; border-color:#26303C; color:#8A96A6; }

/* ═══ 하단 「이전 · 목록」 — 텍스트처럼 작아 누르기 어렵다 (2026-07-31 운영자 지적) ═══
   실측 39×36 · 13px · 배경 없음 → 옆의 「다음 문제」(46px 채움)와 위계가 과했다.
   면을 주고 손가락 크기를 확보한다. 모바일 44px(탭 기준) · PC 40px.
   ⛔ @media(max-width:420px) 의 축소 규칙(padding:10px 8px·12px)과 특이도가 같으므로
      이 블록이 **시트 끝**에 있어야 이긴다 — 위로 옮기지 말 것. */
body.solve-play .solve-nav #solvePrevBtn,
body.solve-play .solve-nav #solvePickBtn,
body.solve-play .solve-nav button.solve-pick-btn{
  min-height:44px !important; padding:0 16px !important;
  font-size:14px !important; font-weight:700 !important;
  border-radius:10px !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  background:#F1F3F8 !important; border:1px solid #E4E7EC !important;
  color:#4A5468 !important; flex-shrink:0;
  max-width:none !important; width:auto !important;
}
body.solve-play .solve-nav #solvePrevBtn:disabled{ opacity:.42 !important; }
/* ⛔ 주 버튼이 보조 버튼보다 작아지면 위계가 뒤집힌다 — 이전·목록을 키운 만큼 같이 올린다
   (실측: 모바일 다음 41 vs 이전 44 · 390px 에서는 34 vs 44 로 역전됐다) */
body.solve-play .solve-nav #solveNextBtn{ min-height:44px !important; }
/* PC: 바가 이미 옅은 회색이라 판처럼 흰 면으로 */
body.solve-play.solve-pc-study .solve-nav #solvePrevBtn,
body.solve-play.solve-pc-study .solve-nav #solvePickBtn,
body.solve-play.solve-pc-study .solve-nav button.solve-pick-btn{
  min-height:40px !important; background:#FFFFFF !important; border-color:#D8DEE7 !important;
}
/* 야간 */
body.bg-eye-dark.solve-play .solve-nav #solvePrevBtn,
body.bg-eye-dark.solve-play .solve-nav #solvePickBtn,
body.bg-eye-dark.solve-play .solve-nav button.solve-pick-btn{
  background:#1E2733 !important; border-color:#2B3542 !important; color:#A9B6C6 !important;
}
/* 전사 검수 화면 (관리자 · 전사검수 탭)
 * 문제 하나를 **네 벌**로 놓는다: 원본 · 사용자 화면 · 후보 둘.
 * 칸마다 문제와 선지가 다 들어가야 통째로 비교된다 — 자리별 격자는 눈이 따라가지 못했다. */
.tr-wrap{display:flex;flex-direction:column;gap:10px;}
.tr-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--sub);}
.tr-prog{flex:1;min-width:120px;height:6px;border-radius:3px;background:var(--border);overflow:hidden;}
.tr-prog>div{height:100%;background:var(--indigo);transition:width .2s;}
.tr-count b{color:var(--text);font-size:13px;}
.tr-keys{font-size:11px;opacity:.75;}
.tr-srcflt{display:inline-flex;gap:4px;}
.tr-srcflt .tr-btn{padding:4px 9px;font-size:12px;}
.tr-srcflt .tr-btn.is-on{border-color:var(--indigo);background:var(--indigo);color:#fff;}
.tr-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;}
.tr-meta>b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;}
.tr-kind{padding:1px 7px;border-radius:9px;background:var(--indigo);color:#fff;font-size:11px;font-weight:700;}
.tr-kind.is-stem{background:#0b8;}
.tr-sub,.tr-ans{padding:1px 7px;border-radius:9px;border:1px solid var(--border);color:var(--sub);font-size:11px;}
.tr-live{padding:1px 7px;border-radius:9px;background:#0b8;color:#fff;font-size:11px;font-weight:600;}
.tr-open{margin-left:auto;font-size:11px;color:var(--sub);text-decoration:underline;}
.tr-stem{font-size:15px;line-height:1.6;padding:9px 12px;border-radius:8px;background:var(--card);border:1px solid var(--border);}

/* 네 벌 */
.tr-panels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:start;}
/* 후보 없는 항목(그록잔존): 원본·사용자 화면 두 장만 — 원본을 넓게 본다 */
.tr-panels.tr-nocand{grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:1500px){ .tr-panels{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:820px){ .tr-panels{grid-template-columns:1fr;} .tr-panels.tr-nocand{grid-template-columns:1fr;} }
.tr-pane{border:1px solid var(--border);border-radius:10px;padding:9px 11px;background:var(--card);
  min-width:0;overflow-wrap:anywhere;}
.tr-pane[onclick]{cursor:pointer;border-width:2px;}
.tr-pane[onclick]:hover{border-color:var(--indigo);}
.tr-pane.is-src{background:#fbfbfe;}
.tr-pane.is-live{background:#f7fbff;}
.tr-pane-hd{display:flex;align-items:center;gap:6px;margin-bottom:7px;font-size:12px;color:var(--sub);
  border-bottom:1px solid var(--border);padding-bottom:5px;}
.tr-pane-hd b{color:var(--text);font-size:13px;}
.tr-orig{margin:0 0 8px;}
.tr-alt[hidden]{display:none;}
.tr-orig img,.tr-orig canvas{max-width:100%;height:auto;}
.tr-srcpre{margin:0 0 6px;font-size:12.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word;
  font-family:var(--font-sans);max-height:300px;overflow:auto;color:#333;}
.tr-nosrc{font-size:12px;color:var(--sub);padding:2px 0 8px;}
.tr-imgs{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;padding:8px;border-radius:8px;background:#fff;border:1px solid var(--border);}
.tr-imgs img{max-width:100%;max-height:260px;height:auto;object-fit:contain;}
.tr-imgs a{display:inline-block;line-height:0;}
.tr-imgs a:hover img{outline:2px solid var(--indigo);outline-offset:2px;}
.tr-ch{margin:8px 0 0;padding-left:20px;font-size:14px;line-height:1.6;}
.tr-ch li{margin:3px 0;word-break:break-word;}
.tr-ch li.tr-brokenli{list-style:none;margin-left:-20px;}
/* 후보가 새로 채운 자리 — 어디가 바뀌는지 한눈에 */
.tr-ch li.tr-newli{background:rgba(99,102,241,.09);border-radius:4px;padding:1px 4px;}
.tr-broken{color:var(--no);font-size:12px;font-style:italic;}
.tr-empty{color:var(--no);font-style:italic;font-size:13px;}
.tr-rendered .katex{font-size:1.0em;}
.tr-raw{display:none;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--sub);word-break:break-all;margin-top:4px;}
body.tr-showraw .tr-raw{display:block;}

.tr-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:sticky;bottom:0;
  padding:8px 0;background:linear-gradient(180deg,transparent,var(--card) 40%);}
.tr-btn{padding:7px 13px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:13px;font-weight:600;cursor:pointer;}
.tr-btn:hover{border-color:var(--indigo);}
.tr-btn.is-a,.tr-btn.is-b{border-color:var(--indigo);}
.tr-btn.is-img{border-color:#0b8;}
.tr-btn.is-nosrc{border-color:#c33;}
.tr-bar kbd,.tr-pane-hd kbd,.tr-btn kbd{display:inline-block;min-width:16px;padding:0 4px;border-radius:4px;border:1px solid var(--border);background:rgba(127,127,127,.12);font-size:11px;font-family:ui-monospace,Menlo,monospace;}
body.bg-eye-dark .tr-imgs{background:#e9e9ee;}
body.bg-eye-dark .tr-pane.is-src,body.bg-eye-dark .tr-pane.is-live{background:var(--card);}
/* 해설의 글머리표·번호 줄 — 내어쓰기 (2026-08-08)
 * renderExp 는 줄을 <br> 로만 잇는다. 그래서 번호 줄이 넘어가면 본문이 왼쪽 끝으로
 * 돌아와 번호와 붙어 버린다. 해설은 오답 정리가 대부분이라 번호 줄이 계속 나온다.
 * 줄 전체를 inline-block 으로 싸고 첫 줄만 내어쓴다. */
.exp-li{display:inline-block;max-width:100%;padding-left:1.25em;text-indent:-1.25em;}