/* Routine.js와 같은 정의. 크기 토큰이 --font-scale을 품어야 「전체 글자 크기」가
   실제로 화면에 반영된다. --font-scale은 이 블록보다 먼저 선언돼야 한다. */
:root {--font-scale:1;
  --fs-25:calc(25px * var(--font-scale));--fs-20:calc(20px * var(--font-scale));
  --fs-18:calc(18px * var(--font-scale));--fs-17:calc(17px * var(--font-scale));
  --fs-15:calc(15px * var(--font-scale));--fs-12:calc(12px * var(--font-scale));
  --fs-10:calc(10px * var(--font-scale));--fs-9:calc(9px * var(--font-scale));
  --fs-8:calc(8px * var(--font-scale));
  /* 6.9.5: 스케일에 구멍이 있었다. 여러 곳이 --fs-11 · --fs-13 · --fs-14 · --fs-16 을 쓰는데
     정의가 없어 **그 font-size 선언이 통째로 무효**가 되고 크기가 상속됐다. 정의되지 않은
     커스텀 속성은 오류가 아니라 '무효한 값'이라 조용히 무시된다 — 화면이 깨지지 않고
     그냥 다른 크기로 그려지므로 눈으로는 못 찾는다. 실제로 쓰이는 단을 채운다. */
  --fs-16:calc(16px * var(--font-scale));--fs-14:calc(14px * var(--font-scale));
  --fs-13:calc(13px * var(--font-scale));--fs-11:calc(11px * var(--font-scale));
  color-scheme: light;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
  /* ROUTINE SHARED TOKENS v1 — 기준: 루틴.js SHELL_HTML :root (docs/DESIGN_TOKENS.md) */
  --bg: #f4f5f7;
  --bg-2: #dce4ef;
  --surface: rgba(255, 255, 255, 0.86);
  --surface-solid: #fff;
  --surface-soft: #edf1f6;
  --text: #17191c;
  --muted: #727780;
  --faint: #9aa0a8;
  --line: rgba(24, 28, 34, 0.09);
  --accent: #527ba0;
  --accent-2: #7fa8c9;
  --accent-soft: rgba(82, 123, 160, 0.12);
  --success: #248a5a;
  --danger: #d94c4c;
  --shadow: 0 14px 36px rgba(25, 35, 45, 0.09);
  --radius: 22px;
  --jp-font:
    "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --nav-bg: rgba(246, 248, 250, 0.78);
  --overlay: rgba(236, 240, 245, 0.8);
  --font-scale: 1;
  --p0: var(--bg-2); --p1: #acd5f2; --p2: var(--accent-2);
  --card: var(--surface); --card-solid: var(--surface-solid); --border: var(--line);
  --track: rgba(35,40,48,.11); --ease: cubic-bezier(.22,.8,.22,1);
  
  /* Routine 3.9.5 Golden Design Contract */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;
  --type-screen:var(--fs-25);--type-section:var(--fs-18);--type-card:var(--fs-17);--type-body:var(--fs-15);--type-support:var(--fs-12);--type-caption:var(--fs-10);--type-micro:var(--fs-9);
  --radius-control:12px;--radius-compact:16px;--radius-card:20px;--radius-sheet:24px;--touch-min:44px;
--score: var(--accent); --severity: var(--danger); --value: var(--text);
}
html[data-theme="dark"] {
  color-scheme: dark;
  /* 기준: 루틴.js 다크 토큰 + THEME_PALETTES.blue.dark */
  --bg: #101311;
  --bg-2: #2b4c6f;
  --surface: rgba(28, 33, 29, 0.88);
  --surface-solid: #1c211d;
  --surface-soft: #232a25;
  --text: #f2f4f2;
  --muted: #9aa19c;
  --faint: #7d847f;
  --line: rgba(255, 255, 255, 0.09);
  --accent: #7cb3e6;
  --accent-2: #5282b4;
  --accent-soft: rgba(124, 179, 230, 0.14);
  --success: #4fbf8f;
  --danger: #e06a6a;
  --shadow: 0 16px 38px rgba(0, 0, 0, 0.28);
  --nav-bg: rgba(20, 24, 21, 0.78);
  --overlay: rgba(12, 15, 13, 0.82);
  --track: rgba(255,255,255,.12);
}
html[data-jp-font="klee"] {
  --jp-font:
    "Klee One", "KleeOne-Regular", "Hiragino Sans", "Yu Gothic", sans-serif;
}
* {
  box-sizing: border-box;
  min-width: 0;
}
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  background: var(--bg);
}
body {
  margin: 0;
  min-height: 100dvh;
  padding: calc(var(--safe-t) + 58px) max(14px, env(safe-area-inset-left))
    calc(86px + var(--safe-b)) max(14px, env(safe-area-inset-right));
  color: var(--text);
  font-family:
    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Apple SD Gothic Neo",
    sans-serif;
  /* Routine.js와 같은 식. 배율을 물려야 「전체 글자 크기」가 상속 기반 요소까지 닿는다. */
  font-size: calc(14px * var(--font-scale));
  line-height: 1.5;
  background:
    radial-gradient(
      circle at 92% 4%,
      color-mix(in srgb, var(--accent) 14%, transparent),
      transparent 35%
    ),
    linear-gradient(150deg, var(--bg), var(--bg-2) 120%);
  background-attachment: fixed;
}
[lang="ja"],
.basic-ja,
.basic-coach-ja,
.japanese-line,
.furigana-line {
  font-family: var(--jp-font);
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
button {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
button:active {
  transform: scale(0.985);
}
.hidden {
  display: none !important;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
}
.topbar {
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  right: 0;
  height: calc(58px + var(--safe-t));
  padding-top: var(--safe-t);
  display: grid;
  grid-template-columns: 42px 1fr 42px;
  align-items: center;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg) 92%, transparent),
    color-mix(in srgb, var(--bg) 72%, transparent)
  );
  border-bottom: 1px solid color-mix(in srgb, var(--line) 45%, transparent);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
}
.topbar-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.topbar h1 {
  font-size:var(--fs-17);
  letter-spacing: -0.03em;
  margin: 0;
}
.version-pill {
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size:var(--fs-9);
  font-weight: 900;
  letter-spacing: 0.05em;
}
.top-spacer {
  width: 42px;
}
/* 7.4-D: 같은 컴포넌트가 두 이름을 갖고 있었다 — PWA .icon-button, Routine.js .icon-btn.
   먼저 별칭으로 이름을 합치고, 마크업을 옮긴 뒤에 옛 이름을 뗀다. 지금 이 앱에는
   .icon-btn 을 쓰는 요소가 없으므로 렌더는 그대로다. */
.icon-button,
.icon-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  font-size: 28px;
  line-height: 1;
  color: var(--text);
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.04);
}
.view {
  width: 100%;
  max-width: 650px;
  margin: 0 auto;
  /* v5.9.1 · display:none에서 돌아올 때 opacity 0.55로 시작하면 WebKit이 다크 배경과
     fixed/blur 레이어를 한 프레임 드러낸다. 화면 전환은 라우터의 원자적 표시로 끝낸다. */
}
.immersive-view {
  max-width: 720px;
}
.stack {
  display: grid;
  gap: 13px;
}
.eyebrow {
  margin: 0 0 3px;
  color: var(--accent);
  font-size:var(--fs-9);
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.home-intro,
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 2px 12px;
}
.home-intro h2,
.section-head h2 {
  font-size:var(--fs-25);
  line-height: 1.14;
  letter-spacing: -0.045em;
  margin: 0 0 6px;
}
.home-intro p:not(.eyebrow),
.section-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size:var(--fs-12);
  line-height: 1.55;
}
.mini-link {
  border: 0;
  background: transparent;
  color: var(--accent);
  font-weight: 850;
  padding: 8px 4px;
  white-space: nowrap;
}
.menu-list,
.compact-panel,
.result-card,
.scene-brief,
.voice-composer,
.release-card,
.history-item,
.premium-item,
.talk-evaluation {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.menu-list {
  overflow: hidden;
}
.menu-row {
  width: 100%;
  display: grid;
  grid-template-columns: 34px 1fr 14px;
  align-items: center;
  gap: 10px;
  padding: 15px 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  text-align: left;
}
.menu-row:last-child {
  border-bottom: 0;
}
.menu-row strong {
  display: block;
  font-size: 16px;
  letter-spacing: -0.025em;
}
.menu-row small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}
.menu-row > b {
  font-size: 24px;
  color: var(--accent);
  font-weight: 500;
}
.menu-glyph {
  color: var(--accent);
  font-size:var(--fs-18);
  font-weight: 800;
  letter-spacing: -0.08em;
}
.settings-menu .menu-glyph {
  font-size: 16px;
}
.reuse-head,
.setting-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin: 0 2px 9px;
}
.reuse-head h3,
.setting-title h3 {
  margin: 0;
  font-size:var(--fs-17);
  letter-spacing: -0.025em;
}
.subtle-label,
.setting-value,
.fixed-provider {
  font-size:var(--fs-9);
  color: var(--accent);
  background: var(--accent-soft);
  border-radius: 999px;
  padding: 5px 8px;
  font-weight: 850;
}
.history-list,
.premium-grid,
.release-list {
  display: grid;
  gap: 9px;
}
.recent-item {
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 12px 13px;
  background: var(--surface);
  border: 1px solid var(--line);
/* 7.4-B · 두 클라이언트가 공유하는 의미형 토큰 레이어.
 *
 * 계층은 tokens-base → (이 파일) → 컴포넌트 → 클라이언트 어댑터다. 이 파일은 색을 새로
 * 만들지 않고 PWA 기준값에 이름을 붙인다. 커스텀 속성 참조는 사용 시점에 풀리므로,
 * 뒤 레이어가 --accent 같은 기준 토큰을 다시 선언해도 별칭은 최종값을 따라간다.
 *
 * 여기서 고치는 실측 불일치 세 가지:
 *   1. --warning 이 PWA #c48216 · Routine.js #c77916 로 갈라져 있었다. 같은 상태가 두 앱에서
 *      다른 색이었다는 뜻이라 정본 하나로 합친다.
 *   2. Routine.js 다크가 --success·--danger 를 덮지 않아 어두운 배경에 라이트용 값을 그대로
 *      썼다. PWA 다크값을 두 앱에 같은 방식으로 적용한다.
 *   3. PWA 는 --accent-ink 를 정의한 적이 없는데 var(--accent-ink) 를 한 곳에서 폴백 없이
 *      쓴다. 정의되지 않은 커스텀 속성은 오류가 아니라 '무효한 값'이라 그 선언이 통째로
 *      버려지고 조용히 상속된다. 기본값을 준다.
 *
 * 다크 트리거가 두 앱에서 다르다 — PWA 는 html[data-theme] 를 직접 쓰고 Routine.js 는
 * OS 설정(prefers-color-scheme)만 따른다. 그래서 두 선택자를 함께 적는다. PWA 는
 * data-theme 이 항상 붙으므로 :not([data-theme="light"]) 가 「라이트 고정」을 정확히 뺀다.
 *
 * UI 의미색과 데이터 시각화색은 다른 층이다. 습관·운동·학습·캘린더·문법 레벨 색은 데이터이며
 * 여기의 accent 계열로 접으면 안 된다. tools/color-ratchet.json 이 둘을 나눠 센다.
 */
:root{
  /* surface */
  --surface-base:var(--bg);
  --surface-raised:var(--card,var(--surface));
  --surface-subtle:var(--surface-soft,color-mix(in srgb,var(--card-solid,#fff) 88%,var(--p0,var(--bg))));
  --surface-selected:color-mix(in srgb,var(--accent) 12%,transparent);
  --surface-overlay:var(--overlay,color-mix(in srgb,var(--bg) 82%,transparent));

  /* text */
  --text-primary:var(--text);
  --text-secondary:var(--muted);
  --text-tertiary:var(--faint,color-mix(in srgb,var(--muted) 74%,transparent));
  --text-disabled:color-mix(in srgb,var(--muted) 52%,transparent);
  --text-inverse:var(--accent-ink);

  /* border */
  --border-default:var(--border,var(--line));
  --border-strong:color-mix(in srgb,var(--text) 22%,transparent);
  --border-focus:var(--accent);

  /* accent */
  --accent-primary:var(--accent);
  --accent-hover:var(--accent-strong,color-mix(in srgb,var(--accent) 84%,var(--text)));
  --accent-muted:var(--accent-soft,color-mix(in srgb,var(--accent) 12%,transparent));
  --accent-contrast:var(--accent-ink);

  /* state — --warning 은 여기가 정본이다. 두 클라이언트의 갈라진 선언은 제거했다.
     값은 PWA 의 #c48216 을 그대로 쓰지 않았다. 흰 카드 대비 3.21 로 상태색 가운데 혼자
     낮았기 때문이다(success 4.32 · danger 4.13 · accent 4.47 · Routine 쪽 #c77916 3.40).
     #b26f0f 는 4.06 이라 같은 대역에 들어온다. 라이트 상태색 전체를 AA 4.5 로 올리는 건
     7.4-J 의 접근성 항목이고, 여기서는 혼자 벗어난 하나를 대열에 넣는 데까지만 한다. */
  --state-success:var(--success);
  --state-warning:#b26f0f;
  --state-danger:var(--danger);
  --state-info:var(--accent);
  --warning:var(--state-warning);

  /* correction */
  --correction-delete:var(--danger);
  --correction-insert:var(--success);

  /* Routine.js 는 강조색 명도를 재서 이 값을 인라인으로 다시 정한다. 인라인이 :root 를
     이기므로 여기 값은 두 앱 공통 기본값 역할만 한다. */
  --accent-ink:#fff;

  /* 7.4-C · 색 밖의 계약. spacing 과 글자 크기는 이미 ratchet 이 있고, 모서리·시간·아이콘은
     이름조차 없어서 반지름 25종·지속시간 20종 넘게 갈라졌다. 여기서 이름을 주고
     tools/shape-motion-ratchet.json 이 스케일을 벗어난 선언 수를 단조 감소로 묶는다.
     기존 --radius-control/compact/card/sheet 는 그대로 두고 새 이름을 겹쳐 쓴다. 실제 적용은
     화면을 건드리는 작업이라 7.6-C 의 모션 계약에서 한다. */
  --radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:20px;--radius-pill:999px;
  --motion-tap:120ms;--motion-state:180ms;--motion-surface:240ms;--motion-route:300ms;
  --icon-xs:14px;--icon-sm:16px;--icon-md:18px;--icon-lg:20px;--icon-xl:24px;

  /* 7.7-A · 이름이 없던 나머지 네 계열. 7.4-C 가 모서리와 시간에 한 것과 같은 처방이고,
     이유도 같다 — 이름이 없으면 화면마다 값을 새로 고른다. 지어낸 스케일이 아니라 두 번들에서
     실제로 쓰이는 값을 세어 많이 쓰이는 쪽을 정본으로 삼았다. 재기 전의 상태:

       굵기 38종 · 줄간격 54종 · 투명도 31종 · z-index 35종

     tools/scale-ratchet.json 이 스케일 밖 선언 수를 단조 감소로 묶는다. 기존 선언을 한 번에
     바꾸지 않는다. 새 위반만 0 이고, 화면을 건드릴 때 그 화면 것만 스케일로 옮긴다. */
  --fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-heavy:800;--fw-black:900;
  --lh-none:1;--lh-tight:1.25;--lh-snug:1.35;--lh-normal:1.45;--lh-relaxed:1.55;--lh-loose:1.65;
  --opacity-none:0;--opacity-disabled:.35;--opacity-muted:.55;--opacity-soft:.75;--opacity-full:1;
  /* z-index 는 크기가 아니라 층이다. 값 사이를 띄워 두 층 사이에 끼워 넣을 자리를 남긴다. */
  --z-base:1;--z-raised:10;--z-sticky:20;--z-dock:40;--z-overlay:60;--z-modal:80;--z-toast:100;
}

/* PWA: 사용자가 다크를 고른 경우. Routine.js 에는 data-theme 이 붙지 않는다. */
html[data-theme="dark"]{
  --faint:#7d847f;
  --success:#4fbf8f;
  --danger:#e06a6a;
  --state-warning:#e0a44a;
}

/* Routine.js: OS 다크. PWA 에서도 「라이트 고정」이 아닌 한 같은 값이 된다. */
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]){
    --faint:#7d847f;
    --success:#4fbf8f;
    --danger:#e06a6a;
    --state-warning:#e0a44a;
  }
}

/* Routine Suite 3.4.0 compatibility layer shared settings contract */
.settings-preset-grid-v28,.preset-grid-v28{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.settings-compact-copy-v335{color:var(--muted);font-size:11px;line-height:1.5}
.diagnostics-contract-v335{display:grid;gap:10px}
.diagnostic-section-v335{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.diagnostic-section-v335>header{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}
.diagnostic-section-v335 h3{margin:0;font-size:14px}.diagnostic-section-v335 p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}
.status-badge-v335{display:inline-flex;align-items:center;min-height:25px;padding:4px 8px;border-radius:999px;background:var(--surface-soft);font-size:10px;font-weight:850}
.status-badge-v335.ok{color:var(--success)}.status-badge-v335.warn{color:#a66a00}.status-badge-v335.error{color:var(--danger)}
.usage-source-grid-v335{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.usage-source-grid-v335 article{padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.usage-source-grid-v335 b{display:block;font-size:17px}.usage-source-grid-v335 small{color:var(--muted);font-size:9px}.usage-provider-list-v335{display:grid;gap:7px}.usage-provider-list-v335 article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:11px 12px;border-radius:12px;background:var(--surface-soft)}.usage-provider-list-v335 small{grid-column:1/-1;color:var(--muted);font-size:10px}
@media(max-width:390px){.usage-source-grid-v335{grid-template-columns:1fr}.settings-preset-grid-v28,.preset-grid-v28{grid-template-columns:1fr}}
/* Routine Suite 3.4.0 compatibility layer — PWA-style routing editor and model picker */
.task-route-list-v337{display:grid;gap:12px}.task-route-card-v337{width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);padding:var(--space-4);display:grid;gap:14px;color:var(--text)}.task-route-card-v337>span{display:grid;gap:5px}.task-route-card-v337>span>b{font-size:18px}.task-route-card-v337>span>small{color:var(--muted);line-height:1.45}.route-chain-v337{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px}.route-chain-v337 em{min-width:74px;border:1px solid var(--line);background:var(--surface-soft);border-radius:15px;padding:8px;display:grid;grid-template-columns:auto 1fr;gap:6px;align-items:center;font-style:normal}.route-chain-v337 em.disabled{opacity:.42}.route-chain-v337 i{width:21px;height:21px;border-radius:8px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-style:normal;font-weight:800}.route-chain-v337 span{display:grid;min-width:0}.route-chain-v337 b{font-size:11px;white-space:nowrap}.route-chain-v337 small{font-size:9px;color:var(--muted);white-space:nowrap}.route-picker-list-v337{display:grid;gap:10px;margin:20px 0}.route-slot-v337{display:grid;grid-template-columns:112px 1fr;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius)}.route-slot-v337>span{display:flex;align-items:center;gap:9px}.route-slot-v337 i{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:var(--accent-soft);color:var(--accent);font-style:normal;font-weight:800}.route-slot-v337 select{width:100%;min-width:0;border:1px solid var(--line);background:var(--surface-solid);color:var(--text);border-radius:13px;padding:12px;font:inherit}.model-picker-v337{display:grid;gap:12px;margin-top:18px}.model-search-v337{display:grid;gap:7px;color:var(--muted);font-size:12px}.model-search-v337 input,.custom-model-entry-v337 input{border:1px solid var(--line);background:var(--surface-solid);color:var(--text);border-radius:14px;padding:14px;font:inherit}.model-filter-tabs-v337{display:flex;gap:7px;overflow-x:auto}.model-filter-tabs-v337 button{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:999px;padding:9px 12px;white-space:nowrap}.model-filter-tabs-v337 button.active{background:var(--accent);border-color:var(--accent);color:#fff}.custom-model-entry-v337{display:grid;grid-template-columns:1fr auto;gap:8px}.custom-model-entry-v337 button{border:0;border-radius:14px;padding:0 14px;background:var(--accent-soft);color:var(--accent);font-weight:800}.model-picker-list-v337{display:grid;gap:9px}.model-picker-item-v337{display:grid;grid-template-columns:1fr auto;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);overflow:hidden}.model-picker-item-v337.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.model-picker-select-v337{border:0;background:transparent;color:var(--text);padding:14px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:start;gap:10px;text-align:left}.model-picker-select-v337 span{display:grid;gap:3px;min-width:0}.model-picker-select-v337 b,.model-picker-select-v337 small,.model-picker-select-v337 em{overflow-wrap:anywhere}.model-picker-select-v337 small,.model-picker-select-v337 em{color:var(--muted);font-size:10px;font-style:normal}.model-picker-select-v337 strong{font-size:10px;color:var(--muted);text-align:right}.model-picker-select-v337 i{color:var(--accent);font-style:normal}.model-favorite-v337{width:48px;border:0;border-left:1px solid var(--line);background:transparent;color:var(--muted);font-size:20px}.model-favorite-v337.active{color:var(--accent)}.model-search-entry-v337{margin-bottom:12px}@media(max-width:430px){.route-slot-v337{grid-template-columns:1fr}.model-picker-select-v337{grid-template-columns:minmax(0,1fr) auto}.model-picker-select-v337 strong{grid-column:1/-1;text-align:left}.route-chain-v337 em{min-width:68px}}

  border-radius: 17px;
}
.recent-item .kind {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
}
.recent-item b {
  display: block;
  font-size: 13px;
}
.recent-item small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-10);
  margin-top: 2px;
}
.recent-item > strong {
  font-size: 11px;
  color: var(--accent);
}
.compact-panel {
  padding: 16px;
}
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.form-grid .full {
  grid-column: 1/-1;
}
label {
  display: grid;
  gap: 6px;
  font-size:var(--fs-12);
  font-weight: 760;
}
input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-solid);
  padding: 11px 12px;
  outline: none;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
textarea {
  resize: vertical;
  line-height: 1.55;
}
.primary,
.secondary,
.ghost {
  min-height: 43px;
  border-radius: 14px;
  padding: 11px 14px;
  font-weight: 850;
  border: 1px solid transparent;
}
.primary {
  background: linear-gradient(
    135deg,
    var(--accent),
    color-mix(in srgb, var(--accent) 62%, var(--accent-2))
  );
  color: white;
}
.secondary {
  background: var(--surface-solid);
  border-color: var(--line);
  color: var(--accent);
}
.ghost {
  background: transparent;
  border-color: var(--line);
  color: var(--muted);
}
.full {
  width: 100%;
}
.dual-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.status {
  min-height: 18px;
  margin: 4px 0;
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}
.status.success {
  color: var(--success);
}
.status.error {
  color: var(--danger);
}
.scenario-presets,
.reuse-strip,
.tab-row,
.speed-row,
.pron-basic-tabs {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 1px 1px 7px;
  scrollbar-width: none;
}
.scenario-presets::-webkit-scrollbar,
.reuse-strip::-webkit-scrollbar,
.tab-row::-webkit-scrollbar {
  display: none;
}
.preset-chip,
.chip {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  padding: 8px 12px;
  color: var(--muted);
  font-size:var(--fs-10);
  font-weight: 800;
}
.preset-chip.active,
.chip.active {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}
.reuse-card {
  flex: 0 0 230px;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius:var(--radius-card);
  background: var(--surface);
  text-align: left;
}
.reuse-card b {
  display: block;
  font-size:var(--fs-12);
}
.reuse-card small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-9);
  margin-top: 4px;
}
#scenarioPreview {
  margin-top: 2px;
}
.scenario-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 12px 0;
}
.scenario-meta-grid span,
.mission-preview,
.keigo-focus,
.starter-hints,
.mission-box {
  padding: 11px;
  border-radius: 14px;
  background: var(--surface-soft);
}
.scenario-meta-grid small,
.mission-preview small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-9);
}
.scenario-meta-grid b {
  font-size: 11px;
}
.mission-preview p {
  margin: 4px 0 0;
}
.keigo-focus {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
.keigo-focus b {
  flex: 0 0 auto;
  color: var(--accent);
}
.starter-hints ul {
  margin: 7px 0 0;
  padding-left: 18px;
}
.starter-hints li + li {
  margin-top: 8px;
}
.scene-brief {
  padding: 14px;
  margin-bottom: 9px;
}
.scene-title-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}
.scene-title-line h2 {
  margin: 1px 0 4px;
  font-size:var(--fs-18);
}
.scene-title-line > b {
  font-size:var(--fs-9);
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
}
.scene-brief > p {
  font-size: 11px;
  color: var(--muted);
  margin: 5px 0 10px;
}
.mission-box {
  display: grid;
  gap: 3px;
  font-size: 11px;
}
.mission-box b {
  color: var(--accent);
}
.scenario-progress {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  font-size:var(--fs-9);
  color: var(--muted);
  padding: 0 3px 8px;
}
.scenario-progress div {
  height: 5px;
  border-radius: 999px;
  background: var(--surface-soft);
  overflow: hidden;
}
.scenario-progress i {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: inherit;
}
.study-aid-bar {
  display: flex;
  justify-content: center;
  gap: 5px;
  position: sticky;
  top: calc(61px + var(--safe-t));
  z-index: 8;
  margin-bottom: 9px;
}
.study-aid-bar button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--nav-bg);
  padding: 7px 11px;
  color: var(--muted);
  font-size:var(--fs-9);
  font-weight: 850;
  backdrop-filter: blur(14px);
}
.study-aid-bar button.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.chat-list {
  display: grid;
  gap: 13px;
  padding-bottom: 190px;
}
.turn-block {
  max-width: min(92%, 470px);
}
.ai-turn {
  justify-self: start;
}
.user-turn {
  justify-self: end;
}
.speaker-label {
  margin: 0 7px 4px;
  color: var(--muted);
  font-size:var(--fs-9);
}
.talk-bubble {
  display: block;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  padding: 12px 14px;
  text-align: left;
  line-height: 1.58;
  overflow-wrap: anywhere;
}
.talk-bubble.ai {
  color: var(--text);
}
.talk-bubble.user {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}
.study-expression {
  display: grid;
  gap: 3px;
}
.furigana-line {
  font-size: 0.68em;
  letter-spacing: 0.06em;
  color: var(--accent);
  line-height: 1.25;
}
.japanese-line {
  font-size: 16px;
  font-weight: 500;
}
.meaning-line {
  font-size: 11px;
  color: var(--muted);
  padding-top: 6px;
  border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.talk-bubble.user .meaning-line,
.talk-bubble.user .furigana-line {
  color: rgba(255, 255, 255, 0.8);
}
.correction-card {
  margin-top: 6px;
  border: 1px solid var(--line);
  border-radius:var(--radius-card);
  background: var(--surface);
  overflow: hidden;
}
.correction-card summary {
  display: grid;
  grid-template-columns: 27px 1fr 14px;
  gap: 8px;
  align-items: center;
  padding: var(--space-3);
  cursor: pointer;
  list-style: none;
}
.correction-card summary::-webkit-details-marker {
  display: none;
}
.correction-status {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 900;
}
.correction-card summary b {
  display: block;
  font-size: 11px;
}
.correction-card summary small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
}
.correction-body {
  padding: 0 10px 10px;
  display: grid;
  gap: 7px;
}
.correction-line {
  position: relative;
  padding: 9px;
  border-radius: 11px;
  background: var(--surface-soft);
}
.correction-line > small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
  margin-bottom: 4px;
}
.tiny-listen {
  margin-top: 6px;
  border: 0;
  background: var(--surface-solid);
  border-radius: 8px;
  padding: 5px 8px;
  color: var(--accent);
  font-size:var(--fs-8);
}
.correction-explain {
  font-size:var(--fs-10);
  margin: 1px;
  line-height: 1.5;
}
.grammar-chip {
  width: max-content;
  max-width: 100%;
  font-size:var(--fs-8);
  color: var(--accent);
  background: var(--accent-soft);
  padding: 5px 8px;
  border-radius: 999px;
}
.retry-sentence {
  border: 1px solid var(--line);
  background: var(--surface-solid);
  border-radius: 10px;
  padding: 8px;
  color: var(--accent);
  font-size:var(--fs-9);
}
.voice-composer {
  position: fixed;
  left: max(10px, env(safe-area-inset-left));
  right: max(10px, env(safe-area-inset-right));
  bottom: calc(72px + var(--safe-b));
  max-width: 640px;
  margin: auto;
  padding: 10px;
  z-index: 25;
}
.transcript {
  margin: 0 0 8px;
  color: var(--muted);
  font-size:var(--fs-10);
}
.composer-actions {
  display: grid;
  grid-template-columns: 1fr 56px 1fr;
  gap: 8px;
  align-items: center;
}
.mic-button {
  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  font-size: 19px;
  box-shadow: 0 9px 24px color-mix(in srgb, var(--accent) 28%, transparent);
}
.mic-button.large {
  width: 70px;
  height: 70px;
}
.mic-button.recording {
  background: var(--danger);
  animation: pulse 1s infinite;
}
.draft-review {
  padding: 9px;
  border-radius: 13px;
  background: var(--surface-soft);
  margin-bottom: 8px;
}
.draft-review p {
  font-family: var(--jp-font);
  margin: 4px 0;
  font-size: 13px;
}
.draft-review > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.shadow-card.advanced {
  display: grid;
  grid-template-columns: 27px 1fr;
  gap: 10px;
  padding: var(--space-3);
  margin: 9px 0;
  border: 1px solid var(--line);
  border-radius:var(--radius-card);
  background: var(--surface);
}
.shadow-number {
  width: 26px;
  height: 26px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 900;
}
.shadow-session-head {
  padding: 13px;
  border-radius: 17px;
  background: var(--surface);
}
.shadow-ja {
  font-family: var(--jp-font);
  font-size:var(--fs-17);
  font-weight: 500;
  line-height: 1.6;
  margin: 0;
}
.shadow-aid {
  margin-top: 7px;
}
.shadow-ko {
  font-size: 11px;
  color: var(--muted);
}
.focus-note {
  font-size:var(--fs-9);
  color: var(--muted);
  margin-top: 7px;
}
.shadow-toolbar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 9px;
}
.shadow-toolbar button {
  border: 1px solid var(--line);
  background: var(--surface-solid);
  border-radius: 10px;
  padding: 8px 5px;
  color: var(--accent);
  font-size:var(--fs-8);
}
.shadow-steps {
  display: flex;
  gap: 4px;
  margin-top: 8px;
}
.shadow-steps i {
  height: 4px;
  flex: 1;
  border-radius: 999px;
  background: var(--surface-soft);
}
.record-stage {
  text-align: center;
  padding: 16px 0;
}
.record-stage p {
  font-size:var(--fs-9);
  color: var(--muted);
}
.wave {
  height: 27px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}
.wave i {
  width: 3px;
  height: 7px;
  border-radius: 3px;
  background: var(--muted);
}
.wave.active i {
  animation: wave 0.65s infinite alternate;
}
.wave.active i:nth-child(2),
.wave.active i:nth-child(4) {
  animation-delay: 0.12s;
}
.pron-result,
.result-card {
  padding: var(--space-4);
}
.pron-result-hero {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 12px;
}
.score-ring {
  width: 74px;
  height: 74px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(
    var(--accent) calc(var(--score, 0) * 1%),
    var(--surface-soft) 0
  );
}
.score-ring > span {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--surface-solid);
  text-align: center;
}
.score-ring b {
  display: block;
  font-size: 22px;
}
.score-ring small {
  font-size:var(--fs-8);
}
.score-detail,
.memory-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  margin: 12px 0;
}
.score-detail span,
.memory-summary-grid > div {
  padding: 9px;
  border-radius: 12px;
  background: var(--surface-soft);
  text-align: center;
}
.score-detail small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
}
.score-detail b {
  font-size: 16px;
}
.recognized-card,
.pron-issue,
.perfect-card {
  padding: var(--space-3);
  border-radius:var(--radius-compact);
  background: var(--surface-soft);
}
.pron-issues {
  display: grid;
  gap: 7px;
}
.pron-issue {
  display: grid;
  grid-template-columns: 25px 1fr;
  gap: 8px;
}
.priority {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--surface-solid);
  color: var(--accent);
  font-weight: 900;
}
.pron-issue h4 {
  margin: 1px 0 3px;
}
.pron-issue p,
.pron-issue .tip {
  margin: 0;
  font-size:var(--fs-9);
}
.issue-actions {
  display: flex;
  gap: 5px;
  margin-top: 7px;
}
.issue-actions button {
  border: 0;
  border-radius: 8px;
  padding: 6px;
  background: var(--surface-solid);
  color: var(--accent);
  font-size:var(--fs-8);
}
.pron-basic-tabs {
  flex-wrap: nowrap;
}
.basic-pron-list {
  display: grid;
  gap: 6px;
}
.basic-pron-card {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius:var(--radius-compact);
  background: var(--surface-solid);
  padding: var(--space-3) var(--space-3);
  text-align: left;
}
.basic-pron-card > span {
  display: grid;
}
.basic-ja {
  font-size: 16px;
  font-weight: 400 !important;
  line-height: 1.45;
}
.basic-pron-card small {
  color: var(--muted);
  font-size:var(--fs-9);
}
.basic-pron-card strong {
  color: var(--accent);
  font-size:var(--fs-9);
}
.basic-coach-ja {
  font-size: 23px;
  font-weight: 400 !important;
  margin: 5px 0;
}
.pron-guide {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 8px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  font-size:var(--fs-10);
}
.pron-guide b {
  color: var(--accent);
}
.pron-guide.warn b {
  color: var(--danger);
}
.setting-section {
  margin: 4px 0 20px;
}
.setting-help,
.route-note,
.dialog-note {
  color: var(--muted);
  font-size:var(--fs-10);
  line-height: 1.55;
}
.theme-segments,
.engine-segments,
.profile-segments {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.engine-segments {
  grid-template-columns: repeat(4, 1fr);
}
.theme-segments button,
.engine-segments button,
.profile-segments button {
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-solid);
  padding: 9px 5px;
  color: var(--muted);
  font-size:var(--fs-9);
  font-weight: 850;
}
.theme-segments button.active,
.engine-segments button.active,
.profile-segments button.active {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}
.theme-preview-grid,
.font-choice-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 11px;
}
.theme-preview,
.font-choice-grid button {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 11px;
  background: var(--surface-solid);
  text-align: left;
}
.theme-preview i {
  display: block;
  width: 100%;
  height: 28px;
  border-radius: 9px;
  margin-bottom: 7px;
}
.light-preview i {
  background: linear-gradient(135deg, #fff, #e9f4f7);
}
.dark-preview i {
  background: linear-gradient(135deg, #12191b, #0a3544);
}
.theme-preview b,
.font-choice-grid b {
  font-size: 11px;
}
.theme-preview small,
.font-choice-grid small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
}
.font-choice-grid button span {
  display: block;
  font-size: 14px;
  margin: 7px 0;
}
.font-choice-grid button.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
.voice-control-card {
  display: grid;
  gap: 11px;
}
.voice-summary-button,
.model-summary-button {
  width: 100%;
  display: grid;
  grid-template-columns: 38px 1fr auto;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-solid);
  padding: 10px;
  text-align: left;
}
.model-summary-button {
  grid-template-columns: 1fr auto;
}
.voice-avatar {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 900;
}
.voice-summary-button b,
.model-summary-button b {
  display: block;
  font-size:var(--fs-12);
}
.voice-summary-button small,
.model-summary-button small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-9);
  margin-top: 2px;
}
.voice-summary-button i,
.model-summary-button i {
  font-style: normal;
  color: var(--accent);
  font-size:var(--fs-9);
}
.rate-control {
  grid-template-columns: auto 1fr;
  align-items: center;
}
.voice-action-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 8px;
  align-items: center;
}
.audio-status {
  margin: 0;
  padding: 8px 10px;
  border-radius: 11px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size:var(--fs-9);
  overflow-wrap: anywhere;
}
.audio-status.success {
  color: var(--success);
}
.audio-status.error {
  color: var(--danger);
}
.toggle-line,
.compact-select-line {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}
.toggle-line:last-child,
.compact-select-line:last-child {
  border-bottom: 0;
}
.toggle-line b,
.compact-select-line b {
  display: block;
  font-size: 11px;
}
.toggle-line small,
.compact-select-line small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
  margin-top: 2px;
}
.toggle-line input {
  width: 42px;
}
.compact-select-line select {
  width: 150px;
}
.switch input {
  width: auto;
}
.task-route-list {
  display: grid;
  gap: 8px;
}
.task-route-card {
  width: 100%;
  border: 1px solid var(--line);
  border-radius:var(--radius-card);
  background: var(--surface);
  padding: var(--space-3);
  text-align: left;
}
.task-route-card b {
  font-size:var(--fs-12);
}
.task-route-card small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-9);
  margin-top: 3px;
}
.route-chain {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  margin-top: 9px;
  padding-bottom: 2px;
}
.route-chain em {
  font-style: normal;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  border-radius: 999px;
  background: var(--surface-soft);
  padding: 5px 7px;
  font-size:var(--fs-8);
}
.route-chain em i {
  font-style: normal;
  color: var(--accent);
  font-weight: 900;
}
.route-chain > span {
  color: var(--faint);
}
.fallback-card {
  padding-top: 5px;
  padding-bottom: 5px;
}
.provider-status {
  padding: 11px 16px;
}
.provider-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
}
.provider-row:last-child {
  border-bottom: 0;
}
.provider-row b {
  font-size: 11px;
}
.provider-row small {
  display: block;
  color: var(--muted);
  font-size:var(--fs-9);
  margin-top: 3px;
  overflow-wrap: anywhere;
}
.provider-row em {
  display: block;
  color: var(--faint);
  font-size:var(--fs-8);
  font-style: normal;
  margin-top: 4px;
}
.provider-row .ok {
  color: var(--success);
}
.provider-row .error,
.provider-row .no {
  color: var(--danger);
}
.runtime-diagnostics,
.notice {
  margin-top: 9px;
  border-radius: 16px;
  background: var(--accent-soft);
  padding: 13px;
  color: var(--muted);
  font-size:var(--fs-10);
}
.notice strong {
  color: var(--accent);
}
.release-card,
.history-item,
.premium-item {
  padding: var(--space-4);
}
.release-card.current {
  border-color: color-mix(in srgb, var(--accent) 60%, var(--line));
}
.release-card > div {
  display: flex;
  justify-content: space-between;
}
.release-card > div span {
  font-size:var(--fs-8);
  color: var(--accent);
}
.release-card h3 {
  font-size: 14px;
  margin: 8px 0 4px;
}
.release-card p,
.release-card li {
  font-size:var(--fs-10);
  color: var(--muted);
}
.release-card ul {
  padding-left: 17px;
}
.release-card li + li {
  margin-top: 4px;
}
.bottom-nav {
  position: fixed;
  z-index: 45;
  left: 50%;
  bottom: max(8px, var(--safe-b));
  transform: translateX(-50%);
  width: min(330px, calc(100% - 28px));
  height: 58px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 5px;
  border: 1px solid color-mix(in srgb, var(--line) 110%, transparent);
  border-radius: 22px;
  background: var(--nav-bg);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.13);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
}
.bottom-nav button {
  border: 0;
  border-radius: 17px;
  background: transparent;
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size:var(--fs-10);
  font-weight: 800;
}
.bottom-nav button svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.bottom-nav button.active {
  background: var(--accent-soft);
  color: var(--accent);
}
body[data-view="scenarioRoom"] .bottom-nav {
  display: none;
}
body[data-view="scenarioRoom"] {
  padding-bottom: calc(176px + var(--safe-b));
}
.loading-overlay {
  position: fixed;
  z-index: 200;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--overlay);
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
}
.loader-card {
  width: min(340px, calc(100% - 38px));
  padding: var(--space-6);
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--surface);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.18);
  text-align: center;
}
.loader-brand {
  color: var(--accent);
  font-size:var(--fs-9);
  font-weight: 900;
  letter-spacing: 0.18em;
}
.loader-orb {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  margin: 0 auto 14px;
  background:
    radial-gradient(circle at 35% 30%, #fff 0 8%, transparent 9%),
    linear-gradient(145deg, var(--accent-2), var(--accent));
  box-shadow: 0 12px 30px color-mix(in srgb, var(--accent) 30%, transparent);
  animation: orb 1.6s ease-in-out infinite;
}
.loader-card h2 {
  font-size:var(--fs-18);
  margin: 7px 0;
}
.loader-card > p {
  font-size:var(--fs-10);
  color: var(--muted);
}
.loading-steps {
  display: grid;
  gap: 6px;
  margin: 15px 0;
  text-align: left;
}
.loading-steps span {
  display: grid;
  grid-template-columns: 14px 1fr;
  gap: 8px;
  align-items: center;
  color: var(--faint);
  font-size:var(--fs-9);
}
.loading-steps i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid var(--line);
}
.loading-steps span.active {
  color: var(--text);
}
.loading-steps span.active i {
  border-color: var(--accent);
  border-top-color: transparent;
  animation: spin 0.8s linear infinite;
}
.loading-steps span.done i {
  background: var(--success);
  border-color: var(--success);
}
.loading-foot {
  display: flex;
  justify-content: space-between;
  font-size:var(--fs-8);
  color: var(--muted);
}
dialog {
  border: 0;
  padding: 0;
  width: min(430px, calc(100% - 24px));
  max-height: min(78dvh, 700px);
  border-radius: 23px;
  background: var(--surface-solid);
  color: var(--text);
  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.3);
}
dialog::backdrop {
  background: rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(8px);
}
dialog form {
  padding: 16px;
}
.dialog-close {
  position: absolute;
  right: 13px;
  top: 12px;
  border: 0;
  background: var(--surface-soft);
  width: 31px;
  height: 31px;
  border-radius: 10px;
}
.voice-picker-list,
.model-picker-list,
.route-picker-list {
  display: grid;
  gap: 7px;
  max-height: 55dvh;
  overflow: auto;
  margin-top: 12px;
}
.voice-picker-item,
.model-picker-item {
  width: 100%;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  text-align: left;
}
.model-picker-item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 40px;
  padding: 0;
  overflow: hidden;
}
.model-picker-item.selected {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.model-picker-select {
  min-width: 0;
  min-height: 58px;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  padding: 10px 4px 10px 11px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.model-picker-select > span { min-width: 0; }
.model-picker-select strong { color: var(--muted); font-size: var(--fs-8); font-weight: 500; text-align: right; }
.model-picker-select i { color: var(--accent); font-size: var(--fs-8); font-style: normal; }
.model-favorite { min-width: 40px; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--muted); font-size: 20px; }
.model-favorite.active { color: var(--accent); }
.voice-picker-item.selected { border-color: var(--accent); background: var(--accent-soft); }
.voice-picker-item b,
.model-picker-item b { font-size: 11px; }
.voice-picker-item small,
.model-picker-item small,
.model-picker-item em { display: block; color: var(--muted); font-size:var(--fs-8); font-style: normal; }
.model-picker-item .model-note { margin-top: 2px; white-space: normal; }
.model-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.model-badges em { display: inline-flex; width: auto; padding: 2px 5px; border-radius: 999px; background: var(--surface-soft); color: var(--accent); font-size: 8px; }
.model-filter-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; margin-top: 10px; }
.model-filter-tabs button { min-height: 36px; padding: 5px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--muted); font-size: 10px; }
.model-filter-tabs button.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.custom-model-entry { display: grid; grid-template-columns: 1fr auto; gap: 6px; margin-top: 8px; }
.custom-model-entry input { min-width: 0; }
.custom-model-entry button { border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); color: var(--text); padding: 0 10px; }
.model-picker-meta { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; color: var(--muted); font-size: 9px; }
.model-picker-meta small { text-align: right; }
.route-slot {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px;
  align-items: center;
}
.route-slot > span {
  display: flex;
.srs-summary-v594{margin:0;padding:0 2px;color:var(--muted);font-size:.78rem}
.srs-row{display:grid;gap:10px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.srs-row.is-scheduled{opacity:.78}
.srs-main-v594{display:grid;gap:5px;width:100%;min-width:0;padding:0;text-align:left;background:transparent;border:0;color:inherit}
.srs-main-v594 b{font-size:1rem;line-height:1.55;overflow-wrap:anywhere}
.srs-main-v594 small{color:var(--muted);font-size:.76rem;line-height:1.4}
.srs-grade-v594{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.srs-grade-v594 button{display:grid;place-items:center;gap:1px;min-width:0;min-height:44px;padding:6px 2px;border:1px solid var(--line);border-radius:11px;background:var(--surface-soft);color:var(--text);font-size:.78rem;font-weight:700}
.srs-grade-v594 button small{font-size:.64rem;color:var(--muted);font-weight:600}
.srs-grade-v594 button[data-srs-grade="again"]{color:var(--danger)}
.srs-grade-v594 button[data-srs-grade="good"],.srs-grade-v594 button[data-srs-grade="easy"]{color:var(--success)}
  align-items: center;
  gap: 6px;
}
.route-slot i {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-style: normal;
  font-size:var(--fs-9);
}
.model-search {
  margin-top: 8px;
}
.toast {
  position: fixed;
  z-index: 180;
  left: 50%;
  bottom: calc(78px + var(--safe-b));
  transform: translateX(-50%);
  max-width: calc(100% - 36px);
  background: #172126;
  color: #fff;
  border-radius: 13px;
  padding: 9px 13px;
  font-size:var(--fs-10);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.update {
  position: fixed;
  z-index: 220;
  top: calc(var(--safe-t) + 7px);
  left: 50%;
  transform: translateX(-50%);
  border: 0;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  padding: 8px 13px;
  font-size:var(--fs-10);
  font-weight: 850;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes wave {
  to {
    height: 24px;
  }
}
@keyframes pulse {
  50% {
    transform: scale(1.05);
  }
}
@keyframes orb {
  50% {
    transform: translateY(-4px) rotate(3deg);
  }
}
@media (max-width: 480px) {
  body {
    padding-left: 12px;
    padding-right: 12px;
  }
  .home-intro h2,
  .section-head h2 {
    font-size: 23px;
  }
  .form-grid {
    grid-template-columns: 1fr;
  }
  .form-grid .full {
    grid-column: auto;
  }
  .scenario-meta-grid {
    grid-template-columns: 1fr;
  }
  .voice-action-row {
    grid-template-columns: 1fr;
  }
  .theme-preview-grid,
  .font-choice-grid {
    grid-template-columns: 1fr;
  }
  .compact-select-line {
    grid-template-columns: 1fr;
  }
  .compact-select-line select {
    width: 100%;
  }
  .route-slot {
    grid-template-columns: 1fr;
  }
  .score-detail {
    grid-template-columns: repeat(3, 1fr);
  }
  .bottom-nav {
    width: min(300px, calc(100% - 24px));
  }
}
@media (max-width: 360px) {
  .menu-row {
    padding: 13px 12px;
  }
  .menu-row strong {
    font-size: 14px;
  }
  .engine-segments {
    grid-template-columns: repeat(2, 1fr);
  }
  .profile-segments {
    grid-template-columns: 1fr;
  }
  .composer-actions {
    grid-template-columns: 1fr 52px 1fr;
  }
  .secondary,
  .primary,
  .ghost {
    padding-left: 8px;
    padding-right: 8px;
    font-size:var(--fs-10);
  }
}


/* Routine Speak v1.5 */
body[data-view="home"],
body[data-view="settings"] {
  padding-top: max(14px, var(--safe-t));
}
body[data-view="home"] .bottom-nav,
body[data-view="settings"] .bottom-nav {
  margin-top: 2px;
}
.home-learning-menu .menu-row strong {
  font-size: 16px;
}
.app-version-footer {
  padding: 18px 0 2px;
  color: var(--faint);
  font-size:var(--fs-8);
  text-align: center;
  letter-spacing: .08em;
}
.scene-selector-panel {
  padding: 11px;
}
.scene-step-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.scene-select-button {
  min-height: 92px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface-solid);
  text-align: left;
  color: var(--text);
}
.scene-select-button:disabled {
  opacity: .48;
}
.scene-select-button.selected {
  border-color: color-mix(in srgb, var(--accent) 65%, var(--line));
  background: var(--accent-soft);
}
.scene-select-button small,
.scene-select-button span {
  display: block;
  color: var(--muted);
  font-size:var(--fs-8);
  line-height: 1.35;
}
.scene-select-button b {
  display: block;
  margin: 6px 0 5px;
  font-size: 14px;
  line-height: 1.2;
}
.scene-selection-summary {
  margin-top: 9px;
  padding: 10px 11px;
  border-radius: 13px;
  background: var(--surface-soft);
}
.scene-selection-summary b,
.scene-selection-summary span {
  display: block;
}
.scene-selection-summary b {
  font-size:var(--fs-10);
}
.scene-selection-summary span {
  margin-top: 4px;
  color: var(--muted);
  font-size:var(--fs-9);
  line-height: 1.45;
}
.scene-clear {
  width: 100%;
  margin-top: 4px;
  text-align: center;
}
.scenario-options-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.scene-picker-list {
  display: grid;
  gap: 7px;
  max-height: 56dvh;
  margin-top: 12px;
  overflow-y: auto;
}
.scene-picker-item {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  color: var(--text);
  text-align: left;
}
.scene-picker-item.active {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.scene-picker-item b,
.scene-picker-item small {
  display: block;
}
.scene-picker-item b {
  font-size: 11px;
}
.scene-picker-item small {
  margin-top: 3px;
  color: var(--muted);
  font-size:var(--fs-8);
  line-height: 1.4;
}
.scene-picker-item i {
  color: var(--accent);
  font-style: normal;
  font-weight: 900;
}
.scene-path {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 16px;
  margin: 7px 0 8px;
  color: var(--accent);
  font-size:var(--fs-8);
  font-weight: 800;
}
.scene-path:empty {
  display: none;
}
.scene-path b {
  opacity: .5;
}
.scene-path.compact {
  margin: 5px 0 8px;
}
.source-mode-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.source-mode-row .chip {
  width: 100%;
}
#shadowReusePanel .reuse-head span b,
#shadowReusePanel .reuse-head span small {
  display: block;
}
#shadowReusePanel .reuse-head span small {
  margin-top: 2px;
  color: var(--muted);
  font-size:var(--fs-8);
}
.shadow-session-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}
.shadow-session-progress {
  width: 86px;
  color: var(--muted);
  font-size:var(--fs-8);
  text-align: right;
}
.shadow-session-progress i {
  display: block;
  height: 5px;
  margin-top: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--surface-soft);
}
.shadow-session-progress b {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), var(--accent-2));
  transition: width var(--motion-state) ease;
}
.shadow-toolbar.dense {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.shadow-toolbar .shadow-done.active {
  border-color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, var(--surface-solid));
  color: var(--success);
}
.pron-source-card {
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius:var(--radius-card);
  background: var(--surface);
}
.pron-source-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}
.pron-source-actions button {
  min-height: 40px;
  padding: 8px 5px;
  font-size:var(--fs-9);
}
.pron-library {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.pron-library .result-card {
  margin-top: 10px;
}
.pron-reuse-card b {
  font-family: var(--jp-font);
  font-weight: 500;
}
@media (max-width: 390px) {
  .scene-step-grid {
    grid-template-columns: 1fr;
  }
  .scene-select-button {
    min-height: 76px;
  }
  .scenario-options-grid {
    grid-template-columns: 1fr 1fr;
  }
  .scenario-options-grid label:nth-child(3) {
    grid-column: 1 / -1;
  }
  .shadow-session-head {
    grid-template-columns: 1fr;
  }
  .shadow-session-progress {
    width: 100%;
    text-align: left;
  }
}
@media (max-width: 340px) {
  .pron-source-actions,
  .source-mode-row,
  .shadow-toolbar.dense {
    grid-template-columns: 1fr;
  }
}

/* v1.6 · 관계/복구/한국인 발음 코스 */
.recovery-panel,.pron-focus-panel{padding:16px}
.recovery-chip-grid,.pron-focus-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.recovery-chip-grid .chip,.pron-focus-grid .chip{min-height:38px;padding:0 13px}
.pron-focus-note{margin:12px 2px 0;color:var(--muted);font-size:13px;line-height:1.55}
.recovery-preview{margin-top:14px;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line))}
.recovery-preview>b{font-size:13px}.recovery-preview>div{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0}.recovery-preview span{padding:5px 9px;border-radius:999px;background:var(--panel-strong);font-size:var(--fs-12)}.recovery-preview small{color:var(--muted);line-height:1.45}
.scenario-meta-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.scene-context-line{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:var(--fs-12);margin:10px 0 0}
.pron-category{display:inline-flex;margin-bottom:5px;padding:3px 7px;border-radius:999px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-weight:750;font-size:11px}
@media(max-width:560px){.scenario-meta-grid{grid-template-columns:1fr 1fr}.scenario-meta-grid span:first-child{grid-column:1/-1}.recovery-chip-grid,.pron-focus-grid{gap:7px}.recovery-chip-grid .chip,.pron-focus-grid .chip{font-size:var(--fs-12);padding:0 11px}}


/* ROUTINE SPEAK v1.7 — mission review, linked practice, shadowing flow */
.mission-preview-list{
  list-style:none;
  display:grid;
  gap:7px;
  margin:10px 0 0;
  padding:0;
}
.mission-preview-list li{
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:8px;
  align-items:start;
  padding:8px 9px;
  border-radius:11px;
  background:var(--surface-solid);
  border:1px solid var(--line);
}
.mission-preview-list li>i{
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:8px;
  background:var(--accent-soft);
  color:var(--accent);
  font-style:normal;
  font-size:var(--fs-9);
  font-weight:900;
}
.mission-preview-list b,
.mission-preview-list small{display:block}
.mission-preview-list b{font-size:11px}
.mission-preview-list small{margin-top:2px;font-size:var(--fs-8);line-height:1.45;color:var(--muted)}
.scene-key-expressions{
  padding:11px;
  border-radius:14px;
  background:var(--surface-soft);
}
.scene-key-expressions>b{display:block;margin-bottom:7px;font-size:var(--fs-10);color:var(--accent)}
.scene-key-expressions>div{display:grid;gap:6px}
.scene-key-expressions button{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-solid);
  padding:9px 10px;
  color:var(--text);
  text-align:left;
}
.scene-key-expressions button>small{color:var(--muted);font-size:var(--fs-8);white-space:nowrap}
.mission-live{
  display:grid;
  gap:8px;
  margin-top:9px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:color-mix(in srgb,var(--accent) 6%,var(--surface-soft));
}
.mission-live>div{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.mission-live>div b{font-size:var(--fs-10);color:var(--accent)}
.mission-live>div small{font-size:7.5px;color:var(--muted);text-align:right}
.mission-live ol{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px;
  margin:0;
  padding:0;
}
.mission-live li{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:6px 7px;
  border-radius:9px;
  background:var(--surface-solid);
  color:var(--muted);
  font-size:var(--fs-8);
}
.mission-live li i{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:17px;
  height:17px;
  border-radius:6px;
  background:var(--accent-soft);
  color:var(--accent);
  font-style:normal;
  font-weight:900;
}
.mission-live li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.talk-evaluation.v17{
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  gap:12px;
  padding:15px;
}
.talk-evaluation.v17 .evaluation-main{align-self:center}
.talk-evaluation.v17 .evaluation-main h2{margin:1px 0 4px;font-size:var(--fs-18)}
.talk-evaluation.v17 .evaluation-main p:last-child{margin:0;color:var(--muted);font-size:var(--fs-10);line-height:1.55}
.mission-results,
.expression-deck.v17,
.next-step-card,
.evaluation-actions,
.talk-evaluation.v17>.evaluation-column,
.talk-evaluation.v17>.ghost{grid-column:1/-1}
.mission-results{display:grid;gap:6px}
.mission-results h3,
.expression-deck.v17 h3,
.talk-evaluation.v17 .evaluation-column h3{margin:0 0 3px;font-size:var(--fs-12)}
.mission-result{
  display:grid;
  grid-template-columns:26px minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-solid);
}
.mission-result>i{
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:9px;
  font-style:normal;
  font-weight:900;
}
.mission-result.completed>i{background:color-mix(in srgb,var(--success) 15%,transparent);color:var(--success)}
.mission-result.partial>i{background:color-mix(in srgb,var(--warning) 16%,transparent);color:var(--warning)}
.mission-result.missed>i{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger)}
.mission-result b,.mission-result small{display:block}
.mission-result b{font-size:var(--fs-10)}
.mission-result small{margin-top:2px;color:var(--muted);font-size:var(--fs-8);line-height:1.4}
.mission-result>em{font-style:normal;color:var(--muted);font-size:7.5px;white-space:nowrap}
.retry-expression{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:stretch;
  padding:9px;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--surface-solid);
}
.retry-expression+.retry-expression{margin-top:6px}
.expression-main{
  border:0;
  background:transparent;
  color:var(--text);
  text-align:left;
  padding:0;
}
.expression-main>small{display:block;margin-top:5px;color:var(--accent);font-size:var(--fs-8)}
.retry-expression>div{display:grid;gap:5px}
.retry-expression>div button{
  min-width:46px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface-soft);
  color:var(--accent);
  font-size:var(--fs-8);
}
.next-step-card{
  padding:var(--space-3) var(--space-3);
  border-radius:var(--radius-compact);
  background:var(--accent-soft);
}
.next-step-card small,.next-step-card b{display:block}
.next-step-card small{font-size:var(--fs-8);color:var(--accent);font-weight:900}
.next-step-card b{margin-top:4px;font-size:var(--fs-10);line-height:1.5}
.evaluation-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}
.evaluation-actions button{min-width:0;padding-left:7px;padding-right:7px;font-size:var(--fs-9)}
.shadow-training-bar{
  position:sticky;
  top:calc(61px + var(--safe-t));
  z-index:7;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:7px;
  align-items:center;
  margin:9px 0;
  padding:10px;
  border:1px solid var(--line);
  border-radius:15px;
  background:var(--nav-bg);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.shadow-training-bar b,.shadow-training-bar small{display:block}
.shadow-training-bar b{font-size:var(--fs-10)}
.shadow-training-bar small{margin-top:2px;color:var(--muted);font-size:7.5px}
.shadow-training-bar button{min-height:34px;padding:7px 9px;font-size:var(--fs-8)}
.shadow-card.advanced{transition:border-color .18s,box-shadow .18s,transform .18s}
.shadow-card.advanced.is-active{
  border-color:color-mix(in srgb,var(--accent) 55%,var(--line));
  box-shadow:0 0 0 3px var(--accent-soft);
}
.shadow-number{border:0;cursor:pointer}
.shadow-chunks{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  align-items:center;
  margin-top:8px;
  padding:8px 9px;
  border-radius:11px;
  background:var(--surface-soft);
  font-family:var(--jp-font);
  font-size:11px;
  line-height:1.45;
}
.shadow-chunks i{color:var(--accent);font-style:normal;font-weight:900}
.rhythm-note{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:7px;
  margin-top:6px;
  padding-top:6px;
  border-top:1px solid var(--line);
  font-size:var(--fs-8);
  line-height:1.45;
}
.rhythm-note b{color:var(--accent)}
.rhythm-note span{color:var(--muted)}
.shadow-toolbar.dense{grid-template-columns:repeat(4,minmax(0,1fr))}
.shadow-toolbar .shadow-routine{grid-column:span 2;color:white;background:var(--accent);border-color:var(--accent)}
.memory-summary-grid.v17{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}
.memory-summary-grid.v17>article{
  min-width:0;
  padding:10px 8px;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--surface);
  text-align:center;
}
.memory-summary-grid.v17 small,.memory-summary-grid.v17 b{display:block}
.memory-summary-grid.v17 small{color:var(--muted);font-size:var(--fs-8)}
.memory-summary-grid.v17 b{margin-top:4px;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.memory-next-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  margin:9px 0;
  padding:var(--space-3);
  border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));
  border-radius:var(--radius-card);
  background:color-mix(in srgb,var(--accent) 8%,var(--surface));
}
.memory-next-card small{color:var(--accent);font-size:var(--fs-8);font-weight:900}
.memory-next-card h3{margin:2px 0 4px;font-size:var(--fs-15)}
.memory-next-card p{margin:0;font-family:var(--jp-font);font-size:13px;line-height:1.45}
.memory-next-card button{min-height:38px;font-size:var(--fs-9)}
@media(max-width:390px){
  .mission-live ol{grid-template-columns:1fr}
  .talk-evaluation.v17{grid-template-columns:68px minmax(0,1fr);padding:12px}
  .shadow-training-bar{grid-template-columns:1fr 1fr}
  .shadow-training-bar>div{grid-column:1/-1}
  .shadow-toolbar.dense{grid-template-columns:repeat(3,minmax(0,1fr))}
  .shadow-toolbar .shadow-routine{grid-column:span 2}
  .evaluation-actions{grid-template-columns:1fr 1fr}
  .evaluation-actions .primary{grid-column:1/-1}
}

/* ===== v1.8 인출 모드 (한국어 큐 → 말하기 → 정답 확인) ===== */
#shadowPlayer.recall .shadow-card .shadow-copy .study-text,
#shadowPlayer.recall .shadow-card .shadow-chunks {
  filter: blur(7px);
  user-select: none;
  transition: filter var(--motion-surface) ease;
}
#shadowPlayer.recall .shadow-card.revealed .shadow-copy .study-text,
#shadowPlayer.recall .shadow-card.revealed .shadow-chunks {
  filter: none;
  user-select: auto;
}
.recall-cue {
  display: none;
  margin: 2px 0 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--accent-soft);
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
}
#shadowPlayer.recall .shadow-card:not(.revealed) .recall-cue {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.recall-cue > span {
  min-width: 0;
  font-size: 14px;
  line-height: 1.45;
}
.recall-cue > span > small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}
.recall-cue .recall-reveal {
  flex: 0 0 auto;
  padding: 8px 12px;
  border: 0;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size:var(--fs-12);
  font-weight: 700;
}
#shadowRecallMode.active,
#shadowAutoAdvance.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* ===== v1.8 저장 자료 소스 필터 ===== */
.reuse-source-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 8px 0 2px;
}
.reuse-source-row .chip {
  font-size:var(--fs-12);
  padding: 6px 11px;
}


/* ROUTINE SPEAK v1.9 — shared form system, scenario layout, local font */
html[data-jp-font="pretendardjp"]{--jp-font:"RoutineJP_pretendardjp","Pretendard JP","PretendardJP","Hiragino Sans",sans-serif}
html[data-jp-font="notojp"]{--jp-font:"RoutineJP_notojp","Noto Sans JP","NotoSansJP","Hiragino Sans",sans-serif}
html[data-jp-font="klee"]{--jp-font:"RoutineJP_klee","Klee One","KleeOne-Regular","Hiragino Sans",sans-serif}
html[data-jp-font="notoserifjp"]{--jp-font:"RoutineJP_notoserifjp","Noto Serif JP","NotoSerifJP","Hiragino Mincho ProN",serif}
.font-choice-grid [data-preview-font="hiragino"]{
  font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","YuGothic",sans-serif!important;
}
.font-choice-grid [data-preview-font="pretendardjp"]{font-family:"RoutineJP_pretendardjp","Pretendard JP","PretendardJP","Hiragino Sans",sans-serif!important}
.font-choice-grid [data-preview-font="notojp"]{font-family:"RoutineJP_notojp","Noto Sans JP","NotoSansJP","Hiragino Sans",sans-serif!important}
.font-choice-grid [data-preview-font="klee"]{font-family:"RoutineJP_klee","Klee One","KleeOne-Regular","Hiragino Sans",sans-serif!important}
.font-choice-grid [data-preview-font="notoserifjp"]{font-family:"RoutineJP_notoserifjp","Noto Serif JP","NotoSerifJP","Hiragino Mincho ProN",serif!important}
.font-choice-head{display:flex!important;align-items:center;justify-content:space-between;gap:8px;margin:0!important}
.font-choice-head em{font-style:normal;font-size:var(--fs-8);padding:4px 7px;border-radius:999px;background:var(--surface-soft);color:var(--muted)}
.font-choice-head em.ready{background:color-mix(in srgb,var(--success) 13%,transparent);color:var(--success)}
.font-file-actions{display:grid;grid-template-columns:1.35fr 1fr;gap:8px;margin-top:10px}
.font-file-actions button{min-height:42px}
.font-file-actions button:disabled{opacity:.45}
.scenario-options-v19{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  padding:12px;
}
.scenario-field{
  min-width:0;
  display:grid;
  align-content:start;
  gap:7px;
  padding:11px;
  border:1px solid var(--line);
  border-radius:15px;
  background:var(--surface-solid);
}
.scenario-field>span{font-size:var(--fs-10);font-weight:900;color:var(--text)}
.scenario-field>small{min-height:22px;font-size:7.5px;line-height:1.4;color:var(--muted)}
.scenario-field select,
.scenario-field textarea{
  width:100%;
  min-width:0;
  margin:0;
  border:0;
  border-radius:11px;
  background:var(--surface-soft);
  color:var(--text);
  box-sizing:border-box;
}
.scenario-field select{
  height:43px;
  padding:0 28px 0 10px;
  font-size:var(--fs-10);
  font-weight:850;
  text-overflow:ellipsis;
}
.scenario-relationship-field{grid-column:1;grid-row:2}
.scenario-request-field{grid-column:2/4;grid-row:2}
.scenario-request-field textarea{
  min-height:108px;
  resize:vertical;
  padding:11px 12px;
  font-size:var(--fs-10);
  line-height:1.55;
}
.scenario-config-summary{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:4px 9px;
  align-items:baseline;
  margin:-3px 2px 2px;
  padding:10px 12px;
  border-radius:14px;
  background:var(--surface-soft);
}
.scenario-config-summary>span{font-size:var(--fs-8);color:var(--accent);font-weight:900;letter-spacing:.06em}
.scenario-config-summary>b{min-width:0;font-size:var(--fs-9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scenario-config-summary>small{grid-column:1/-1;color:var(--muted);font-size:var(--fs-8);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.recovery-chip-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px!important;
}
.recovery-chip-grid .chip{
  width:100%;
  min-width:0;
  min-height:42px!important;
  padding:7px 5px!important;
  display:grid;
  place-items:center;
  text-align:center;
  white-space:normal;
  line-height:1.25;
}
.scene-select-button b{overflow-wrap:anywhere}
#scenarioView .primary#generateScenario{min-height:51px;font-size:13px;box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 22%,transparent)}
.loader-card{border-radius:24px}
.loader-orb{border-radius:17px}
@media(max-width:390px){
  .scenario-options-v19{gap:7px;padding:9px}
  .scenario-field{padding:9px 7px;border-radius:13px}
  .scenario-field>span{font-size:var(--fs-9)}
  .scenario-field>small{font-size:7px}
  .scenario-field select{height:40px;padding-left:7px;padding-right:22px;font-size:var(--fs-9)}
  .scenario-request-field textarea{min-height:100px;padding:9px;font-size:var(--fs-9)}
  .recovery-chip-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .recovery-chip-grid .chip{font-size:var(--fs-10)!important}
}
@media(max-width:340px){
  .scenario-options-v19{grid-template-columns:1fr 1fr}
  .scenario-guidance-field{grid-column:1/-1}
  .scenario-relationship-field{grid-column:1;grid-row:auto}
  .scenario-request-field{grid-column:1/-1;grid-row:auto}
  .recovery-chip-grid{grid-template-columns:1fr 1fr!important}
  .font-file-actions{grid-template-columns:1fr}
}


/* ROUTINE SPEAK v2.0 — shared UI architecture */
:root{--radius-xs:10px;--radius-sm:14px;--radius-md:18px;--radius-lg:24px;--space-1:6px;--space-2:10px;--space-3:14px;--space-4:18px;--state-progress:var(--accent);--state-complete:var(--success);--state-warning:#d49a1e;--state-error:var(--danger)}
.home-intro-v20{align-items:flex-start}.today-focus-v20{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:13px;align-items:center;margin:18px 0 22px;padding:17px;border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));border-radius:24px;background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel));box-shadow:var(--shadow)}.today-focus-v20 .focus-icon{width:48px;height:48px;border-radius:16px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-size:21px;font-weight:900}.today-focus-v20 div{min-width:0}.today-focus-v20 small{display:block;color:var(--accent);font-size:var(--fs-9);font-weight:950;letter-spacing:.14em}.today-focus-v20 b{display:block;margin-top:5px;font-size:var(--fs-17);line-height:1.25}.today-focus-v20 p{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.today-focus-v20 button{min-height:42px;padding:0 14px;white-space:nowrap}
.home-cluster-v20{margin:0 0 24px}.cluster-head-v20{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 3px 10px}.cluster-head-v20 span small{display:block;color:var(--accent);font-size:var(--fs-9);font-weight:950;letter-spacing:.16em}.cluster-head-v20 span b{display:block;margin-top:3px;font-size:var(--fs-20)}.cluster-head-v20 em{font-style:normal;color:var(--muted);font-size:var(--fs-10)}.home-learning-menu-v20{border-radius:22px}.home-learning-menu-v20 .menu-row{min-height:94px}.home-review-grid-v20{display:grid;grid-template-columns:1fr 1fr;gap:10px}.home-review-card-v20{min-width:0;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel);color:var(--text);text-align:left;box-shadow:var(--shadow)}.home-review-card-v20>span{display:grid;width:36px;height:36px;border-radius:var(--radius-compact);background:var(--surface-soft);place-items:center;color:var(--accent);font-weight:900}.home-review-card-v20>b{display:block;margin-top:12px;font-size:var(--fs-15)}.home-review-card-v20>small{display:block;margin-top:5px;min-height:34px;color:var(--muted);font-size:var(--fs-10);line-height:1.45}.home-review-card-v20>strong{display:block;margin-top:10px;color:var(--accent);font-size:11px}
.ui-summary-card-v20{margin:0 0 12px;padding:var(--space-4);border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:var(--radius-card);background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 10%,var(--panel)),var(--panel));box-shadow:var(--shadow)}.ui-summary-card-v20>small{display:block;color:var(--accent);font-size:var(--fs-8);font-weight:950;letter-spacing:.14em}.ui-summary-card-v20>div{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:8px}.ui-summary-card-v20 b{font-size:var(--fs-18);line-height:1.2}.ui-summary-card-v20 span{max-width:52%;color:var(--muted);font-size:var(--fs-10);line-height:1.4;text-align:right}.ui-recommend-v20{margin:0 0 12px;padding:14px;border:1px solid color-mix(in srgb,var(--success) 25%,var(--line));border-radius:18px;background:color-mix(in srgb,var(--success) 7%,var(--panel));display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px}.ui-recommend-v20>i{width:30px;height:30px;border-radius:10px;background:color-mix(in srgb,var(--success) 16%,transparent);display:grid;place-items:center;color:var(--success);font-style:normal;font-weight:950}.ui-recommend-v20 b{display:block;font-size:13px}.ui-recommend-v20 small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-10);line-height:1.5}.ui-preview-card-v20{margin:0 0 12px;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel)}.ui-preview-card-v20>small{display:block;color:var(--muted);font-size:var(--fs-8);font-weight:900;letter-spacing:.1em}.ui-preview-card-v20>div{margin-top:10px}.ui-diagnostic-link-v20{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 0;padding:14px 15px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);text-align:left}.ui-diagnostic-link-v20 span{min-width:0}.ui-diagnostic-link-v20 b{display:block;font-size:13px}.ui-diagnostic-link-v20 small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-10)}.ui-diagnostic-link-v20 strong{color:var(--accent);font-size:var(--fs-12);white-space:nowrap}.learning-flow-preview-v20{display:flex!important;align-items:center;justify-content:space-between;gap:5px}.learning-flow-preview-v20 span{padding:8px 9px;border-radius:11px;background:var(--surface-soft);font-size:var(--fs-10);font-weight:850}.learning-flow-preview-v20 i{color:var(--muted);font-style:normal}.settings-action-list-v20{padding:0!important;overflow:hidden}.settings-action-list-v20>button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left}.settings-action-list-v20>button:last-child{border-bottom:0}.settings-action-list-v20 b{display:block;font-size:13px}.settings-action-list-v20 small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-10)}.settings-action-list-v20 strong{color:var(--accent);font-size:11px;white-space:nowrap}
.diagnostics-grid-v20{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}.diagnostic-tile-v20{padding:15px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.diagnostic-tile-v20 small{display:block;color:var(--muted);font-size:var(--fs-9)}.diagnostic-tile-v20 b{display:block;margin-top:7px;font-size:var(--fs-15)}.diagnostic-tile-v20.good b{color:var(--success)}.diagnostic-tile-v20.warn b{color:var(--state-warning)}.diagnostic-tile-v20.bad b{color:var(--danger)}
.routine-inbox-list-v20{display:grid;gap:12px}.routine-inbox-card-v20{padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel);box-shadow:var(--shadow)}.routine-inbox-card-v20>small{color:var(--accent);font-size:var(--fs-8);font-weight:900}.inbox-cue-v20{width:100%;margin-top:9px;padding:13px;border:0;border-radius:15px;background:var(--surface-soft);color:var(--text);text-align:left}.inbox-cue-v20 span,.inbox-answer-v20 small{display:block;color:var(--muted);font-size:var(--fs-8)}.inbox-cue-v20 b{display:block;margin-top:5px;font-size:14px;line-height:1.5}.inbox-answer-v20{margin-top:9px;padding:13px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--accent) 7%,var(--panel))}.inbox-answer-v20 b{display:block;margin-top:5px;font-size:var(--fs-17);line-height:1.6}.inbox-answer-v20 span{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-10)}.routine-inbox-card-v20>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.recent-item-v20{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:0!important;overflow:hidden}.recent-main-v20{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;padding:14px;border:0;background:transparent;color:var(--text);text-align:left;min-width:0}.recent-practice-v20{align-self:stretch;min-width:72px;border:0;border-left:1px solid var(--line);background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);font-size:var(--fs-10);font-weight:900}.empty-state-v20,.error-state-v20{padding:20px;border-radius:19px;text-align:center}.empty-state-v20{border:1px dashed var(--line);background:var(--panel)}.error-state-v20{border:1px solid color-mix(in srgb,var(--danger) 30%,var(--line));background:color-mix(in srgb,var(--danger) 7%,var(--panel))}.empty-state-v20 b,.error-state-v20 b{display:block;font-size:14px}.empty-state-v20 small,.error-state-v20 small{display:block;margin-top:6px;color:var(--muted);font-size:var(--fs-10);line-height:1.5}.error-state-v20 button{margin-top:12px}
.loading-actions-v20{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.loading-overlay.failed .loader-orb{animation:none;background:linear-gradient(145deg,color-mix(in srgb,var(--danger) 70%,var(--accent)),var(--danger))}.loading-steps span.error{color:var(--danger)}.loading-steps span.error i{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 18%,transparent)}
/* scenario/mobile hierarchy */
@media(max-width:430px){.scenario-options-v19{grid-template-columns:1fr 1fr!important}.scenario-level-field{grid-column:1}.scenario-register-field{grid-column:2}.scenario-guidance-field{grid-column:1;grid-row:2}.scenario-relationship-field{grid-column:2;grid-row:2}.scenario-request-field{grid-column:1/-1;grid-row:3}.scenario-field select{font-size:var(--fs-12)!important}.scenario-field>small{min-height:0!important}.recovery-chip-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.recovery-chip-grid .chip:last-child{grid-column:1/-1}.today-focus-v20{grid-template-columns:44px minmax(0,1fr)}.today-focus-v20 button{grid-column:1/-1;width:100%}.home-review-grid-v20{grid-template-columns:1fr}.cluster-head-v20 em{display:none}.ui-summary-card-v20>div{align-items:flex-start;flex-direction:column}.ui-summary-card-v20 span{max-width:none;text-align:left}.recent-item-v20{grid-template-columns:1fr!important}.recent-practice-v20{min-height:42px;border-left:0;border-top:1px solid var(--line)}}

body{padding-bottom:calc(112px + env(safe-area-inset-bottom))}


/* Routine Speak v2.1 · compact focus and calm dark background */
body{background:var(--bg)!important;background-attachment:initial!important;position:relative;isolation:isolate}
body::before{content:"";position:fixed;z-index:-1;left:0;right:0;top:0;height:260px;pointer-events:none;background:radial-gradient(circle at 88% 0%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 58%),linear-gradient(180deg,color-mix(in srgb,var(--bg-2) 72%,var(--bg)),transparent 100%)}
html[data-theme="dark"] body::before{height:220px;opacity:.58;background:radial-gradient(circle at 88% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 62%),linear-gradient(180deg,color-mix(in srgb,var(--bg-2) 58%,var(--bg)),transparent 100%)}
.home-cluster-v20{margin-bottom:16px}.home-learning-menu-v20 .menu-row{min-height:76px;padding-top:13px;padding-bottom:13px}.cluster-head-v20{margin-bottom:8px}
.home-review-strip-v21{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 16px}.home-review-strip-v21>button{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:62px;padding:10px 11px;border:1px solid var(--line);border-radius:17px;background:var(--panel);color:var(--text);text-align:left;box-shadow:var(--shadow)}.home-review-strip-v21>button>span{display:grid;width:32px;height:32px;place-items:center;border-radius:10px;background:var(--surface-soft);color:var(--accent);font-weight:900}.home-review-strip-v21 small{display:block;color:var(--accent);font-size:7px;font-weight:950;letter-spacing:.12em}.home-review-strip-v21 b{display:block;margin-top:2px;font-size:var(--fs-12);white-space:nowrap}.home-review-strip-v21 strong{color:var(--accent);font-size:8.5px;white-space:nowrap}
.recent-item-v21{padding:0!important;overflow:hidden}.recent-main-v21{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:9px;align-items:center;padding:12px 13px;border:0;background:transparent;color:var(--text);text-align:left}.recent-main-v21 .kind{display:grid;width:34px;height:34px;place-items:center;border-radius:11px;background:var(--surface-soft);color:var(--accent);font-weight:900}.recent-main-v21 b{display:block;font-size:var(--fs-12);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent-main-v21 small{display:block;margin-top:3px;color:var(--muted);font-size:8.5px}.recent-main-v21 em{padding:4px 7px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-style:normal;font-size:7.5px;font-weight:900;white-space:nowrap}.recent-main-v21 strong{font-size:var(--fs-9);white-space:nowrap}
.learning-settings-head-v21{margin-bottom:10px}.learning-settings-hero-v21{margin-bottom:11px;padding:17px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel));box-shadow:var(--shadow)}.learning-settings-title-v21 small{color:var(--accent);font-size:var(--fs-8);font-weight:950;letter-spacing:.14em}.learning-settings-title-v21 b{display:block;margin-top:7px;font-size:var(--fs-20);line-height:1.22}.learning-settings-title-v21 span{display:block;margin-top:5px;color:var(--muted);font-size:9.5px}.learning-default-chips-v21{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.learning-default-chips-v21 span{padding:6px 9px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));border-radius:99px;background:var(--panel);color:var(--text);font-size:var(--fs-9);font-weight:850}.learning-edit-primary-v21{width:100%;margin-top:13px;min-height:46px}.learning-flow-card-v21{margin-bottom:10px;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel)}.learning-flow-card-v21>small{color:var(--accent);font-size:var(--fs-8);font-weight:900}.learning-flow-card-v21>div{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-top:9px}.learning-flow-card-v21>div span{padding:var(--space-2) var(--space-2);border-radius:var(--radius-control);background:var(--surface-soft);font-size:8.5px;font-weight:850}.learning-flow-card-v21>div i{color:var(--muted);font-style:normal}.learning-flow-card-v21 p{margin:9px 0 0;color:var(--muted);font-size:var(--fs-9);line-height:1.5}.learning-review-link-v21{width:100%;display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;margin-bottom:10px;padding:13px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);text-align:left}.learning-review-link-v21>span{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:var(--surface-soft);color:var(--accent);font-weight:900}.learning-review-link-v21 b{display:block;font-size:13px}.learning-review-link-v21 small{display:block;margin-top:3px;color:var(--muted);font-size:var(--fs-9)}.learning-review-link-v21 strong{color:var(--accent);font-size:var(--fs-9)}.learning-diagnostic-v21{margin-top:0}
@media(max-width:430px){.home-review-strip-v21{grid-template-columns:1fr}.home-review-strip-v21>button{min-height:56px}.recent-main-v21{grid-template-columns:auto minmax(0,1fr) auto}.recent-main-v21 em{display:none}.learning-flow-card-v21>div span{padding:7px 5px;font-size:7.8px}}


/* Routine Speak v2.3 · stable home recent cards and one-action review strip */
.home-review-strip-v21{grid-template-columns:1fr!important}
.recent-card-v22{display:block;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);box-shadow:var(--shadow)}
.recent-main-v22{width:100%;min-width:0;display:grid;grid-template-columns:42px minmax(0,1fr) auto 12px;gap:11px;align-items:center;padding:15px;border:0;background:transparent;color:var(--text);text-align:left}
.recent-main-v22 .kind{display:grid;width:42px;height:42px;place-items:center;border-radius:14px;background:var(--surface-soft);color:var(--accent);font-size:var(--fs-15);font-weight:900}
.recent-copy-v22{display:block;min-width:0}
.recent-copy-v22 b{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;line-height:1.35}
.recent-copy-v22 small{display:flex;align-items:center;gap:6px;margin-top:5px;color:var(--muted);font-size:var(--fs-9);line-height:1.35;white-space:nowrap}
.recent-copy-v22 small i{font-style:normal;opacity:.55}
.recent-main-v22 em{padding:5px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-style:normal;font-size:var(--fs-8);font-weight:900;white-space:nowrap}
.recent-main-v22>strong{color:var(--accent);font-size:13px}
@media(max-width:390px){
  .recent-main-v22{grid-template-columns:38px minmax(0,1fr) 10px;padding:13px;gap:10px}
  .recent-main-v22 .kind{width:38px;height:38px;border-radius:13px}
  .recent-main-v22 em{display:none}
  .recent-copy-v22 b{font-size:var(--fs-12)}
  .recent-copy-v22 small{font-size:8.5px}
}


/* ===== v2.3 UI 통일 — 타입·간격 스케일 =====
   원칙: 밀도는 유지하고 역할별 크기를 2단계 라벨·1단계 행제목·1단계 보조설명으로 수렴 */
:root {
  --fs-label: 8px;    /* 클러스터·스트립 마이크로 라벨 */
  --fs-micro: 9px;    /* eyebrow */
  --fs-caption: 10px; /* 행 보조 설명 */
  --fs-item: 15px;    /* 행 제목 */
  --flow-gap: 18px;   /* 홈 섹션 사이 공통 리듬 */
}
.eyebrow { font-size: var(--fs-micro); }
/* 복습 스트립에 버튼이 하나면 반쪽짜리 칸 대신 전체 폭 사용 */
.home-review-strip-v21 > button:only-child { grid-column: 1 / -1; }

/* 빈 상태 문구가 남기는 유령 여백 제거 (학습 흐름 방해 요소) */
.status:empty { min-height: 0; margin: 0; }

/* 활성 카드로 스크롤할 때 세션 헤더에 가리지 않도록 */
.shadow-card { scroll-margin-top: 84px; }

/* 학습 툴바 버튼 높이·글자 통일 (같은 줄에서 들쭉날쭉 방지) */
.shadow-toolbar button { min-height: 40px; font-size: 11px; }
.shadow-toolbar button.primary { font-size:var(--fs-12); }

/* 키보드·스위치 컨트롤 포커스 링 통일 (보강) */
:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 72%, transparent);
  outline-offset: 2px;
}


/* ===== v2.4 타입 역할 통일 — 밀도 유지, 미세 크기 수렴 =====
   역할 사다리: 화면 제목 25 / 클러스터 20 / 서브 화면 18 / 패널 17 / 카드 15
   행 버튼 제목 15 / 목록 행 제목 12 / 보조 10 / 라벨 9 / 마이크로 8 */

/* 7.5px 5곳 → 마이크로 8px */
.mission-live > div small,
.mission-result > em,
.shadow-training-bar small,
.scenario-field > small,
.recent-main-v21 em { font-size: var(--fs-label); }

/* 8.5px 4곳 → 라벨 9px */
.recent-main-v21 small,
.learning-flow-card-v21 > div span,
.home-review-strip-v21 strong,
.recent-copy-v22 small { font-size: var(--fs-micro); }

/* 9.5px → 보조 10px */
.learning-settings-title-v21 span { font-size: var(--fs-caption); }

/* 행 버튼 계열 제목 통일: learning-review-link도 메뉴 행과 같은 문법(15/10) */
.learning-review-link-v21 b { font-size: var(--fs-item); }
.learning-review-link-v21 small,
.learning-review-link-v21 strong { font-size: var(--fs-caption); }


/* ROUTINE SUITE 2.1 · SETTINGS UX ONLY */
.settings-category-v21{margin-top:22px}
.settings-category-head-v21{display:flex;align-items:flex-end;justify-content:space-between;margin:0 2px 8px;gap:12px}
.settings-category-head-v21>div{min-width:0;display:grid;gap:3px}
.settings-category-head-v21 b{font-size:14px;line-height:1.3;letter-spacing:-.02em}
.settings-category-head-v21 small{color:var(--muted);font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.settings-menu-v21{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:var(--shadow-soft)}
.settings-menu-v21 .menu-row{width:100%;min-height:66px;height:auto;margin:0;border:0;border-radius:0;border-bottom:1px solid var(--line);background:transparent;padding:13px 14px;align-items:center;text-align:left}
.settings-menu-v21 .menu-row:last-child{border-bottom:0}
.settings-menu-v21 .menu-row>span:nth-child(2){min-width:0;flex:1}
.settings-menu-v21 .menu-row strong,.settings-menu-v21 .menu-row small{white-space:normal;overflow-wrap:anywhere}
.settings-menu-v21 .menu-row small{line-height:1.42}
.settings-accordion-v21{margin:12px 0;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:var(--shadow-soft);overflow:hidden;height:auto!important;max-height:none!important}
.settings-accordion-v21>summary{display:flex;align-items:center;gap:12px;min-height:66px;height:auto;padding:14px 15px;cursor:pointer;list-style:none}
.settings-accordion-v21>summary::-webkit-details-marker{display:none}
.settings-accordion-v21>summary span{min-width:0;flex:1;display:grid;gap:3px}
.settings-accordion-v21>summary b{font-size:14px;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
.settings-accordion-v21>summary small{color:var(--muted);font-size:11px;line-height:1.42;white-space:normal;overflow-wrap:anywhere}
.settings-accordion-v21>summary i{font-style:normal;color:var(--muted);transition:transform var(--motion-state) ease;flex:0 0 auto}
.settings-accordion-v21[open]>summary{border-bottom:1px solid var(--line)}
.settings-accordion-v21[open]>summary i{transform:rotate(90deg)}
.settings-accordion-body-v21{padding:12px;height:auto!important;max-height:none!important;overflow:visible}
.settings-accordion-body-v21>.setting-section{margin:0 0 12px}
.settings-accordion-body-v21>.setting-section:last-child{margin-bottom:0}
.settings-accordion-body-v21 .compact-panel{box-shadow:none}
.settings-accordion-body-v21 .toggle-line,.settings-accordion-body-v21 .compact-select-line,.settings-accordion-body-v21 .voice-summary-button,.settings-accordion-body-v21 .model-summary-button{min-height:56px;height:auto}
.settings-accordion-body-v21 .toggle-line>span,.settings-accordion-body-v21 .compact-select-line>span,.settings-accordion-body-v21 .voice-summary-button>span,.settings-accordion-body-v21 .model-summary-button>span{min-width:0}
.settings-accordion-body-v21 b,.settings-accordion-body-v21 small,.settings-accordion-body-v21 em,.settings-accordion-body-v21 p{overflow-wrap:anywhere}
.review-assist-v21{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.review-assist-v21 button{min-width:0;height:42px;padding:0 6px}
.review-recovery-v21{display:flex;flex-wrap:wrap;gap:7px}
.setting-info-list-v21{display:grid;gap:0;padding:0;overflow:hidden}
.setting-info-list-v21>div{display:grid;gap:3px;padding:13px 14px;border-bottom:1px solid var(--line)}
.setting-info-list-v21>div:last-child{border-bottom:0}
.setting-info-list-v21 b{font-size:13px}
.setting-info-list-v21 small{color:var(--muted);font-size:11px;line-height:1.45}
.ai-save-body-v21>.primary{width:100%;margin-top:0}
@media(max-width:390px){
  .settings-menu-v21 .menu-row{min-height:62px;padding:12px}
  .settings-accordion-v21>summary{min-height:62px;padding:13px}
  .settings-accordion-body-v21{padding:10px}
  .review-assist-v21{grid-template-columns:1fr}
  .settings-accordion-body-v21 .engine-segments,.settings-accordion-body-v21 .profile-segments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .settings-accordion-body-v21 .task-route-list{grid-template-columns:1fr}
}
@media(min-width:600px){
  .settings-category-v21,.settings-accordion-v21{max-width:760px;margin-left:auto;margin-right:auto}
}


/* PWA component 2.5.2 hotfix: reliable iOS checkbox switches */
.toggle-line input[type="checkbox"],
.switch input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  width: 46px;
  min-width: 46px;
  height: 28px;
  margin: 0;
  border: 1px solid var(--line-strong, var(--line));
  border-radius: 999px;
  background-color: var(--surface-soft);
  background-image: radial-gradient(circle at 14px 13px, #ffffff 0 9.5px, transparent 10px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease, background-image .18s ease;
  vertical-align: middle;
}
.toggle-line input[type="checkbox"]:checked,
.switch input[type="checkbox"]:checked {
  border-color: var(--accent);
  background-color: var(--accent);
  background-image: radial-gradient(circle at 32px 13px, #ffffff 0 9.5px, transparent 10px);
}
.toggle-line input[type="checkbox"]:focus-visible,
.switch input[type="checkbox"]:focus-visible {
  outline: 3px solid var(--accent-soft);
  outline-offset: 2px;
}
.toggle-line input[type="checkbox"]:disabled,
.switch input[type="checkbox"]:disabled { opacity: .45; cursor: default; }
.switch { display: inline-flex; align-items: center; flex: 0 0 auto; }
.switch > span { display: none; }
.compact-select-line select {
  min-height: 42px;
  color: var(--text);
  background-color: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: 0 34px 0 12px;
  font-size:var(--fs-12);
  line-height: 1.25;
}
.diagnostic-tile-v20.ok b { color: var(--success); }
.diagnostic-tile-v20.error b { color: var(--danger); }


/* Routine Suite 2.4.5 · shared theme / typography / speaking polish */
:root{
  --p0:#dce4ef;--p1:#acd5f2;--p2:#7fa8c9;--p3:#527ba0;--p4:#254e77;
  --fs-micro:9px;--fs-caption:11px;--fs-label:12px;--fs-body:14px;--fs-item:16px;--fs-section:19px;--fs-title:24px;--fs-display:32px;--fs-numeric:28px;
  /* 7.4-B: --warning 은 shared/design/semantic-tokens-v740.css 가 정본이다. */
  --premium:#8d58df;--ai-accent:var(--accent);
  --bg:color-mix(in srgb,var(--p0) 30%,#f7f8fa);--bg-2:color-mix(in srgb,var(--p1) 50%,#eef2f6);
  --accent:var(--p3);--accent-2:var(--p2);--accent-soft:color-mix(in srgb,var(--p2) 18%,transparent);
}
html[data-theme="dark"]{
  --bg:color-mix(in srgb,var(--p0) 68%,#0b0e0d);--bg-2:color-mix(in srgb,var(--p1) 62%,#111513);
  --surface:color-mix(in srgb,var(--p0) 34%,#161b18);--surface-solid:color-mix(in srgb,var(--p0) 24%,#181d1a);--surface-soft:color-mix(in srgb,var(--p1) 28%,#1c221e);
  --accent:var(--p4);--accent-2:var(--p3);--accent-soft:color-mix(in srgb,var(--p4) 18%,transparent);--ai-accent:var(--p4);
}
.theme-palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding-top:4px}
.theme-palette-card{min-height:82px;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);color:var(--text);text-align:left;box-shadow:none}
.theme-palette-card>span{display:grid;grid-template-columns:repeat(5,1fr);height:18px;overflow:hidden;border-radius:8px;margin-bottom:9px}
.theme-palette-card i{display:block;background:var(--swatch)}.theme-palette-card b{display:block;font-size:var(--fs-label);line-height:1.25}.theme-palette-card small{display:block;margin-top:3px;color:var(--muted);font-size:var(--fs-micro)}
.theme-palette-card.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--surface))}
.shadow-ko-brief{margin:7px 0 0;color:var(--muted);font-size:var(--fs-caption);line-height:1.55}.pron-ready-chip em{margin-left:4px;padding:2px 5px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-size:var(--fs-8);font-style:normal}
.diagnostics-grid-v20{grid-template-columns:repeat(2,minmax(0,1fr))}.diagnostic-tile-v20{min-height:74px}
.loading-card .loader-orb,.loading-overlay .loader-orb{background:linear-gradient(145deg,color-mix(in srgb,var(--ai-accent) 88%,white),var(--ai-accent))}
@media(max-width:390px){.font-choice-grid{grid-template-columns:1fr}.diagnostics-grid-v20{grid-template-columns:1fr 1fr}}
@media(max-width:330px){.theme-palette-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.loader-orb,.busy-orb{animation-duration:.01ms!important;animation-iteration-count:1!important}.view{animation:none}}

.loading-overlay[data-loading-kind="utility"] .loader-orb{width:70px;height:42px;border-radius:14px;background:linear-gradient(90deg,var(--surface-soft) 0 28%,color-mix(in srgb,var(--accent) 24%,var(--surface-soft)) 45% 55%,var(--surface-soft) 72% 100%);background-size:220% 100%;animation:utility-skeleton 1.25s ease-in-out infinite;box-shadow:none}
.loading-overlay[data-loading-kind="utility"] .loader-orb i{display:none}
.loading-overlay[data-loading-kind="utility"] .eyebrow{color:var(--muted)}
@keyframes utility-skeleton{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.loading-overlay[data-loading-kind="utility"] .loader-orb{animation:none}}

/* v2.4.6 */
.speed-row-label{align-self:center;margin-right:2px;color:var(--muted);font-size:var(--fs-10);font-weight:700}
.shadow-speed-row{margin-top:2px}
.pitch-accent-card{margin-top:12px;padding:var(--space-3) var(--space-3);border:1px solid var(--line);border-radius:var(--radius-compact);background:var(--card-solid)}
.pitch-accent-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.pitch-accent-head small{color:var(--muted);font-size:var(--fs-9);font-weight:700}
.pitch-accent-head b{font-size:var(--fs-12)}
.pitch-accent-head em{margin-left:auto;font-style:normal;color:var(--muted);font-size:var(--fs-8);border:1px solid var(--line);border-radius:99px;padding:2px 7px}
.pitch-accent-scroll{overflow-x:auto;padding-bottom:2px}
.pitch-accent-scroll svg{display:block}
.pitch-accent-scroll polyline{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pitch-accent-scroll circle{fill:var(--accent)}
.pitch-accent-scroll circle.lo{fill:var(--card-solid);stroke:var(--accent);stroke-width:2}
.pitch-accent-kana{display:flex}
.pitch-accent-kana span{flex:0 0 30px;text-align:center;font-size:var(--fs-12);color:var(--text)}
.pitch-accent-kana span:first-child{margin-left:-1px}


/* Suite 2.5.5 — pronunciation voice contour beta */
.pronunciation-analysis-setting-v255{margin-bottom:10px}
.intonation-analysis-card{margin:13px 0;padding:var(--space-3);border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:var(--radius-card);background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 7%,var(--panel)),var(--panel));overflow:hidden}
.intonation-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.intonation-card-head small{display:block;color:var(--accent);font-size:var(--fs-8);font-weight:950;letter-spacing:.12em}
.intonation-card-head h3{margin:4px 0 0;font-size:var(--fs-14)}
.intonation-card-head>span{flex:0 0 auto;padding:4px 7px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:var(--fs-8);font-weight:800}
.intonation-summary{margin:10px 0;color:var(--text);font-size:var(--fs-10);line-height:1.55}
.intonation-chart-wrap{padding:8px 7px 6px;border:1px solid var(--line);border-radius:14px;background:var(--surface-solid);overflow:hidden}
.intonation-chart{display:block;width:100%;height:auto;min-height:112px}
.intonation-chart path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:3}
.intonation-reference{stroke:var(--accent)}
.intonation-user{stroke:var(--success);opacity:.9}
.intonation-midline{stroke:var(--line);stroke-width:1;stroke-dasharray:4 5}
.intonation-analysis-card.hide-user-contour .intonation-user{display:none}
.intonation-mora-row{display:flex;align-items:center;justify-content:space-around;gap:2px;overflow:hidden;padding:2px 3px 0}
.intonation-mora-row span{min-width:0;color:var(--muted);font-size:var(--fs-8);text-align:center;white-space:nowrap}
.intonation-legend{display:flex;gap:13px;align-items:center;margin-top:8px;color:var(--muted);font-size:var(--fs-8);font-weight:800}
.intonation-legend span{display:inline-flex;align-items:center;gap:5px}
.intonation-legend i{width:14px;height:3px;border-radius:99px;background:var(--accent)}
.intonation-legend .user i{background:var(--success)}
.intonation-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}
.intonation-actions button{min-height:38px;padding:8px 5px;font-size:var(--fs-9)}
.intonation-note,.intonation-error{margin:9px 0 0;color:var(--muted);font-size:var(--fs-8);line-height:1.55}
.intonation-error{color:var(--danger);font-size:var(--fs-9)}
.intonation-loading{display:flex;gap:10px;align-items:center;margin-top:12px;padding:11px;border-radius:13px;background:var(--surface-soft)}
.intonation-loading>i{width:18px;height:18px;flex:0 0 auto;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .85s linear infinite}
.intonation-loading p{margin:0}.intonation-loading b{display:block;font-size:var(--fs-9)}.intonation-loading small{display:block;margin-top:3px;color:var(--muted);font-size:var(--fs-8);line-height:1.45}
@media(max-width:380px){.intonation-actions{grid-template-columns:1fr 1fr}.intonation-actions button:last-child{grid-column:1/-1}.intonation-mora-row span{font-size:7.5px}}

.pron-method-v34{margin:14px 0;padding:11px 13px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.pron-method-v34 summary{font-weight:750;cursor:pointer}.pron-method-v34 p{color:var(--muted);font-size:13px;line-height:1.6}
/* Routine Suite 2.7 — design customization and unified result surfaces */
:root{--v27-radius:20px;--v27-gap:14px;--v27-border:color-mix(in srgb,var(--p2) 34%,transparent);--v27-glass:color-mix(in srgb,var(--p0) 84%,transparent);--v27-shadow:0 16px 42px rgba(16,27,43,.1)}
html[data-ui-density="comfortable"]{--v27-gap:18px;--v27-radius:23px}html[data-ui-density="dense"]{--v27-gap:9px;--v27-radius:15px}html[data-ui-style="liquid"] .view:not(#homeView) .compact-panel,html[data-ui-style="liquid"] .view:not(#homeView) .card,html[data-ui-style="liquid"] .view:not(#homeView) .correction-card{border-color:color-mix(in srgb,white 28%,var(--accent) 14%);background:linear-gradient(145deg,color-mix(in srgb,white 11%,transparent),color-mix(in srgb,var(--panel) 72%,transparent));box-shadow:0 16px 38px rgba(8,18,30,.12),inset 0 1px 0 rgba(255,255,255,.24);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}html[data-ui-style="liquid"] .view:not(#homeView)>.section-head{padding:12px 14px;margin-bottom:16px;border:1px solid color-mix(in srgb,white 28%,var(--accent) 14%);border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,white 12%,transparent),color-mix(in srgb,var(--panel) 70%,transparent));box-shadow:0 14px 34px rgba(8,18,30,.1);backdrop-filter:blur(22px) saturate(155%);-webkit-backdrop-filter:blur(22px) saturate(155%)}
html[data-ui-density="comfortable"] .view:not(#homeView){--section-gap:22px}html[data-ui-density="comfortable"] .view:not(#homeView) .stack{gap:17px}html[data-ui-density="dense"] .view:not(#homeView){--section-gap:11px}html[data-ui-density="dense"] .view:not(#homeView) .stack,html[data-ui-density="dense"] .view:not(#homeView) .form-grid{gap:9px}html[data-ui-density="dense"] .view:not(#homeView) .setting-section{margin-block:10px}
.ui-style-grid-v27{display:grid;gap:9px}.ui-style-grid-v27>button{display:flex;justify-content:space-between;align-items:center;text-align:left;color:inherit;background:color-mix(in srgb,var(--p0) 93%,transparent);border:1px solid var(--v27-border);border-radius:17px;padding:14px}.ui-style-grid-v27>button span{display:grid;gap:3px}.ui-style-grid-v27>button small{opacity:.6}.ui-style-grid-v27>button>i{width:21px;height:21px;border:2px solid color-mix(in srgb,var(--p2) 65%,transparent);border-radius:50%}.ui-style-grid-v27>button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 11%,var(--p0))}.ui-style-grid-v27>button.active>i{border:6px solid var(--accent)}.density-panel-v27{display:grid;gap:10px;margin-top:12px;border-radius:17px;padding:14px;background:color-mix(in srgb,var(--p1) 22%,transparent)}.density-panel-v27>span{display:flex;justify-content:space-between;gap:10px}.density-panel-v27>span small{opacity:.6}.density-segments-v27{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.density-segments-v27 button{border:0;border-radius:10px;background:color-mix(in srgb,var(--p2) 22%,transparent);color:inherit;padding:10px 4px;font-weight:800}.density-segments-v27 button.active{background:var(--accent);color:var(--accent-ink,#fff)}.density-current-v27{opacity:.65;text-align:right}
.correction-unified-v27{border-radius:var(--v27-radius);overflow:hidden}.correction-unified-v27 summary{padding:15px;min-height:44px;box-sizing:border-box}.correction-unified-v27 .correction-body{display:grid;gap:9px;padding:0 15px 15px}.correction-unified-v27 .correction-line{border-radius:14px;background:color-mix(in srgb,var(--p1) 25%,transparent);padding:12px}.correction-unified-v27 .correction-line.corrected{border-left:3px solid var(--accent)}.correction-unified-v27 .correction-line.natural{border-left:3px solid var(--success)}.correction-detail-v27{border-top:1px solid var(--v27-border);padding-top:9px}.correction-detail-v27>summary{padding:3px 0!important;font-size:12px;font-weight:800;opacity:.72}.correction-detail-v27 .correction-explain{line-height:1.65}
.intonation-analysis-card.intonation-v27{border-radius:var(--v27-radius);padding:var(--space-4);background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 9%,var(--p0)),color-mix(in srgb,var(--p0) 92%,transparent));border:1px solid var(--v27-border);box-shadow:none}.intonation-v27 .intonation-card-head small{letter-spacing:.13em}.intonation-summary-v27{margin:13px 0;padding:13px 14px;border-radius:15px;background:color-mix(in srgb,var(--p1) 26%,transparent)}.intonation-summary-v27 small{font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--accent)}.intonation-summary-v27 p{margin:5px 0 0;line-height:1.55;font-weight:700}.intonation-chart-v27{position:relative;border-radius:16px;padding:12px 8px 5px;background:color-mix(in srgb,var(--p0) 65%,transparent);border:1px solid var(--v27-border)}.intonation-gridline-v27{stroke:color-mix(in srgb,var(--p2) 20%,transparent);stroke-width:1;stroke-dasharray:3 5}.intonation-axis-v27{position:absolute;left:7px;font-size:8px;opacity:.45;z-index:2}.intonation-axis-v27.top{top:5px}.intonation-axis-v27.bottom{bottom:29px}.intonation-metrics-v27{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:11px 0}.intonation-metrics-v27 span{display:grid;gap:2px;padding:9px;border-radius:12px;background:color-mix(in srgb,var(--p1) 24%,transparent)}.intonation-metrics-v27 small{font-size:9px;opacity:.55}.intonation-metrics-v27 b{font-size:15px}.floating-toolbar-inline-v27{display:grid!important;grid-template-columns:repeat(3,1fr);gap:6px!important}.floating-toolbar-inline-v27 button{border-radius:12px!important;min-height:44px;touch-action:manipulation}.intonation-detail-v27{margin-top:9px;border-top:1px solid var(--v27-border);padding-top:10px}.intonation-detail-v27 summary{font-size:12px;font-weight:800;cursor:pointer}.intonation-detail-v27 .intonation-note{margin-top:8px}
@media(max-width:390px){.ui-style-grid-v27>button{padding:12px}.intonation-analysis-card.intonation-v27{padding:13px}.intonation-metrics-v27 small{font-size:8px}.floating-toolbar-inline-v27 button{font-size:11px;padding-inline:4px}}@media(max-width:350px){.intonation-metrics-v27{grid-template-columns:1fr}.floating-toolbar-inline-v27{grid-template-columns:1fr!important}}

/* Suite 2.8 model picker small-screen stabilization */
.model-favorite{align-self:stretch;min-height:44px;height:auto}
@media(max-width:380px){
  .model-picker-select{grid-template-columns:minmax(0,1fr) auto;align-items:start}
  .model-picker-select>span{grid-column:1;grid-row:1;min-width:0}
  .model-picker-select>strong{grid-column:1/-1;grid-row:2;text-align:left;white-space:normal;overflow-wrap:anywhere}
  .model-picker-select>i{grid-column:2;grid-row:1;align-self:start}
  .model-picker-meta{display:grid;grid-template-columns:1fr}
  .model-picker-meta small{text-align:left}
}
.preset-grid-v28,.tone-grid-v28{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.preset-card-v28,.tone-card-v28{min-width:0;min-height:72px;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel);color:var(--ink);text-align:left}.preset-card-v28 b,.tone-card-v28 b{display:block;font-size:12px}.preset-card-v28 small,.tone-card-v28 small{display:block;margin-top:5px;color:var(--muted);font-size:9px;line-height:1.4}.preset-card-v28.active,.tone-card-v28.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}.correction-option-list-v28{display:grid;gap:0;margin-top:10px;border:1px solid var(--line);border-radius:15px;overflow:hidden}.correction-option-list-v28 .toggle-line{margin:0;padding:12px 13px;border-bottom:1px solid var(--line);background:var(--panel)}.correction-option-list-v28 .toggle-line:last-child{border-bottom:0}.settings-preview-v28{margin-top:10px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.settings-preview-v28>small{color:var(--muted);font-size:9px}.settings-preview-v28>b{display:block;margin-top:5px}.settings-preview-v28 p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.6}.settings-management-v28{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.settings-management-v28 button{min-height:44px;padding:8px;border:1px solid var(--line);border-radius:13px;background:var(--panel);color:var(--ink);font-size:10px;font-weight:800}.score-scale-grid-v28{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.score-scale-grid-v28 button{min-height:44px;border:1px solid var(--line);border-radius:13px;background:var(--panel);color:var(--ink);font-weight:800}.score-scale-grid-v28 button.active{border-color:var(--accent);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
html[data-correction-show-original="false"] .correction-unified-v27 .correction-line.original{display:none!important}html[data-correction-show-native="false"] .correction-unified-v27 .correction-line.natural{display:none!important}html[data-correction-show-tts="false"] .correction-unified-v27 .tiny-listen{display:none!important}html[data-correction-show-pronunciation="false"] .correction-unified-v27 .retry-sentence{display:none!important}html[data-correction-highlight-changes="false"] .correction-unified-v27 .correction-line.corrected{background:var(--panel)!important;border-color:var(--line)!important}html[data-correction-detail="simple"] .correction-unified-v27 .correction-line.original,html[data-correction-detail="simple"] .correction-unified-v27 .correction-line.natural,html[data-correction-detail="simple"] .correction-unified-v27 .correction-detail-v27{display:none!important}html[data-correction-detail="standard"] .correction-unified-v27 .correction-detail-v27:not([open])>*:not(summary){display:none}html[data-reduce-motion="true"] *,html[data-reduce-motion="true"] *::before,html[data-reduce-motion="true"] *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}html[data-reduce-glass="true"] .floating-toolbar-v27,html[data-reduce-glass="true"] .page-header-v27,html[data-reduce-glass="true"] .grammar-rating-dock,html[data-reduce-glass="true"] .grade-grid,html[data-reduce-glass="true"][data-ui-style="liquid"] .compact-panel,html[data-reduce-glass="true"][data-ui-style="liquid"] .card,html[data-reduce-glass="true"][data-ui-style="liquid"] .correction-card,html[data-reduce-glass="true"][data-ui-style="liquid"] .section-head{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--panel)!important}html[data-high-contrast="true"]{--line:color-mix(in srgb,var(--ink) 34%,transparent);--muted:color-mix(in srgb,var(--ink) 72%,transparent)}html[data-high-contrast="true"] button,html[data-high-contrast="true"] .compact-panel,html[data-high-contrast="true"] .card{border-width:1.5px!important}html[data-large-touch="true"] button,html[data-large-touch="true"] [role="button"],html[data-large-touch="true"] .menu-row{min-height:48px}html[data-score-scale="large"] .score,html[data-score-scale="large"] .result-score,html[data-score-scale="large"] .pronunciation-score,html[data-score-scale="large"] .stat-hero-value{font-size:calc(1em + 8px)!important}
@media(max-width:520px){.preset-grid-v28,.tone-grid-v28{grid-template-columns:1fr}.settings-management-v28{grid-template-columns:1fr}.preset-card-v28,.tone-card-v28{min-height:58px}}

.density-segments-v27 button{min-height:44px}

html[data-score-scale="standard"] .score-preview-value-v571{font-size:20px!important}
html[data-score-scale="large"] .score-preview-value-v571{font-size:28px!important}
.toggle-line input[type="checkbox"],.switch input[type="checkbox"]{-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;width:48px;height:28px;min-width:48px;min-height:28px;margin:0;padding:3px;border:0;border-radius:99px;background:var(--track,var(--surface-soft));box-shadow:inset 0 0 0 1px var(--line);transition:background var(--motion-state),box-shadow var(--motion-state)}
.toggle-line input[type="checkbox"]::after,.switch input[type="checkbox"]::after{content:"";display:block;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.22);transform:translateX(0);transition:transform var(--motion-state)}
.toggle-line input[type="checkbox"]:checked,.switch input[type="checkbox"]:checked{background:var(--accent);box-shadow:none}
.toggle-line input[type="checkbox"]:checked::after,.switch input[type="checkbox"]:checked::after{transform:translateX(20px)}
.toggle-line input[type="checkbox"]:focus-visible,.switch input[type="checkbox"]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(forced-colors:active){.toggle-line input[type="checkbox"],.switch input[type="checkbox"]{border:1px solid ButtonText;forced-color-adjust:auto}.toggle-line input[type="checkbox"]:checked,.switch input[type="checkbox"]:checked{background:Highlight}}

.model-picker-item.model-expired{opacity:.66}.model-picker-item.model-expired .model-picker-select{cursor:not-allowed}.model-picker-item.model-expired .model-badges em:last-child{border-color:color-mix(in srgb,#ff453a 50%,var(--border));color:#ff453a}

/* Suite 2.9.3 — unified audio transport and settings preview controls */
.voice-action-grid-v293{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,.8fr);gap:7px;align-items:center;margin-top:12px}
.voice-action-grid-v293 .audio-status{grid-column:1/-1;margin:1px 0 0;min-height:20px}
.audio-transport-v293{position:fixed;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));bottom:calc(72px + env(safe-area-inset-bottom));z-index:95;display:grid;grid-template-columns:38px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:10px 11px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:18px;background:color-mix(in srgb,var(--panel) 96%,transparent);box-shadow:0 12px 32px rgba(0,0,0,.2)}
.audio-transport-v293.hidden{display:none}
.audio-transport-icon-v293{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-size:18px;font-weight:900}
.audio-transport-copy-v293{display:grid;gap:2px;min-width:0}.audio-transport-copy-v293 b,.audio-transport-copy-v293 small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.audio-transport-copy-v293 b{font-size:12px}.audio-transport-copy-v293 small{font-size:10px;color:var(--muted)}
.audio-transport-v293 button{min-height:42px;padding:8px 11px;white-space:nowrap}
.audio-transport-v293[data-audio-state="paused"]{border-color:color-mix(in srgb,var(--warning,#d99614) 55%,var(--line))}
.audio-transport-v293[data-audio-state="loading"] .audio-transport-icon-v293{animation:audioPulseV293 1.1s ease-in-out infinite}
@keyframes audioPulseV293{50%{transform:scale(.9);opacity:.55}}
@media(max-width:390px){.voice-action-grid-v293{grid-template-columns:1fr 1fr}.voice-action-grid-v293 #previewTts,.voice-action-grid-v293 #previewScenarioVoice{grid-column:1/-1}.audio-transport-v293{grid-template-columns:34px minmax(0,1fr) auto;padding:9px}.audio-transport-v293 #audioStopV293{grid-column:3}.audio-transport-v293 #audioPauseResumeV293{grid-column:1/-1;width:100%}}
@media(prefers-reduced-motion:reduce){.audio-transport-v293[data-audio-state="loading"] .audio-transport-icon-v293{animation:none}}
/* Routine Suite v5.0 workstream E — consolidated release scar layers.
   Concatenation of uiux-v295.css, uiux-v298.css, uiux-v299.css, uiux-v2910.css, uiux-v300.css, uiux-v310.css, uiux-v315.css, uiux-v33-hotfix.css in cascade order.
   Content is unchanged; generated output stays byte-identical. */
/* Routine Suite 2.9.5 · PWA interaction and accessibility baseline */
:root{--tap-target-v295:44px;--focus-ring-v295:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}
button,[role="button"],summary{touch-action:manipulation;-webkit-tap-highlight-color:color-mix(in srgb,var(--accent) 16%,transparent)}
button:disabled,[aria-disabled="true"]{opacity:.48!important;pointer-events:none!important;filter:saturate(.72)}
button:focus-visible,[role="button"]:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:0;box-shadow:var(--focus-ring-v295)!important}
.menu-row,.setting-row,.task-route-card,.route-slot,.primary-button,.secondary-button,.bottom-nav button{min-height:var(--tap-target-v295)}
.menu-row span,.setting-row span,.task-route-card span,.route-slot span{min-width:0}
.menu-row strong,.menu-row small,.setting-row strong,.setting-row small,.task-route-card b,.task-route-card small{overflow-wrap:anywhere;word-break:keep-all}
#appHeader{isolation:isolate;pointer-events:auto}
#backButton{position:relative;z-index:3;min-width:44px;min-height:44px;touch-action:manipulation}
.bottom-nav{gap:4px!important;padding:6px!important}
.bottom-nav button{border-radius:16px!important;transition:background .18s ease,color .18s ease,transform .12s ease}
.bottom-nav button.active{background:color-mix(in srgb,var(--accent) 12%,transparent)!important;color:var(--accent)!important}
.bottom-nav button:active{transform:scale(.96)}
.loading-overlay,.modal-backdrop{overscroll-behavior:contain}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}.bottom-nav button,.view,.loading-overlay{animation:none!important;transition:none!important}}
@media(prefers-reduced-transparency:reduce){.bottom-nav,#appHeader,.loading-card,.modal-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--surface,#fff)!important}}


/* Routine Suite 2.9.7 hotfix · speaking recorder, scenario composer and restore consent */
.record-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 16px 20px;margin:6px 0 10px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:24px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,var(--panel)),var(--panel));box-shadow:0 16px 44px rgba(0,0,0,.08)}
.record-stage .wave{order:0;height:22px}.record-stage .mic-button{order:1;width:88px;height:88px;font-size:24px;border:8px solid color-mix(in srgb,var(--accent) 13%,transparent);background-clip:padding-box;box-shadow:0 14px 34px color-mix(in srgb,var(--accent) 26%,transparent)}
.record-stage #recordTimer{order:2;display:block;margin-top:1px;font-size:22px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--text)}
.record-stage p{order:3;margin:0;color:var(--muted);font-size:12px}
.record-stage:has(.mic-button.recording){border-color:color-mix(in srgb,var(--danger) 45%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--danger) 8%,var(--panel)),var(--panel))}

body[data-view="scenarioRoom"]{padding-bottom:calc(242px + var(--safe-b))}
.voice-composer{bottom:max(10px,var(--safe-b));z-index:80;width:min(720px,calc(100% - 20px));padding:12px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:25px;background:color-mix(in srgb,var(--panel) 96%,transparent);box-shadow:0 20px 56px rgba(0,0,0,.24);backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%)}
.voice-composer .transcript{min-height:20px;margin:0 4px 10px;padding:0;color:var(--muted);font-size:12px;line-height:1.45}
.voice-composer .composer-actions{grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr);gap:10px}
.voice-composer .composer-actions .secondary{min-height:54px;border-radius:18px;font-size:13px}
.voice-composer #scenarioMic{width:72px;height:72px;font-size:22px;border:7px solid color-mix(in srgb,var(--accent) 13%,transparent);background-clip:padding-box}
.voice-composer #finishScenario{width:100%;min-height:42px;margin-top:8px;border-radius:15px}
.scenario-audio-slot:empty{display:none}.scenario-audio-slot{margin:0 0 10px}
.scenario-audio-slot .audio-transport-v293{position:static;inset:auto;width:100%;display:grid;grid-template-columns:38px minmax(0,1fr) auto auto;margin:0;padding:9px 10px;border-radius:17px;box-shadow:none;background:color-mix(in srgb,var(--accent) 7%,var(--surface-soft))}
.scenario-audio-slot .audio-transport-v293.hidden{display:none}
.scenario-audio-slot .audio-transport-v293 button{min-height:42px;padding:8px 10px}

.ai-restore-dialog{width:min(380px,calc(100% - 28px));border-radius:28px}.ai-restore-dialog form{padding:26px 22px 20px;text-align:center}.ai-restore-icon{width:58px;height:58px;margin:0 auto 14px;display:grid;place-items:center;border-radius:20px;background:var(--accent-soft);color:var(--accent);font-size:28px;font-weight:900}.ai-restore-dialog h2{margin:6px 0 8px;font-size:21px}.ai-restore-dialog>form>p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px;line-height:1.6}.ai-restore-meta{display:flex;justify-content:space-between;gap:12px;margin:18px 0 4px;padding:12px 13px;border-radius:15px;background:var(--surface-soft);text-align:left}.ai-restore-meta span{font-weight:850}.ai-restore-meta small{color:var(--muted)}.ai-restore-dialog menu{display:grid;grid-template-columns:1fr 1.25fr;gap:9px;margin:18px 0 0;padding:0}.ai-restore-dialog menu button{min-height:48px}

@media(max-width:390px){body[data-view="scenarioRoom"]{padding-bottom:calc(254px + var(--safe-b))}.voice-composer{width:calc(100% - 16px);padding:10px}.voice-composer .composer-actions{grid-template-columns:minmax(0,1fr) 66px minmax(0,1fr);gap:7px}.voice-composer #scenarioMic{width:66px;height:66px}.scenario-audio-slot .audio-transport-v293{grid-template-columns:34px minmax(0,1fr) auto}.scenario-audio-slot .audio-transport-v293 #audioStopV293{grid-column:3}.scenario-audio-slot .audio-transport-v293 #audioPauseResumeV293{grid-column:1/-1;width:100%}}
@media(prefers-reduced-transparency:reduce){.voice-composer{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--panel)}}
/* Routine Speak PWA 3.2.8 · route clarity, stable loading, TTS provenance */
.task-route-card-v298{gap:16px}.task-route-card-v298>.route-chain{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin-top:12px}.task-route-card-v298 .route-chain>em{display:flex;align-items:center;gap:9px;min-width:0;padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--radius-compact)}.task-route-card-v298 .route-chain>em>i{flex:0 0 27px;width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:var(--surface-soft);font-style:normal}.task-route-card-v298 .route-chain>em>span{display:grid;min-width:0;text-align:left}.task-route-card-v298 .route-chain>em small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
.route-provider-status-v298{display:grid;gap:8px;margin-top:14px}.route-provider-row-v298{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--line);border-radius:14px}.route-provider-row-v298>span:nth-child(2){display:grid;min-width:0}.route-provider-row-v298 small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.route-provider-row-v298 em{font-style:normal;font-size:12px;color:var(--muted)}.provider-dot{width:9px;height:9px;border-radius:50%;background:var(--muted)}.provider-dot.ok{background:#32b978;box-shadow:0 0 0 4px color-mix(in srgb,#32b978 16%,transparent)}
.ai-restore-dialog menu{display:grid;grid-template-columns:.8fr 1fr 1.2fr;gap:10px}.ai-restore-dialog .danger{color:#ff7676}
.audio-transport-copy-v293{min-width:0}.audio-transport-copy-v293 em{display:block;margin-top:3px;font-size:11px;font-style:normal;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loader-card{contain:layout paint}.loader-card #loadingDetail{min-height:3.1em;transition:none}.loading-steps span,.loading-steps b{transition:none!important}
@media(max-width:420px){.task-route-card-v298>.route-chain{grid-template-columns:1fr}.ai-restore-dialog menu{grid-template-columns:1fr}.route-provider-row-v298{grid-template-columns:auto 1fr}.route-provider-row-v298 em{grid-column:2}}

.provider-dot.error{background:var(--danger);box-shadow:0 0 0 4px color-mix(in srgb,var(--danger) 14%,transparent)}
/* Routine Speak PWA 3.2.9 · foreground AI and shared review timebox */
.memory-timebox-v299{display:grid;gap:12px;padding:18px;border:1px solid var(--line);border-radius:22px;background:var(--panel)}.memory-timebox-v299>div{display:grid;gap:4px}.memory-timebox-v299 small{color:var(--accent);font-weight:900;letter-spacing:.13em}.memory-timebox-v299 b{font-size:20px}.memory-timebox-v299 span{color:var(--muted);font-size:13px}.memory-timebox-v299>i{height:8px;border-radius:99px;background:var(--surface);overflow:hidden}.memory-timebox-v299>i>b{display:block;height:100%;background:var(--accent)}
#loadingOverlay .loading-card{min-height:410px}#loadingTime{font-variant-numeric:tabular-nums;min-width:64px;text-align:right}#loadingDetail{min-height:48px}.loading-steps span b{min-height:22px;display:flex;align-items:center}
/* Routine Speak PWA 3.2.10 · correction studio harmony */
.correction-studio-v2910{display:grid;gap:18px;min-width:0}
.correction-studio-v2910 .evaluation-main,.correction-studio-v2910 .pron-result-hero{min-width:0}
.correction-studio-v2910 .evaluation-main h2,.correction-studio-v2910 .pron-result-hero h2{line-height:1.24;letter-spacing:-.035em;overflow-wrap:anywhere}
.correction-studio-v2910 .evaluation-column,.correction-studio-v2910 .recognized-card,.correction-studio-v2910 .pron-issue,.correction-studio-v2910 .next-step-card{border-radius:var(--radius-card)}
.correction-studio-v2910 .correction-action-bar-v2910,.correction-studio-v2910 .evaluation-actions{position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px!important;margin-top:4px!important;padding:9px!important;border:1px solid var(--border);border-radius:21px;background:color-mix(in srgb,var(--panel) 90%,transparent);box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.correction-studio-v2910 .correction-action-bar-v2910 button,.correction-studio-v2910 .evaluation-actions button{min-width:0;min-height:48px;white-space:normal;line-height:1.25}
.correction-studio-v2910 .recognized-card p[lang="ja"],.correction-studio-v2910 .pron-issue h4[lang="ja"]{font-size:clamp(17px,4.3vw,24px);line-height:1.68}
.correction-studio-v2910 .expression-deck{display:grid;gap:10px}
@media(max-width:390px){.correction-studio-v2910 .correction-action-bar-v2910,.correction-studio-v2910 .evaluation-actions{grid-template-columns:1fr 1fr}.correction-studio-v2910 .evaluation-actions button:last-child:nth-child(odd){grid-column:1/-1}}
/* Routine Speak PWA 3.3.0 · design runtime across Today and Learning */
:root{--v300-rule:color-mix(in srgb,var(--line) 82%,transparent);--v300-linear-pad:15px}
/* Density now controls Routine Core everywhere, including home. */
html[data-ui-density="comfortable"] #homeView{--home-gap:24px}html[data-ui-density="comfortable"] #homeView .home-learning-menu-v20 .menu-row{min-height:104px}html[data-ui-density="dense"] #homeView{--home-gap:13px}html[data-ui-density="dense"] #homeView .home-intro{margin-bottom:13px}html[data-ui-density="dense"] #homeView .home-cluster-v20,html[data-ui-density="dense"] #homeView .home-review-strip-v21{margin-bottom:11px}html[data-ui-density="dense"] #homeView .home-learning-menu-v20 .menu-row{min-height:68px;padding-block:10px}
html[data-ui-style="liquid"] #homeView .home-intro,html[data-ui-style="liquid"] #homeView .home-learning-menu-v20,html[data-ui-style="liquid"] #homeView .home-review-strip-v21>button{border:1px solid color-mix(in srgb,white 27%,var(--accent) 16%);background:linear-gradient(145deg,color-mix(in srgb,white 12%,transparent),color-mix(in srgb,var(--panel) 73%,transparent));box-shadow:0 16px 38px rgba(8,18,30,.12),inset 0 1px 0 rgba(255,255,255,.22);backdrop-filter:blur(22px) saturate(155%);-webkit-backdrop-filter:blur(22px) saturate(155%)}html[data-reduce-glass="true"][data-ui-style="liquid"] #homeView .home-intro,html[data-reduce-glass="true"][data-ui-style="liquid"] #homeView .home-learning-menu-v20,html[data-reduce-glass="true"][data-ui-style="liquid"] #homeView .home-review-strip-v21>button{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--panel)}
/* Scenario pre-learning: efficient vertical reading order instead of split columns. */
#scenarioPreview{display:grid;gap:15px}#scenarioPreview>h2{margin:0;font-size:clamp(25px,7.5vw,34px);line-height:1.2}#scenarioPreview>p{margin:0;line-height:1.7}.scene-key-expressions{padding:15px;border-radius:18px}.scene-key-expressions>b{margin-bottom:11px}.scene-key-expressions>div{gap:9px}.scene-key-expressions button{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;align-items:start!important;padding:15px;border-radius:15px;text-align:left!important}.scene-key-expressions button>.study-expression{gap:5px}.scene-key-expressions .furigana-line{font-size:11px;line-height:1.35}.scene-key-expressions .japanese-line{font-size:clamp(19px,5.7vw,25px);font-weight:750;line-height:1.45;overflow-wrap:anywhere}.scene-key-expressions .meaning-line{font-size:12px;line-height:1.55;padding-top:8px}.scene-key-expressions button>small{white-space:normal!important;line-height:1.5;padding-top:8px;border-top:1px solid var(--v300-rule);color:var(--muted)}.scenario-meta-grid{gap:8px}.mission-preview{padding:15px}.scene-path:empty{display:none}
@media(min-width:720px){.scene-key-expressions>div{grid-template-columns:1fr 1fr}.scene-key-expressions button{min-height:178px}}
@media(max-width:390px){#scenarioPreview{gap:12px}.scene-key-expressions{padding:12px}.scene-key-expressions button{padding:13px!important}.scene-key-expressions .japanese-line{font-size:20px}}

/* Routine Suite 3.0.3 stabilization */
.learning-catalog-v301{margin-top:10px!important}.learning-catalog-v301 .category-grid{gap:9px}.learning-catalog-v301 .category-card{grid-template-rows:42px 29px minmax(30px,auto)!important;min-height:126px!important;padding:var(--space-3) var(--space-4) var(--space-3)!important}.learning-catalog-v301 .category-card i{width:40px!important;height:40px!important;line-height:40px!important;border-radius:var(--radius-compact)!important;font-size:21px!important}.learning-catalog-v301 .category-card b{font-size:calc(18px * var(--font-scale))!important;line-height:1.12!important}.learning-catalog-v301 .category-card small,.learning-catalog-v301 .learning-sub{margin-top:5px!important;min-height:0!important;font-size:calc(9.5px * var(--font-scale))!important;line-height:1.35!important}.learning-root-topbar-v301{margin-bottom:2px}
html[data-ui-density="dense"] .learning-catalog-v301 .category-card{min-height:112px!important;padding:var(--space-3) var(--space-3)!important;grid-template-rows:36px 26px minmax(26px,auto)!important}html[data-ui-density="comfortable"] .learning-catalog-v301 .category-card{min-height:142px!important;padding:var(--space-4)!important}
html[data-ui-style="liquid"] .card,html[data-ui-style="liquid"] .category-card{position:relative;overflow:hidden}html[data-ui-style="liquid"] .card::before,html[data-ui-style="liquid"] .category-card::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);pointer-events:none}html[data-ui-style="liquid"] .card,html[data-ui-style="liquid"] .category-card{border-color:color-mix(in srgb,white 35%,var(--accent) 12%)!important;box-shadow:0 12px 32px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.08)!important}
@media(max-height:850px){.learning-catalog-v301{margin-top:6px!important}.learning-catalog-v301 .category-card{min-height:116px!important;padding:11px 12px!important;grid-template-rows:38px 27px minmax(27px,auto)!important}.learning-catalog-v301 .category-card i{width:36px!important;height:36px!important;line-height:36px!important;font-size:19px!important}.learning-catalog-v301+.footer-note{margin-top:7px!important}}

html[data-color-mode="dark"],html[data-theme="dark"]{--p0:#0d1210;--bg:#0d1210;--card:#151c18;--card-solid:#151c18;--soft:#19231e;--track:#26302b;--border:rgba(224,235,228,.12);--muted:rgba(224,235,228,.62)}

/* 3.0.5 routing allocation */
.routing-use-map-v305{display:grid;gap:8px}.routing-use-map-v305 article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:12px;border-radius:13px;background:var(--panel-soft,#f5f7fa);border:1px solid var(--line,#e5e7eb)}.routing-use-map-v305 article b{font-size:13px}.routing-use-map-v305 article span{font-size:11px;font-weight:800;color:var(--accent);text-align:right}.routing-use-map-v305 article small{grid-column:1/-1;color:var(--muted);line-height:1.45}.assessment-basis-v305{margin:12px 0;border:1px solid var(--line);border-radius:13px;overflow:hidden}.assessment-basis-v305 summary{padding:12px 14px;font-weight:800}.assessment-basis-v305>div{display:grid;gap:7px;padding:0 14px 14px}.assessment-basis-v305 p{margin:0;font-size:12px;line-height:1.5;color:var(--muted)}.assessment-basis-v305 strong{color:var(--text)}.assessment-basis-v305.low{border-color:#d66}.assessment-confidence-v305{display:inline-flex;padding:4px 8px;border-radius:99px;background:var(--panel-soft);font-size:11px;font-weight:800}.task-route-card-v298 .route-chain{grid-template-columns:repeat(2,minmax(0,1fr))}.route-chain em:nth-child(n+5){opacity:.78}
/* Routine Suite 3.1.0 — Scriptable/PWA settings rhythm parity */
#settingsView .ui-summary-card-v20,#settingsAiView .ui-summary-card-v20,#settingsTtsView .ui-summary-card-v20{border-radius:var(--radius-card)}
#settingsView .settings-category-v21,#settingsAiView .compact-panel,#settingsTtsView .compact-panel,
#settingsView details,#settingsAiView details,#settingsTtsView details{border-radius:18px}
#settingsView .menu-row,#settingsAiView .toggle-line,#settingsTtsView .toggle-line{min-height:58px;padding:12px 14px}
#settingsView .settings-category-v21{margin-top:10px}
#settingsView .settings-category-head-v21 b,#settingsAiView summary b,#settingsTtsView summary b{letter-spacing:-.015em}
#settingsAiView .task-route-card-v298{border-radius:var(--radius-card);padding:var(--space-4);gap:12px}
#settingsAiView .task-route-card-v298>span{min-width:0}
#settingsAiView .task-route-card-v298>span>b,#settingsAiView .task-route-card-v298>span>small{display:block;overflow:hidden;text-overflow:ellipsis}
#settingsAiView .task-route-card-v298>span>small{line-height:1.42}
#settingsAiView .effective-route-v310{display:block;margin-top:7px;color:var(--muted);font-size:12px;font-style:normal;line-height:1.42;white-space:normal}
#settingsAiView .route-chain{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
#settingsAiView .route-chain::-webkit-scrollbar{display:none}
#settingsAiView .route-chain em{flex:0 0 auto;min-width:112px}
#settingsAiView .route-chain em:first-child{outline:1px solid var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 14%,transparent)}
#settingsAiView .route-chain .route-empty-v310{min-width:100%;outline:0;box-shadow:none}
#settingsAiView .direct-provider-card-v310{display:grid;gap:8px}
#settingsAiView .direct-provider-card-v310 .setting-help{margin:0;padding:0 2px}
#settingsAiView .route-provider-row-v298 span:nth-child(2){min-width:0}
#settingsAiView .route-provider-row-v298 span:nth-child(2) b,#settingsAiView .route-provider-row-v298 span:nth-child(2) small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:520px){
  #settingsView .menu-row,#settingsAiView .toggle-line,#settingsTtsView .toggle-line{padding:11px 12px}
  #settingsAiView .task-route-card-v298{padding:12px}
  #settingsAiView .route-chain em{min-width:104px}
}
/* Routine Suite 3.3.0 — prompt contracts and pronunciation confidence. */
.prompt-contract-map-v315{display:grid;gap:10px}
.prompt-contract-map-v315 article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:13px 14px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}
.prompt-contract-map-v315 b{font-size:13px;overflow-wrap:anywhere}.prompt-contract-map-v315 span{font-size:11px;color:var(--accent);font-weight:700}.prompt-contract-map-v315 small{grid-column:1/-1;color:var(--muted);line-height:1.45}.prompt-contract-map-v315 em{grid-column:1/-1;font-size:10px;color:var(--muted);font-style:normal}
.pron-quality-v315{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.pron-quality-v315 span{padding:10px;border-radius:13px;background:var(--panel-soft);text-align:center}.pron-quality-v315 small{display:block;color:var(--muted);font-size:10px}.pron-quality-v315 b{font-size:13px}.assessment-basis-v305 p{overflow-wrap:anywhere}
@media(max-width:520px){.pron-quality-v315{grid-template-columns:1fr}.prompt-contract-map-v315 article{grid-template-columns:1fr}.prompt-contract-map-v315 span{justify-self:start}}
/* Routine Speak 3.3 hotfix working copy */
/* 실제 학습별 사용표: 다크모드에서도 패널과 텍스트 대비 유지 */
.routing-use-map-v305 article{background:color-mix(in srgb,var(--panel) 94%,var(--accent) 6%)!important;border-color:var(--line)!important;color:var(--text)!important}
.routing-use-map-v305 article b{color:var(--text)!important}
.routing-use-map-v305 article small{color:var(--muted)!important}
@media(prefers-color-scheme:dark){.routing-use-map-v305 article{background:color-mix(in srgb,var(--panel) 90%,white 4%)!important;border-color:color-mix(in srgb,var(--line) 78%,white 10%)!important}.routing-use-map-v305 article b{color:var(--text)!important}.routing-use-map-v305 article small{color:color-mix(in srgb,var(--muted) 88%,white 12%)!important}}
/* Routine Suite 3.4.3 — shared settings contract.
   Byte-identical in PWA and Scriptable. Platform-specific controls stay independent. */
:root{
  --settings-gap-v34:10px;
  --settings-card-radius-v34:18px;
  --settings-control-radius-v34:14px;
  --settings-compact-radius-v34:12px;
}
.settings-detail-page-v34,
#settingsAiView,#settingsTtsView,#settingsDataView,#diagnosticsView{
  min-width:0;
  overflow-x:hidden;
}
.settings-detail-page-v34 .section-head,
#settingsAiView>.section-head,#settingsTtsView>.section-head,
#settingsDataView>.section-head,#diagnosticsView>.section-head{
  margin-bottom:12px;
}
.settings-shell-v34{display:grid;gap:var(--settings-gap-v34);min-width:0}
.settings-summary-v34,.ui-summary-card-v20{
  min-width:0;overflow:hidden;border-radius:var(--settings-card-radius-v34);
}
.settings-summary-v34 b,.ui-summary-card-v20 b{overflow-wrap:anywhere}
.settings-section-v34,.diagnostic-section-v335,.settings-subpanel,.settings-accordion-v21{
  min-width:0;overflow:hidden;border-radius:var(--settings-card-radius-v34);
}
.settings-section-v34{display:grid;gap:10px;padding:12px}
.settings-section-v34>header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.settings-section-v34>header>div{display:grid;gap:2px;min-width:0}
.settings-section-v34 h3{margin:0;font-size:16px;line-height:1.3}
.settings-section-v34 small{color:var(--muted);line-height:1.4}
.status-badge-v34,.status-badge-v335{
  display:inline-flex;align-items:center;justify-content:center;min-height:25px;
  padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;white-space:nowrap;
  background:var(--surface-soft);color:var(--muted);border:1px solid var(--line);
}
.status-badge-v34.ok,.status-badge-v335.ok{background:color-mix(in srgb,#1b9e68 12%,var(--surface));color:#16754f;border-color:color-mix(in srgb,#1b9e68 35%,var(--line))}
.status-badge-v34.warn,.status-badge-v335.warn{background:color-mix(in srgb,#d3901f 13%,var(--surface));color:#8a5b0d;border-color:color-mix(in srgb,#d3901f 36%,var(--line))}
.status-badge-v34.error,.status-badge-v335.error{background:color-mix(in srgb,#d54d59 12%,var(--surface));color:#a72e39;border-color:color-mix(in srgb,#d54d59 34%,var(--line))}
.status-badge-v34.fallback{background:var(--accent-soft);color:var(--accent);border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
.layout-audit-note-v590{margin:0 0 9px;color:var(--muted);font-size:11px;line-height:1.5}
.layout-audit-grid-v590{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.layout-audit-grid-v590 article{display:grid;gap:3px;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}
.layout-audit-grid-v590 b{color:var(--muted);font-size:9.5px;font-weight:600;line-height:1.3}
.layout-audit-grid-v590 strong{font-size:16px;line-height:1.2}
.layout-audit-device-v590{display:block;margin-top:9px;color:var(--muted);font-size:9.5px;line-height:1.4}

/* Compact route cards: one content column and six providers in two rows. */
#settingsAiView .task-route-list,
#settingsAiView .task-route-list-v337,
.task-route-list-v337{display:grid;gap:8px;min-width:0;width:100%}
.settings-routing-studio-v299 .task-route-card-v337,
#settingsAiView .task-route-card-v298,
#settingsAiView .task-route-card-v310,
.task-route-card-v337{
  box-sizing:border-box;width:100%;max-width:100%;min-width:0;
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;
  padding:var(--space-3) var(--space-3)!important;text-align:left;overflow:hidden;
  border-radius:var(--radius-card)!important;
}
.route-card-head-v341{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;min-width:0}
.route-card-head-v341>span,
#settingsAiView .task-route-card-v298>span,
#settingsAiView .task-route-card-v310>span,
.task-route-card-v337>span{display:grid;gap:2px;min-width:0;width:100%}
.route-card-head-v341 b,
#settingsAiView .task-route-card-v298>span>b,
#settingsAiView .task-route-card-v310>span>b,
.task-route-card-v337>span>b{
  display:block;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
  overflow-wrap:anywhere;word-break:keep-all;font-size:15px;line-height:1.3;
}
.route-card-head-v341 small,
#settingsAiView .task-route-card-v298>span>small,
#settingsAiView .task-route-card-v310>span>small,
.task-route-card-v337>span>small{
  display:block;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
  overflow-wrap:anywhere;word-break:keep-all;font-size:10.5px;line-height:1.35;color:var(--muted);
}
.route-effective-badge-v341{
  align-self:start;max-width:132px;padding:5px 7px;border-radius:999px;
  background:var(--accent-soft);color:var(--accent);font-size:9.5px;font-style:normal;
  font-weight:800;line-height:1.25;text-align:right;overflow-wrap:anywhere;
}
#settingsAiView .effective-route-v310{
  margin-top:2px!important;font-size:10px!important;line-height:1.35!important;color:var(--muted)!important;
}
#settingsAiView .route-chain,.route-chain-v337{
  box-sizing:border-box;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;width:100%!important;min-width:0!important;max-width:100%!important;
  overflow:visible!important;padding:0!important;margin:0!important;
}
#settingsAiView .route-chain>em,.route-chain-v337>em{
  box-sizing:border-box;width:100%!important;min-width:0!important;max-width:100%!important;
  min-height:46px!important;display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;
  align-items:center;gap:6px;padding:7px!important;border-radius:11px!important;overflow:hidden;
}
#settingsAiView .route-chain>em>i,.route-chain-v337>em>i{
  width:22px!important;height:22px!important;min-width:22px!important;display:grid;place-items:center;
  border-radius:8px;font-size:10px;font-style:normal;font-weight:900;
}
#settingsAiView .route-chain>em>span,.route-chain-v337>em>span{display:grid;gap:1px;min-width:0}
#settingsAiView .route-chain>em b,#settingsAiView .route-chain>em small,
.route-chain-v337>em b,.route-chain-v337>em small{
  display:block;min-width:0;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
  overflow-wrap:anywhere;word-break:normal;
}
#settingsAiView .route-chain>em b,.route-chain-v337>em b{font-size:10.5px;line-height:1.15}
#settingsAiView .route-chain>em small,.route-chain-v337>em small{font-size:8.5px;line-height:1.15;color:var(--muted)}
#settingsAiView .route-empty-v310{grid-column:1/-1!important;min-width:0!important}

/* Compact inline secondary information. */
.settings-inline-details-v341{margin-top:8px;border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden}
.settings-inline-details-v341>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;list-style:none;cursor:pointer}
.settings-inline-details-v341>summary::-webkit-details-marker{display:none}
.settings-inline-details-v341>summary span{display:grid;gap:2px;min-width:0}
.settings-inline-details-v341>summary b{font-size:13px;line-height:1.25}
.settings-inline-details-v341>summary small{font-size:9.5px;color:var(--muted)}
.settings-inline-details-v341>summary i{font-style:normal;color:var(--muted)}
.settings-inline-details-v341[open]>summary{border-bottom:1px solid var(--line)}
.settings-inline-details-v341>.settings-inline-body-v341{padding:10px}
.task-routing-panel-v33 .setting-group{border-radius:14px}
.task-routing-panel-v33 .setting-line{min-height:50px;padding:9px 11px}
.task-routing-panel-v33 .routing-allocation{gap:7px}
.task-routing-panel-v33 .routing-allocation>div{padding:10px 11px;border-radius:12px}

/* Shared provider order editor. */
.route-picker-list-v337,.route-picker-list-v34{display:grid;gap:8px;margin:13px 0;min-width:0}
.route-slot-v337,.route-slot-v34,.route-slot{
  box-sizing:border-box;display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:9px;
  width:100%;min-width:0;padding:10px;border:1px solid var(--line);background:var(--surface);border-radius:14px;
}
.route-slot-v337>span,.route-slot-v34>span,.route-slot>span{display:flex;align-items:center;gap:7px;min-width:0}
.route-slot-v337 i,.route-slot-v34 i,.route-slot i{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;font-size:11px}
.route-slot-v337 select,.route-slot-v34 select,.route-slot select{box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:9px 10px;border:1px solid var(--line);background:var(--surface-solid);color:var(--text);border-radius:10px;font:inherit;font-size:12px}

/* AI, TTS, usage and diagnostics share the same compact rhythm. */
.observatory-grid-v34,.usage-source-grid-v335{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-width:0}
.observatory-grid-v34 article,.usage-source-grid-v335 article{
  min-width:0;display:grid;gap:3px;padding:10px;border:1px solid var(--line);
  background:var(--surface);border-radius:12px;
}
.observatory-grid-v34 small,.usage-source-grid-v335 small{color:var(--muted);font-size:9px}
.observatory-grid-v34 b,.usage-source-grid-v335 b{font-size:14px;overflow-wrap:anywhere}
.observatory-list-v34,.usage-provider-list-v335{display:grid;gap:6px;min-width:0}
.observatory-list-v34 article,.usage-provider-list-v335 article{
  min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;
  padding:10px;border:1px solid var(--line);background:var(--surface);border-radius:12px;
}
.observatory-list-v34 article>b,.usage-provider-list-v335 article>b{min-width:0;overflow-wrap:anywhere;font-size:12px}
.observatory-list-v34 article>strong,.usage-provider-list-v335 article>strong{white-space:nowrap;color:var(--accent);font-size:10px}
.observatory-list-v34 article>small,.usage-provider-list-v335 article>small{grid-column:1/-1;color:var(--muted);font-size:9px;line-height:1.35;overflow-wrap:anywhere}
.observatory-empty-v34{padding:11px;color:var(--muted);font-size:10px;border:1px dashed var(--line);border-radius:12px}
.settings-actions-v34{display:flex;gap:7px;flex-wrap:wrap}
.settings-actions-v34>*{flex:1 1 140px}
.settings-explainer-v34{margin:0;padding:9px 10px;border-radius:12px;background:var(--surface-soft);color:var(--muted);font-size:10px;line-height:1.4}

/* Model picker parity. */
.model-picker-v337,.model-picker-v34{display:grid;gap:10px;min-width:0}
.model-search-v337 input,.model-search-v34 input,.custom-model-entry-v337 input,.custom-model-entry-v34 input{box-sizing:border-box;width:100%;min-width:0}
.model-picker-item-v337,.model-picker-item-v34{min-width:0;max-width:100%}
.model-picker-select-v337,.model-picker-select-v34{min-width:0;max-width:100%}

@media(min-width:700px){
  #settingsAiView .route-chain,.route-chain-v337{grid-template-columns:repeat(6,minmax(0,1fr))!important}
}
@media(max-width:390px){
  .route-card-head-v341{grid-template-columns:minmax(0,1fr)}
  .route-effective-badge-v341{max-width:100%;justify-self:start;text-align:left}
  #settingsAiView .route-chain,.route-chain-v337{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .route-slot-v337,.route-slot-v34,.route-slot{grid-template-columns:minmax(0,1fr)}
  .observatory-grid-v34,.usage-source-grid-v335{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:340px){
  .observatory-grid-v34,.usage-source-grid-v335{grid-template-columns:minmax(0,1fr)}
}
/* Routine Suite 3.4.3 — settings-system completion.
   Byte-identical in PWA and Scriptable. Four shared styles, independent density,
   compact route summaries, and a common AI/TTS/usage/diagnostics rhythm. */
:root{
  --settings-page-title-v342:30px;
  --settings-section-title-v342:17px;
  --settings-card-title-v342:15px;
  --settings-body-v342:12px;
  --settings-caption-v342:10px;
  --settings-row-min-v342:58px;
}

/* The same four appearance choices in both apps. */
.ui-style-grid-v27{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
.ui-style-grid-v27>button,.ui-style-choice-v27{
  box-sizing:border-box!important;width:100%!important;min-width:0!important;min-height:76px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;
  padding:14px 15px!important;border-radius:16px!important;text-align:left!important;
  border:1px solid var(--line)!important;background:var(--surface)!important;color:var(--text)!important;
}
.ui-style-grid-v27>button>span,.ui-style-choice-v27>span{display:grid!important;gap:3px!important;min-width:0!important}
.ui-style-grid-v27>button b,.ui-style-choice-v27 b{font-size:16px!important;line-height:1.25!important;overflow-wrap:anywhere}
.ui-style-grid-v27>button small,.ui-style-choice-v27 small{font-size:11px!important;line-height:1.4!important;color:var(--muted)!important;opacity:1!important}
.ui-style-grid-v27>button>i,.ui-style-choice-v27>i{flex:0 0 auto!important;width:22px!important;height:22px!important}
.ui-style-grid-v27>button.active,.ui-style-choice-v27.active{border-color:var(--accent);background:var(--accent-soft)!important;box-shadow:inset 0 0 0 1px var(--accent)}

/* Density is independent from style and uses the same control geometry. */
.density-panel-v27{display:grid!important;gap:10px!important;margin-top:10px!important;padding:13px!important;border:1px solid var(--line)!important;border-radius:16px!important;background:var(--surface-soft)!important}
.density-panel-v27>span{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:4px 10px!important;align-items:start!important}
.density-panel-v27>span b{font-size:15px!important;line-height:1.3!important}
.density-panel-v27>span small{font-size:10px!important;line-height:1.35!important;color:var(--muted)!important;opacity:1!important;text-align:right}
.density-segments-v27{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
.density-segments-v27 button{box-sizing:border-box!important;min-width:0!important;min-height:44px!important;padding:8px 4px!important;border:1px solid var(--line)!important;border-radius:11px!important;background:var(--surface)!important;color:var(--text)!important;font-size:12px!important;font-weight:800!important}
.density-segments-v27 button.active{border-color:var(--accent)!important;background:var(--accent)!important;color:var(--accent-ink,#fff)!important}
.density-current-v27{font-size:10px!important;color:var(--muted)!important;opacity:1!important}

/* Shared accordion and setting-row rhythm. */
.settings-subpanel,.settings-accordion-v21{
  box-sizing:border-box!important;min-width:0!important;overflow:hidden!important;
  border:1px solid var(--line)!important;border-radius:18px!important;background:var(--surface)!important;
}
.settings-subpanel>summary,.settings-accordion-v21>summary{
  box-sizing:border-box!important;min-height:66px!important;display:flex!important;align-items:center!important;
  justify-content:space-between!important;gap:12px!important;padding:14px 15px!important;list-style:none!important;
}
.settings-subpanel>summary::-webkit-details-marker,.settings-accordion-v21>summary::-webkit-details-marker{display:none}
.settings-subpanel>summary>span,.settings-accordion-v21>summary>span{display:grid!important;gap:3px!important;min-width:0!important}
.settings-subpanel>summary b,.settings-accordion-v21>summary b{font-size:var(--settings-section-title-v342)!important;line-height:1.3!important;overflow-wrap:anywhere}
.settings-subpanel>summary small,.settings-accordion-v21>summary small{font-size:11px!important;line-height:1.35!important;color:var(--muted)!important;overflow-wrap:anywhere}
.settings-subpanel>summary i,.settings-accordion-v21>summary i{font-style:normal!important;color:var(--muted)!important}
.settings-subpanel[open]>summary,.settings-accordion-v21[open]>summary{border-bottom:1px solid var(--line)!important}
.settings-subbody,.settings-accordion-body-v21{box-sizing:border-box!important;min-width:0!important;padding:12px!important}
.setting-group,.settings-section-v34,.diagnostic-section-v335{border-radius:15px!important}
.setting-line,.mode-row{box-sizing:border-box!important;min-height:var(--settings-row-min-v342)!important;padding:11px 12px!important}
.setting-line b,.mode-row b{font-size:14px!important;line-height:1.3!important}
.setting-line small,.mode-row small{font-size:10px!important;line-height:1.35!important;color:var(--muted)!important}

/* Compact task cards: summary first, full order only in the editor sheet. */
#settingsAiView .task-route-list,.task-route-list-v337{display:grid!important;gap:8px!important;min-width:0!important;width:100%!important}
#settingsAiView .task-route-card-v342,.task-route-card-v342{
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;
  padding:var(--space-3) var(--space-3)!important;border:1px solid var(--line)!important;border-radius:var(--radius-card)!important;
  background:var(--surface)!important;color:var(--text)!important;text-align:left!important;overflow:hidden!important;
}
.route-card-head-v342{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:9px!important;align-items:start!important;min-width:0!important}
.route-card-head-v342>span{display:grid!important;gap:2px!important;min-width:0!important}
.route-card-head-v342 b{font-size:15px!important;line-height:1.25!important;white-space:normal!important;overflow-wrap:anywhere!important}
.route-card-head-v342 small{font-size:10.5px!important;line-height:1.35!important;color:var(--muted)!important;white-space:normal!important;overflow-wrap:anywhere!important}
.route-card-head-v342>i{font-style:normal!important;font-size:18px!important;line-height:1!important;color:var(--muted)!important}
.route-actual-v342{display:flex!important;align-items:baseline!important;gap:7px!important;min-width:0!important}
.route-actual-v342 small{flex:0 0 auto!important;color:var(--accent)!important;font-size:9.5px!important;font-weight:800!important}
.route-actual-v342 b{min-width:0!important;font-size:12px!important;line-height:1.3!important;font-weight:750!important;overflow-wrap:anywhere!important}
.route-chain-summary-v342{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:3px 7px!important;align-items:center!important;min-width:0!important;padding-top:7px!important;border-top:1px solid var(--line)!important}
.route-chain-summary-v342>span{min-width:0!important;font-size:11px!important;line-height:1.3!important;color:var(--text)!important;white-space:normal!important;overflow-wrap:anywhere!important}
.route-chain-summary-v342>em{padding:3px 6px!important;border-radius:999px!important;background:var(--accent-soft)!important;color:var(--accent)!important;font-size:9px!important;font-style:normal!important;font-weight:850!important}
.route-chain-summary-v342>small{grid-column:1/-1!important;color:var(--muted)!important;font-size:9px!important;line-height:1.3!important}

/* Same visual density for AI, TTS, usage and diagnostics. */
.settings-shell-v34{gap:9px!important}
.settings-section-v34,.diagnostic-section-v335{padding:12px!important;border:1px solid var(--line)!important;background:var(--surface)}
.settings-section-v34 h3,.diagnostic-section-v335 h3{font-size:15px!important;line-height:1.3!important}
.settings-section-v34 p,.diagnostic-section-v335 p,.settings-explainer-v34{font-size:10.5px!important;line-height:1.45!important}
.observatory-grid-v34,.usage-source-grid-v335{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
.observatory-grid-v34 article,.usage-source-grid-v335 article{padding:10px!important;border-radius:12px!important}
.observatory-grid-v34 b,.usage-source-grid-v335 b{font-size:14px!important}
.observatory-list-v34 article,.usage-provider-list-v335 article{padding:10px 11px!important;border-radius:12px!important}
.status-badge-v34,.status-badge-v335{min-height:24px!important;padding:3px 8px!important;font-size:9.5px!important}
.settings-inline-details-v341{margin-top:7px!important;border-radius:13px!important}
.settings-inline-details-v341>summary{min-height:54px!important;padding:10px 11px!important}
.settings-inline-details-v341>summary b{font-size:12.5px!important}
.settings-inline-details-v341>summary small{font-size:9px!important}

/* Global density contract, applied consistently across both products. */
html[data-ui-density="comfortable"]{--settings-gap-v34:13px;--settings-row-min-v342:64px}
html[data-ui-density="standard"]{--settings-gap-v34:10px;--settings-row-min-v342:58px}
html[data-ui-density="dense"]{--settings-gap-v34:7px;--settings-row-min-v342:50px}
html[data-ui-density="comfortable"] .settings-subbody,html[data-ui-density="comfortable"] .settings-accordion-body-v21{padding:15px!important}
html[data-ui-density="dense"] .settings-subbody,html[data-ui-density="dense"] .settings-accordion-body-v21{padding:9px!important}
html[data-ui-density="dense"] .settings-subpanel>summary,html[data-ui-density="dense"] .settings-accordion-v21>summary{min-height:58px!important;padding:11px 12px!important}
html[data-ui-density="dense"] .task-route-card-v342{padding:var(--space-3) var(--space-3)!important;gap:6px!important}

@media(max-width:390px){
  .density-panel-v27>span{grid-template-columns:minmax(0,1fr)!important}
  .density-panel-v27>span small{text-align:left!important}
  .observatory-grid-v34,.usage-source-grid-v335{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:330px){
  .density-segments-v27{grid-template-columns:minmax(0,1fr)!important}
  .observatory-grid-v34,.usage-source-grid-v335{grid-template-columns:minmax(0,1fr)!important}
}
/* Routine Suite v5.0 workstream E — consolidated release scar layers.
   Concatenation of uiux-v343.css, uiux-v350.css, uiux-v351.css, uiux-v360.css, uiux-v370.css in cascade order.
   Content is unchanged; generated output stays byte-identical. */
/* Routine Suite 3.4.3 — compact pronunciation result metrics. */
.pron-metrics-v343{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:10px 0 8px}
.pron-metrics-v343 span{min-width:0;min-height:50px;padding:7px 5px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.pron-metrics-v343 small{display:block;color:var(--muted);font-size:10px;line-height:1.2;white-space:nowrap}
.pron-metrics-v343 b{display:block;margin-top:3px;font-size:14px;line-height:1.18;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:360px){.pron-metrics-v343{gap:4px}.pron-metrics-v343 span{padding:6px 3px;min-height:47px}.pron-metrics-v343 small{font-size:9px}.pron-metrics-v343 b{font-size:12px}}
/* Routine Suite 3.5.0 — shared UX contract */
:root{
  --ux-page-pad:16px;
  --ux-section-gap:18px;
  --ux-card-radius:18px;
  --ux-card-pad:15px;
  --ux-title-size:30px;
  --ux-section-title:19px;
  --ux-card-title:16px;
  --ux-body-size:15px;
  --ux-note-size:12px;
  --ux-jp-problem:22px;
  --ux-jp-answer:20px;
  --ux-action-height:48px;
}
.page{padding-left:var(--ux-page-pad);padding-right:var(--ux-page-pad)}
.section{margin-top:var(--ux-section-gap)}
.card{border-radius:var(--ux-card-radius)}
.section-title{font-size:var(--ux-section-title);line-height:1.25}
.section-note,.row-sub,.footer-note{font-size:var(--ux-note-size);line-height:1.45}
.btn{min-height:var(--ux-action-height)}
.learning-catalog-v350 .category-card{min-height:108px;align-content:start}
.learning-purpose-v350{display:block;margin-top:5px;color:var(--muted);font-size:10px;line-height:1.35;font-weight:500}
.stats-facts-v350{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 4px}
.stats-facts-v350>span{min-width:0;padding:13px 11px;border:1px solid var(--border);border-radius:16px;background:var(--card)}
.stats-facts-v350 small,.stats-facts-v350 em{display:block;color:var(--muted);font-size:9px;line-height:1.35;font-style:normal}
.stats-facts-v350 b{display:block;margin:5px 0 3px;font-size:23px;line-height:1;font-weight:780;white-space:nowrap}
.stats-insight-v350{padding:12px 14px}.stats-insight-v350 p{margin:0;font-size:13px;line-height:1.5}
.review-session-bar-v350{position:relative;z-index:2}
.review-card-v350{padding:var(--space-4)!important;min-height:0!important}
.review-task-v350{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px;color:var(--muted)}
.review-task-v350>small{font-size:11px;line-height:1.4}
.review-repeat-v350{display:flex;align-items:center;gap:5px;padding:5px 8px;border-radius:99px;background:color-mix(in srgb,var(--warning,#ff9f0a) 14%,transparent);font-size:9px;white-space:nowrap}
.review-repeat-v350 b{font-size:10px}
.review-label-v350{margin:8px 0 7px;color:var(--muted);font-size:11px;font-weight:700}.review-label-v350.correct{color:var(--success,#34c759)}
.review-card-v350 .front{margin:0;padding:12px 0;font-size:var(--ux-jp-problem)!important;line-height:1.55!important;font-weight:500!important}
.review-card-v350 .answer{margin:0;padding:12px 0;font-size:var(--ux-jp-answer)!important;line-height:1.55!important;font-weight:500!important}
.review-card-v350 .deck-error-mark{background:transparent;color:var(--danger,#ff453a);text-decoration:none;font-weight:400;border-bottom:1.5px solid color-mix(in srgb,var(--danger,#ff453a) 72%,transparent);padding-bottom:.05em}
.review-card-v350 .deck-correct-mark{background:transparent;color:var(--success,#34c759);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:400}
.deck-change-v350{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:9px!important;align-items:center!important;margin:12px 0;padding:11px;border:1px solid var(--border);border-radius:13px;background:var(--surface,transparent)}
.deck-change-v350 span{min-width:0}.deck-change-v350 small{display:block;margin-bottom:4px;color:var(--muted);font-size:9px}.deck-change-v350 del{color:var(--danger,#ff453a);font-weight:400;word-break:break-word}.deck-change-v350 ins{color:var(--success,#34c759);font-weight:400;text-underline-offset:3px;word-break:break-word}.deck-change-v350 i{font-style:normal;color:var(--muted)}
.review-reason-v350{margin-top:13px;padding:12px 13px;border-radius:13px;background:color-mix(in srgb,var(--accent) 6%,var(--card));font-size:13px;line-height:1.55}.review-reason-v350>small{display:block;margin-bottom:5px;color:var(--accent);font-size:10px;font-weight:750}.review-reason-v350 p{margin:0}.review-reason-v350 p span{display:block;margin-top:6px;color:var(--muted);font-size:11px}
.review-context-details-v350,.review-coach-v350{margin-top:11px;border:1px solid var(--border);border-radius:13px;background:var(--card);overflow:hidden}.review-context-details-v350 summary,.review-coach-v350 summary{padding:11px 12px;color:var(--muted);font-size:11px;cursor:pointer}.review-context-details-v350>div{padding:0 12px 11px}.review-context-details-v350 p{margin:8px 0}.review-context-details-v350 small,.review-context-details-v350 span{display:block}.review-context-details-v350 small{color:var(--muted);font-size:9px}.review-context-details-v350 span{margin-top:3px;font-size:13px;line-height:1.5}
.review-reveal-v350{width:100%;margin-top:15px}.grade-grid-v350{gap:7px}.grade-grid-v350 .btn{padding-left:2px;padding-right:2px}.grade-grid-v350 small{font-size:8px!important}
@media(max-width:360px){:root{--ux-page-pad:13px;--ux-jp-problem:20px;--ux-jp-answer:19px}.stats-facts-v350{grid-template-columns:1fr 1fr}.stats-facts-v350>span:first-child{grid-column:1/-1}.deck-change-v350{grid-template-columns:1fr}.deck-change-v350>i{display:none}}
body[data-density="compact"],body.density-compact{--ux-section-gap:14px;--ux-card-radius:15px;--ux-card-pad:12px;--ux-action-height:44px}
body[data-density="relaxed"],body.density-relaxed{--ux-section-gap:22px;--ux-card-radius:20px;--ux-card-pad:18px;--ux-action-height:52px}

/* Routine Suite 3.5.2 · retelling and focused shadowing */
.retelling-home-row-v351{position:relative;grid-template-columns:44px minmax(0,1fr) auto 18px;column-gap:14px;min-height:112px;padding:18px}.retelling-home-row-v351 .menu-glyph{align-self:start;margin-top:2px}.retelling-home-row-v351>span:nth-child(2){min-width:0;align-self:start}.retelling-home-row-v351 strong{font-size:18px;line-height:1.25}.retelling-home-row-v351 small{margin-top:7px;font-size:12px;line-height:1.5;white-space:normal}.retelling-home-row-v351 em{align-self:start;margin-top:1px;font-size:10px;letter-spacing:.08em;font-style:normal;padding:5px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}.retelling-home-row-v351>b{align-self:center}
.retelling-options-v351{grid-template-columns:repeat(2,minmax(0,1fr))}.retelling-options-v351 label:last-child{grid-column:1/-1}.retelling-seed-v351{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;margin:10px 0;border-radius:var(--radius);background:var(--accent-soft)}.retelling-seed-v351 span{display:grid;gap:3px}.retelling-seed-v351 small{color:var(--muted)}
.retelling-source-card-v351,.retelling-result-v351{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:clamp(16px,4vw,24px);box-shadow:var(--shadow)}.retelling-source-head-v351{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.retelling-source-ja-v351{font-family:var(--jp-font);font-size:clamp(21px,5.2vw,28px);line-height:1.72;margin:18px 0 8px}.retelling-reading-v351{font-family:var(--jp-font);font-size:14px;color:var(--muted);line-height:1.65}.retelling-keywords-v351{display:grid;gap:8px;margin:18px 0}.retelling-keywords-v351>div{display:flex;gap:7px;flex-wrap:wrap}.retelling-keywords-v351 span{padding:7px 10px;border-radius:999px;background:var(--accent-soft);font-family:var(--jp-font)}.retelling-prompt-v351{padding:13px 14px;border-left:3px solid var(--accent);background:var(--surface-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.retelling-model-answer-v351{margin-top:14px}
.retelling-practice-head-v351{display:flex;justify-content:space-between;align-items:center;gap:12px}.retelling-practice-head-v351>div{display:grid;gap:3px}.retelling-practice-head-v351>span{font-variant-numeric:tabular-nums;font-weight:700}.retelling-record-actions-v351{display:flex;justify-content:center;align-items:center;gap:9px;flex-wrap:wrap;margin:14px 0}.retelling-wave-v351{margin:14px auto}.retelling-transcript-v351{display:grid;gap:8px;margin-top:14px}.retelling-transcript-v351 textarea{font-family:var(--jp-font);font-size:17px;line-height:1.65}
.retelling-result-hero-v351{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}.retelling-metrics-v351{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin:18px 0 8px}.retelling-metrics-v351>div{text-align:center;padding:10px 5px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-soft)}.retelling-metrics-v351 small{display:block;color:var(--muted);font-size:11px}.retelling-metrics-v351 b{font-size:20px}.metric-note-v351{font-size:12px;color:var(--muted);line-height:1.5}.retelling-retry-v351{display:grid;gap:9px;margin:18px 0}.retelling-retry-v351 article{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:var(--radius-sm)}.retelling-retry-v351 article>div{display:grid;gap:2px}.retelling-retry-v351 p{margin:2px 0;color:var(--muted)}
.shadow-focus-panel-v351 .wide{grid-column:1/-1}.shadow-text-hidden-v351 .study-text,.shadow-text-hidden-v351 .shadow-ko-brief,.shadow-text-hidden-v351 .shadow-chunks,.shadow-text-hidden-v351 .focus-note,.shadow-text-hidden-v351 .rhythm-note{visibility:hidden}.shadow-text-hidden-v351 .shadow-copy:after{content:"텍스트 없이 소리에 집중하세요";display:grid;place-items:center;min-height:120px;border:1px dashed var(--line);border-radius:var(--radius-sm);color:var(--muted);font-weight:650}
@media(max-width:640px){.retelling-options-v351{grid-template-columns:1fr}.retelling-options-v351 label:last-child{grid-column:auto}.retelling-source-head-v351{display:grid}.retelling-result-hero-v351{grid-template-columns:1fr;text-align:center}.retelling-result-hero-v351 .score-ring{margin:auto}.retelling-metrics-v351{grid-template-columns:repeat(3,1fr)}.retelling-retry-v351 article{align-items:flex-start}.retelling-record-actions-v351 .secondary{flex:1 1 120px}}
/* Routine Suite 3.6.0 — correction and review UX completion. Existing menus are preserved. */
.correction-unified-v27{margin-top:8px;border-radius:18px}
.correction-unified-v27 summary{grid-template-columns:28px minmax(0,1fr) 14px;gap:10px;padding:13px 14px!important}
.correction-unified-v27 .correction-body{gap:8px;padding:0 14px 14px!important}
.correction-unified-v27 .correction-line{padding:11px 12px!important;border:1px solid var(--line);background:var(--panel)!important}
.correction-unified-v27 .correction-line>small{margin-bottom:6px;font-size:var(--fs-8);font-weight:850;letter-spacing:.04em}
.correction-unified-v27 .correction-line.original{border-color:color-mix(in srgb,var(--danger) 22%,var(--line))}
.correction-unified-v27 .correction-line.corrected{border-left:3px solid var(--success)!important}
.correction-unified-v27 .correction-line.natural{border-left:3px solid var(--accent)!important;background:color-mix(in srgb,var(--accent) 5%,var(--panel))!important}
.correction-unified-v27 del{color:var(--danger);text-decoration:none;border-bottom:1.5px solid currentColor;font-weight:400}
.correction-unified-v27 ins{color:var(--success);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:400}
.review-card-v350 .deck-change{font-size:13px;line-height:1.55}
.review-card-v350 .deck-change del{color:var(--danger);text-decoration:none;border-bottom:1.5px solid currentColor;font-weight:400}
.review-card-v350 .deck-change ins{color:var(--success);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:400}
.grade-grid-v350{position:sticky;left:auto;right:auto;bottom:calc(8px + env(safe-area-inset-bottom));width:100%;margin:16px 0 0;box-sizing:border-box;z-index:20}
@media(max-width:390px){.grade-grid-v350{grid-template-columns:repeat(4,minmax(0,1fr))!important}.grade-grid-v350 .btn{min-height:58px!important}.grade-grid-v350 b{font-size:13px}.grade-grid-v350 small{font-size:8px!important}}
/* Routine Suite 3.7.0 — cross-product UI/UX consistency release. */
:root{
  --ux-page-pad:16px;
  --ux-section-gap:18px;
  --ux-row-min:96px;
  --ux-row-glyph:44px;
  --ux-row-gap:14px;
  --ux-title-leading:1.22;
  --ux-body-leading:1.52;
}
.home-intro,.section-head{padding-top:12px;padding-bottom:14px}
.home-intro h2,.section-head h2{line-height:1.12}
.home-cluster-v20{margin-top:16px}
.cluster-head-v20{margin-bottom:10px}
.home-learning-menu-v20 .menu-row{
  display:grid!important;
  grid-template-columns:var(--ux-row-glyph) minmax(0,1fr) 18px!important;
  align-items:center!important;
  column-gap:var(--ux-row-gap)!important;
  min-height:var(--ux-row-min)!important;
  padding:18px 20px!important;
}
.home-learning-menu-v20 .menu-row .menu-glyph{
  width:var(--ux-row-glyph);height:var(--ux-row-glyph);margin:0!important;
  display:grid;place-items:center;align-self:center!important;
}
.home-learning-menu-v20 .menu-row>span:nth-child(2){display:grid;align-content:center;gap:6px;align-self:stretch!important}
.home-learning-menu-v20 .menu-row strong{margin:0!important;font-size:18px!important;line-height:var(--ux-title-leading)!important;letter-spacing:-.035em}
.home-learning-menu-v20 .menu-row small{margin:0!important;font-size:12px!important;line-height:var(--ux-body-leading)!important;white-space:normal!important}
.home-learning-menu-v20 .menu-row>b{align-self:center!important;justify-self:end!important;margin:0!important;font-size:30px!important;line-height:1!important}
.retelling-home-row-v351{grid-template-columns:var(--ux-row-glyph) minmax(0,1fr) 18px!important;min-height:var(--ux-row-min)!important;padding:18px 20px!important}
.retelling-home-row-v351>em{display:none!important}
.home-review-strip-v21{margin-top:12px}
.section-head,.reuse-head,.screen-head{letter-spacing:-.015em}
.section-head p:not(.eyebrow),.home-intro p:not(.eyebrow){max-width:42em}
.correction-unified-v27 summary,.correction-unified-v27 .correction-body{font-size:14px;line-height:1.55}
.correction-unified-v27 .correction-line{border-radius:14px}
.grade-grid-v350{border-radius:18px;padding:8px!important;background:color-mix(in srgb,var(--surface-solid) 92%,transparent)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
@media(max-width:390px){
  :root{--ux-page-pad:14px;--ux-row-min:92px;--ux-row-glyph:42px;--ux-row-gap:12px}
  .home-learning-menu-v20 .menu-row,.retelling-home-row-v351{padding:16px!important}
  .home-learning-menu-v20 .menu-row strong{font-size:17px!important}
  .home-learning-menu-v20 .menu-row small{font-size:11.5px!important}
}
/* Routine Suite 3.9.0 · AI Sensei learning experience */
.sensei-strength-v39{margin:4px 0 12px;padding:11px 12px;border-radius:13px;background:color-mix(in srgb,var(--success,#34c759) 8%,var(--card));border:1px solid color-mix(in srgb,var(--success,#34c759) 25%,transparent)}.sensei-strength-v39 small,.sensei-remember-v39 small{display:block;margin-bottom:5px;font-size:10px;font-weight:800;color:var(--success,#34c759)}.sensei-strength-v39 p{margin:0;font-size:13px;line-height:1.55}.sensei-remember-v39{margin-top:12px;padding:11px 12px;border-radius:13px;background:color-mix(in srgb,var(--accent) 8%,var(--card));border-left:2px solid var(--accent)}.sensei-remember-v39 b{font-size:16px;line-height:1.5;font-weight:600}
/* Routine Suite 3.8 continuity UI */
.continuity-network-v38{position:sticky;top:max(8px,env(safe-area-inset-top));z-index:40;margin:8px var(--page-pad,16px) 0;padding:9px 12px;border:1px solid color-mix(in srgb,var(--warning,#d89b2b) 35%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--warning,#d89b2b) 9%,var(--panel));font-size:var(--fs-10);font-weight:800;text-align:center;box-shadow:var(--shadow)}
.continuity-resume-v38{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin:0 0 16px;padding:15px;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--line));border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 9%,var(--panel)),var(--panel));box-shadow:var(--shadow)}
.continuity-resume-v38 small,.continuity-resume-v38 b,.continuity-resume-v38 span{display:block}.continuity-resume-v38 small{color:var(--accent);font-size:var(--fs-8);font-weight:950;letter-spacing:.13em}.continuity-resume-v38 b{margin-top:4px;font-size:var(--fs-15)}.continuity-resume-v38 span{margin-top:4px;color:var(--muted);font-size:var(--fs-10);line-height:1.45}.continuity-resume-v38>div:last-child{display:flex;gap:7px}.continuity-resume-v38 button{min-height:40px;padding:0 12px}
.continuity-diagnostic-v38{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.continuity-diagnostic-v38 b,.continuity-diagnostic-v38 small{display:block}.continuity-diagnostic-v38 small{margin-top:4px;color:var(--muted);font-size:var(--fs-10)}.continuity-diagnostic-v38 strong{color:var(--success);font-size:var(--fs-10);white-space:nowrap}
@media(max-width:430px){.continuity-resume-v38{grid-template-columns:1fr}.continuity-resume-v38>div:last-child{width:100%}.continuity-resume-v38 button{flex:1}}
/* Routine Suite 3.9.5 · Golden Build visual contract */
:root{--ux-page-pad:var(--space-4);--ux-section-gap:var(--space-6);--ux-card-pad:var(--space-4)}
.card,.correction-card-v27,.correction-unified-v27,.review-card-v350{border-radius:var(--radius-card)!important}
.btn,button.primary,button.secondary,input,textarea,select{min-height:var(--touch-min)}
.screen-head h1,.home-intro h2{font-size:var(--type-screen);line-height:1.14;letter-spacing:-.04em}
.section-title,.section-head h2{font-size:var(--type-section);line-height:1.25}
.menu-row strong,.correction-card-v27 summary b{font-size:var(--type-card);line-height:1.3}
.correction-line-v27 p,.correction-line p,.review-reason-v350 p{font-size:var(--type-body);line-height:1.62}
.section-note,.menu-row small,.correction-card-v27 summary small{font-size:var(--type-support);line-height:1.5}
.badge,.eyebrow,.sensei-summary-v39>small{font-size:var(--type-micro)}
/* One calm accent. Semantic red/green is limited to changed fragments and status. */
.sensei-summary-v39{background:var(--card);border-color:var(--border);box-shadow:none}
.sensei-strength-v39{background:var(--card);border-color:var(--border);border-left:2px solid var(--success)}
.sensei-remember-v39{background:var(--card);border:1px solid var(--border);border-left:2px solid var(--accent)}
.sensei-registers-v39{background:var(--card);border-radius:var(--radius-compact)}
.sensei-registers-v39 summary{min-height:44px;display:flex;align-items:center}
.correction-line-v27,.correction-line{background:transparent!important;border:1px solid var(--border)!important}
.correction-line-v27.original,.correction-line.original{color:var(--text)}
.correction-line-v27.corrected,.correction-line.corrected,.correction-line-v27.native,.correction-line.natural{color:var(--text)}
.review-think-v39{background:var(--card);border:1px solid var(--border);border-left:2px solid var(--accent)}
.grade-grid-v350{gap:var(--space-2)!important}
.grade-grid-v350 button{min-height:44px!important;border-radius:var(--radius-control)!important}
details>summary{list-style:none}details>summary::-webkit-details-marker{display:none}
@media(max-width:390px){:root{--ux-page-pad:14px}.screen-head h1,.home-intro h2{font-size:20px}.section-title,.section-head h2{font-size:17px}}
/* Routine Suite 4.1.5 — shared frontend foundation contract
 * Quiet hierarchy, progressive disclosure, and platform parity.
 * Screen-specific layout remains protected for later 0.0.1 patches. */
:root{
  --weight-body:400;--weight-control:500;--weight-card:550;--weight-section:600;--weight-emphasis:650;
  --type-page-quiet:20px;--type-section-quiet:17px;--type-card-quiet:15px;
  --foundation-panel-gap:12px;--foundation-control-height:44px;
  --motion-fast:160ms;--motion-standard:220ms;
}
/* Typography hierarchy: spacing and contrast before size or weight. */
.view:not(#homeView)>.section-head h2,.page:not([data-page="home"]) .section-title{font-weight:var(--weight-section);}
.card h2,.card h3,.compact-panel h2,.compact-panel h3,.setting-section h3{font-weight:var(--weight-card);}
button,.btn,.menu-row strong,.row-title{font-weight:var(--weight-control);}
small,.helper,.setting-help,.section-note{font-weight:var(--weight-body);}
.version-pill,.eyebrow,.hero-kicker,.brand{font-weight:var(--weight-section);}
/* Shared interactive floor. */
button,.btn,input,select,textarea,summary,[role="button"]{min-height:var(--foundation-control-height);}
summary{display:flex;align-items:center;cursor:pointer;touch-action:manipulation;}
details>summary::-webkit-details-marker{display:none;}
details>summary::marker{content:"";}
/* Quiet shared surfaces. */
.setting-section,.settings-section,.correction-unified-v27,.review-card,.result-card{border-radius:var(--radius-card);}
.setting-section>summary,.settings-section>summary,.correction-unified-v27>summary{padding-block:12px;}
.setting-section[open]>summary,.settings-section[open]>summary{margin-bottom:var(--space-2);}
/* Correction and review: color only the changed fragment; do not add weight. */
.correction-line del,.correction-delete,.diff-delete{color:var(--danger);font-weight:var(--weight-body);text-decoration-thickness:1px;}
.correction-line ins,.correction-insert,.diff-insert{color:var(--success);font-weight:var(--weight-body);text-decoration:none;}
.correction-detail-v27>summary,.intonation-detail-v27 summary{font-weight:var(--weight-control);}
/* Progressive disclosure stays calm and avoids layout jumps. */
details>summary+*{animation:foundationReveal var(--motion-fast) ease-out;}
@keyframes foundationReveal{from{opacity:.35;transform:translateY(-2px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){details>summary+*{animation:none!important}}
/* Density changes spacing, never touch size, order, or hierarchy. */
html[data-ui-density="comfortable"]{--foundation-panel-gap:16px;}
html[data-ui-density="dense"]{--foundation-panel-gap:9px;}
html[data-ui-density] .stack{gap:var(--foundation-panel-gap);}
/* Accessibility and narrow-phone stability. */
@media(max-width:390px){
  .view:not(#homeView)>.section-head h2{font-size:min(var(--type-page-quiet),5.2vw);line-height:1.22;}
  .setting-section>summary,.settings-section>summary{gap:8px;}
}
@media(prefers-contrast:more){.card,.compact-panel,.setting-section,.settings-section{border-color:color-mix(in srgb,var(--text) 24%,var(--line));}}
/* Routine Suite v5.0 workstream E — consolidated release scar layers.
   Concatenation of uiux-v416.css, uiux-v417.css, uiux-v418.css, uiux-v419.css, uiux-v4110.css, uiux-v4117.css in cascade order.
   Content is unchanged; generated output stays byte-identical. */
/* Routine Suite 4.1.6 · PWA quiet-density alignment
   PWA keeps its speaking-first IA while sharing Routine.js scale, rhythm and restraint. */
#homeView .home-intro-v20{padding-block:8px 14px;margin-bottom:18px}
#homeView .home-intro-v20 h2{font-size:clamp(27px,7vw,34px);font-weight:600;letter-spacing:-.045em}
#homeView .home-intro-v20>div>p:last-child{max-width:31rem;font-size:14px;line-height:1.55}
#homeView .cluster-head-v20{align-items:center;margin-bottom:8px}
#homeView .cluster-head-v20 span small{font-size:9px;font-weight:600;letter-spacing:.16em}
#homeView .cluster-head-v20 span b{margin-top:2px;font-size:18px;font-weight:600}
#homeView .cluster-head-v20 em{font-size:11px}
#homeView .home-learning-menu-v20{gap:10px}
#homeView .home-learning-menu-v20 .menu-row{min-height:138px;padding:14px 15px;border-radius:20px;grid-template-columns:52px minmax(0,1fr) auto;column-gap:12px}
#homeView .home-learning-menu-v20 .menu-row .menu-glyph{width:48px;height:48px;border-radius:15px;font-size:27px;font-weight:600}
#homeView .home-learning-menu-v20 .menu-row>span:nth-child(2){gap:5px}
#homeView .home-learning-menu-v20 .menu-row strong{font-size:16px;font-weight:600;letter-spacing:-.03em}
#homeView .home-learning-menu-v20 .menu-row small{font-size:11.5px;line-height:1.45}
#homeView .home-learning-menu-v20 .menu-row>b{font-size:22px!important;font-weight:400}
#homeView .home-review-strip-v21>button{border-radius:18px}
#settingsView>.section-head{padding-bottom:11px}
#settingsView .settings-category-v21{margin-top:18px}
#settingsView .settings-category-head-v21{margin:0 4px 8px}
#settingsView .settings-category-head-v21 b{font-size:15px;font-weight:600}
#settingsView .settings-category-head-v21 small{font-size:11px;line-height:1.4}
#settingsView .settings-menu-v21{border-radius:18px}
#settingsView .settings-menu-v21 .menu-row{min-height:58px;padding:10px 12px;grid-template-columns:34px minmax(0,1fr) auto;column-gap:10px}
#settingsView .settings-menu-v21 .menu-glyph{width:32px;height:32px;font-size:18px;font-weight:600}
/* 5.8.1: Routine.js와 중간에서 만나도록 살짝 키운다. 저쪽은 전체 글자 크기 배율이
   곱해지므로 기준 px을 낮췄고, PWA는 배율이 없어 여기서 올린다. */
#settingsView .settings-menu-v21 .menu-row strong{font-size:16px;font-weight:600}
#settingsView .settings-menu-v21 .menu-row small{margin-top:2px;font-size:11.5px;line-height:1.38}
#settingsView .settings-menu-v21 .menu-row>b{font-size:21px;font-weight:400}
@media(max-width:390px){
  #homeView .home-learning-menu-v20 .menu-row{min-height:128px;padding:13px}
  #homeView .home-learning-menu-v20 .menu-row .menu-glyph{width:45px;height:45px;font-size:25px}
  #homeView .home-learning-menu-v20 .menu-row strong{font-size:15.5px!important}
  #homeView .home-learning-menu-v20 .menu-row small{font-size:11px!important}
}
@media(max-width:350px){
  #homeView .home-learning-menu-v20{grid-template-columns:1fr}
  #homeView .home-learning-menu-v20 .menu-row{min-height:76px;grid-template-columns:44px minmax(0,1fr) auto}
}
/* Routine Suite 4.1.7 · PWA learning hub continuity and density */
#homeView .home-learning-menu-v20{gap:8px}
#homeView .home-learning-menu-v20 .menu-row{min-height:122px;padding:13px 14px;border-radius:18px;grid-template-columns:46px minmax(0,1fr) auto}
#homeView .home-learning-menu-v20 .menu-row .menu-glyph{width:43px;height:43px;border-radius:13px;font-size:23px}
#homeView .home-learning-menu-v20 .menu-row strong{font-size:15px!important;font-weight:600}
#homeView .home-learning-menu-v20 .menu-row small{font-size:10.5px!important;line-height:1.42!important}
#homeView .home-review-strip-v21{margin-top:10px}
@media(max-width:390px){#homeView .home-learning-menu-v20 .menu-row{min-height:116px;padding:12px}#homeView .home-learning-menu-v20 .menu-row .menu-glyph{width:40px;height:40px;font-size:22px}}
/* Routine Suite 4.1.8 · Speaking and dialogue interaction refinement */
#scenarioRoomView .turn-block{margin-block:8px}.speaker-label{font-size:10px;font-weight:500;letter-spacing:.01em;color:var(--muted)}
#scenarioRoomView .talk-bubble{max-width:91%;padding:11px 13px;border-radius:16px;font-size:14px;line-height:1.7}
#scenarioRoomView .talk-bubble.ai{border-bottom-left-radius:6px}#scenarioRoomView .talk-bubble.user{border-bottom-right-radius:6px}
.scene-key-expressions{padding:12px;border-radius:16px}.scene-key-expressions>b{margin-bottom:8px;font-size:12px;font-weight:600}
.scene-key-expressions>div{gap:7px}.scene-key-expressions button{padding:12px!important;border-radius:13px!important}
.scene-key-expressions .japanese-line{font-size:18px;font-weight:500;line-height:1.55}.scene-key-expressions .meaning-line{font-size:10.5px;line-height:1.5}
.shadow-training-bar{gap:8px}.shadow-training-bar>div b{font-weight:600}.shadow-toolbar.dense{gap:6px}.shadow-toolbar.dense button{min-height:42px}
#pronunciationView [data-record],#scenarioRoomView [data-record],.record-button{min-height:48px}
.busy-card h3,.loading-card h3{font-weight:600}.busy-card p,.loading-card p{line-height:1.55}
.correction-card summary b,.correction-line>small{font-weight:600}.correction-card summary{min-height:50px}
html[data-reduce-motion="true"] #scenarioRoomView .talk-bubble,html[data-reduce-motion="true"] .record-button{transition:none!important}
@media(max-width:390px){.scene-key-expressions .japanese-line{font-size:17px}.shadow-toolbar.dense{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Routine Suite 4.1.9 · Pronunciation, shadowing and recording state contract */
#pronunciationView .record-stage{padding:18px 14px;border:1px solid var(--border);border-radius:18px;background:var(--card-solid)}
#pronunciationView .record-stage strong{font-size:17px;font-weight:600;letter-spacing:.02em}
#pronunciationView .record-stage p{max-width:28rem;margin-inline:auto;font-size:11px;line-height:1.55;color:var(--muted)}
#pronunciationView .mic-button.large{width:64px;height:64px;min-width:64px;border-radius:50%;box-shadow:none}
#pronunciationView .mic-button.large.recording{transform:none;box-shadow:0 0 0 7px color-mix(in srgb,var(--accent) 14%,transparent)}
#pronunciationView .wave{min-height:25px}.record-stage:has(.recording) .wave{opacity:1}.record-stage:not(:has(.recording)) .wave{opacity:.42}
#pronunciationView #recordingActions{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));z-index:5;padding:8px;border:1px solid var(--border);border-radius:16px;background:color-mix(in srgb,var(--card-solid) 92%,transparent);backdrop-filter:blur(14px)}
#pronunciationView #recordingActions button{min-height:46px}
#pronunciationView #pronunciationStatus:not(:empty){padding:9px 11px;border-radius:12px;background:var(--surface-subtle);font-size:11px;line-height:1.5}
.shadow-session-head h2{font-size:20px;font-weight:600}.shadow-session-progress span{font-weight:500}.shadow-card.is-active{border-color:color-mix(in srgb,var(--accent) 56%,var(--border));box-shadow:none}
.shadow-card .shadow-stage-label,.shadow-card .shadow-step{font-weight:500}.shadow-card .japanese{font-weight:500}
.shadow-text-hidden-v351 .japanese,.shadow-text-hidden-v351 .meaning{filter:blur(6px);opacity:.2;user-select:none}
@media(max-width:390px){#pronunciationView .record-stage{padding:16px 12px}#pronunciationView .mic-button.large{width:60px;height:60px;min-width:60px}.shadow-session-head h2{font-size:18px}}
html[data-reduce-motion="true"] #pronunciationView .mic-button.large,html[data-reduce-motion="true"] #pronunciationView .wave i{animation:none!important;transition:none!important}
/* Routine Suite 4.1.10 · Shared learning result hierarchy */
.learning-result-v4110,.pron-result.correction-studio-v2910{display:grid;gap:12px}
.pron-result-hero{grid-template-columns:auto minmax(0,1fr);gap:13px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--card-solid)}
.pron-result-hero .score-ring.large{width:66px;height:66px}.pron-result-hero .score-ring.large b{font-size:20px;font-weight:600}.pron-result-hero h2{margin:3px 0 4px;font-size:18px;font-weight:600;line-height:1.35}.pron-result-hero p{font-size:11px;line-height:1.55}
.pron-metrics-v343{gap:7px}.pron-metrics-v343>span{min-height:58px;padding:9px;border-radius:13px}.pron-metrics-v343 small{font-size:8px}.pron-metrics-v343 b{font-size:12px;font-weight:600}
.priority-head{margin-top:2px}.priority-head h3{font-size:15px;font-weight:600}.priority-head span{font-size:9px}
.pron-issues{display:grid;gap:9px}.pron-issue{padding:12px;border-radius:15px}.pron-issue h4{font-size:16px;font-weight:500}.pron-issue p,.pron-issue .tip{font-size:11px;line-height:1.6}
.pron-issue .priority{font-weight:600}.issue-actions{gap:6px}.issue-actions button{min-height:42px;font-weight:500}
.assessment-basis-v305>summary,.pron-method-v34>summary{font-weight:500}.recognized-card p{font-weight:400;line-height:1.65}
#pronWholeRetry{min-height:46px}.result-next-actions-v4110{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));z-index:4}
@media(max-width:390px){.pron-result-hero{grid-template-columns:58px minmax(0,1fr);padding:12px}.pron-result-hero .score-ring.large{width:58px;height:58px}.pron-result-hero h2{font-size:16px}.pron-metrics-v343{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Routine Suite 4.1.17 · PWA shell, navigation and keyboard-safe viewport */
:root{
  --shell-top-v4117:54px;
  --shell-nav-v4117:54px;
  --app-viewport-height:100dvh;
  --keyboard-inset:0px;
}
body{
  min-height:var(--app-viewport-height);
  padding-top:calc(var(--safe-t) + var(--shell-top-v4117));
  padding-bottom:calc(var(--shell-nav-v4117) + 28px + var(--safe-b));
}
.topbar{
  height:calc(var(--shell-top-v4117) + var(--safe-t));
  grid-template-columns:40px minmax(0,1fr) 40px;
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  box-shadow:none;
}
.topbar h1{font-size:15.5px;font-weight:600;letter-spacing:-.025em}
.icon-button{width:34px;height:34px;border-radius:12px;font-size:24px;box-shadow:none}
.view[tabindex="-1"]:focus{outline:none}
.view{scroll-margin-top:calc(var(--safe-t) + var(--shell-top-v4117) + 8px)}
.bottom-nav{
  width:min(300px,calc(100% - 28px));
  height:var(--shell-nav-v4117);
  bottom:max(8px,var(--safe-b));
  padding:4px;
  border-radius:19px;
  box-shadow:0 10px 30px rgba(0,0,0,.11);
}
.bottom-nav button{gap:6px;border-radius:15px;font-size:10px;font-weight:550}
.bottom-nav button svg{width:18px;height:18px;stroke-width:1.7}
.update{top:calc(var(--safe-t) + 8px);max-width:calc(100% - 28px)}
dialog{max-height:calc(var(--app-viewport-height) - var(--safe-t) - 18px)}
dialog>form{max-height:calc(var(--app-viewport-height) - var(--safe-t) - 24px);overflow:auto;overscroll-behavior:contain}
.loading-overlay{height:var(--app-viewport-height)}
html[data-keyboard-open="true"] body{padding-bottom:calc(18px + var(--keyboard-inset))}
html[data-keyboard-open="true"] .bottom-nav{opacity:0;pointer-events:none;transform:translate(-50%,calc(100% + 28px))}
html[data-keyboard-open="true"] .audio-transport-v293{bottom:calc(10px + var(--keyboard-inset))}
html[data-app-mode="standalone"] .topbar{background:color-mix(in srgb,var(--bg) 82%,transparent)}
html[data-app-mode="browser"] .topbar{border-bottom-color:color-mix(in srgb,var(--line) 74%,transparent)}
@media(max-width:390px){
  :root{--shell-top-v4117:52px;--shell-nav-v4117:52px}
  body{padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))}
  .bottom-nav{width:min(286px,calc(100% - 24px));border-radius:18px}
  .bottom-nav button{font-size:9.5px}
}
@media(orientation:landscape) and (max-height:500px){
  :root{--shell-top-v4117:48px;--shell-nav-v4117:48px}
  .bottom-nav{width:min(280px,calc(100% - 24px))}
}
@media(prefers-reduced-motion:reduce){
  html[data-keyboard-open="true"] .bottom-nav{transition:none}
}
/* Routine Suite 4.1.19 · consolidated shared final layer */
/* Retires separate build layers uiux-v4113.css, uiux-v4116.css and uiux-v4118.css without deleting their source history. */
/* Routine Suite 4.1.13 · review, correction and vocabulary refinement */
.review-flow-v4113,.correction-flow-v4113,.vocabulary-flow-v4113{--flow-gap:14px}
.review-card-v350{padding:var(--space-4);border-radius:var(--radius-card);box-shadow:none}
.review-think-v39{padding:12px 14px;margin:8px 0 14px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface) 92%,var(--accent) 8%)}
.review-think-v39 small,.review-label-v350,.review-reason-v350 small{font-size:12px;font-weight:500;letter-spacing:.01em}
.review-think-v39 b,.review-task-v350 small{font-size:14px;font-weight:600}
.deck-review .front,.deck-review .answer{font-size:20px;line-height:1.58;font-weight:500}
.deck-change-v350{gap:10px;padding:12px;border-radius:14px;background:var(--surface-soft)}
.deck-change-v350 del,.deck-change-v350 ins{font-weight:500;text-decoration-thickness:1px}
.review-reason-v350{margin-top:14px;padding:14px;border-radius:14px;background:var(--surface-soft)}
.grade-grid-v350{gap:8px;position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));padding:8px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(14px)}
.grade-grid-v350 .btn{min-height:52px;font-weight:500}
.correction-studio-v2910{display:grid;gap:14px}
.correction-summary-v2910,.diary-native-once-v303{border-radius:16px;box-shadow:none}
.correction-summary-v2910 b,.diary-native-once-v303 p{font-weight:500}
.correction-score-grid-v2910{gap:8px}
.correction-score-grid-v2910>div{padding:12px;border-radius:14px}
.correction-studio-v2910 details.card{border-radius:var(--radius-card);box-shadow:none}
.correction-studio-v2910 details summary b{font-weight:600}
.diff-card-v303 del{color:var(--danger);font-weight:400;text-decoration-thickness:1px}
.diff-card-v303 ins{color:var(--success);font-weight:400;text-decoration:none}
.vocabulary-flow-v4113 .section-head{margin-bottom:8px}
.vocabulary-flow-v4113 .flat-menu,.vocabulary-flow-v4113 .synonym-list{border-radius:16px;box-shadow:none}
.vocabulary-flow-v4113 .mode-row,.vocabulary-flow-v4113 .synonym-row{min-height:56px;padding:12px 14px}
.vocabulary-flow-v4113 .mode-row b,.vocabulary-flow-v4113 .synonym-row b{font-weight:550}
.flashcard.vocab-card-v4113{padding:var(--space-5) var(--space-4);border-radius:var(--radius-card);box-shadow:none}
.flashcard.vocab-card-v4113 .front b{font-size:28px!important;font-weight:600}
.flashcard.vocab-card-v4113 .front div{font-size:13px!important}
.flashcard.vocab-card-v4113 .answer{font-size:18px;font-weight:500}
.vocab-actions-v4113{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));padding:8px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(14px)}
.vocab-actions-v4113 .btn{min-height:48px;font-weight:500}
@media(max-width:390px){.deck-review .front,.deck-review .answer{font-size:18px}.flashcard.vocab-card-v4113 .front b{font-size:25px!important}.grade-grid-v350{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){.grade-grid-v350,.vocab-actions-v4113{backdrop-filter:none}}
/* Routine Suite 4.1.14–4.1.16 · records, settings IA, routing/TTS/diagnostics */
:root{--settings-row-min-v4116:52px;--settings-detail-gap-v4116:10px}
.settings-current-strip-v4116{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 14px;padding:11px 13px;border:1px solid var(--line,var(--border));border-radius:14px;background:var(--surface,var(--card))}
.settings-current-strip-v4116>span{min-width:0;display:grid;gap:2px}.settings-current-strip-v4116 small{font-size:9px;line-height:1.2;letter-spacing:.09em;color:var(--muted);font-weight:500}.settings-current-strip-v4116 b{font-size:12.5px;line-height:1.4;font-weight:550;overflow-wrap:anywhere}.settings-current-strip-v4116 em{font-size:9.5px;line-height:1.35;color:var(--muted);font-style:normal;text-align:right;white-space:nowrap}
.settings-index-v4116 .settings-category-v21,.settings-index-v4116 .settings-index-v310{margin-top:16px!important}.settings-index-v4116 .section-head,.settings-index-v4116 .settings-category-head-v21{margin-bottom:6px!important}.settings-index-v4116 .section-title,.settings-index-v4116 .settings-category-head-v21 b{font-size:13px!important;font-weight:600!important}.settings-index-v4116 .section-note,.settings-index-v4116 .settings-category-head-v21 small{font-size:10px!important;line-height:1.35!important}
.settings-index-v4116 .flat-menu,.settings-index-v4116 .settings-menu-v21{border-radius:15px!important;box-shadow:none!important;overflow:hidden}.settings-index-v4116 .menu-row,.settings-index-v4116 .flat-menu>button{min-height:var(--settings-row-min-v4116)!important;padding:10px 12px!important;gap:10px!important}.settings-index-v4116 .menu-glyph{width:30px!important;height:30px!important;border-radius:10px!important;font-size:11px!important;font-weight:600!important}.settings-index-v4116 .menu-row strong,.settings-index-v4116 .flat-menu>button b{font-size:12.5px!important;line-height:1.3!important;font-weight:550!important}.settings-index-v4116 .menu-row small,.settings-index-v4116 .flat-menu>button small{font-size:9.5px!important;line-height:1.4!important}.settings-index-v4116 .menu-row>b,.settings-index-v4116 .flat-menu>button>span:last-child{font-weight:500!important}
.settings-detail-v4116>.section-head h2,.settings-detail-v4116 .section-head h2{font-size:20px!important;font-weight:600!important;letter-spacing:-.025em}.settings-detail-v4116>.section-head p:last-child,.settings-detail-v4116 .section-head p:last-child{font-size:11px!important;line-height:1.45!important}.settings-detail-v4116 .ui-summary-card-v20,.settings-detail-v4116 .ui-summary-card-v32{padding:var(--space-3)!important;border-radius:var(--radius-card)!important;background:var(--surface,var(--card))!important;box-shadow:none!important}.settings-detail-v4116 .ui-summary-card-v20>small,.settings-detail-v4116 .ui-summary-card-v32>small{font-size:8.5px!important;font-weight:550!important}.settings-detail-v4116 .ui-summary-card-v20 b,.settings-detail-v4116 .ui-summary-card-v32 b{font-size:15px!important;font-weight:600!important}.settings-detail-v4116 .ui-recommend-v20,.settings-detail-v4116 .ui-recommend-v32{box-shadow:none!important}.settings-detail-v4116 .settings-accordion-v21,.settings-detail-v4116 .settings-subpanel{margin-top:var(--settings-detail-gap-v4116)!important;border-radius:15px!important;box-shadow:none!important}.settings-detail-v4116 .settings-accordion-v21>summary,.settings-detail-v4116 .settings-subpanel>summary{min-height:54px!important;padding:11px 13px!important}.settings-detail-v4116 .settings-accordion-v21>summary b,.settings-detail-v4116 .settings-subpanel>summary b{font-size:12.5px!important;font-weight:600!important}.settings-detail-v4116 .settings-accordion-v21>summary small,.settings-detail-v4116 .settings-subpanel>summary small{font-size:9.5px!important}.settings-detail-v4116 .settings-accordion-body-v21,.settings-detail-v4116 .settings-subbody{padding:0 11px 12px!important}.settings-detail-v4116 .setting-section{margin-top:10px!important}.settings-detail-v4116 .compact-panel{border-radius:14px!important;box-shadow:none!important}.settings-detail-v4116 .option-card b,.settings-detail-v4116 .preset-card-v28 b,.settings-detail-v4116 .tone-card-v28 b{font-weight:550!important}.settings-detail-v4116 .ui-diagnostic-link-v20,.settings-detail-v4116 .ui-diagnose-v32{min-height:50px!important;padding:11px 13px!important;border-radius:14px!important;box-shadow:none!important}
.settings-ai-v4116 .task-route-list,.settings-ai-v4116 .route-picker-list-v337{gap:7px!important}.settings-ai-v4116 .task-route-card,.settings-ai-v4116 .route-slot-v337,.settings-ai-v4116 .routing-use-map-v305 article{border-radius:var(--radius-compact)!important;box-shadow:none!important}.settings-ai-v4116 .routing-use-map-v305 article{padding:10px 11px!important}.settings-ai-v4116 .routing-use-map-v305 article b{font-size:12px!important;font-weight:550!important}.settings-ai-v4116 .routing-use-map-v305 article span{font-size:9px!important}.settings-ai-v4116 .routing-use-map-v305 article small{font-size:9.5px!important;line-height:1.4!important}.settings-tts-v4116 .voice-control-card,.settings-tts-v4116 .tts-provider-panel-v36{box-shadow:none!important}.settings-tts-v4116 .voice-summary-button b,.settings-tts-v4116 .setting-title h3{font-weight:550!important}.settings-tts-v4116 .voice-avatar{font-weight:600!important}
.records-index-v4116 .section{margin-top:16px}.records-index-v4116 .section-title{font-size:13px!important;font-weight:600!important}.records-index-v4116 .flat-menu{border-radius:15px;box-shadow:none}.records-index-v4116 .flat-menu>button{min-height:52px!important;padding:10px 12px!important}.records-overview-v4116{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0!important;overflow:hidden;box-shadow:none!important}.records-overview-v4116>span{min-width:0;padding:11px 10px;border-right:1px solid var(--line,var(--border))}.records-overview-v4116>span:last-child{border-right:0}.records-overview-v4116 small,.stats-overview-v4116 small{display:block;font-size:9px;line-height:1.3;color:var(--muted)}.records-overview-v4116 b{display:block;margin-top:4px;font-size:15px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums}
.stats-overview-v4116{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.45fr);padding:0!important;overflow:hidden;box-shadow:none!important}.stats-primary-v4116{padding:14px;border-right:1px solid var(--line,var(--border));display:flex;flex-direction:column;justify-content:center}.stats-primary-v4116 b{margin:5px 0 3px;font-size:24px;line-height:1;font-weight:650;font-variant-numeric:tabular-nums}.stats-primary-v4116 span{font-size:9.5px;color:var(--muted)}.stats-support-v4116{display:grid;grid-template-columns:1fr 1fr}.stats-support-v4116>span{min-width:0;padding:13px 11px;border-right:1px solid var(--line,var(--border));display:flex;flex-direction:column;justify-content:center}.stats-support-v4116>span:last-child{border-right:0}.stats-support-v4116 b{margin:4px 0 3px;font-size:17px;line-height:1.1;font-weight:600;font-variant-numeric:tabular-nums}.stats-support-v4116 em{font-size:8.8px;line-height:1.35;color:var(--muted);font-style:normal}.stats-insight-v4116{margin-top:10px;padding:0!important;overflow:hidden;box-shadow:none!important}.stats-insight-v4116 summary{list-style:none;min-height:50px;padding:10px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer}.stats-insight-v4116 summary::-webkit-details-marker{display:none}.stats-insight-v4116 summary span{display:grid;gap:2px}.stats-insight-v4116 summary small{font-size:8.5px;letter-spacing:.08em;color:var(--muted)}.stats-insight-v4116 summary b{font-size:12.5px;font-weight:550}.stats-insight-v4116 summary i{font-style:normal;color:var(--muted);transition:transform .18s ease}.stats-insight-v4116[open] summary i{transform:rotate(90deg)}.stats-insight-v4116 p{margin:0;padding:11px 13px 13px;border-top:1px solid var(--line,var(--border));font-size:11px;line-height:1.55;color:var(--muted)}.week-chart-v4116{padding:12px 10px!important;box-shadow:none!important}.activity-list-v4116{padding:4px 12px!important;box-shadow:none!important}.activity-list-v4116 .activity-row-v27 b{font-weight:550!important}.grass-wrap-v4116{padding:12px!important;box-shadow:none!important}.grass-scroll-v4116{width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.grass-scroll-v4116 .grass-svg{min-width:330px;width:100%;display:block}.calendar-shell-v4116{display:grid;gap:10px}.calendar-shell-v4116 .calendar-head{margin:0}.calendar-shell-v4116 .calendar-head button{min-width:44px;min-height:44px}.calendar-shell-v4116 .cal-day{position:relative;min-height:40px!important;font-weight:450!important}.calendar-shell-v4116 .cal-day span{position:relative;z-index:1}.calendar-shell-v4116 .cal-day i{position:absolute;left:50%;bottom:4px;width:4px;height:4px;border-radius:50%;background:var(--accent);transform:translateX(-50%)}.calendar-shell-v4116 .cal-day.today{box-shadow:inset 0 0 0 1px var(--accent)!important}.calendar-shell-v4116 .cal-day.has{font-weight:550!important}
.history-summary-v4116{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.history-summary-v4116 span{display:grid;gap:2px}.history-summary-v4116 small{font-size:8.5px;letter-spacing:.08em;color:var(--muted)}.history-summary-v4116 b{font-size:12px;font-weight:550}.history-summary-v4116 em{font-size:9px;color:var(--muted);font-style:normal}.history-tabs-v4116{margin-bottom:10px!important}.history-view-v4116 .recent-card-v22{box-shadow:none!important}.history-view-v4116 .recent-copy-v22 b{font-weight:550!important}
.diagnostics-folds-v4116{display:grid;gap:9px}.diagnostic-fold-v4116{padding:0!important;overflow:hidden;box-shadow:none!important}.diagnostic-fold-v4116>summary{list-style:none;min-height:54px;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:9px;cursor:pointer}.diagnostic-fold-v4116>summary::-webkit-details-marker{display:none}.diagnostic-fold-v4116>summary>span:first-child{display:grid;gap:2px}.diagnostic-fold-v4116>summary b{font-size:12.5px;font-weight:600}.diagnostic-fold-v4116>summary small{font-size:9.5px;line-height:1.35;color:var(--muted)}.diagnostic-fold-v4116>summary>i{font-style:normal;color:var(--muted);transition:transform .18s ease}.diagnostic-fold-v4116[open]>summary>i{transform:rotate(90deg)}.diagnostic-fold-body-v4116{padding:11px 12px 12px;border-top:1px solid var(--line)}.diagnostic-fold-body-v4116 .usage-provider-list-v335,.diagnostic-fold-body-v4116#diagnosticsRecent,.diagnostic-fold-body-v4116#diagnosticsAdvice{margin:0}
@media(max-width:390px){.settings-current-strip-v4116{align-items:flex-start}.settings-current-strip-v4116 em{white-space:normal;max-width:38%}.stats-overview-v4116{grid-template-columns:1fr}.stats-primary-v4116{border-right:0;border-bottom:1px solid var(--line,var(--border));padding:12px 13px}.stats-primary-v4116 b{font-size:21px}.records-overview-v4116 b{font-size:14px}.diagnostic-fold-v4116>summary{grid-template-columns:minmax(0,1fr) auto}.diagnostic-fold-v4116>summary>i{display:none}}
@media(prefers-reduced-motion:reduce){.stats-insight-v4116 summary i,.diagnostic-fold-v4116>summary>i{transition:none!important}}
/* Routine Suite 4.1.18 · shared accessibility and responsive contract */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}
:where(button,input,select,textarea,summary,[role="button"]){scroll-margin-block:calc(var(--safe-t) + 68px) calc(var(--safe-b) + 104px)}
:where(button,input,select,textarea)[disabled],:where([aria-disabled="true"]){cursor:not-allowed;opacity:.46}
:where(.row-title,.row-sub,.menu-row strong,.menu-row small,.section-title,.section-note,.setting-line b,.setting-line small,.status,.note){overflow-wrap:anywhere}
html[data-large-touch="true"] :where(button,[role="button"],summary,input,select){min-height:48px}
html[data-reduce-glass="true"] :where(.card,.compact-panel,.menu-list,.bottom-nav,.topbar,.bottom-sheet,dialog,.loading-overlay,.busy){backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-high-contrast="true"]{
  --muted:color-mix(in srgb,var(--text) 76%,transparent);
  --line:color-mix(in srgb,var(--text) 28%,transparent);
  --border:var(--line);
  --track:color-mix(in srgb,var(--text) 17%,transparent);
}
html[data-high-contrast="true"] :where(.card,.compact-panel,.menu-list,.bottom-nav,.topbar,.bottom-sheet,dialog,.setting-line,.mode-row){box-shadow:none;border-color:var(--line)}
@media(prefers-contrast:more){
  :root{--muted:color-mix(in srgb,var(--text) 76%,transparent);--line:color-mix(in srgb,var(--text) 28%,transparent);--border:var(--line)}
  :where(.card,.compact-panel,.menu-list,.bottom-nav,.topbar,.bottom-sheet,dialog){box-shadow:none}
}
@media(forced-colors:active){
  :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid Highlight}
  :where(.card,.compact-panel,.menu-list,.bottom-nav,.topbar,.bottom-sheet,dialog){forced-color-adjust:auto;box-shadow:none}
}
@media(prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto;animation-duration:.01ms;animation-iteration-count:1;transition-duration:.01ms}
}
@media(max-width:340px){
  :where(.dual-actions,.evaluation-actions,.grade-grid-v350,.review-assist-v21){grid-template-columns:1fr}
  :where(.section-head,.reuse-head){align-items:flex-start;flex-wrap:wrap}
  :where(.section-head,.reuse-head)>.mini-link{margin-left:auto}
}

/* Routine Suite 5.0.4 · focused speaking flow and progressive practice tools */
.speaking-flow-v504{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 16px;
  padding:0;
}
.speaking-flow-v504 li{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px 9px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-soft);
  color:var(--muted);
  font-size:10px;
  line-height:1.3;
}
.speaking-flow-v504 li i{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:22px;
  height:22px;
  border-radius:8px;
  background:var(--surface);
  color:inherit;
  font-style:normal;
  font-weight:600;
}
.speaking-flow-v504 li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.speaking-flow-v504 li.active{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:color-mix(in srgb,var(--accent) 8%,var(--surface));color:var(--accent)}
.speaking-flow-v504 li.done{color:var(--success)}
.talk-evaluation.v17>.speaking-flow-v504{grid-column:1/-1;margin-bottom:0}
.shadow-primary-actions-v504{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:8px}
.shadow-primary-actions-v504 button{min-height:48px}
.shadow-primary-actions-v504 .shadow-done.active{border-color:var(--success);color:var(--success);background:color-mix(in srgb,var(--success) 10%,var(--surface))}
.shadow-tools-v504{
  margin-top:8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-soft);
  overflow:hidden;
}
.shadow-tools-v504>summary{
  list-style:none;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 11px;
  cursor:pointer;
}
.shadow-tools-v504>summary::-webkit-details-marker{display:none}
.shadow-tools-v504>summary span{display:grid;gap:2px}
.shadow-tools-v504>summary b{font-size:11px;font-weight:600}
.shadow-tools-v504>summary small{color:var(--muted);font-size:9px}
.shadow-tools-v504>summary i{color:var(--muted);font-style:normal;transition:transform .18s ease}
.shadow-tools-v504[open]>summary i{transform:rotate(90deg)}
.shadow-tools-v504 .shadow-toolbar.dense{
  grid-template-columns:repeat(3,minmax(0,1fr));
  padding:8px;
  border-top:1px solid var(--line);
}
.shadow-tools-v504 .shadow-toolbar.dense button,
.pron-source-actions button,
.recovery-chip-grid .chip,
.pron-focus-grid .chip,
.memory-next-card button,
.issue-actions button,
.retry-expression button,
.evaluation-actions button{min-height:44px}
@media(max-width:390px){
  .speaking-flow-v504{gap:5px}
  .speaking-flow-v504 li{display:grid;justify-items:center;gap:4px;padding:7px 4px;text-align:center}
  .speaking-flow-v504 li span{width:100%}
  .shadow-tools-v504 .shadow-toolbar.dense{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.shadow-tools-v504>summary i{transition:none}}
/* Routine Suite v5.0 workstream E — consolidated release scar layers.
   Concatenation of shared-v430.css, uiux-v435.css, uiux-v440.css, uiux-v441.css, uiux-v442.css, uiux-v450.css, uiux-v451.css in cascade order.
   Content is unchanged; generated output stays byte-identical. */
/* Routine Suite 4.3.0 · bottom dock, review typography and learning-focus contract */
:root{
  --bottom-dock-gap:2px;
  --bottom-dock-pad-x:8px;
  --bottom-dock-pad-top:7px;
  --bottom-dock-pad-bottom:max(7px,env(safe-area-inset-bottom));
  --review-study-size:16px;
  --review-study-line:1.5;
}
/* All persistent learning actions sit against the bottom safe area instead of floating high. */
:where(.grade-grid-v350,.grammar-rating-dock,.vocab-actions-v4113,.result-next-actions-v4110,#pronunciationView #recordingActions,.floating-toolbar-v27,.review-bottom-actions-v430,.learning-result-next-v4110,.grade-grid){
  bottom:var(--bottom-dock-gap)!important;
  margin-bottom:0!important;
  padding:var(--bottom-dock-pad-top) var(--bottom-dock-pad-x) var(--bottom-dock-pad-bottom)!important;
  border-bottom-left-radius:0!important;
  border-bottom-right-radius:0!important;
  box-shadow:0 -8px 22px rgba(0,0,0,.10)!important;
}
/* Preserve content under a dock without creating a visually empty floating gap. */
:where(.deck-review,.review-session-v350,.grammar-review-screen,.vocab-review-screen,.page:has(.floating-toolbar-v27),.page:has(.grammar-rating-dock)){
  scroll-padding-bottom:calc(68px + env(safe-area-inset-bottom));
}
/* Review content is compact and regular-weight. Correction differences carry the emphasis. */
:where(.deck-review,.review-session-v350,.correction-unified-v27,.correction-card-v27){
  --type-body:var(--review-study-size);
}
:where(.deck-review .front,.deck-review .answer,.review-session-v350 [lang="ja"],.correction-line p,.correction-line-v27 p,.correction-final-text-v27){
  font-size:var(--review-study-size)!important;
  line-height:var(--review-study-line)!important;
  font-weight:400!important;
}
:where(.correction-card summary b,.correction-line>small,.correction-line-v27 small,.review-reason-v350 small,.prompt-label,.review-label-v350,.review-think-v39 small,.deck-review .card-label,.deck-review .label){
  font-weight:450!important;
}
:where(.correction-line,.correction-line-v27){padding:10px 11px!important}
:where(.correction-line del,.correction-delete,.diff-delete){font-weight:400!important}
:where(.correction-line ins,.correction-insert,.diff-insert){font-weight:400!important}
:where(.grade-grid-v350 .btn,.grammar-rating-row button,.grade-grid .btn,.vocab-actions-v4113 .btn,.learning-result-next-v4110 .btn){font-weight:500!important}
:where(.deck-review .answer,.review-session-v350 .answer,.correction-final-text-v27){margin-block:8px!important}
:where(.review-reason-v350,.correction-detail-v27){font-weight:400!important}
@media(max-width:390px){
  :root{--review-study-size:15px}
  :where(.grade-grid-v350,.grammar-rating-dock,.vocab-actions-v4113){left:0!important;right:0!important;width:100%!important}
}
@media(prefers-reduced-motion:reduce){
  :where(.grade-grid-v350,.grammar-rating-dock,.vocab-actions-v4113,.result-next-actions-v4110){transition:none!important}
}

/* Routine Suite 4.3.2 · PWA settings menus use the same surfaced card treatment as Routine.js. */
#settingsView.settings-index-v4116 .settings-menu-v21,
#settingsView .settings-category-v21>.settings-menu-v21{
  background:var(--panel)!important;
  border:1px solid var(--line)!important;
  box-shadow:var(--shadow-soft)!important;
}
#settingsView .settings-menu-v21 .menu-row{
  background:color-mix(in srgb,var(--panel) 96%,var(--accent) 4%);
}
#settingsView .settings-menu-v21 .menu-row:active{
  background:color-mix(in srgb,var(--panel) 90%,var(--accent) 10%);
}

/* Routine Suite 4.3.5 — settings surfaces and five-style differentiation */
:root{--surface-raised:var(--card);--surface-inset:color-mix(in srgb,var(--card) 88%,var(--bg));--shadow-soft:0 10px 26px color-mix(in srgb,#20324a 10%,transparent),0 1px 0 color-mix(in srgb,#fff 72%,transparent);}
#settingsView .settings-menu-v21,#settingsView .settings-category-v21>.card.flat-menu{background:var(--surface-raised);border:1px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:var(--shadow-soft);}
#settingsView .settings-menu-v21 .settings-row,#settingsView .settings-menu-v21 .menu-row,#settingsView .flat-menu .menu-row{background:color-mix(in srgb,var(--surface-raised) 96%,var(--accent) 4%)!important;}
#settingsView .settings-menu-v21 .settings-row:active,#settingsView .settings-menu-v21 .menu-row:active,#settingsView .flat-menu .menu-row:active{background:var(--surface-inset)!important;box-shadow:inset 0 2px 7px color-mix(in srgb,#1b2c43 9%,transparent)!important;}
html[data-ui-style="liquid"] .card,html[data-ui-style="liquid"] #settingsView .settings-menu-v21{background:color-mix(in srgb,var(--card) 72%,transparent);backdrop-filter:blur(20px) saturate(1.18);-webkit-backdrop-filter:blur(20px) saturate(1.18);border-color:color-mix(in srgb,#fff 42%,var(--border));box-shadow:0 16px 36px color-mix(in srgb,var(--accent) 10%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 58%,transparent);}
.study-week-card-v15 .study-left-v15{position:relative;}
.study-week-card-v15 .study-left-v15:before{content:"WEEKLY RHYTHM";display:block;margin-bottom:9px;font-size:9px;letter-spacing:.22em;color:var(--accent);font-weight:650;}
.study-week-card-v15 .week-mini{padding:8px 6px 4px;border-radius:var(--radius-card);background:color-mix(in srgb,var(--accent) 4%,transparent);}
.study-week-card-v15 .study-debt,.study-week-card-v15 .ai-sensei-mini{border-top:1px solid color-mix(in srgb,var(--border) 72%,transparent);margin-top:10px;padding-top:10px;}
@media(prefers-color-scheme:dark){}
/* Routine Suite 4.4.0 — frontend design-system completion and five-style identity */
:root{
  --ds-radius-sm:12px;--ds-radius-md:18px;--ds-radius-lg:24px;
  --ds-border-subtle:color-mix(in srgb,var(--border) 76%,transparent);
  --ds-focus-ring:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent);
  --ds-shadow-core:0 8px 24px color-mix(in srgb,#20324a 9%,transparent),0 1px 0 color-mix(in srgb,#fff 66%,transparent);
}
/* Shared interaction contract. */
button,.menu-row,.settings-row,.ui-style-choice-v27{transition:transform var(--motion-state) var(--ease),background-color var(--motion-state) var(--ease),border-color var(--motion-state) var(--ease),box-shadow var(--motion-state) var(--ease)}
button:focus-visible,.menu-row:focus-visible,.settings-row:focus-visible,.ui-style-choice-v27:focus-visible{outline:0;box-shadow:var(--ds-focus-ring)!important}
@media(hover:hover){button:hover,.menu-row:hover,.settings-row:hover{transform:translateY(-1px)}}
button:active,.menu-row:active,.settings-row:active{transform:translateY(0) scale(.995)}

/* Settings use a visible surface on every style; Linear remains deliberately flat. */
#settingsView .settings-category-v21>.card.flat-menu,#settingsView .settings-menu-v21{
  background:var(--surface-raised,var(--card));border:1px solid var(--ds-border-subtle);
  border-radius:var(--ds-radius-lg)!important;box-shadow:var(--ds-shadow-core)!important;overflow:hidden!important;
}
#settingsView .flat-menu>.menu-row,#settingsView .settings-menu-v21>.menu-row,#settingsView .settings-menu-v21>.settings-row{
  background:color-mix(in srgb,var(--surface-raised,var(--card)) 97%,var(--accent) 3%)!important;
}
#settingsView .flat-menu>.menu-row+ .menu-row,#settingsView .settings-menu-v21>.menu-row+ .menu-row,#settingsView .settings-menu-v21>.settings-row+ .settings-row{
  border-top-color:color-mix(in srgb,var(--border) 66%,transparent)!important;
}

/* Style picker doubles as a compact live preview. */
.ui-style-grid-v27>button,.ui-style-choice-v27{position:relative;min-height:72px;padding-right:72px!important;overflow:hidden}
.ui-style-grid-v27>button::after,.ui-style-choice-v27::after{content:"";position:absolute;right:16px;top:50%;width:42px;height:42px;transform:translateY(-50%);border-radius:14px;pointer-events:none}
.ui-style-grid-v27>button[data-ui-style-choice="core"]::after,.ui-style-choice-v27[data-value="core"]::after{background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--card) 88%,var(--accent)));border:1px solid var(--border);box-shadow:0 7px 15px color-mix(in srgb,#20324a 12%,transparent)}
.ui-style-grid-v27>button[data-ui-style-choice="liquid"]::after,.ui-style-choice-v27[data-value="liquid"]::after{background:linear-gradient(145deg,color-mix(in srgb,#fff 58%,transparent),color-mix(in srgb,var(--accent) 18%,transparent));border:1px solid color-mix(in srgb,#fff 62%,var(--border));box-shadow:0 10px 20px color-mix(in srgb,var(--accent) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.75);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* Routine Core: balanced, quiet and product-like. */
html[data-ui-style="core"] .card,html[data-ui-style="core"] .compact-panel,html[data-ui-style="core"] .home-metric{border-radius:var(--radius-card);box-shadow:var(--ds-shadow-core)}
html[data-ui-style="core"] .section-title{font-weight:680;letter-spacing:-.035em}

/* Liquid Glass: depth is reserved for navigation, status and compact surfaces. */
html[data-ui-style="liquid"] body{background:radial-gradient(circle at 15% 5%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 36%),var(--bg)!important}
html[data-ui-style="liquid"] .card,html[data-ui-style="liquid"] .compact-panel,html[data-ui-style="liquid"] .home-metric,html[data-ui-style="liquid"] #settingsView .settings-menu-v21{background:linear-gradient(145deg,color-mix(in srgb,#fff 14%,transparent),color-mix(in srgb,var(--card) 68%,transparent))!important;border-color:color-mix(in srgb,#fff 44%,var(--border))!important;box-shadow:0 18px 42px color-mix(in srgb,var(--accent) 12%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 64%,transparent)!important;backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25)}
html[data-ui-style="liquid"] .floating-toolbar-v27,html[data-ui-style="liquid"] .bottom-nav{box-shadow:0 18px 48px rgba(7,18,34,.2),inset 0 1px 0 rgba(255,255,255,.58)!important}

/* Weekly learning polish. Anki column is intentionally untouched. */
.study-week-card-v15 .study-left-v15{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:var(--space-4) var(--space-4) var(--space-4);background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 4%,var(--card)),var(--card))}
.study-week-card-v15 .study-left-v15::before{content:"WEEKLY RHYTHM";margin:0 0 10px;font-size:9px;line-height:1;letter-spacing:.2em;color:var(--accent);font-weight:650}
.study-week-card-v15 .study-left-v15 .week-mini{height:68px;padding:8px 8px 5px;border-radius:var(--radius-card);background:color-mix(in srgb,var(--accent) 4.5%,transparent)}
.study-week-card-v15 .study-left-v15 .week-mini i{width:9px;border-radius:99px}
.study-week-card-v15 .study-left-v15 .study-debt,.study-week-card-v15 .study-left-v15 .ai-sensei-mini{margin-top:11px;padding-top:11px;border-top:1px solid color-mix(in srgb,var(--border) 68%,transparent)}
html[data-ui-style="liquid"] .study-week-card-v15 .study-left-v15{background:linear-gradient(145deg,color-mix(in srgb,#fff 10%,transparent),color-mix(in srgb,var(--accent) 7%,transparent))}

/* Small-phone and accessibility guardrails. */
@media(max-width:390px){.ui-style-grid-v27>button,.ui-style-choice-v27{min-height:66px;padding-right:64px}.ui-style-grid-v27>button::after,.ui-style-choice-v27::after{right:13px;width:36px;height:36px;border-radius:12px}.study-week-card-v15 .study-left-v15{padding:15px 14px 13px}}
@media(prefers-reduced-motion:reduce){button,.menu-row,.settings-row,.ui-style-choice-v27{transition:none!important}}
@media(prefers-color-scheme:dark){}
/* Routine Suite 4.4.1 · frontend precision and style regression hardening */
:root{--v441-focus:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}

/* Keep every PWA settings group visibly separated, including nested learning/review panels. */
#settingsView .settings-category-v21>.card.flat-menu,
#settingsView .settings-menu-v21,
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-accordion-v21,
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-subpanel{
  background:var(--surface-raised,var(--card))!important;
  border:1px solid color-mix(in srgb,var(--border) 88%,transparent)!important;
}
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-accordion-v21>summary,
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-subpanel>summary{
  background:color-mix(in srgb,var(--surface-raised,var(--card)) 96%,var(--accent) 4%)!important;
}
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-accordion-v21[open]>summary,
:where(.settings-detail-v4116,.page.settings-detail-v445) .settings-subpanel[open]>summary{
  border-bottom:1px solid color-mix(in srgb,var(--border) 72%,transparent)!important;
}

/* Keyboard focus must remain visible across all five styles. */
.ui-style-grid-v27>button:focus-visible,.ui-style-choice-v27:focus-visible,
#settingsView button:focus-visible,.bottom-nav button:focus-visible,.btn:focus-visible{
  outline:0!important;box-shadow:var(--v441-focus)!important;
}
.ui-style-grid-v27>button.active,.ui-style-choice-v27.active{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 26%,transparent)!important;
}
.ui-style-grid-v27>button.active::after,.ui-style-choice-v27.active::after{transform:translateY(-50%) scale(.92)}

/* Prevent preview ornaments and long descriptions from colliding on compact phones. */
.ui-style-grid-v27>button>span,.ui-style-choice-v27>span{min-width:0;padding-right:2px}
.ui-style-grid-v27>button small,.ui-style-choice-v27 small{display:block;overflow-wrap:anywhere}

/* Style identities: tighten contrast without changing component structure. */
html[data-ui-style="core"]{--v441-section-accent:color-mix(in srgb,var(--accent) 10%,transparent)}
html[data-ui-style="core"] .section-head{padding-bottom:7px;border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent)}
html[data-ui-style="liquid"] .bottom-nav,html[data-ui-style="liquid"] .floating-toolbar-v27{border-color:color-mix(in srgb,#fff 42%,var(--border))!important}
html[data-theme="dark"][data-ui-style="liquid"] .card,
html[data-color-mode="dark"][data-ui-style="liquid"] .card{border-color:color-mix(in srgb,#fff 24%,var(--border))!important}

/* Weekly learning: refine hierarchy; Anki selectors intentionally excluded. */
.study-week-section .study-today-score{display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:29px;padding:0 10px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--card));border:1px solid color-mix(in srgb,var(--accent) 20%,var(--border));font-size:12px;font-weight:650;color:var(--accent)}
.study-week-card-v15 .study-left-v15 .week-mini span{min-width:0}
.study-week-card-v15 .study-left-v15 .week-mini small{font-size:9px;line-height:1.1}
.study-week-card-v15 .study-left-v15 .study-debt{font-size:10.5px;line-height:1.45;color:var(--muted)}
.study-week-card-v15 .study-left-v15 .ai-sensei-mini{font-size:11px;line-height:1.5}

@media(max-width:390px){
  .ui-style-grid-v27>button,.ui-style-choice-v27{padding-left:12px!important;padding-right:58px!important}
  .ui-style-grid-v27>button b,.ui-style-choice-v27 b{font-size:14px!important}
  .ui-style-grid-v27>button small,.ui-style-choice-v27 small{font-size:10px!important;line-height:1.35!important}
  .ui-style-grid-v27>button::after,.ui-style-choice-v27::after{right:11px;width:34px;height:34px}
  .study-week-section .section-head{align-items:center}
  .study-week-section .study-today-score{min-width:42px;height:27px;font-size:11px}
}
@media(max-width:350px){
  .ui-style-grid-v27>button,.ui-style-choice-v27{padding-right:12px!important}
  .ui-style-grid-v27>button::after,.ui-style-choice-v27::after{display:none}
}
@media(prefers-reduced-transparency:reduce){html[data-ui-style="liquid"] .card,html[data-ui-style="liquid"] .compact-panel,html[data-ui-style="liquid"] .bottom-nav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card-solid,var(--card))!important}}
/* Routine Suite 4.4.2 · frontend device regression and accessibility hardening */
:root{
  --v442-tap-min:44px;
  --v442-bottom-gap:max(4px,env(safe-area-inset-bottom));
  --v442-hairline:color-mix(in srgb,var(--border) 84%,transparent);
}

/* Preserve readable wrapping and prevent horizontal clipping in dense learning/settings surfaces. */
:where(.menu-row,.setting-line,.mode-row,.compact-panel,.correction-card-v27,.result-card,.ai-sensei-mini) :where(strong,b,small,p,span){
  min-width:0;
  overflow-wrap:anywhere;
}
:where(.settings-detail-v4116,.settings-category-v21,.study-week-card-v15,.learning-result-v4110){min-width:0;max-width:100%}

/* Keep primary touch controls usable without inflating dense text-only content. */
:where(.bottom-nav button,.floating-toolbar-v27 button,.grammar-rating-dock button,.grade-grid button,.review-bottom-actions-v430 button,.ui-style-grid-v27>button,.ui-style-choice-v27){
  min-height:var(--v442-tap-min);
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

/* Docked controls must sit close to the home indicator while retaining the actual safe area. */
:where(.floating-toolbar-v27,.grammar-rating-dock,.grade-grid-v350,.grade-grid,.review-bottom-actions-v430,.learning-result-next-v4110){
  padding-bottom:var(--v442-bottom-gap)!important;
}
.bottom-nav{
  padding-bottom:max(2px,env(safe-area-inset-bottom))!important;
}

/* Stronger selected/focus state in high-contrast modes across all five visual styles. */
@media(prefers-contrast:more){
  :where(.ui-style-grid-v27>button,.ui-style-choice-v27,.bottom-nav button,.btn):focus-visible{
    outline:2px solid CanvasText!important;
    outline-offset:2px!important;
    box-shadow:none!important;
  }
  :where(.ui-style-grid-v27>button.active,.ui-style-choice-v27.active){
    border-width:2px!important;
  }
  #settingsView :where(.settings-menu-v21,.settings-accordion-v21,.settings-subpanel){
    border-color:color-mix(in srgb,var(--text) 38%,var(--border))!important;
  }
}
@media(forced-colors:active){
  :where(.ui-style-grid-v27>button.active,.ui-style-choice-v27.active,.bottom-nav button.active){
    forced-color-adjust:auto;
    outline:2px solid Highlight!important;
    outline-offset:-2px;
  }
}

/* Manual accessibility switches receive the same treatment as OS preferences. */
html[data-high-contrast="true"] :where(.ui-style-grid-v27>button.active,.ui-style-choice-v27.active){
  border-width:2px!important;
  box-shadow:0 0 0 1px var(--text)!important;
}
html[data-large-touch="true"] :where(.bottom-nav button,.floating-toolbar-v27 button,.grammar-rating-dock button,.grade-grid button){min-height:50px!important}

/* Style-specific final polish without changing component structure. */
html[data-ui-style="core"] :where(.card,.compact-panel){border-color:var(--v442-hairline)}
html[data-ui-style="liquid"] :where(.floating-toolbar-v27,.bottom-nav){background:color-mix(in srgb,var(--card) 82%,transparent)!important}

/* Compact phones: avoid toolbar overflow and preserve sentence reading width. */
@media(max-width:390px){
  :where(.floating-toolbar-v27,.grammar-rating-dock,.grade-grid-v350,.grade-grid,.review-bottom-actions-v430){
    gap:6px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  :where(.floating-toolbar-v27,.grammar-rating-dock,.grade-grid-v350,.grade-grid,.review-bottom-actions-v430) button{
    min-width:0!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .study-week-card-v15 :where(.ai-sensei-mini,.study-debt){overflow-wrap:anywhere}
}
@media(max-width:350px){
  :where(.floating-toolbar-v27,.grammar-rating-dock,.grade-grid-v350,.grade-grid,.review-bottom-actions-v430) button{
    font-size:11px!important;
  }
}

/* Reduced transparency and motion must remain visually stable in Liquid Glass. */
@media(prefers-reduced-transparency:reduce){
  html[data-ui-style="liquid"] :where(.floating-toolbar-v27,.bottom-nav,.card,.compact-panel){
    background:var(--card-solid,var(--card))!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}
@media(prefers-reduced-motion:reduce){
  :where(.ui-style-grid-v27>button,.ui-style-choice-v27,.floating-toolbar-v27,.bottom-nav){scroll-behavior:auto!important}
}
/* Routine Suite 4.5.1 · compact speaking launch and Soft Surface polish */
:root{--v451-radius-control:16px;--v451-radius-card:22px;--v451-shadow-soft:0 1px 2px rgba(16,24,40,.04),0 10px 28px rgba(16,24,40,.07)}
.home-intro-v20 h2{font-size:clamp(22px,6vw,27px);font-weight:720;letter-spacing:-.035em}.home-intro-v20>div>p:last-child{max-width:31rem;font-size:14px;line-height:1.55}.speaking-launch-v451{margin-bottom:18px}.speaking-launch-grid-v451{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.speaking-launch-card-v451{position:relative;min-width:0;min-height:142px;padding:var(--space-4);border:1px solid color-mix(in srgb,var(--line) 88%,transparent);border-radius:var(--v451-radius-card);background:var(--panel);color:var(--text);text-align:left;display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-rows:auto 1fr;gap:13px 10px;align-items:start;box-shadow:var(--v451-shadow-soft)}.speaking-launch-card-v451 .menu-glyph{grid-column:1;width:40px;height:40px;border-radius:var(--radius-compact)}.speaking-launch-card-v451>span:nth-child(2){grid-column:1/-1;align-self:end;min-width:0}.speaking-launch-card-v451 strong{display:block;font-size:16px;line-height:1.25;font-weight:720;letter-spacing:-.018em}.speaking-launch-card-v451 small{display:block;margin-top:5px;color:var(--muted);font-size:12px;line-height:1.45}.speaking-launch-card-v451>b{grid-column:3;grid-row:1;color:var(--muted);font-size:18px;font-weight:500}.speaking-launch-card-v451:active{transform:translateY(1px)}
.settings-detail-v4116 :where(h2,h3){font-weight:720;letter-spacing:-.025em}.settings-detail-v4116 p,.settings-detail-v4116 small{line-height:1.5}.menu-row strong,.setting-line b{font-weight:690}
@media(max-width:370px){.speaking-launch-grid-v451{gap:8px}.speaking-launch-card-v451{min-height:132px;padding:14px}.speaking-launch-card-v451 strong{font-size:15px}.speaking-launch-card-v451 small{font-size:11px}}
@media(max-width:330px){.speaking-launch-grid-v451{grid-template-columns:1fr}.speaking-launch-card-v451{min-height:108px}}
/* Routine Suite 5.9.2 · iPhone 15 Pro (393pt) learning-detail compatibility. */
#textDialog label{
  display:block;
  margin:0 0 7px;
  color:var(--muted);
  font-size:var(--type-support);
  font-weight:700;
}

/* iOS WebKit zooms focused form controls below 16px. Keep learning inputs stable without
   changing the typography of labels, buttons, or the protected home learning area. */
#scenarioView :where(input,select,textarea),
#scenarioRoomView :where(input,select,textarea),
#shadowView :where(input,select,textarea),
#retellingView :where(input,select,textarea),
#pronunciationView :where(input,select,textarea),
#textDialog :where(input,select,textarea){
  font-size:16px;
}

@media(max-width:430px){
  /* The previous compact composer stopped at 390px; iPhone 15 Pro is 393 CSS pt. */
  body[data-view="scenarioRoom"]{padding-bottom:calc(254px + var(--safe-b))}
  .voice-composer{width:calc(100% - 16px);padding:10px}
  .voice-composer .composer-actions{grid-template-columns:minmax(0,1fr) 66px minmax(0,1fr);gap:7px}
  .voice-composer #scenarioMic{width:66px;height:66px}
  .scenario-audio-slot .audio-transport-v293{grid-template-columns:34px minmax(0,1fr) auto}
  .scenario-audio-slot .audio-transport-v293 #audioStopV293{grid-column:3}
  .scenario-audio-slot .audio-transport-v293 #audioPauseResumeV293{grid-column:1/-1;width:100%}

  .mission-live ol{grid-template-columns:1fr}
  .talk-evaluation.v17{grid-template-columns:68px minmax(0,1fr);padding:12px}
  .shadow-training-bar{grid-template-columns:1fr 1fr}
  .shadow-training-bar>div{grid-column:1/-1}
  .shadow-toolbar.dense{grid-template-columns:repeat(3,minmax(0,1fr))}
  .shadow-toolbar .shadow-routine{grid-column:span 2}
  .evaluation-actions{grid-template-columns:1fr 1fr}
  .evaluation-actions .primary{grid-column:1/-1}
  .speaking-flow-v504{gap:5px}
  .speaking-flow-v504 li{display:grid;justify-items:center;gap:4px;padding:7px 4px;text-align:center}
  .speaking-flow-v504 li span{width:100%}
  .shadow-tools-v504 .shadow-toolbar.dense{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pron-result-hero{grid-template-columns:58px minmax(0,1fr);padding:12px}
  .pron-result-hero .score-ring.large{width:58px;height:58px}
  .pron-result-hero h2{font-size:16px}
  .pron-metrics-v343{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Routine Suite v5.0 workstream E — single byte-identical final shared layer.
   Concatenation of uiux-v460.css, uiux-v461.css, uiux-v462.css, uiux-v463.css, uiux-v464.css, uiux-v465.css, uiux-v470.css, uiux-v480.css, uiux-v485.css in cascade order.
   Content is unchanged: the generated bundles are byte-identical to 4.9.0. */
/* Routine Suite 4.6.0 — dark-mode readability baseline. Routine.js is the visual source of truth. */
html[data-theme="dark"]{
  --bg:#101311;
  --bg-2:#17201b;
  --surface:rgba(28,33,29,.94);
  --surface-solid:#1c211d;
  --surface-soft:#242b26;
  --card:var(--surface);
  --card-solid:var(--surface-solid);
  --text:#f4f6f4;
  --muted:#b2b9b4;
  --faint:#8e9690;
  --line:rgba(255,255,255,.14);
  --border:var(--line);
  --track:rgba(255,255,255,.13);
  --nav-bg:rgba(20,24,21,.94);
  --overlay:rgba(10,13,11,.9);
  --shadow:0 16px 38px rgba(0,0,0,.34);
}
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 92% 4%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 34%),
    linear-gradient(150deg,var(--bg),var(--bg-2) 125%);
}
html[data-theme="dark"] :where(.card,.compact-panel,.menu-list,.result-card,.scene-brief,.voice-composer,.release-card,.history-item,.premium-item,.talk-evaluation,.settings-menu-v21,.settings-category-v21>.card.flat-menu,.settings-section-v34,.diagnostic-section-v335,.setting-group,.settings-tile,.option-card,.theme-card){
  background:var(--surface-solid)!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] :where(.menu-row,.settings-row,.setting-line,.health-row,.record-item){
  background:transparent!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] :where(.menu-row:active,.settings-row:active,.setting-line:active,.option-card:active,.theme-card:active){
  background:color-mix(in srgb,var(--accent) 10%,var(--surface-solid))!important;
}
html[data-theme="dark"] :where(p,small,.status,.support,.caption,.helper,.setting-line small,.settings-row small,.menu-row small){
  color:var(--muted);
}
html[data-theme="dark"] :where(h1,h2,h3,h4,b,strong,.title,.setting-line b,.settings-row b,.menu-row b){
  color:var(--text);
}
html[data-theme="dark"] :where(input,textarea,select){
  background:#151a17!important;
  border-color:rgba(255,255,255,.16)!important;
  color:var(--text)!important;
}
html[data-theme="dark"] :where(input::placeholder,textarea::placeholder){color:#89918b!important}
html[data-theme="dark"] :where(.chip,.badge,.pill,.version-pill){
  border-color:rgba(255,255,255,.16)!important;
}
html[data-theme="dark"] .bottom-nav,
html[data-theme="dark"] .floating-toolbar-v27,
html[data-theme="dark"] .sticky-action{
  background:var(--nav-bg)!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 -10px 28px rgba(0,0,0,.32)!important;
}
html[data-theme="dark"] .topbar{
  background:linear-gradient(180deg,rgba(16,19,17,.98),rgba(16,19,17,.86))!important;
  border-bottom-color:rgba(255,255,255,.1)!important;
}
html[data-theme="dark"] .primary,
html[data-theme="dark"] .btn.primary{
  color:#081018!important;
}
html[data-theme="dark"] .secondary,
html[data-theme="dark"] .btn.secondary{
  background:#242a26!important;
  border-color:rgba(255,255,255,.16)!important;
  color:var(--text)!important;
}
html[data-theme="dark"] .danger,
html[data-theme="dark"] del{color:#ff8585!important}
html[data-theme="dark"] .success,
html[data-theme="dark"] ins{color:#67d6a4!important}
html[data-theme="dark"][data-ui-style="liquid"] :where(.card,.compact-panel,.settings-menu-v21,.settings-category-v21>.card.flat-menu){
  background:rgba(30,36,34,.84)!important;
  border-color:rgba(255,255,255,.18)!important;
}
@media (prefers-contrast:more){html[data-theme="dark"]{--muted:#c5cbc7;--line:rgba(255,255,255,.24)}}
/* Routine Suite 4.6.1 — Design Bible compliance and five-style identity layer. */
:root{
  --v461-radius-card:18px;
  --v461-radius-item:14px;
  --v461-radius-control:12px;
  --v461-space-1:4px;
  --v461-space-2:8px;
  --v461-space-3:12px;
  --v461-space-4:16px;
  --v461-space-5:24px;
  --v461-motion-fast:140ms;
  --v461-motion-standard:190ms;
  --v461-ease:cubic-bezier(.2,.8,.2,1);
  --v461-card-shadow:0 10px 28px color-mix(in srgb,#07110b 10%,transparent);
  --v461-focus:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent);
}
/* Shared hierarchy: spacing and contrast lead; weight is restrained. */
:where(.card,.compact-panel,.settings-menu-v21,.settings-section-v34,.diagnostic-section-v335,.result-card,.correction-card-v27,.learning-result-v4110){
  border-radius:var(--v461-radius-card);
}
:where(.menu-row,.settings-row,.setting-line,.record-item,.health-row,.option-card,.theme-card){
  min-height:44px;
}
:where(.menu-row b,.settings-row b,.setting-line b,.card-title,.section-title){font-weight:600}
:where(.menu-row small,.settings-row small,.setting-line small,.section-note,.setting-help){font-weight:400;line-height:1.5}
:where(button,.btn,.menu-row,.settings-row,.setting-line,.option-card,.theme-card){
  transition:background-color var(--v461-motion-fast) var(--v461-ease),border-color var(--v461-motion-fast) var(--v461-ease),box-shadow var(--v461-motion-fast) var(--v461-ease),transform var(--v461-motion-fast) var(--v461-ease);
}
:where(button,.btn,.menu-row,.settings-row,.setting-line,.option-card,.theme-card):focus-visible{outline:none;box-shadow:var(--v461-focus)!important}
:where(button,.btn,.menu-row,.settings-row,.setting-line,.option-card,.theme-card):active{transform:translateY(1px)}

/* Routine Core: calm, balanced, durable card hierarchy. */
html[data-ui-style="core"]{
  --v461-card-radius:18px;
  --v461-item-radius:14px;
}
html[data-ui-style="core"] :where(.card,.compact-panel,.settings-menu-v21,.result-card){
  border-radius:var(--v461-card-radius)!important;
  box-shadow:var(--v461-card-shadow)!important;
}
html[data-ui-style="core"] :where(.menu-row,.settings-row,.setting-line){border-radius:var(--v461-item-radius)}

/* Liquid Glass: layered translucency and controlled specular depth. */
html[data-ui-style="liquid"] :where(.card,.compact-panel,.settings-menu-v21,.settings-section-v34,.result-card,.correction-card-v27){
  background:linear-gradient(145deg,color-mix(in srgb,white 13%,transparent),color-mix(in srgb,var(--card) 74%,transparent))!important;
  border-color:color-mix(in srgb,white 30%,var(--accent) 12%)!important;
  box-shadow:0 18px 44px rgba(8,18,30,.14),inset 0 1px 0 rgba(255,255,255,.25)!important;
  backdrop-filter:blur(24px) saturate(160%)!important;
  -webkit-backdrop-filter:blur(24px) saturate(160%)!important;
}
html[data-ui-style="liquid"] :where(.bottom-nav,.floating-toolbar-v27,.sticky-action,.topbar){
  backdrop-filter:blur(26px) saturate(165%)!important;
  -webkit-backdrop-filter:blur(26px) saturate(165%)!important;
}

/* Dark variants retain each style identity while preserving readability. */
html[data-theme="dark"][data-ui-style="core"] :where(.card,.compact-panel,.settings-menu-v21,.result-card){box-shadow:0 14px 34px rgba(0,0,0,.28)!important}
html[data-theme="dark"][data-ui-style="liquid"] :where(.card,.compact-panel,.settings-menu-v21,.result-card){background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(27,34,31,.78))!important;border-color:rgba(255,255,255,.2)!important}

/* Shared state semantics and low-noise badges. */
:where(.badge,.pill,.chip,.version-pill){font-weight:550;letter-spacing:-.01em}
:where(.empty-state,.error-state,.success-state,.loading-card){border-radius:var(--v461-radius-card)}
:where(.floating-toolbar-v27,.sticky-action){border-radius:20px!important}

@media(max-width:390px){
  :root{--v461-radius-card:16px;--v461-radius-item:12px}
  :where(.card,.compact-panel,.settings-menu-v21,.settings-section-v34){border-radius:var(--v461-radius-card)}
}
@media(prefers-reduced-motion:reduce){
  :where(button,.btn,.menu-row,.settings-row,.setting-line,.option-card,.theme-card){transition:none!important;transform:none!important}
}
@media(prefers-contrast:more){
  :where(.card,.compact-panel,.settings-menu-v21,.settings-section-v34,.result-card){border-width:2px!important}
}
/* Routine Suite 4.6.2 — review layout and typography refinement */
.review-flow-v4113.review-card-v350{min-height:0;padding:var(--space-4) var(--space-4) var(--space-5);gap:0;text-align:left;border-radius:22px;overflow:visible}
.review-task-v350{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:0 0 13px;border-bottom:1px solid var(--border);background:none!important}
.review-task-v350>span{display:grid;gap:3px;min-width:0}.review-task-v350>span>small{font-size:10px;letter-spacing:.11em;color:var(--muted);font-weight:750}.review-task-v350>span>b{font-size:13px;line-height:1.4;font-weight:650;color:var(--text)}
.review-repeat-v350{flex:0 0 auto;padding:6px 9px;border-radius:999px;background:color-mix(in srgb,var(--warning) 10%,var(--card));border:1px solid color-mix(in srgb,var(--warning) 23%,var(--border));display:flex;gap:5px;align-items:center}.review-repeat-v350 span,.review-repeat-v350 b{font-size:10px;line-height:1.2}.review-repeat-v350 span{color:var(--muted)}
.review-prompt-v462,.review-answer-v462{display:grid;gap:7px}.review-prompt-v462>small,.review-answer-v462>small{font-size:10px;font-weight:750;color:var(--muted);letter-spacing:.02em}
.flashcard.deck-review .review-prompt-v462 .front{margin:0;padding:2px 0 4px;text-align:left;font-size:clamp(20px,5.7vw,25px);line-height:1.68;font-weight:520;letter-spacing:-.025em}
.review-answer-v462{margin-top:18px;padding-top:17px;border-top:1px solid var(--border)}
.flashcard.deck-review .review-answer-v462 .answer{margin:0;padding:0;border:0;text-align:left;font-size:clamp(19px,5.3vw,23px);line-height:1.68;font-weight:520;letter-spacing:-.025em}
.deck-error-mark,.deck-correct-mark{font-weight:520;background:none;text-decoration:none;border-radius:4px;padding:0 .08em}.deck-error-mark{color:var(--danger);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--danger) 58%,transparent)}.deck-correct-mark{color:var(--success);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--success) 55%,transparent)}
.deck-change-v350{grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr)!important;margin:14px 0 0!important;padding:12px 13px!important;border:0!important;border-radius:15px!important;background:var(--surface-soft)!important}.deck-change-v350 small{font-size:10px;margin-bottom:5px}.deck-change-v350 del,.deck-change-v350 ins{font-size:13px;line-height:1.55;font-weight:450!important}.deck-change-v350 del{text-decoration:line-through!important;text-decoration-thickness:1px!important}.deck-change-v350 ins{text-decoration:none!important}
.review-reason-v462{margin-top:14px;padding:14px 0 0;border-top:1px solid var(--border);background:none!important}.review-reason-v462>small{font-size:10px;letter-spacing:.02em;color:var(--muted);font-weight:750}.review-reason-v462 p{margin:7px 0 0;font-size:13px;line-height:1.62;color:var(--text);font-weight:450}.review-reason-v462 p span{display:block;margin-top:7px;color:var(--muted);font-size:11px}
.review-context-details-v350,.review-coach-v350{margin-top:12px;border:1px solid var(--border);border-radius:14px;background:transparent}.review-context-details-v350 summary,.review-coach-v350 summary{min-height:42px;padding:11px 13px;font-size:11px;font-weight:650;color:var(--muted)}
.review-reveal-v350{width:100%;min-height:48px;margin-top:19px;font-size:14px}
.grade-grid-v350{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));z-index:32;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:12px;padding:8px;border-radius:18px;background:color-mix(in srgb,var(--card-solid) 96%,transparent);border:1px solid var(--border);box-shadow:0 -8px 28px rgba(0,0,0,.12);backdrop-filter:blur(18px)}.grade-grid-v350 .btn{min-width:0;min-height:46px;padding:7px 3px;border-radius:11px}.grade-grid-v350 .btn b{display:block;font-size:11px}.grade-grid-v350 .btn small{display:block;margin-top:2px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.review-session-bar-v350{margin-bottom:12px}.review-session-bar-v350+ .review-save-state-v299{margin-bottom:10px}
@media(max-width:360px){.review-flow-v4113.review-card-v350{padding:16px}.flashcard.deck-review .review-prompt-v462 .front{font-size:20px}.flashcard.deck-review .review-answer-v462 .answer{font-size:19px}.deck-change-v350{grid-template-columns:1fr!important}.deck-change-v350>i{display:none}.grade-grid-v350 .btn small{display:none}.grade-grid-v350 .btn{min-height:42px}}
[data-density="compact"] .review-flow-v4113.review-card-v350{padding:var(--space-4) var(--space-4) var(--space-4)}[data-density="compact"] .review-task-v350{margin-bottom:12px;padding-bottom:10px}[data-density="compact"] .review-answer-v462{margin-top:14px;padding-top:13px}[data-ui-style="liquid"] .grade-grid-v350{background:color-mix(in srgb,var(--card-solid) 82%,transparent)}
/* Routine Suite 4.6.3 · Sensei, records and sake refinement */
.home-metric>b{font-weight:500;font-variation-settings:"wght" 500;letter-spacing:-.045em}.study-today-score{font-weight:500!important}
.review-focus-v37,.review-queue-v31,.review-debt-card-v31{box-shadow:none!important}.review-focus-v37{border-radius:24px;padding:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 10%,var(--card)),var(--card))}.review-focus-v37>small{letter-spacing:.16em}.review-focus-v37 h2{font-size:clamp(22px,5.6vw,29px);line-height:1.3;letter-spacing:-.035em}.review-focus-v37 p{max-width:34em;line-height:1.65}.review-queue-v31{display:grid;gap:8px}.review-queue-v31 .menu-row{border-radius:16px;background:color-mix(in srgb,var(--p1) 55%,transparent)}
.record-stack-v463{display:grid;gap:12px}.record-hero-v463,.sake-hero-v463,.progress-hero-v463{display:grid;grid-template-columns:1fr auto;gap:5px 14px;align-items:end;margin:0 0 18px;padding:18px 20px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 8%,var(--card)),var(--card))}.record-hero-v463 small,.sake-hero-v463 small,.progress-hero-v463 small{color:var(--accent);font-size:10px;letter-spacing:.17em}.record-hero-v463 b,.sake-hero-v463 b,.progress-hero-v463 b{grid-row:1/3;grid-column:2;font-size:38px;font-weight:500;letter-spacing:-.06em}.record-hero-v463 span,.sake-hero-v463 span,.progress-hero-v463 span{color:var(--muted);font-size:12px;line-height:1.55}
.record-collection-v463,.sake-region-v463,.sake-note-region-v463{overflow:hidden;padding:0!important}.record-collection-v463>summary,.sake-region-v463>summary,.sake-note-region-v463>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px}.record-collection-v463>summary::-webkit-details-marker,.sake-region-v463>summary::-webkit-details-marker,.sake-note-region-v463>summary::-webkit-details-marker{display:none}.record-collection-v463 summary span,.sake-region-v463 summary span,.sake-note-region-v463 summary span{display:grid;gap:3px}.record-collection-v463 summary small,.sake-region-v463 summary small,.sake-note-region-v463 summary small{color:var(--accent);font-size:10px;letter-spacing:.15em}.record-collection-v463 summary b,.sake-region-v463 summary b,.sake-note-region-v463 summary b{font-size:17px}.record-collection-v463 summary em,.sake-region-v463 summary em,.sake-note-region-v463 summary em{font-style:normal;color:var(--muted);font-size:12px}.record-collection-body-v463,.sake-region-v463>div,.sake-note-region-v463>div{border-top:1px solid var(--border)}
.record-entry-v463,.sake-entry-v463{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 18px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);text-align:left}.record-entry-v463:last-child,.sake-entry-v463:last-child{border-bottom:0}.record-entry-v463 span,.sake-entry-v463 span{display:grid;gap:4px;min-width:0}.record-entry-v463 b,.sake-entry-v463 b{font-size:15px;line-height:1.4}.record-entry-v463 small,.sake-entry-v463 small{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.record-entry-v463 i,.sake-entry-v463 i{padding:6px 9px;border-radius:999px;background:var(--p1);color:var(--muted);font-size:10px;font-style:normal}.sake-entry-v463 i.tried{background:color-mix(in srgb,var(--success) 13%,var(--p1));color:var(--success)}.sake-entry-v463 i.wish{background:color-mix(in srgb,var(--accent) 12%,var(--p1));color:var(--accent)}
.sake-note-region-v463 article{display:grid;gap:5px;padding:14px 18px;border-bottom:1px solid var(--border)}.sake-note-region-v463 article:last-child{border-bottom:0}.sake-note-region-v463 article small{color:var(--muted);font-size:11px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.progress-card-v463{padding:var(--space-4) var(--space-4)}.progress-card-v463 header,.progress-card-v463 footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.progress-card-v463 header span{display:grid;gap:4px}.progress-card-v463 header small{color:var(--accent);font-size:10px;letter-spacing:.14em}.progress-card-v463 header b{font-size:17px}.progress-card-v463 header>i{font-style:normal;color:var(--success);font-size:11px}.progress-track-v463{height:6px;margin:15px 0 11px;border-radius:999px;background:var(--p1);overflow:hidden}.progress-track-v463 i{display:block;height:100%;border-radius:inherit;background:var(--accent)}.progress-card-v463.complete .progress-track-v463 i{background:var(--success)}.progress-card-v463 footer{color:var(--muted);font-size:11px}
.settings-preview-v28{border-radius:20px!important}.settings-preview-v28:has([lang="ja"]),.settings-preview-v28{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 6%,var(--card)),var(--card))}.settings-preview-v28>b{font-size:18px;line-height:1.55}.settings-preview-v28 p{line-height:1.65}
@media(max-width:390px){.record-hero-v463,.sake-hero-v463,.progress-hero-v463{padding:16px}.record-entry-v463,.sake-entry-v463{padding:13px 15px}.record-hero-v463 b,.sake-hero-v463 b,.progress-hero-v463 b{font-size:32px}}
/* Routine Suite 4.6.4 · Japanese font presets, weekly rhythm, Soft Studio persistence */
.study-week-card-v15{grid-template-columns:minmax(0,46%) minmax(0,54%);align-items:stretch}
.study-week-card-v15 .study-left-v15{justify-content:flex-start;padding:var(--space-4) var(--space-4);min-height:0}
.study-week-card-v15 .study-left-v15::before{content:"주간 리듬";margin:0 0 12px;font-size:11px;line-height:1.2!important;letter-spacing:0!important;color:var(--text)!important;font-weight:560}
.study-week-card-v15 .week-mini{height:104px;min-height:104px;padding:var(--space-3) var(--space-2) var(--space-2);display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;align-items:end!important;gap:7px;border-radius:var(--radius-card);background:color-mix(in srgb,var(--panel-2) 66%,transparent);overflow:visible!important}
.study-week-card-v15 .week-mini>span{height:80px;display:grid!important;grid-template-rows:58px 18px;align-items:end!important;justify-items:center!important;min-width:0!important}
.study-week-card-v15 .week-mini i{width:12px;min-height:5px;max-height:54px;border-radius:999px!important;background:color-mix(in srgb,var(--accent) 26%,var(--line))!important;box-shadow:none!important}
.study-week-card-v15 .week-mini>span.active i{background:color-mix(in srgb,var(--accent) 72%,var(--panel))!important}
.study-week-card-v15 .week-mini>span.today i{outline:3px solid color-mix(in srgb,var(--accent) 13%,transparent)!important;transform:none!important}
.study-week-card-v15 .week-mini small{margin-top:6px;font-size:10px;line-height:1!important;color:var(--muted)!important;font-weight:450}
.study-week-card-v15 .week-mini>span.today small{color:var(--accent)!important;font-weight:560!important}
html[data-jp-font="pretendardjp"] :where([lang="ja"],.jp-text,.jp,.japanese,.review-japanese,.sake-japanese){font-family:"RoutineJP_pretendardjp","Pretendard JP","PretendardJP","Hiragino Sans",sans-serif!important}
html[data-jp-font="notojp"] :where([lang="ja"],.jp-text,.jp,.japanese,.review-japanese,.sake-japanese){font-family:"RoutineJP_notojp","Noto Sans JP","NotoSansJP","Hiragino Sans",sans-serif!important}
html[data-jp-font="klee"] :where([lang="ja"],.jp-text,.jp,.japanese,.review-japanese,.sake-japanese){font-family:"RoutineJP_klee","Klee One","KleeOne-Regular","Hiragino Sans",sans-serif!important}
@media(max-width:390px){.study-week-card-v15{grid-template-columns:1fr}.study-week-card-v15 .anki-v29,.study-week-card-v15 .anki-v17{border-left:0!important;border-top:1px solid var(--border)!important}.study-week-card-v15 .week-mini{height:98px;min-height:98px}}
/* Routine Suite 4.6.5 · compact weekly rhythm */
.study-week-card-v15{grid-template-columns:minmax(0,32%) minmax(0,68%)!important;align-items:start!important}
.study-week-card-v15 .study-left-v15{align-self:stretch!important;justify-content:center!important;padding:var(--space-3) var(--space-3) var(--space-3)!important;min-height:0!important}
.study-week-card-v15 .study-left-v15::before{content:"주간 리듬"!important;margin:0 0 8px!important;font-size:10px!important;font-weight:540!important}
.study-week-card-v15 .week-mini{height:72px!important;min-height:72px!important;padding:7px 3px 5px!important;gap:4px!important;border-radius:var(--radius-compact)!important;background:transparent!important}
.study-week-card-v15 .week-mini>span{height:58px!important;grid-template-rows:40px 14px!important}
.study-week-card-v15 .week-mini i{width:9px!important;min-height:3px!important;max-height:36px!important}
.study-week-card-v15 .week-mini small{margin-top:3px!important;font-size:10px!important;font-weight:430!important}
.study-week-card-v15 .anki-v29{align-self:start!important;padding:var(--space-3)!important;gap:8px!important}
.study-week-card-v15 .anki-v29-primary{min-height:118px!important}
.study-week-card-v15 .anki-v29-panel{min-height:118px!important;padding:var(--space-2)!important}
.study-week-card-v15 .anki-v29-foot{padding-top:7px!important}
@media(max-width:390px){.study-week-card-v15{grid-template-columns:minmax(0,30%) minmax(0,70%)!important}.study-week-card-v15 .study-left-v15{padding:10px 8px!important}.study-week-card-v15 .week-mini{height:66px!important;min-height:66px!important;gap:2px!important}.study-week-card-v15 .week-mini>span{height:53px!important;grid-template-rows:36px 13px!important}.study-week-card-v15 .anki-v29-primary,.study-week-card-v15 .anki-v29-panel{min-height:112px!important}}
@media(max-width:330px){.study-week-card-v15{grid-template-columns:1fr!important}.study-week-card-v15 .study-left-v15{border-bottom:1px solid var(--border)!important}.study-week-card-v15 .anki-v29{border-left:0!important}}
/* Routine Suite 4.6.5 hotfix · AI learning coach and compact metrics */
.home-metric>b{font-size:18.7px;font-weight:470;font-variation-settings:"wght" 470!important;letter-spacing:-.035em}
.home-metric{padding:15px 10px 14px}
.home-metric>span:not(.metric-dots){font-size:12px;margin-top:5px}
.home-metric .metric-dots{margin-top:7px;transform:scale(.92);transform-origin:center}
.study-coach-card-v465{grid-template-columns:minmax(0,36%) minmax(0,64%);align-items:stretch!important}
.study-coach-card-v465 .learning-coach-v465{min-width:0;padding:var(--space-4) var(--space-4) var(--space-3);display:flex;flex-direction:column;gap:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,var(--card)),var(--card));cursor:pointer}
.learning-coach-head-v465{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding-bottom:9px;border-bottom:1px solid color-mix(in srgb,var(--border) 72%,transparent)}
.learning-coach-head-v465>span{font-size:11px;font-weight:620;color:var(--muted);letter-spacing:-.02em}
.learning-coach-head-v465>strong{font-size:25px;line-height:.9;font-weight:520;color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.055em}
.learning-coach-head-v465>strong small{font-size:10px;margin-left:2px;font-weight:540}
.learning-coach-row-v465{display:grid;gap:3px;min-width:0}
.learning-coach-row-v465 small,.learning-coach-recommend-v465 small{font-size:10px;color:var(--muted);font-weight:500}
.learning-coach-row-v465 b{font-size:11.5px;font-weight:590;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.learning-coach-row-v465.growth b{color:color-mix(in srgb,var(--success,#35a875) 88%,var(--text))}
.learning-coach-row-v465.focus b{color:var(--text)}
.learning-coach-recommend-v465{margin-top:auto;display:grid;grid-template-columns:1fr auto;gap:2px 7px;align-items:center;padding:9px 10px;border-radius:13px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--accent) 17%,transparent)}
.learning-coach-recommend-v465 small{grid-column:1}
.learning-coach-recommend-v465 b{grid-column:1;font-size:10.5px;line-height:1.3;font-weight:570;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.learning-coach-recommend-v465 i{grid-column:2;grid-row:1/3;font-style:normal;color:var(--accent);font-size:18px;font-weight:400}
.study-coach-card-v465 .anki-v29{align-self:stretch!important;padding:var(--space-3);gap:9px}
.study-coach-card-v465 .anki-v29-primary,.study-coach-card-v465 .anki-v29-panel{min-height:124px}
@media(max-width:390px){.home-metric>b{font-size:17px}.home-metric{padding:14px 8px 13px}.study-coach-card-v465{grid-template-columns:minmax(0,35%) minmax(0,65%)}.study-coach-card-v465 .learning-coach-v465{padding:13px 10px 11px;gap:8px}.learning-coach-head-v465>strong{font-size:22px}.learning-coach-row-v465 b{font-size:10.5px}.learning-coach-recommend-v465{padding:8px}.study-coach-card-v465 .anki-v29{padding:10px}.study-coach-card-v465 .anki-v29-primary,.study-coach-card-v465 .anki-v29-panel{min-height:118px!important}}
@media(max-width:330px){.study-coach-card-v465{grid-template-columns:1fr!important}.study-coach-card-v465 .learning-coach-v465{border-bottom:1px solid var(--border)}.study-coach-card-v465 .anki-v29{border-left:0!important}}
/* Routine Suite 4.7.0 · product-wide UI/UX finishing layer */
:root{--ui470-card-gap:14px;--ui470-section-gap:22px;--ui470-control-h:44px;--ui470-radius:18px}
/* Home: preserve grass, refine everything around it. */
.home-metrics{gap:10px!important}
.home-metric{min-height:112px;border-radius:20px;padding:14px 10px 13px}
.home-metric>b{font-size:18px;font-weight:450;letter-spacing:-.04em!important}
.home-metric>span:not(.metric-dots){font-size:11.5px;font-weight:520!important}
.home-metric .metric-dots{margin-top:7px;transform:scale(.88)}
.study-coach-card-v465{grid-template-columns:minmax(0,40%) minmax(0,60%)}
.study-coach-card-v465 .learning-coach-v465{padding:var(--space-4) var(--space-4)!important;gap:14px;justify-content:flex-start!important;cursor:default!important}
.learning-coach-head-v465{align-items:center!important;padding-bottom:12px!important}
.learning-coach-head-v465>span{font-size:11px!important;font-weight:590!important}
.learning-coach-head-v465>strong{font-size:22px!important;font-weight:480!important;letter-spacing:-.045em!important}
.learning-coach-head-v465>strong small{font-size:10px!important}
.learning-coach-row-v465{gap:4px;padding:1px 0!important}
.learning-coach-row-v465 small{font-size:10px!important}
.learning-coach-row-v465 b{font-size:11.5px!important;font-weight:570!important;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.learning-coach-recommend-v465{display:none!important}
.study-coach-card-v465 .anki-v29{padding:var(--space-3)!important;gap:10px!important}
.study-coach-card-v465 .anki-v29-primary,.study-coach-card-v465 .anki-v29-panel{min-height:118px!important}
/* Product-wide hierarchy and density. */
.screen-head,.routine-page-header-v27{margin-bottom:16px!important}
.screen-head h1,.routine-page-header-v27 h1{font-weight:650!important;letter-spacing:-.035em!important}
.section{margin-top:var(--ui470-section-gap)!important}
.section-head{margin-bottom:11px!important}
.section-title{font-weight:650!important;letter-spacing:-.025em!important}
.card{border-radius:var(--ui470-radius)!important}
.settings-menu-v21,.settings-shell-v21,.settings-option-card-v28{border-radius:var(--radius-card)!important}
.settings-menu-v21 button,.settings-row-v21{min-height:var(--ui470-control-h)!important}
button,.button,.primary,.secondary{font-weight:600}
.result-hero-v27,.correction-card-v27,.review-card,.sensei-card{box-shadow:none!important}
.correction-card-v27 summary{min-height:48px!important}
.correction-line-v27 p{line-height:1.7!important}
.correction-line-v27.original p{font-weight:430!important}
.correction-line-v27.corrected p,.correction-line-v27.native p{font-weight:500!important}
/* Records and archives: calmer, consistent cards. */
.record-card,.archive-card,.taste-card,.sake-card,.podcast-card,.reading-card{border-radius:var(--radius-card)!important;box-shadow:none!important}
.record-card h3,.archive-card h3,.taste-card h3,.sake-card h3{letter-spacing:-.025em!important}
/* Bottom navigation and overlays. */
.bottom-nav,.tabbar,.floating-toolbar-v27{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
@media(max-width:390px){
 .home-metric{min-height:104px!important;padding:13px 8px 12px}
 .home-metric>b{font-size:16.5px}
 .study-coach-card-v465{grid-template-columns:minmax(0,40%) minmax(0,60%)}
 .study-coach-card-v465 .learning-coach-v465{padding:13px 10px;gap:11px!important}
 .learning-coach-head-v465>strong{font-size:20px!important}
 .learning-coach-row-v465 b{font-size:10.8px}
 .study-coach-card-v465 .anki-v29{padding:10px!important}
}
@media(max-width:340px){.study-coach-card-v465{grid-template-columns:1fr}.study-coach-card-v465 .learning-coach-v465{border-bottom:1px solid var(--border)}.study-coach-card-v465 .anki-v29{border-left:0}}
/* Routine Suite 4.8.0 · AI Memory and Sensei */
.home-metrics{max-width:66.666%;margin-left:auto;margin-right:auto}
.study-coach-card-v465{grid-template-columns:minmax(0,40%) minmax(0,60%)}
.study-coach-card-v465 .learning-coach-v465{gap:5px}
.learning-coach-head-v465{margin-bottom:2px!important}
.learning-coach-row-v465{gap:1px;margin-top:2px}
.sensei-report-v480{margin:0 16px 28px;border:1px solid var(--border);border-radius:var(--radius-card,24px);background:var(--card);overflow:hidden}
.sensei-report-v480>header{display:flex;justify-content:space-between;gap:16px;align-items:end;padding:22px;border-bottom:1px solid var(--border)}
.sensei-report-v480>header small,.sensei-memory-v480 small{font-size:10px;letter-spacing:.16em;color:var(--accent);font-weight:700}.sensei-report-v480 h2{margin:5px 0 0;font-size:22px;line-height:1.3}.sensei-report-v480>header>strong{font-size:38px;line-height:1;font-weight:520;color:var(--accent)}.sensei-report-v480>header>strong small{font-size:12px;margin-left:2px}
.sensei-signal-grid-v480{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 22px;gap:0}.sensei-signal-grid-v480 article{display:grid;gap:5px;padding:4px 16px;border-left:1px solid var(--border)}.sensei-signal-grid-v480 article:first-child{border-left:0;padding-left:0}.sensei-signal-grid-v480 article:last-child{padding-right:0}.sensei-signal-grid-v480 small{font-size:10px;color:var(--muted)}.sensei-signal-grid-v480 b{font-size:17px;font-weight:610}.sensei-signal-grid-v480 span{font-size:11px;color:var(--muted);line-height:1.45}.sensei-signal-grid-v480 .positive b{color:var(--success)}
.sensei-memory-v480{margin:0 22px 18px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));border-radius:18px;background:color-mix(in srgb,var(--accent) 5%,var(--card));display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center}.sensei-memory-v480 h3{margin:4px 0;font-size:16px}.sensei-memory-v480 p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}.sensei-memory-v480 button{border:0;background:none;color:var(--accent);font-weight:650}.sensei-report-v480>footer{display:flex;gap:8px;align-items:center;padding:13px 22px;border-top:1px solid var(--border);font-size:10px;color:var(--muted)}.sensei-report-v480>footer b{color:var(--text);font-weight:600}.sensei-report-v480>footer small{margin-left:auto}
@media(max-width:390px){.home-metrics{max-width:72%}.study-coach-card-v465{grid-template-columns:minmax(0,42%) minmax(0,58%)}.sensei-signal-grid-v480{grid-template-columns:1fr}.sensei-signal-grid-v480 article{border-left:0;border-top:1px solid var(--border);padding:12px 0}.sensei-signal-grid-v480 article:first-child{border-top:0}.sensei-memory-v480{grid-template-columns:1fr}.sensei-report-v480>footer{flex-wrap:wrap}.sensei-report-v480>footer small{margin-left:0;width:100%}}
/* Routine Suite 4.8.5 · vertical metric compression and evidence-first Sensei */
.home-metrics{max-width:none!important;width:100%!important;margin-left:0!important;margin-right:0!important;align-items:stretch!important}
.home-metric{min-height:0!important;height:auto!important;padding:9px 10px 8px!important;border-radius:20px!important}
.home-metric>b{font-size:17px!important;line-height:1!important;font-weight:460!important}
.home-metric>span:not(.metric-dots){margin-top:3px!important;font-size:11px!important;line-height:1.1!important}
.home-metric .metric-dots{margin-top:5px!important;transform:scale(.84)!important}
.sensei-evidence-v485{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 22px 14px}
.sensei-evidence-v485 article{min-width:0;padding:12px;border:1px solid var(--border);border-radius:15px;background:color-mix(in srgb,var(--card) 92%,var(--accent) 8%)}
.sensei-evidence-v485 small,.sensei-action-v485 small{display:block;color:var(--muted);font-size:10px}.sensei-evidence-v485 b{display:block;margin-top:4px;font-size:13px;font-weight:610}.sensei-evidence-v485 span{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.4}
.sensei-action-v485{margin:0 22px 16px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--accent) 6%,var(--card));display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text);text-align:left;width:calc(100% - 44px)}
.sensei-action-v485 b{display:block;margin-top:3px;font-size:13px}.sensei-action-v485 strong{color:var(--accent);font-size:11px;white-space:nowrap}
.sensei-diagnostics-v485{display:flex;flex-wrap:wrap;gap:5px 10px;padding:11px 22px;border-top:1px solid var(--border);font-size:10px;color:var(--muted)}.sensei-diagnostics-v485 b{color:var(--text);font-weight:590}
@media(max-width:390px){.home-metric{padding:8px 7px 7px!important;border-radius:18px!important}.home-metric>b{font-size:16px!important}.sensei-evidence-v485{grid-template-columns:1fr;margin:0 16px 12px}.sensei-action-v485{margin:0 16px 14px;width:calc(100% - 32px)}}

/* Routine Suite 5.2.1 · wider evidence surfaces and bottom-attached review controls */
.study-coach-card-v465{grid-template-columns:minmax(0,48%) minmax(0,52%)}
.study-coach-card-v465 .learning-coach-v465{gap:10px!important}
.learning-coach-row-v465{grid-template-columns:auto minmax(0,1fr)!important;align-items:baseline;gap:8px!important;margin-top:0!important}
.learning-coach-row-v465 small,.learning-coach-row-v465 b{white-space:nowrap!important}
.learning-coach-row-v465 b{display:block!important;overflow:hidden;text-overflow:ellipsis}
.learning-coach-v520>footer{min-width:0;white-space:nowrap}
.learning-coach-v520>footer span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.learning-coach-v520>footer b{flex:0 0 auto;white-space:nowrap}

.sensei-report-v480{margin:0 0 28px!important}
.sensei-weekly-evidence-v520,.sensei-weekly-report-v520,.sensei-weekly-empty-v520{margin-left:12px;margin-right:12px}
.sensei-primary-actions-v520,.sensei-memory-v480{margin-left:12px;margin-right:12px}
.jlpt-mock-hero-v520,.jlpt-mock-start-v520,.jlpt-weekly-snapshot-v520,.jlpt-mock-question-v520,.jlpt-score-grid-v520,.compound-quiz-launch-v520{margin-left:0;margin-right:0}

.flashcard.deck-review .review-prompt-v462 .front,
.flashcard.deck-review .review-answer-v462 .answer{font-size:clamp(20px,5.7vw,25px)!important;font-weight:520!important}
.grade-grid-v350 .grammar-grade{min-width:0;min-height:58px;height:auto;padding:7px 3px;border:1px solid color-mix(in srgb,currentColor 28%,var(--border));background:color-mix(in srgb,currentColor 8%,var(--card-solid));font-weight:500}
.grade-grid-v350 .grammar-grade b{display:block;font-size:11px;color:currentColor}
.grade-grid-v350 .grammar-grade small{display:block;margin-top:3px;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grade-grid-v350 .grammar-grade.again{color:var(--danger)}
.grade-grid-v350 .grammar-grade.hard{color:var(--warning)}
.grade-grid-v350 .grammar-grade.good{color:var(--accent)}
.grade-grid-v350 .grammar-grade.easy{color:var(--success)}

.deck-review + .grade-grid{left:var(--space-3);right:var(--space-3);bottom:calc(var(--space-2) + env(safe-area-inset-bottom));max-width:760px;padding:var(--space-2);border-radius:var(--radius-card)}
/* Every dock anchors at bottom:0 and clears the home indicator with padding, not with a gap
   above it. These were written as :where(), which has zero specificity, so earlier
   `bottom:calc(Npx + env(safe-area-inset-bottom))!important` class rules in responsive.css and
   merged-uiux-v350 outranked them and left the docks floating ~8-12px above the safe area.
   Plain class selectors here tie on specificity and win on order, so the intent actually lands. */
.sticky-action,.bottom-action-dock,.dialogue-answer-dock,.talk-composer,.grammar-rating-dock,
.grade-grid,.grade-grid-v298,.grade-grid-v299,.grade-grid-v350,.vocab-actions-v4113,
.review-bottom-actions-v430,.result-next-actions-v4110,.learning-result-next-v4110,
#pronunciationView #recordingActions{bottom:calc(var(--space-2) + env(safe-area-inset-bottom))!important;left:var(--space-3)!important;right:var(--space-3)!important;border-radius:var(--radius-card)!important;padding-bottom:var(--space-2)!important}
.floating-toolbar-v27{bottom:calc(var(--space-2) + env(safe-area-inset-bottom))!important;left:var(--space-3)!important;right:var(--space-3)!important;border-radius:var(--radius-card)!important;padding-bottom:var(--space-2)!important}

@media(max-width:390px){
  .study-coach-card-v465{grid-template-columns:minmax(0,48%) minmax(0,52%)}
  .study-coach-card-v465 .learning-coach-v465{padding:13px 11px!important}
  .learning-coach-row-v465{gap:6px!important}
  .learning-coach-row-v465 small{font-size:10px!important}
  .learning-coach-row-v465 b{font-size:10.5px!important}
  .sensei-weekly-evidence-v520,.sensei-weekly-report-v520,.sensei-weekly-empty-v520,.sensei-primary-actions-v520,.sensei-memory-v480{margin-left:8px;margin-right:8px}
}
@media(max-width:340px){
  .study-coach-card-v465{grid-template-columns:1fr}
  .study-coach-card-v465 .learning-coach-v465{border-bottom:1px solid var(--border)}
  .study-coach-card-v465 .anki-v29{border-left:0!important}
}

/* Routine Suite 5.3.0 · evidence-first coach and shared settings layout contract */
.study-coach-card-v465{grid-template-columns:minmax(0,52%) minmax(0,48%)}
.learning-coach-score-v530{display:grid!important;justify-items:end;gap:2px;flex:0 0 auto}
.learning-coach-score-v530>strong{font-size:23px;line-height:.9;font-weight:500;color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.05em}
.learning-coach-score-v530>strong small{margin-left:2px;font-size:10px;font-weight:560}
.learning-coach-score-v530>em{color:var(--muted);font-size:10px;font-style:normal;font-weight:560;white-space:nowrap}
.learning-coach-signals-v530{display:grid;gap:8px;min-width:0}
.learning-coach-v520>footer{margin-top:auto!important}

@media(min-width:600px){
  .learning-coach-signals-v530{grid-template-columns:repeat(2,minmax(0,1fr))}
  .learning-coach-signals-v530 .learning-coach-row-v465{grid-template-columns:minmax(0,1fr)!important;align-content:start;gap:4px!important;padding:10px;border:1px solid color-mix(in srgb,var(--border) 76%,transparent);border-radius:13px;background:color-mix(in srgb,var(--accent) 4%,var(--card))}
  .learning-coach-signals-v530 .learning-coach-row-v465 small,.learning-coach-signals-v530 .learning-coach-row-v465 b{white-space:normal!important}
  .settings-index-v4116:not(.hidden){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
  .settings-index-v4116>:not(.settings-category-v21){grid-column:1/-1}
  .settings-index-v4116>.settings-category-v21{min-width:0}
  .ui-style-grid-v27{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:390px){
  .study-coach-card-v465{grid-template-columns:minmax(0,52%) minmax(0,48%)}
}
@media(max-width:340px){
  .study-coach-card-v465{grid-template-columns:1fr}
}

/* Routine Suite 5.5.0 · coach 45:55, third coach signal, compact PWA speaking cards */
.study-coach-card-v465{grid-template-columns:minmax(0,45%) minmax(0,55%)!important}
/* The coach column is narrower than 5.3.0's 52%, so the third signal must not force the
   two existing rows to wrap. Rows stay label-then-value on one line. */
.learning-coach-signals-v530{gap:7px}
.learning-coach-row-v465.rhythm b{font-variant-numeric:tabular-nums}

@media(min-width:600px){
  /* Two evidence columns as in 5.3.0; the rhythm row reads as a summary under them. */
  .learning-coach-signals-v530 .learning-coach-row-v465.rhythm{grid-column:1/-1}
}
@media(max-width:390px){
  .study-coach-card-v465{grid-template-columns:minmax(0,45%) minmax(0,55%)!important}
  .learning-coach-signals-v530{gap:6px}
}
@media(max-width:340px){
  .study-coach-card-v465{grid-template-columns:1fr!important}
}

/* PWA 오늘의 발화: each 2x2 card is 15% shorter, with padding and row gap tightened to
   match so the height comes out of empty space rather than the text block. */
.speaking-launch-card-v451{min-height:121px!important;padding:var(--space-3)!important;gap:9px 10px!important}
.speaking-launch-card-v451 small{margin-top:4px!important}
.speaking-launch-grid-v451{gap:9px!important}
@media(max-width:370px){
  .speaking-launch-card-v451{min-height:112px!important;padding:11px!important;gap:8px 9px!important}
  .speaking-launch-grid-v451{gap:8px!important}
}
@media(max-width:330px){
  .speaking-launch-card-v451{min-height:92px!important}
}

/* Routine Suite 5.6 · 백그라운드 AI 작업 트레이와 대기 화면 내리기 */
.loading-background-v56{width:100%;margin-top:12px;min-height:44px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--line,var(--border)) 88%,transparent);border-radius:14px;background:transparent;color:var(--muted);font-size:12.5px;font-weight:600}
.loading-background-v56:active{transform:translateY(1px)}
.loading-overlay.failed .loading-background-v56{display:none}
.ai-task-tray-v56{position:fixed;left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom) + 74px);z-index:40}
.ai-task-tray-v56.hidden{display:none}
.ai-task-tray-v56>button,.ai-task-choices-v573>button{width:100%;min-height:48px;display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line,var(--border)));border-radius:16px;background:color-mix(in srgb,var(--accent) 8%,var(--panel,var(--card)));color:var(--text);text-align:left;box-shadow:0 8px 22px color-mix(in srgb,#000 14%,transparent)}
.ai-task-choices-v573,.bg-tray-choices-v573{display:grid;gap:6px;max-height:min(52vh,320px);overflow:auto;padding:8px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line,var(--border)));border-radius:18px;background:color-mix(in srgb,var(--panel,var(--card-solid)) 96%,transparent);box-shadow:0 10px 28px color-mix(in srgb,#000 18%,transparent)}
.ai-task-choices-v573>small,.bg-tray-choices-v573>small{padding:2px 6px 4px;color:var(--muted);font-size:11px;font-weight:650}
.ai-task-tray-v56 b{flex:1;min-width:0;font-size:12.5px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-task-tray-v56 strong{color:var(--accent);font-size:12px;white-space:nowrap}
.ai-task-dot-v56{width:9px;height:9px;border-radius:50%;flex:0 0 auto;background:var(--accent);animation:aiTaskPulseV56 1.4s ease-in-out infinite}
.ai-task-dot-v56.ready{background:var(--success,#30a14e);animation:none}
@keyframes aiTaskPulseV56{0%,100%{opacity:.35}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.ai-task-dot-v56{animation:none}}

/* Routine Suite 5.6.2 · 쉐도잉 카드 하단 액션이 아이콘 열로 떨어지던 문제
   .shadow-card.advanced는 27px + 1fr 2열 그리드인데 자식이 4개다. 3번째인 액션 묶음이
   두 번째 줄의 27px 열에 배치돼 "5단계 훈련"이 한 글자씩 세로로 접히고 "연습 완료"가
   가려졌다. 아래 두 블록은 카드 전체 폭을 쓴다. */
.shadow-card.advanced>.shadow-primary-actions-v504,
.shadow-card.advanced>.shadow-tools-v504{grid-column:1/-1}

/* Routine Suite 5.6.4 · Routine.js 대기 화면 내려두기·백그라운드 트레이
   5.6.3에서는 learning-components.css(18개 레이어 중 4번째)에 넣어 뒤 레이어의 일반 버튼
   규칙에 덮였다. 캐스케이드 마지막인 이 파일이 제자리다. */
.busy-card-v31 .busy-background-v563{
  width:100%;margin:12px 0 0;min-height:44px;padding:var(--space-3) var(--space-4);
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:var(--radius-compact);
  background:color-mix(in srgb,var(--accent) 6%,transparent);color:var(--accent);
  font-size:calc(12.5px * var(--font-scale));font-weight:650;letter-spacing:-.01em;
  text-align:center;display:block;box-shadow:none;-webkit-appearance:none;appearance:none
}
.busy-card-v31 .busy-background-v563:active{transform:translateY(1px);background:color-mix(in srgb,var(--accent) 11%,transparent)}
.busy-card-v31.failed .busy-background-v563{display:none}
/* 실패 시에는 닫기·다시 시도만 남는다 */
.busy-card-v31 .busy-actions-v32{margin-top:8px}

.bg-tray-v563{position:fixed;left:12px;right:12px;z-index:130;display:none}
/* 5.7 · Routine.js에는 화면마다 하단 액션 독(문형 평가·대화 답안·공용 액션)이 있고
   높이가 60~70px다. 트레이를 낮게 두면 그 버튼들을 덮는다. 기본값을 독 위로 두고,
   독이 없는 화면에서만 내린다. :has()를 못 쓰는 환경에서는 높은 쪽이 유지되므로
   겹치는 일은 생기지 않는다. */
.bg-tray-v563{bottom:calc(env(safe-area-inset-bottom) + 92px)}
body:not(:has(.grammar-rating-dock,.dialogue-answer-dock,.bottom-action-dock,.floating-toolbar-v27)) .bg-tray-v563{bottom:calc(env(safe-area-inset-bottom) + 16px)}
.bg-tray-v563.show{display:block}
.bg-tray-v563>button{
  width:100%;min-height:50px;display:flex;align-items:center;gap:10px;padding:12px 15px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));border-radius:16px;
  background:color-mix(in srgb,var(--accent) 9%,var(--card-solid));color:var(--text);
  text-align:left;box-shadow:0 10px 26px rgba(0,0,0,.26);-webkit-appearance:none;appearance:none
}
.bg-tray-choices-v573>button{width:100%;min-height:48px;display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--accent) 26%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent) 8%,var(--card-solid));color:var(--text);text-align:left;-webkit-appearance:none;appearance:none}
.bg-tray-v563>button:active{transform:translateY(1px)}
.bg-tray-v563 b{flex:1;min-width:0;font-size:calc(12.5px * var(--font-scale));font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bg-tray-v563 strong{color:var(--accent);font-size:calc(12px * var(--font-scale));font-weight:700;white-space:nowrap}
.bg-tray-v563 .bg-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;background:var(--accent);animation:bgPulseV563 1.4s ease-in-out infinite}
.bg-tray-v563 .bg-dot.ready{background:var(--success);animation:none}
@keyframes bgPulseV563{0%,100%{opacity:.35}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.bg-tray-v563 .bg-dot{animation:none}}

/* Routine Suite 5.6.5 · 기기에서 보고된 세 가지 표시 문제 */

/* ① 컬러 팔레트. .theme-palette-grid는 PWA 전용 레이어에만 있었고 스와치·버튼 규칙은
   어느 쪽에도 없었다. Routine.js에서는 규칙이 하나도 닿지 않아 색은 보이지 않고 라벨만
   검은 상자로 늘어섰다. 두 클라이언트가 같은 규칙을 쓰도록 공용 마지막 레이어에 둔다. */
.theme-palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding-top:4px}
.theme-palette-choice{
  min-width:0;display:grid;gap:8px;padding:11px 12px;
  border:1px solid var(--border,var(--line));border-radius:15px;
  background:var(--card-solid,var(--panel));color:var(--text);text-align:left;
  -webkit-appearance:none;appearance:none
}
.theme-palette-choice>b{display:block;font-size:calc(12px * var(--font-scale,1));font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.theme-palette-swatches{display:flex;gap:4px;align-items:center}
.theme-palette-swatches>i{flex:1 1 0;min-width:0;height:22px;border-radius:6px;display:block;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}

/* Routine Suite 5.10.0 · quiet-precision detail, correction and evaluation contract */
:root{
  --learning-radius-card:18px;
  --learning-radius-item:14px;
  --learning-radius-control:12px;
  --learning-space-1:4px;
  --learning-space-2:8px;
  --learning-space-3:12px;
  --learning-space-4:16px;
  --learning-space-5:24px;
  --learning-space-6:32px;
  --learning-measure:34em;
}
.learning-detail-v510{display:grid;gap:var(--learning-space-4);min-width:0;margin-inline:auto;max-width:760px}
.learning-detail-v510 :where(h2,h3,p){margin-block-start:0}
.learning-evaluation-header-v510{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:start;padding:18px 0 20px;border-bottom:1px solid var(--border,var(--line))}
.learning-evaluation-header-v510>div:last-child{min-width:0}
.learning-evaluation-header-v510 h2{margin:4px 0 6px;font-size:clamp(18px,4.9vw,22px);font-weight:600;line-height:1.38;letter-spacing:-.025em;text-wrap:balance}
.learning-evaluation-header-v510 p:last-child{margin:0;max-width:var(--learning-measure);color:var(--muted);font-size:14px;line-height:1.6}
.learning-kicker-v510{margin:0;color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.02em}
.learning-score-v510{min-width:58px;padding:10px 9px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border,var(--line)));border-radius:14px;background:color-mix(in srgb,var(--accent) 6%,var(--card-solid,var(--panel)));text-align:center;font-variant-numeric:tabular-nums}
.learning-score-v510 b{display:block;font-size:24px;font-weight:600;line-height:1;color:var(--text)}
.learning-score-v510 small{display:block;margin-top:5px;color:var(--muted);font-size:10px;font-weight:500}
.learning-outcome-v510{display:grid;gap:8px;padding:16px 0;border-bottom:1px solid var(--border,var(--line))}
.learning-outcome-v510 h3,.learning-section-v510>h3{margin:0;font-size:15px;font-weight:600;letter-spacing:-.015em}
.learning-outcome-v510 p{position:relative;margin:0;padding-left:14px;color:var(--text);font-size:14px;line-height:1.6}
.learning-outcome-v510 p::before{content:'·';position:absolute;left:1px;color:var(--accent);font-weight:600}
.learning-outcome-v510.positive h3{color:var(--text)}
.learning-outcome-v510.focus h3{color:var(--accent)}
.learning-section-v510{display:grid;gap:10px;padding-top:4px}
.learning-correction-stack-v510{display:grid;gap:0!important;padding:0!important;overflow:hidden;border:1px solid var(--border,var(--line))!important;border-radius:var(--learning-radius-card)!important;background:var(--card-solid,var(--panel))!important;box-shadow:none!important}
.learning-correction-stack-v510>div{display:grid;gap:7px;padding:14px 15px;border:0!important;border-bottom:1px solid var(--border,var(--line))!important;border-radius:0!important;background:transparent!important}
.learning-correction-stack-v510>div:last-child{border-bottom:0!important}
.learning-correction-stack-v510 small{display:block;margin:0;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.01em}
.learning-correction-stack-v510 :where(p,strong){margin:0;color:var(--text);font-size:16px;font-weight:450;line-height:1.68;letter-spacing:-.012em;word-break:break-word}
.learning-correction-stack-v510 .corrected{background:color-mix(in srgb,var(--accent) 4%,transparent)!important}
.learning-correction-stack-v510 .native{background:color-mix(in srgb,var(--accent) 6%,transparent)!important}
.learning-correction-stack-v510 .meaning :where(p,strong){color:var(--muted);font-size:14px;line-height:1.55}
.learning-diff-v510{display:block;margin:0!important;color:var(--text)!important;font-size:16px;font-weight:450;line-height:1.68;letter-spacing:-.012em;word-break:break-word}
.learning-diff-v510 del{margin-right:1px;color:var(--danger);font-weight:400;text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:currentColor}
.learning-diff-v510 ins{margin-right:1px;color:var(--success);font-weight:400;text-decoration:none;border-bottom:1.5px solid currentColor}
.learning-action-row-v510{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:8px;padding-top:4px}
.learning-action-row-v510 :where(button,.btn){min-height:44px;margin:0}
.learning-correction-card-v510{overflow:hidden;box-shadow:none!important}
.learning-correction-card-v510>.correction-body{gap:0!important;padding:0!important}
.learning-correction-card-v510 .correction-line{border-width:0 0 1px!important;border-radius:0!important}
.learning-correction-card-v510 .correction-line:last-of-type{border-bottom:0!important}
.learning-correction-card-v510 .correction-line.original{background:transparent!important;border-color:var(--border,var(--line))!important}
.learning-correction-card-v510 .correction-line.corrected{border-left:0!important;background:color-mix(in srgb,var(--accent) 4%,var(--card-solid,var(--panel)))!important}
.learning-correction-card-v510 .correction-line.natural{border-left:0!important;background:color-mix(in srgb,var(--accent) 6%,var(--card-solid,var(--panel)))!important}
.learning-evaluation-v510 .retelling-metrics-v351{border:1px solid var(--border,var(--line));border-radius:var(--learning-radius-item);overflow:hidden;background:transparent}
.learning-evaluation-v510 .retelling-metrics-v351>div{border-left:1px solid var(--border,var(--line));border-radius:0;background:transparent}
.learning-evaluation-v510 .retelling-metrics-v351>div:first-child{border-left:0}
.learning-evaluation-v510 .retelling-metrics-v351 b{font-weight:600}
.learning-evaluation-v510 .metric-note-v351{margin:-6px 2px 0;color:var(--muted);font-size:11px;line-height:1.55}
.learning-evaluation-v510 .correction-summary-v2910{margin:0;padding:14px 0;border-width:0 0 1px;border-radius:0;background:transparent}
.learning-evaluation-v510 .diary-compact-review-v303,.learning-evaluation-v510 .diary-native-once-v303{margin:0;box-shadow:none!important}
.learning-evaluation-v510 .learning-native-v510{border-color:color-mix(in srgb,var(--accent) 22%,var(--border,var(--line)));background:color-mix(in srgb,var(--accent) 5%,var(--card-solid,var(--panel)))}
.learning-evaluation-v510 .sensei-summary-v39{box-shadow:none!important}
.learning-evaluation-v510 .reverse-result-grid-v303{gap:14px}
.learning-evaluation-v510 .reverse-result-card-v352>div:first-child{padding-bottom:10px;border-bottom:1px solid var(--border,var(--line))}
.learning-review-v510{box-shadow:none!important}
.learning-review-v510 .review-task-v350{padding-bottom:13px;border-bottom:1px solid var(--border,var(--line))}
.learning-review-v510 :where(.review-prompt-v462,.review-answer-v462,.review-reason-v462){padding-inline:0}
.learning-review-v510 .review-answer-v462{border-top:1px solid var(--border,var(--line))}
html[data-theme="dark"] .learning-detail-v510 :where(.learning-correction-stack-v510,.learning-score-v510,.learning-correction-card-v510){background:var(--surface-solid)!important}
html[data-ui-style="liquid"] .learning-detail-v510 .learning-correction-stack-v510{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card-solid,var(--panel))!important}
@media(max-width:430px){
  .learning-detail-v510{gap:14px}
  .learning-evaluation-header-v510{grid-template-columns:54px minmax(0,1fr);gap:12px;padding:14px 0 17px}
  .learning-score-v510{min-width:0;padding:9px 6px;border-radius:12px}
  .learning-score-v510 b{font-size:21px}
  .learning-evaluation-header-v510 h2{font-size:19px}
  .learning-evaluation-header-v510 p:last-child{font-size:13px}
  .learning-correction-stack-v510>div{padding:13px}
  .learning-correction-stack-v510 :where(p,strong),.learning-diff-v510{font-size:15px!important}
  .learning-evaluation-v510 .retelling-metrics-v351{grid-template-columns:repeat(5,minmax(0,1fr))}
  .learning-evaluation-v510 .retelling-metrics-v351>div{min-width:0;padding:10px 3px}
  .learning-evaluation-v510 .retelling-metrics-v351 small{font-size:10px}
  .learning-evaluation-v510 .retelling-metrics-v351 b{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.learning-detail-v510 *{scroll-behavior:auto!important}}
.theme-palette-choice.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--card-solid,var(--panel)))}
.theme-palette-choice.active>b{color:var(--accent)}
.theme-palette-choice:active{transform:translateY(1px)}
@media(max-width:330px){.theme-palette-grid{grid-template-columns:1fr}}

/* ② 큰 터치를 켜면 shared-final-v4119의 min-height:48px가 input까지 걸려, 46×28 알약
   토글이 46×48 원이 되고 흰 손잡이 그라디언트가 어긋나 빈 원으로 보였다. 토글은 이미
   56px 이상인 행(label) 안에 있어 터치 영역은 충분하므로 설계 크기를 지킨다. */
html[data-large-touch="true"] :where(.toggle-line,.switch) input[type="checkbox"]{min-height:28px;height:28px}

/* ③ 다시 말하기: 본문 일본어는 최대 28px인데 읽기(가나)는 14px 고정이라 정확히 절반이었다.
   읽기는 보조 표기일 뿐 다른 글이 아니므로 간격을 좁힌다. */
.retelling-reading-v351{font-size:clamp(15px,3.9vw,18px);line-height:1.72}

/* 5.7.1 · 큰 터치의 48px 버튼 높이와 방문 지도의 19~23px 고정 행이 충돌하면
   한 현의 카드가 다음 현 위를 덮는다. 터치 크기를 줄이지 않고 행도 함께 확장한다. */
html[data-large-touch="true"] .japan-map-v27{
  grid-template-rows:repeat(14,48px)!important;
  max-height:none!important;
}
html[data-large-touch="true"] .japan-map-v27 .pref-tile{
  min-height:48px!important;
  height:48px!important;
}

/* 5.7.4 · 홈의 「이번 주 학습」에서 AI 학습 코치 열을 걷어내고 Anki가 카드 폭을 전부 쓴다.
   패널이 2개에서 3개로 늘어도 카드 폭이 두 배 가까이 넓어져 패널 하나는 오히려 넓어진다.
   코치 열이 정하던 카드 높이가 사라지므로 패널 최소 높이로 세로폭을 유지한다. */
.study-anki-card-v574{
  display:grid!important;
  grid-template-columns:1fr!important;
  align-items:stretch!important;
}
.study-anki-card-v574 .anki-v29{
  align-self:stretch!important;
  border-left:0!important;
  padding:var(--space-4) var(--space-4) var(--space-3)!important;
  gap:11px!important;
}
.study-anki-card-v574 .anki-v29-head>b{font-size:var(--fs-18)}
.anki-v29-primary-triple{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.study-anki-card-v574 .anki-v29-primary,
.study-anki-card-v574 .anki-v29-panel{min-height:134px!important}
.study-anki-card-v574 .anki-v29-panel{padding:var(--space-3) var(--space-3) var(--space-3)}
/* 패널이 넓어진 만큼 라벨과 숫자를 읽기 쉬운 크기로 올린다. */
.study-anki-card-v574 .anki-v29-label{font-size:10px;letter-spacing:-.01em}
/* 숫자와 예습·복습·시간 사이 간격은 margin이 아니라 min-height가 정한다.
   .anki-v29-details가 margin-top:auto라 패널의 남는 높이를 전부 흡수하기 때문이다.
   간격을 실제로 줄이려면 auto를 걷고 값을 직접 주어야 한다. */
/* 5.8.0: 카드 세로를 약 10% 줄여 오늘 화면이 한 화면에 더 들어오게 한다.
   줄인 곳은 패딩 3px · 숫자 위아래 여백 8px로, 글자 크기는 그대로 둔다. */
.study-anki-card-v574 .anki-v29-panel{min-height:99px;padding:var(--space-2) var(--space-3) var(--space-2)!important}
/* 예습·복습·시간 묶음은 카드 아래쪽에 붙는다. margin-top:auto가 남는 높이를 흡수해
   숫자 바로 밑이 아니라 바닥 가까이 놓인다. 5.7.9에서 0으로 막았던 것을 되돌린다. */
.study-anki-card-v574 .anki-v29-details{margin-top:auto!important;gap:2px!important}
.study-anki-card-v574 .anki-v29-total{margin:4px 0 9px!important}
.study-anki-card-v574 .anki-v29-total>span{font-size:25.1px!important}
/* 라벨과 숫자를 10%씩 키운다. 6.2 → 6.8 / 8.6 → 9.5 / 6.4 → 7.0 */
.study-anki-card-v574 .anki-v29-detail{font-size:10px!important}
.study-anki-card-v574 .anki-v29-detail>small{font-size:10px}
.study-anki-card-v574 .anki-v29-detail>b{font-size:10px}
.study-anki-card-v574 .anki-v29-detail>b>em{font-size:10px}
.study-anki-card-v574 .anki-v29-total>em{font-size:10px}
.study-anki-card-v574 .anki-v29-foot{font-size:10px;padding-top:2px!important}
/* JLPT와 日本語는 같은 지표라 테두리 강조 대신 라벨 색으로만 구분한다. */
.anki-v29-panel.deck-jlpt .anki-v29-label{color:color-mix(in srgb,var(--accent) 72%,var(--muted))}
.anki-v29-panel.deck-nihongo .anki-v29-label{color:color-mix(in srgb,var(--text) 46%,var(--muted))}
@media(max-width:390px){
  .study-anki-card-v574 .anki-v29{padding:13px 11px 11px!important}
  .study-anki-card-v574 .anki-v29-panel{padding:10px 8px 9px}
  .anki-v29-primary-triple{gap:6px!important}
  .study-anki-card-v574 .anki-v29-total>span{font-size:21.1px!important}
  .study-anki-card-v574 .anki-v29-total{margin:7px 0 13px}
  .study-anki-card-v574 .anki-v29-label{font-size:10px!important}
  .study-anki-card-v574 .anki-v29-primary,
  .study-anki-card-v574 .anki-v29-panel{min-height:94px!important;padding:8px 8px 8px!important}
  .study-anki-card-v574 .anki-v29-total{margin:4px 0 8px!important}
}
/* 아주 좁은 화면에서는 3열이 숫자를 자르므로 대기 한 줄 + 완료 두 열로 접는다. */
@media(max-width:330px){
  .anki-v29-primary-triple{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .anki-v29-primary-triple>.pending{grid-column:1/-1}
  .study-anki-card-v574 .anki-v29-primary{min-height:0!important}
}

/* 5.7.5 · 방문 지도 타일이 아래 칸을 덮던 문제.
   foundation-v415의 전역 컨트롤 하한(button 44px)이 .pref-tile에도 걸리는데 지도 행은 23px이라
   타일마다 21px씩 넘쳐 이웃 칸을 가렸다. 지도는 칸의 위치 자체가 도도부현의 방향을 뜻하므로
   타일을 키우는 대신 행 높이에 정확히 맞춘다. 큰 터치(48px 행)에서도 100%가 그대로 48px이 된다. */
.japan-map-v27 .pref-tile{min-height:0!important;height:100%!important}

/* 5.8.3 — 설정 행 타이포는 두 앱이 같은 식을 쓴다.
   그동안 어긋난 이유: 양쪽 모두 `.settings-index-v4116 ... {12.5px!important}`를 갖고 있는데
   Routine.js에서는 5.8.1에 넣은 규칙이 순서로 이겨 14px, PWA에서는 그 규칙에 져서 12.5px가
   됐다. 실측 14 : 12.5 = 1.12로, 사용자가 「Routine.js 88%가 PWA 100% 같다」고 본 그 값이다.
   5.8.2에서 PWA도 --font-scale을 갖게 되어 이제 한 식으로 통일할 수 있다.
   명시도는 위 12.5px 규칙(0,2,1 / 0,2,2)을 넘겨야 한다. */
#settingsView .settings-menu-v21 .menu-row strong,
.settings-index-v4116 .settings-menu-row-v578>span:nth-child(2)>b{
  font-size:calc(13px * var(--font-scale));
  font-weight:600;
}
#settingsView .settings-menu-v21 .menu-row small,
.settings-index-v4116 .settings-menu-row-v578>span:nth-child(2)>small{
  font-size:calc(10px * var(--font-scale));
  line-height:1.38!important;
}
#settingsView .settings-menu-v21 .menu-glyph,
.settings-index-v4116 .settings-menu-row-v578 .menu-glyph{
  font-size:calc(14px * var(--font-scale))!important;
  font-weight:600!important;
}

/* 5.8.4 — 공유 컴포넌트 타이포를 PWA 기준선(14px)으로 통일한다.
   바이블 「What the two clients MAY legitimately differ on」에 따라 상단바와 하단 탭 같은
   navigation shell은 제외한다. 두 앱의 셸은 원래 다른 물건이다.
   값은 --font-scale을 물려 두 앱이 모든 배율에서 함께 움직인다. */
.btn{font-size:calc(14px * var(--font-scale))}
.chip{font-size:calc(10px * var(--font-scale))}
.empty{font-size:calc(14px * var(--font-scale))!important}
.note{font-size:calc(14px * var(--font-scale))}
.option-card{font-size:calc(14px * var(--font-scale))!important}
.option-card>b{font-size:calc(14px * var(--font-scale))}
.option-card>small{font-size:calc(11.5px * var(--font-scale))}
.setting-title{font-size:calc(12px * var(--font-scale))}

/* 5.8.7 — 오늘 화면 Anki 카드의 글자를 바이블의 10px 바닥 위로 올린다.
   「Avoid micro text below 10px for meaningful information」. 예습·복습·시간은 장식이
   아니라 숫자의 뜻을 알려주는 라벨이고, 6.8px은 읽으라고 만든 크기가 아니다.
   5.8.4에서 문서 기준선을 16 → 14px로 내리면서 상대적으로 더 작아지기도 했다.

   카드가 그만큼 높아진다. 5.8.1에서 높이를 10% 줄인 이유는 하단 버전 표시를 띄우기
   위함이었는데 5.8.0에서 버전을 날짜 아래로 옮겼으므로 그 제약은 이미 없다.
   읽히지 않는 라벨보다 카드 몇 px이 낫다. */
.study-anki-card-v574 .anki-v29-label{font-size:calc(10px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-detail>small{font-size:calc(10px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-detail>b{font-size:calc(11.5px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-detail>b>em{font-size:calc(10px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-total>em{font-size:calc(10.5px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-foot{font-size:calc(10px * var(--font-scale))!important}
.study-anki-card-v574 .anki-v29-empty-note{font-size:calc(10px * var(--font-scale))!important}
/* 글자가 커진 만큼 카드도 늘려야 세 줄이 눌리지 않는다. */
.study-anki-card-v574 .anki-v29-panel{min-height:118px!important}
@media(max-width:390px){
  .study-anki-card-v574 .anki-v29-panel{min-height:112px!important}
}

/* Routine Suite 5.11.0 · active learning canvas and bottom action contract */
.learning-session-v511{min-width:0}
.learning-session-v511 :where(input,textarea,select){font-size:max(16px,calc(14px * var(--font-scale,1)))}
.learning-context-v511{margin:0 0 14px!important;padding:14px 0!important;border-width:0 0 1px!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.learning-context-v511 h2{font-size:19px;font-weight:600;line-height:1.38;letter-spacing:-.025em}
.learning-context-v511 p{font-size:13px;line-height:1.58}
.learning-canvas-v511{padding:17px!important;border-color:color-mix(in srgb,var(--accent) 18%,var(--border,var(--line)))!important;background:var(--card-solid,var(--panel))!important;box-shadow:none!important}
.learning-canvas-v511 :where(.quiz-index,.study-input-label-v502){font-size:10px!important;font-weight:500!important;letter-spacing:.01em!important;text-transform:none!important}
.learning-canvas-v511 :where(.quiz-prompt,h3){font-weight:600!important;letter-spacing:-.018em}
.learning-canvas-v511 textarea{min-height:78px;padding:13px 14px;border-radius:12px;line-height:1.6;resize:vertical}
.learning-audio-actions-v511{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(112px,1fr))!important;gap:8px!important;align-items:center}
.learning-audio-actions-v511 :where(button,.btn){min-width:0;min-height:46px;margin:0!important;font-size:13px;font-weight:500}
.learning-action-dock-v511{left:var(--space-3)!important;right:var(--space-3)!important;bottom:calc(var(--space-2) + env(safe-area-inset-bottom))!important;width:min(760px,100%)!important;max-width:760px!important;margin:0 auto!important;padding:var(--space-2) var(--space-3)!important;border:1px solid var(--border,var(--line))!important;border-radius:var(--radius-card)!important;background:color-mix(in srgb,var(--card-solid,var(--panel)) 96%,transparent)!important;box-shadow:0 -10px 28px color-mix(in srgb,#000 14%,transparent)!important;backdrop-filter:blur(18px) saturate(125%)!important;-webkit-backdrop-filter:blur(18px) saturate(125%)!important}
.learning-action-dock-v511 :where(button,.btn){min-height:48px;font-weight:500}
.learning-composer-v511{display:grid;gap:8px}
.learning-composer-v511 .transcript{margin:0!important;padding:0 2px!important;min-height:0!important;font-size:12px!important;line-height:1.45!important}
.learning-composer-v511 .composer-actions{gap:8px!important}
.learning-composer-v511 #scenarioMic{width:64px!important;height:64px!important;box-shadow:none!important}
.learning-composer-v511 #finishScenario{margin-top:0!important;min-height:44px!important}
.learning-composer-v511 .composer-row>.composer-btn:first-child{width:auto;min-width:64px;padding-inline:8px;font-size:11px}
.learning-thread-v511{scroll-padding-bottom:190px}
.learning-thread-v511 :where(.talk-bubble,.dialogue-bubble,.bubble){font-size:16px;line-height:1.68;font-weight:450}
.learning-thread-v511 :where(.speaker-label,.dialogue-name){font-size:10px;font-weight:500;letter-spacing:0}
.learning-record-canvas-v511{padding:18px 15px!important;border:1px solid color-mix(in srgb,var(--accent) 20%,var(--border,var(--line)))!important;border-radius:18px!important;background:var(--card-solid,var(--panel))!important;box-shadow:none!important}
.learning-record-canvas-v511 .mic-button{box-shadow:none!important}
.learning-record-canvas-v511 :where(#recordTimer,#retellingTimer){font-variant-numeric:tabular-nums;font-weight:600}
.learning-tools-v511{margin-bottom:14px!important;padding:12px 0!important;border-width:1px 0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.learning-tools-v511 small{font-size:10px!important;line-height:1.45}
.learning-tools-v511 :where(button,.chip){min-height:44px!important;font-size:11px!important;font-weight:500!important}
.learning-session-card-v511{box-shadow:none!important;transition:border-color var(--motion-tap) var(--v461-ease),background-color var(--motion-tap) var(--v461-ease)!important}
.learning-session-card-v511.is-active{border-color:color-mix(in srgb,var(--accent) 52%,var(--border,var(--line)))!important;background:color-mix(in srgb,var(--accent) 4%,var(--card-solid,var(--panel)))!important;transform:none!important}
.learning-session-card-v511 :where(.shadow-original,[lang="ja"]){font-weight:450}
.learning-session-card-v511 .shadow-practice-head span{font-size:10px!important;font-weight:500!important;letter-spacing:0!important}
.learning-session-v511 .dialogue-play{box-shadow:none}
.learning-session-v511 .dialogue-play>i{width:44px;height:44px}
.learning-session-v511 .dialogue-choice{border-radius:12px;box-shadow:none}
.learning-session-v511 .dialogue-choice b{font-weight:450}
body[data-view="scenarioRoom"]{padding-bottom:calc(214px + env(safe-area-inset-bottom))!important}
body[data-view="scenarioRoom"] .learning-composer-v511{z-index:80}
body.talk-keyboard-open .learning-composer-v511 .talk-controls{margin-bottom:5px}
html[data-theme="dark"] .learning-action-dock-v511{background:color-mix(in srgb,var(--surface-solid) 97%,transparent)!important;border-color:rgba(255,255,255,.14)!important}
html[data-theme="dark"] :where(.learning-record-canvas-v511,.learning-canvas-v511){background:var(--surface-solid)!important}
html[data-ui-style="liquid"] :where(.learning-canvas-v511,.learning-record-canvas-v511){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card-solid,var(--panel))!important}
html[data-reduce-glass="true"] .learning-action-dock-v511{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card-solid,var(--panel))!important}
@media(max-width:430px){
  .learning-canvas-v511{padding:14px!important}
  .learning-context-v511 h2{font-size:18px}
  .learning-action-dock-v511{padding-inline:10px!important}
  .learning-composer-v511 #scenarioMic{width:58px!important;height:58px!important}
  body[data-view="scenarioRoom"]{padding-bottom:calc(202px + env(safe-area-inset-bottom))!important}
  .learning-tools-v511{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .learning-tools-v511>div{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){.learning-session-card-v511{transition:none!important}}

/* Routine Suite 6.0.0 · reading, reference and history visual contract */
.learning-reading-head-v600{
  margin-bottom:14px!important;
  padding:6px 0 17px!important;
  border-width:0 0 1px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learning-reading-head-v600 h1{
  max-width:28em;
  margin-top:8px!important;
  font-family:var(--font-jp-serif,var(--font-ui));
  font-size:clamp(20px,5.4vw,26px)!important;
  font-weight:550!important;
  line-height:1.5!important;
  letter-spacing:-.025em!important;
}
.learning-reading-shell-v600{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.learning-reading-v600{max-width:34em;margin-inline:auto!important}
.learning-reading-canvas-v600{
  padding:clamp(18px,5vw,28px)!important;
  border-color:color-mix(in srgb,var(--text) 11%,var(--border,var(--line)))!important;
  border-radius:16px!important;
  background:var(--card-solid,var(--panel))!important;
  box-shadow:none!important;
}
.learning-reading-v600 :where(p,.news-paragraph){
  max-width:34em;
  margin-inline:auto;
  font-family:var(--font-jp-serif,var(--font-ui));
  font-size:clamp(17px,4.6vw,20px);
  font-weight:450!important;
  line-height:1.94;
  letter-spacing:.005em!important;
  text-wrap:pretty;
}
.learning-reading-v600 ruby rt{font-family:var(--font-ui);font-size:.56em;font-weight:450;letter-spacing:0}
.learning-reading-v600 .reading-translation{
  margin-top:22px!important;
  padding-top:19px!important;
  border-top:1px solid var(--border,var(--line))!important;
}
.learning-reading-v600 .reading-translation :where(h3,p){font-family:var(--font-ui);font-size:14px!important;line-height:1.72!important}
.learning-reading-questions-v600,.learning-reading-translation-v600{max-width:680px;margin-inline:auto}
.learning-reading-question-v600{
  margin-bottom:10px!important;
  padding:16px!important;
  border-radius:14px!important;
  box-shadow:none!important;
}
.learning-reading-question-v600 h3{font-size:16px;line-height:1.65;font-weight:550}
.learning-reading-question-v600 .choice{min-height:48px;border-radius:11px!important;font-size:15px!important;line-height:1.5!important}
.learning-reading-translation-v600>.card{padding:0 16px!important;box-shadow:none!important}
.learning-reading-translation-v600 .translation-row{padding:17px 0!important;border-bottom:1px solid var(--border,var(--line))}
.learning-reading-translation-v600 .translation-row:last-child{border-bottom:0}
.learning-reading-translation-v600 .translation-row p{font-size:16px;line-height:1.72;font-weight:450}
.learning-reading-translation-v600 textarea{min-height:82px;font-size:16px;line-height:1.6!important;border-radius:11px!important;resize:vertical}
.learning-reading-section-v600 .news-study-hint{font-size:11px!important;letter-spacing:0!important}

.learning-reference-v600,.learning-reference-list-v600,.learning-reference-grid-v600{min-width:0}
.learning-reference-tools-v600{
  margin:0 0 13px!important;
  padding:13px 0!important;
  border-width:1px 0!important;
  border-style:solid!important;
  border-color:var(--border,var(--line))!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learning-reference-tools-v600 input[type="search"]{min-height:46px;font-size:16px;border-radius:11px!important}
.learning-reference-list-v600{padding:0 14px!important;box-shadow:none!important}
.learning-reference-row-v600{
  min-height:58px!important;
  padding:12px 2px!important;
  border-width:0 0 1px!important;
  border-color:var(--border,var(--line))!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learning-reference-row-v600:last-child{border-bottom:0!important}
.learning-reference-row-v600 :where(b,.article-title){font-size:14px;font-weight:550;line-height:1.5!important}
.learning-reference-row-v600 :where(small,.article-meta){font-size:11px;line-height:1.5!important}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505){
  margin:0!important;
  padding:0!important;
  border-width:0 0 1px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505)>summary{min-height:64px;padding:12px 2px!important}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505)>summary b{font-size:18px;font-weight:550;line-height:1.45!important}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505)>summary :where(small,em){font-size:11px!important;line-height:1.45!important}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505) :where(.compound-detail-v505,.synonym-word-head~*){max-width:48em}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505) .synonym-example b{font-size:16px!important;line-height:1.72!important;font-weight:450!important}
.learning-reference-grid-v600{display:grid!important;grid-template-columns:1fr!important;gap:0!important}

.learning-history-v600{min-width:0}
.learning-history-summary-v600{
  margin-bottom:12px!important;
  padding:12px 0!important;
  border-width:1px 0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learning-history-summary-v600 small{font-size:10px!important;letter-spacing:0!important;text-transform:none!important}
.learning-history-summary-v600 b{font-size:14px;font-weight:550}
.learning-history-list-v600{display:grid;gap:0!important}
.learning-history-row-v600{
  margin:0!important;
  border-width:0 0 1px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learning-history-row-v600 :where(.recent-main-v22,.record-entry-v463){min-height:64px;padding:12px 2px!important}
.learning-history-row-v600 .kind{width:34px!important;height:34px!important;border-radius:10px!important;font-size:12px!important;font-weight:600!important}
.learning-history-row-v600 :where(.recent-copy-v22 b,header b){font-size:14px;font-weight:550;line-height:1.48!important}
.learning-history-row-v600 :where(.recent-copy-v22 small,footer,header small){font-size:11px;line-height:1.48!important}
.learning-history-row-v600 .recent-main-v22>em{font-size:11px;font-style:normal!important}
.learning-history-group-v600{border-radius:12px!important;box-shadow:none!important}
.learning-history-group-v600>summary small{font-size:10px!important;letter-spacing:0!important}

:where(.learning-reading-v600,.learning-reference-v600,.learning-history-v600) :focus-visible{
  outline:3px solid color-mix(in srgb,var(--accent) 72%,white 8%)!important;
  outline-offset:2px!important;
}
html[data-theme="dark"] :where(.learning-reading-canvas-v600,.learning-reading-question-v600){background:var(--surface-solid)!important;border-color:rgba(255,255,255,.14)!important}
html[data-theme="dark"] :where(.learning-reference-row-v600,.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505,.learning-history-row-v600){border-color:rgba(255,255,255,.14)!important}
html[data-ui-style="liquid"] :where(.learning-reading-canvas-v600,.learning-reading-question-v600){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card-solid,var(--panel))!important}
@media(max-width:430px){
  .learning-reading-canvas-v600{padding:18px 15px!important;border-radius:14px!important}
  .learning-reading-v600 :where(p,.news-paragraph){font-size:17px!important;line-height:1.9!important}
  .learning-reading-question-v600{padding:14px 12px!important}
  .learning-reading-translation-v600>.card,.learning-reference-list-v600{padding-inline:12px!important}
  :where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505)>summary{min-height:60px}
  .learning-history-v600 .history-tabs-v4116{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap!important}
  .learning-history-v600 .history-tabs-v4116 .chip{flex:0 0 auto;min-height:42px!important}
}
@media(max-width:330px){
  .learning-reading-v600 :where(p,.news-paragraph){font-size:16px!important}
  .learning-history-row-v600 .recent-main-v22>em{display:none}
}
@media(prefers-reduced-motion:reduce){
  :where(.learning-reading-v600,.learning-reference-v600,.learning-history-v600) *{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}
}

/* Routine Suite 6.1.0 · semantic typography contract
   두 WebView의 래스터라이징을 같게 만들지 않는다. 같은 의미 역할이 같은 계산식과
   배율을 사용하고, 실제 글꼴 파일이 없을 때 fallback을 진단 가능하게 만드는 계약이다. */
:root{
  --type-ui-body:calc(14px * var(--font-scale,1));
  --type-ui-support:calc(12px * var(--font-scale,1));
  --type-ui-caption:calc(10px * var(--font-scale,1));
  --type-ui-control:calc(14px * var(--font-scale,1));
  --type-ui-title:calc(18px * var(--font-scale,1));
  --type-jp-answer:calc(16px * var(--font-scale,1));
  --type-jp-reading:clamp(calc(16px * var(--font-scale,1)),calc(4.6vw * var(--font-scale,1)),calc(20px * var(--font-scale,1)));
  --type-jp-reference:calc(18px * var(--font-scale,1));
  --weight-ui-regular:450;
  --weight-ui-medium:550;
  --weight-ui-emphasis:600;
  --leading-ui-body:1.68;
  --leading-jp-answer:1.72;
  --leading-jp-reading:1.94;
}

/* Shared controls and settings use role tokens; navigation shells remain platform-specific. */
.btn{font-size:var(--type-ui-control)!important}
.chip{font-size:var(--type-ui-caption)!important}
:where(.empty,.note,.option-card){font-size:var(--type-ui-body)!important}
.option-card>b{font-size:var(--type-ui-body)!important;font-weight:var(--weight-ui-medium)!important}
.option-card>small{font-size:var(--type-ui-support)!important}
.setting-title{font-size:var(--type-ui-support)!important}
#settingsView .settings-menu-v21 .menu-row strong,
.settings-index-v4116 .settings-menu-row-v578>span:nth-child(2)>b{font-size:var(--type-ui-body)!important;font-weight:var(--weight-ui-medium)!important}
#settingsView .settings-menu-v21 .menu-row small,
.settings-index-v4116 .settings-menu-row-v578>span:nth-child(2)>small{font-size:var(--type-ui-caption)!important}

/* Shared learning roles inherit the same scale without weakening the iOS 16px input floor. */
.learning-diff-v510,
.learning-correction-stack-v510 :where(p,strong),
.learning-thread-v511 :where(.talk-bubble,.dialogue-bubble,.bubble),
.learning-reading-question-v600 h3,
.learning-reading-translation-v600 .translation-row p,
.learning-reference-card-v600 .synonym-example b,
.learning-reference-v600 .compound-card-v505 .synonym-example b{
  font-size:var(--type-jp-answer)!important;
  font-weight:var(--weight-ui-regular)!important;
  line-height:var(--leading-jp-answer)!important;
}
.learning-reading-v600 :where(p,.news-paragraph){font-size:var(--type-jp-reading)!important;line-height:var(--leading-jp-reading)!important}
:where(.learning-reference-card-v600,.learning-reference-v600 .compound-card-v505)>summary b{font-size:var(--type-jp-reference)!important;font-weight:var(--weight-ui-medium)!important}
.learning-reference-row-v600 :where(b,.article-title),
.learning-history-summary-v600 b,
.learning-history-row-v600 :where(.recent-copy-v22 b,header b){font-size:var(--type-ui-body)!important;font-weight:var(--weight-ui-medium)!important}
.learning-reference-row-v600 :where(small,.article-meta),
.learning-history-row-v600 :where(.recent-copy-v22 small,footer,header small),
.learning-history-row-v600 .recent-main-v22>em{font-size:var(--type-ui-caption)!important}
.learning-session-v511 :where(input,textarea,select),
.learning-reading-translation-v600 textarea,
.learning-reference-tools-v600 input[type="search"]{font-size:max(16px,var(--type-ui-body))!important}
.typography-diagnostics-v610 .setting-line b{font-size:var(--type-ui-body)!important;font-weight:var(--weight-ui-medium)!important}
.typography-diagnostics-v610 .setting-line small{font-size:var(--type-ui-caption)!important}

@media(max-width:430px){
  :root{--type-jp-reading:calc(17px * var(--font-scale,1))}
}
@media(max-width:330px){
  :root{--type-jp-reading:calc(16px * var(--font-scale,1))}
}

/* Routine Suite 6.1.1 · PWA surface parity hotfix
   Routine.js remains the visual source of truth. The PWA launch cards previously referenced
   an undefined --panel token and therefore rendered transparent. Its settings index also let
   a more-specific translucent surface override the solid Routine.js dark settings surface. */
#homeView .speaking-launch-card-v451{
  background:var(--card)!important;
  border-color:var(--border)!important;
}
#settingsView .settings-category-v21>.settings-menu-v21{
  background:var(--card)!important;
  border-color:var(--border)!important;
}
html[data-theme="dark"] #settingsView .settings-category-v21>.settings-menu-v21{
  background:var(--surface-solid)!important;
  border-color:var(--line)!important;
}

/* 6.2: 日本語 패널 안의 갈래 한 줄(単語 / 漢字).
   줄기 패널을 하나 더 만들지 않고 기존 패널 바닥에 붙이므로 카드 레이아웃은 그대로다.
   갈래 정보가 없는 날은 마크업 자체가 나오지 않아 높이도 변하지 않는다. */
.anki-v62-branches{
  display:flex;flex-wrap:wrap;gap:3px 6px;
  margin-top:5px;padding-top:5px;
  border-top:1px solid var(--line);
}
.anki-v62-branches>i{
  font-style:normal;font-size:10px;line-height:1.25;
  color:var(--muted);letter-spacing:-.01em;
  white-space:nowrap;
}
.anki-v62-branches>i>b{font-weight:650;color:var(--text)}
/* 7.3.0: 갈래 줄을 예습·복습·시간과 같은 행으로 그린다. 칩으로 흘려보내면 패널 폭에 따라
   1줄이 되기도 2줄이 되기도 해서 세 칸의 가로줄이 어긋난다.
   7.3.0 는 빈 칸에 'empty' 클래스를 붙였는데, 그것이 전역 빈 상태 규칙(padding:30px 18px)을
   그대로 먹어 빈 자리에 100px 짜리 상자가 생겼다. 지역 수식어에 전역 유틸리티 이름을 쓰면
   안 된다 — 이름이 겹치는 순간 의도하지 않은 규칙이 통째로 딸려온다. */
.anki-v62-branches.anki-v69-branch-rows{display:grid;gap:2px}
.anki-v69-branch>small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 빈 행은 자리만 잡는다. 내용이 없으므로 아무것도 보이지 않아야 한다. */
.anki-v69-branch-slot{visibility:hidden}

/* ============================================================================
   6.5 간격 스케일 계약
   ============================================================================
   간격 값이 46종이고 4px 그리드 밖이 2,455회다. 9px·7px·13px·11px 가 각각 200회 넘게
   쓰인다. 제품이 '조립된 느낌'을 주는 가장 큰 이유가 색이나 그림자가 아니라 이것이다.

   2,455곳을 한 번에 스냅하는 것은 정리가 아니라 리디자인이고 기기 검증 없이는 할 수 없다.
   그래서 스케일을 토큰으로 못박고, 계약이 스케일 밖 사용 횟수를 세어 늘어나면 실패하게 한다.
   앞으로 어떤 변경도 이 숫자를 되돌릴 수 없고, 표면 단위로 옮겨갈 때마다 줄어든다. */
:root{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;
  --space-12:48px;
  /* 모서리는 세 단계로 수렴한다. 카드 · 항목 · 컨트롤. */
  /* 7.3.0: 반경 스케일은 tokens-base 가 이미 12/16/20/24 로 정의해 두었다. 6.7 이 그 위에
     18/14 짜리 경쟁 세트를 얹은 것을 되돌린다. 간격 때와 같은 실수였다. */
  --radius-pill:999px;
}

/* ============================================================================
   6.4.1 기기 확인에서 나온 결함 수정
   ============================================================================ */

/* 1. 다크에서 카드 아래에 흰 줄이 그어지는 문제.
   --ds-shadow-core 와 --shadow-soft 의 두 번째 그림자가 `0 1px 0 (흰색 66~72%)` 인데
   라이트용 하이라이트다. 다크 재정의가 없어 어두운 배경 위에 흰 실선으로 남았다.
   Routine.js 설정만 멀쩡했던 것은 거기만 box-shadow:none 이었기 때문이고, 토큰을 고치면
   두 클라이언트의 모든 소비자가 함께 낫는다. */
html[data-theme="dark"],
html[data-color-mode="dark"]{
  --ds-shadow-core:0 8px 24px rgba(0,0,0,.34),0 1px 0 rgba(255,255,255,.045);
  --shadow-soft:0 10px 26px rgba(0,0,0,.32),0 1px 0 rgba(255,255,255,.045);
}
@media(prefers-color-scheme:dark){
  html:not([data-theme="light"]):not([data-color-mode="light"]){
    --ds-shadow-core:0 8px 24px rgba(0,0,0,.34),0 1px 0 rgba(255,255,255,.045);
    --shadow-soft:0 10px 26px rgba(0,0,0,.32),0 1px 0 rgba(255,255,255,.045);
  }
}

/* 2. 오류 복습의 밑줄이 두 번 그려지던 문제.
   tokens-base 가 text-decoration, merged-uiux-v350 이 error 에 border-bottom / correct 에
   text-decoration, final-shared 가 box-shadow 로 각각 밑줄을 그어 세 세대가 겹쳤다.
   마지막 한 겹(box-shadow)만 남긴다. v350 과 같은 특이도라 뒤에 오는 이 규칙이 이긴다. */
.review-card-v350 .deck-error-mark,
.review-card-v350 .deck-correct-mark{
  border-bottom:0;
  text-decoration:none;
  background:none;
  padding-bottom:0;
}

/* 3. 하단 독을 화면 바닥에 더 붙이고 네 모서리를 모두 둥글게 한다.
   난이도 평가 독은 위쪽만 둥근 '보도블록' 모양이라 카드가 잘린 것처럼 보였고, 바닥에서
   떠 있어 위치가 애매했다. 모든 독이 같은 여백과 같은 모서리를 쓰게 맞춘다. */
.grade-grid-v350{
  bottom:calc(2px + env(safe-area-inset-bottom));
  border-radius:20px!important;
}
.deck-review + .grade-grid{
  left:10px;
  right:10px;
  /* 7.6-I · 캐스케이드 감사는 이 !important 를 "지금은 없어도 승자가 같다"고 판정했지만,
     6.5 가 여기에 !important 를 둔 이유는 앞선 파일들의 !important 규칙을 이기기 위해서다.
     지금 같다는 것과 앞으로도 같다는 것은 다르고, 단위 테스트가 그 의도를 고정하고 있다. */
  bottom:calc(6px + env(safe-area-inset-bottom))!important;
  padding:8px!important;
  border-radius:20px!important;
  border-bottom:1px solid var(--border)!important;
}
.bottom-action-dock,
.dialogue-answer-dock,
.sticky-action{
  bottom:calc(var(--space-2) + env(safe-area-inset-bottom))!important;
  border-radius:var(--radius-card)!important;
}

/* ============================================================================
   6.5.1 기기 확인 후속
   ============================================================================ */

/* 1. 난이도 평가 독이 여전히 본문 흐름 안에 떠 있었다.
   position:sticky 라 스크롤 위치에 따라 화면 중간에 놓이고 아래로 본문이 계속 이어졌다.
   6.4.1 은 모양만 바꿨지 위치 방식을 바꾸지 않았다. 이미 같은 문제를 푼 .dialogue-answer-dock
   과 동일하게 fixed 로 바꾸고, 가려지는 만큼 페이지 아래 여백을 준다. */
.grade-grid-v350,
.deck-review + .grade-grid{
  position:fixed!important;
  left:var(--space-3)!important;
  right:var(--space-3)!important;
  bottom:calc(var(--space-2) + env(safe-area-inset-bottom))!important;
  width:auto!important;
  max-width:760px!important;
  margin:0 auto!important;
  z-index:45!important;
}
.page:has(.grade-grid-v350){padding-bottom:calc(env(safe-area-inset-bottom) + 124px)!important}

/* 2. 첨삭 결과 도구의 주 버튼이 통짜 강조색이라 다섯 버튼 중 하나만 튀었다.
   주 행동이라는 사실은 남기되 채움 대신 옅은 색조와 글자색으로 구분한다.
   Design Bible: 위계는 크기·굵기보다 간격과 대비에서 나온다. */
.floating-toolbar-v27 button.primary{
  background:color-mix(in srgb,var(--accent) 16%,transparent)!important;
  color:var(--accent)!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 32%,transparent)!important;
}

/* ============================================================================
   7.3.0 페이지 감사 — 화면 단위 결함
   ============================================================================
   화면 91개를 감사 도구로 훑어 나온 것들이다(tools/page-audit.mjs).
   눈으로는 못 찾는다 — 대부분 실패했을 때만 보이거나, 옆 화면과 나란히 놓아야 보인다. */

/* 렌더가 실패했을 때 뜨는 오류 카드가 **어느 CSS 에도 없었다.** 라우터의 catch 만이
   이 클래스를 쓰는데, 화면이 깨졌을 때만 보이므로 여태 아무도 못 봤다.
   하필 가장 불안한 순간에 스타일 없는 날 HTML 이 나오고 있었다. */
.state-card-v31{
  display:flex;align-items:flex-start;gap:var(--space-3);
  padding:var(--space-4);
  border:1px solid var(--border);border-radius:var(--radius-card);
  background:var(--card);
}
.state-card-v31 b{display:block;font-size:var(--fs-14);line-height:1.4}
.state-card-v31 small{display:block;margin-top:var(--space-1);color:var(--muted);font-size:var(--fs-11);line-height:1.5;word-break:break-word}
.state-card-v31.error{border-color:color-mix(in srgb,var(--danger,#e2504a) 38%,var(--border))}
.state-icon-v31{
  display:grid;place-items:center;flex:0 0 auto;
  width:24px;height:24px;border-radius:var(--radius-pill);
  font-size:var(--fs-13);font-weight:700;line-height:1;
  background:color-mix(in srgb,var(--danger,#e2504a) 16%,transparent);
  color:var(--danger,#e2504a);
}

/* 인라인 style="width:100%" 가 27곳이었다. 인라인은 캐스케이드 밖이라 어떤 토큰으로도
   못 바꾼다 — 6.4~6.7 이 정리한 표면을 화면 단위로 되돌리는 것이 이것이다.
   여백은 8·9·10px 로 흩어져 있던 것을 간격 스케일 하나로 모은다. */
.full-v692{width:100%}
.full-v692.gap-v692{margin-top:var(--space-2)}

/* 주간 신호 카드의 '점'이 헤더 라벨용 letter-spacing(.12em)을 물려받아 글자가 벌어져 있었다.
   `header small` 하나로 'WEEKLY SIGNAL' 라벨과 숫자 뒤 단위를 같이 잡고 있었던 탓이다.
   단위는 숫자에 붙어야 하므로 자간과 색을 제자리로 돌린다. */
.jlpt-weekly-snapshot-v520 header strong>small{
  letter-spacing:normal;color:inherit;margin-left:1px;font-weight:inherit;
}
/* 왼쪽은 두 줄, 오른쪽은 큰 숫자 한 줄이라 flex-end 로는 밑선이 안 맞는다. */
.jlpt-weekly-snapshot-v520 header{align-items:baseline}
.jlpt-weekly-snapshot-v520 header span{align-self:end}

/* 옵션 그리드가 2열 고정이라 항목이 3개면 2+1 로 깨지고 오른쪽 아래가 통째로 비었다.
   설정에 3지선다가 많아 그 빈칸이 화면마다 반복된다(카드 순서 · AI 보강 기준 · 월간 한도 ·
   청해 길이 …). 첨삭 상세도만 3열이었는데, 그 모양이 맞다.
   `:has(> :nth-child(3):last-child)` 는 '자식이 정확히 셋'이라는 뜻이다 — 개수를 코드에서
   세어 클래스를 붙이지 않아도 되므로, 항목이 늘거나 줄면 배치가 알아서 따라간다. */
.option-grid.option-grid:has(> :nth-child(3):last-child){
  grid-template-columns:repeat(3,minmax(0,1fr));
}
/* 3열이 되면 칸이 좁아져 설명이 두 줄로 접힌다. 접히는 것 자체는 괜찮지만 칸마다 높이가
   달라지면 안 되므로 줄을 늘려 잡는다. */
.option-grid.option-grid:has(> :nth-child(3):last-child)>*{min-width:0}

/* 대기 트레이에 폐기 길을 낸다. 이어갈 수 있게만 해두고 버릴 수 없으면 목록이 계속 쌓여
   무엇이 진짜 남은 학습인지 알 수 없게 된다. */
.bg-tray-row-v693{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:var(--space-1)}
.bg-tray-row-v693>[data-bg-open]{min-width:0}
.bg-tray-drop-v693{
  flex:0 0 auto;width:34px;border:1px solid var(--border);border-radius:var(--radius-compact);
  background:transparent;color:var(--muted);font-size:var(--fs-12);line-height:1;
}
.bg-tray-drop-v693:active{background:var(--track)}

/* 일기 첨삭 결과의 도구 묶음만 통짜 파란 판 위에 얹혀 있었다
   (`background:color-mix(in srgb,var(--p1) 86%,var(--card-solid))`). 앱 전체에서 이 배경을
   쓰는 컨테이너는 여기 하나뿐이라 첨삭 화면만 다른 앱처럼 보인다.
   6.5.1 은 이 묶음의 주 버튼 색만 고치고 **판 자체를 놓쳤다** — 버튼을 눅여도 판이 파랗다.
   다른 카드와 같은 표면으로 되돌린다. */
.correction-action-bar-v2910{
  background:var(--card)!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-card)!important;
}
/* 판이 카드색이 되면 버튼도 같이 눅여야 한다. 파란 판 위에서만 읽히던 색이다. */
.correction-action-bar-v2910 button{
  background:var(--track)!important;
  color:var(--text)!important;
}
.correction-action-bar-v2910 button.primary{
  background:color-mix(in srgb,var(--accent) 16%,transparent)!important;
  color:var(--accent)!important;
}

/* 공용 대기 모달의 중단 버튼. 예전에는 일기 전용 대기 화면에만 있었다. */
.busy-cancel-v694{width:100%;margin-top:var(--space-2)}
.busy-cancel-v694.hidden{display:none}

/* 큰 숫자가 패널 폭을 거의 다 먹어 네 자리(1600)에서는 '장'이 밀려 붙는다.
   숫자와 단위 사이 간격을 좁힌다 — 단위는 숫자에 붙어야 하나의 값으로 읽힌다.
   크기 자체는 아래 원래 선언에서 10% 줄였다(27.9→25.1 · 23.4→21.1). 덮어쓰기를 얹으면
   같은 속성이 두 번 선언돼 다음 사람이 어느 쪽이 진짜인지 알 수 없다. */
.study-anki-card-v574 .anki-v29-total{gap:1px!important}

/* 글감 줄 15% · 추천 표현 20% 키운다. 일기를 쓰기 전에 읽는 두 줄인데 화면에서 가장 작았다.
   같은 비율로 패딩과 높이도 올려 알약이 글자에 끼지 않게 한다. */
.prompt-chip{font-size:var(--fs-14)!important;padding:var(--space-3) var(--space-4)!important}
.diary-prompt-v300 small,.diary-prompt-v300 span{font-size:var(--fs-11)!important}
.diary-prompt-words-v300 button{
  font-size:var(--fs-12)!important;min-height:40px!important;padding:0 var(--space-3)!important;
}
/* 최근 읽은 기사에서 온 글감. 지어낸 주제가 아니라는 것을 알아야 무엇에 대해 쓸지 감이 온다. */
.prompt-chip-news-v695{
  background:color-mix(in srgb,var(--success,#248a5a) 13%,transparent)!important;
  color:var(--success,#248a5a)!important;
}

/* ============================================================================
   7.5.1 홈 첫 줄 — 두 앱이 같은 모양으로
   ============================================================================
   7.3.0 은 PWA 홈의 「복습 메모리」와 「오늘의 학습 조언」을 루틴.js 의 목록 행 모양으로
   옮겼다(.routine-row-v695). 7.5.1 은 같은 의도를 한 단계 더 밀어, 루틴.js 학습 홈의
   첫 줄 — TODAY · AI SENSEI 두 칸 — 을 PWA 홈에도 그대로 둔다. 두 칸이 발화 카드 위로
   올라가면서 그 목록 행을 쓰는 화면이 없어졌고, 쓰지 않는 정의는 남기지 않는다.

   비율은 눈으로 맞추지 않고 루틴.js `.learning-overview-v417` 의 값(.82 : 1.18)을 옮겼다.
   글자 크기는 PWA 의 의미 토큰을 쓴다 — 루틴.js 의 8~13px 은 Scriptable WebView 의
   축소된 스케일이고, 그 숫자까지 옮기면 PWA 에서만 작아 보인다.

   7.5.1 은 두 칸을 홈 맨 위, 주제어보다 위에 두었다. 루틴.js 는 그 자리가 아니다 — 주제어
   (학습 · 오늘의 학습) 아래, 학습 카드 위다. 두 칸이 무엇에 대한 요약인지는 주제어가 정하는데,
   주제어보다 위에 있으면 그 관계가 끊긴다. 이제 「오늘의 발화」 아래, 발화 카드 위에 둔다.

   세로 여백도 루틴.js 값이다. `.learning-overview-v417` 의 margin 은 `8px 0 12px` 이고,
   위아래 형제와 마진이 상쇄되어 실제로는 위 8px · 아래 12px 로 보인다. 같은 결과를 PWA
   토큰으로 쓴다(--space-2 / --space-3). 위 문단이 옮기지 말라고 한 것은 글자 크기이지
   간격이 아니다 — 간격은 두 앱이 같은 4px 배수 스케일을 쓰므로 그대로 옮겨진다. */
.home-overview-v751{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:var(--space-2);margin:var(--space-2) 0 var(--space-3)}
.home-overview-slot-v751{display:grid;min-width:0}
.home-overview-slot-v751 .status{margin:0;align-self:center}
.home-overview-card-v751{
  min-width:0;display:block;width:100%;text-align:left;
  padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);
  background:var(--panel);color:var(--text);
}
.home-overview-card-v751>small{display:block;font-size:var(--fs-10);font-weight:700;letter-spacing:.16em;color:var(--accent)}
.home-overview-card-v751>b{display:block;margin-top:var(--space-1);font-size:var(--fs-15);line-height:1.35;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-overview-card-v751>span{display:block;margin-top:var(--space-1);font-size:var(--fs-11);line-height:1.45;color:var(--muted)}
/* 조언 칸의 부제만 강조색이다. 왼쪽은 상태, 오른쪽은 눌러서 이어갈 곳이라는 뜻. */
.home-overview-sensei-v751>span{color:var(--accent)}
.home-overview-sensei-v751 i{font-style:normal}
@media(max-width:390px){.home-overview-v751{grid-template-columns:1fr}}

/* ============================================================================
   7.0 재생 우선 복습
   ============================================================================
   앞면에서 틀린 문장을 걷어내고 입력을 놓았다. 화면의 무게 중심이 "읽기"에서
   "쓰기"로 옮겨가야 하므로 입력칸이 카드에서 가장 큰 요소여야 한다. */
.review-recall-v700{display:grid;gap:var(--space-2);margin-top:var(--space-3)}
.review-recall-v700>small{color:var(--muted);font-size:var(--fs-11)}
.recall-frame-v700{
  padding:var(--space-3);border-radius:var(--radius-compact);background:var(--track);
  font-size:var(--fs-16);line-height:1.9;word-break:break-word;
}
.recall-blank-v700{
  display:inline-block;min-width:5em;margin:0 var(--space-1);
  border-bottom:2px dashed var(--accent);color:transparent;user-select:none;
}
.review-recall-v700 textarea{
  width:100%;box-sizing:border-box;padding:var(--space-3);
  border:1px solid var(--border);border-radius:var(--radius-compact);
  background:var(--card-solid);color:var(--text);
  font:inherit;font-size:var(--fs-16);line-height:1.8;resize:none;
}
.recall-actions-v700{display:grid}

/* 비교 세 줄. 여기가 이 화면의 결론이다 — 정답 한 줄이 아니라 '내 답 · 예전 오답 · 교정문'을
   나란히 놓는 것이 목적이다. 예전 오답과 이번 답이 같으면 그 습관이 아직 살아 있다. */
.review-compare-v700{display:grid;gap:var(--space-2);margin-top:var(--space-3)}
.recall-verdict-v700{font-size:var(--fs-14);line-height:1.4}
.review-compare-v700.v-match .recall-verdict-v700{color:var(--success,#248a5a)}
.review-compare-v700.v-repeat .recall-verdict-v700{color:var(--danger,#d94c4c)}
.review-compare-v700.v-differs .recall-verdict-v700,
.review-compare-v700.v-empty .recall-verdict-v700{color:var(--muted)}
.recall-row-v700{
  display:grid;gap:var(--space-1);padding:var(--space-3);
  border-radius:var(--radius-compact);background:var(--track);
}
.recall-row-v700>small{color:var(--muted);font-size:var(--fs-10)}
.recall-row-v700>span{font-size:var(--fs-15);line-height:1.75;word-break:break-word}
/* 예전 오답은 눈에 띄되 정답처럼 보이면 안 된다. 교정문이 마지막에 오고 가장 또렷하다. */
.recall-row-v700.past>span{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1px}
.recall-row-v700.fixed{background:color-mix(in srgb,var(--success,#248a5a) 12%,transparent)}
.recall-row-v700.fixed>span{font-weight:650}

/* 7.0 (C): 일기 에디터의 재사용 슬롯. 글감 바로 아래에 두어 "무엇에 대해 쓸까" 다음에
   "무엇을 써볼까"가 오게 한다. 권유일 뿐이라 강조는 최소로 한다 — 강제하면 숙제가 된다. */
.diary-reuse-v700{
  display:grid;gap:var(--space-2);margin:0 0 var(--space-3);padding:var(--space-3);
  border:1px solid var(--border);border-radius:var(--radius-compact);background:var(--soft);
}
.diary-reuse-v700>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.diary-reuse-v700 small{font-size:var(--fs-11);font-weight:900;color:var(--accent);letter-spacing:.08em}
.diary-reuse-v700>div:first-child>span{font-size:var(--fs-11);color:var(--muted)}
.diary-reuse-list-v700{display:grid;gap:var(--space-2)}
.diary-reuse-item-v700{
  display:grid;gap:var(--space-1);width:100%;text-align:left;
  padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-compact);
  background:var(--card-solid);color:var(--text);
}
.diary-reuse-item-v700>b{font-size:var(--fs-15);line-height:1.6}
/* 이전 오답은 회색 취소선. 정답과 헷갈리면 안 된다 — 복습 비교 화면과 같은 규칙이다. */
.diary-reuse-item-v700>small{
  font-size:var(--fs-11);color:var(--muted);
  text-decoration:line-through;text-decoration-thickness:1px;
}
.diary-reuse-item-v700>i{font-style:normal;font-size:var(--fs-10);color:var(--danger,#d94c4c)}

/* 7.2 능력축. 표본이 찬 축만 들어오므로 칸 수가 1~3으로 달라진다 — 고정 열이 아니라
   들어온 만큼 나눠 갖게 한다. 빈 자리를 만들지 않기 위해서다. */
.ability-grid-v720{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--space-2);padding:var(--space-4)}
.ability-axis-v720{display:grid;gap:var(--space-1);justify-items:center;min-width:0}
.ability-axis-v720>small{color:var(--muted);font-size:var(--fs-11)}
.ability-axis-v720>b{font-size:var(--fs-20);line-height:1.1}
.ability-axis-v720>b>em{font-size:var(--fs-11);font-style:normal;color:var(--muted);margin-left:1px}
/* 표본 수를 함께 보여준다. 3회로 낸 70%와 30회로 낸 70%는 다른 값이고, 그 차이를
   숨기면 사용자가 숫자를 실제보다 믿게 된다. */
.ability-axis-v720>i{font-style:normal;font-size:var(--fs-10);color:var(--muted)}

/* 7.3 회화 목표 표현. 미션 바로 아래에 놓여 "무슨 상황인지" 다음에 "무엇을 써볼지"가 온다.
   달성해도 사라지지 않고 상태만 바뀐다 — 사라지면 자기가 해낸 것이 안 보인다. */
.talk-targets-v730{display:grid;gap:var(--space-2);padding:var(--space-3) var(--space-4)}
.talk-targets-v730>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.talk-targets-v730 small{font-size:var(--fs-11);font-weight:900;color:var(--accent);letter-spacing:.08em}
.talk-targets-v730>div:first-child>span{font-size:var(--fs-11);color:var(--muted)}
.talk-target-item-v730{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);
  padding:var(--space-2) var(--space-3);border-radius:var(--radius-compact);background:var(--track);
}
.talk-target-item-v730>b{font-size:var(--fs-15);line-height:1.5;min-width:0}
.talk-target-item-v730>i{font-style:normal;font-size:var(--fs-11);color:var(--muted);flex:0 0 auto}
.talk-target-item-v730.used{background:color-mix(in srgb,var(--success,#248a5a) 12%,transparent)}
.talk-target-item-v730.used>i{color:var(--success,#248a5a);font-weight:650}

/* ============================================================================
   7.6.0 C — 모션 감소를 실제로 적용한다
   ============================================================================
   Reduced Motion 규칙은 이미 있었다(shared-final-v4119.css). 그런데 `!important` 가 없어서,
   뒤에 오는 `animation:pageInRight .24s ...` 같은 **단축 선언**이 duration 을 다시 덮었다.
   설정을 켜도 화면 전환은 그대로 미끄러졌다는 뜻이다. 규칙이 있다는 것과 이긴다는 것은
   다르고, 여기가 그 차이였다.

   그래서 이 블록은 두 번들의 **마지막 공유 레이어**에 있고 `!important` 를 쓴다. 로드맵
   7.6-C 의 네 줄이 그대로 네 선언이다: 큰 이동을 없애고(지속시간 0), 페이드를 최소로 줄이고,
   반복을 멈추고(iteration-count 1), 상태 변화를 즉시로 만든다.

   선택자는 보편 선택자 하나뿐이다. `.page.enter-forward` 나 `.spinner` 를 여기서 따로 잡으면
   공유 레이어가 그 이름들을 **정의**하게 되고, 이미 그 이름을 쓰는 클라이언트 CSS 가 전부
   "공유 컴포넌트의 화면별 예외"로 집계된다 — 7.6 이 줄이기로 한 바로 그 수치가 규칙 하나를
   넣었다는 이유로 올라간다. 보편 선언만으로 네 가지가 모두 달성되므로 그렇게 하지 않는다.

   회전하던 대기 표시는 이 설정에서 멈춘다. 멈춘 원은 "기다리는 중"을 말하지 못하므로,
   대기 상태를 움직임이 아니라 형태로 말하는 것은 7.6-D(스켈레톤)가 맡는다.

   스크롤 동작까지 auto 로 두는 이유: 부드러운 스크롤은 사용자가 요청하지 않은 이동이고,
   전정기관 문제가 있는 사람에게는 전환 애니메이션과 같은 종류의 자극이다. */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* 7.6.0 D — 기다리는 동안 보이는 것은 올 것의 모양이다.
   회색 막대가 결과의 구역 순서(결론 → 교정 → 다음 행동)대로 서 있고, 결과가 오면 그 자리가
   내용으로 바뀐다. 도착 순간에 화면이 통째로 갈리지 않는 것이 목적이므로 막대의 높이와
   간격은 실제 본문의 행간을 따른다. 흐르는 반짝임은 넣지 않는다 — 진행을 뜻하는 것처럼
   보이지만 아무 정보도 없고, 모션 감소에서 어차피 멈춘다. */
.loading-skeleton-v760{display:grid;gap:var(--space-3);margin:var(--space-3) 0}
.loading-zone-v760{display:grid;gap:var(--space-1)}
.loading-zone-v760>b{font-size:var(--fs-10);font-weight:700;letter-spacing:.12em;color:var(--muted)}
.loading-zone-v760>i{display:block;height:var(--space-2);border-radius:var(--radius-xs);background:var(--track)}
.loading-zone-v760>i.loading-line-short-v760{width:52%}

/* 7.6.0 E — 키보드가 올라오면 동작 독은 그 위로 올라온다.
   4.11.7 이 --keyboard-inset 을 계산해 두고 body 여백과 오디오 바에만 썼다. 회화 입력과
   발음 녹음의 동작 독은 그대로여서, 입력하는 동안 주요 버튼이 키보드 뒤에 있었다. 값이
   없어서가 아니라 그 값을 여기에 쓰지 않아서다.

   화면마다 규칙을 만들지 않고 공유 컴포넌트 하나(.learning-action-dock-v511)에 건다.
   화면별로 걸면 두 가지가 동시에 나빠진다: 새 화면은 이 동작을 못 물려받고, "공유 컴포넌트를
   화면별로 다시 칠한 규칙" 수치가 올라간다 — 7.6 이 줄이기로 한 바로 그 수치다.
   원래 규칙이 bottom 을 !important 로 잡고 있어 여기서도 쓴다. */
html[data-keyboard-open="true"] .learning-action-dock-v511{bottom:calc(var(--space-2) + var(--keyboard-inset))!important}
