/* lab-redesign.css — 연구소 대개편 (기존 styles.css 토큰 위 op.gg 밀도 셸) */
/* lz- 프리픽스. 색은 판정 전용, 인터랙션 무채색. 라이트/다크 자동. */

:root{
  --lz-nav-h:56px;
  --lz-side-w:236px;
  --lz-sum-w:296px;
  --lz-row-h:48px;
  /* 콘텐츠 최대폭 토큰 (하드코딩 캡 일원화). --lz-cap = 기존 1240 보존값,
     --lz-wide = 데스크톱 최적화용 확대폭(≥1024 미디어쿼리에서만 사용). */
  --lz-cap:1240px;
  --lz-wide:1440px;
  --lz-mono:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;

  /* ── 디자인 토큰 (2026-07-16 정의 — 화면별 점진 치환. 대원칙: 이름만 토큰, 값 변경 최소) ── */
  /* 간격: 8 그리드 + half-step(6·10) + 촘촘값(2)·레이아웃 치수(32~56) 값 보존 */
  --sp-0:2px;  /* 예외: 가장 촘촘한 seg/칩 내부 — 절대 키우지 않음 */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px;  --sp-4:16px;  --sp-5:20px;  --sp-6:24px;
  --sp-h:6px;  --sp-h2:10px; /* half-step */
  --sp-7:32px; --sp-8:40px;  --sp-9:48px;  --sp-10:56px; /* 레이아웃 치수(카드·모달·섹션) */
  /* 아이콘 (11종 → 4종). 인라인 작은 아이콘 보존 위해 xs 추가 */
  --ico-xs:14px; --ico-sm:16px; --ico-md:20px; --ico-lg:24px;
  /* 폰트 위계 (28종 → 7종 + 특수 3). 14→base13·20→lg18·26→xl22 (데스크톱 성장 금지) */
  --fs-cap:11px; --fs-sm:12px; --fs-base:13px; --fs-md:15px; --fs-lg:18px; --fs-xl:22px; --fs-display:32px;
  --fs-micro:10px;        /* 특수: 깊이 배지·초소형 라벨(8~10 흡수) */
  --fs-char:42px;         /* 특수: 상세 큰 음절 표시 */
  --fs-char-lg:64px;      /* 특수: 최대 표시 */
}
.lz-num{font-family:var(--lz-mono);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}

/* ── 셸: 화면 전체 그리드 ── */
.lz-app{display:flex;flex-direction:column;height:100dvh;overflow:hidden}

/* ── 상단 nav ── */
.lz-nav{height:var(--lz-nav-h);flex-shrink:0;display:flex;align-items:center;gap:24px;padding:0 20px;
  background:color-mix(in srgb, var(--surface) 82%, transparent);
  -webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px); /* 글래스 통일(2026-07-18 3단계) — 본게임 topbar와 동일 기법 */
  border-bottom:1px solid var(--hair);transition:background .3s,border-color .3s}
.lz-logo{font-size:16px;font-weight:800;letter-spacing:-.03em;cursor:pointer;color:var(--ink);
  white-space:nowrap;flex-shrink:0}
.lz-tabs{display:flex;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.lz-tabs::-webkit-scrollbar{display:none}
.lz-tab{padding:7px 13px;border-radius:var(--r1);font-size:var(--fs-base);font-weight:600;color:var(--ink-3);
  white-space:nowrap;flex-shrink:0;text-decoration:none; /* 링크형 탭(이론 검증)도 버튼과 동일 외형 */
  cursor:pointer;border:none;background:transparent;font-family:inherit;transition:background .13s,color .13s}
.lz-tab:hover{color:var(--ink-2);background:var(--raise)}
.lz-tab.on{color:var(--ink);background:var(--raise)}
.lz-search{margin-left:auto;width:min(340px,34vw);height:38px;display:flex;align-items:center;gap:8px;
  padding:0 12px;background:var(--raise);border:1px solid var(--hair-2);border-radius:var(--r1);
  cursor:text;transition:border-color .15s,box-shadow .15s}
.lz-search:focus-within{border-color:var(--ink-3);box-shadow:0 0 0 3px var(--focus)}
.lz-search svg{width:var(--ico-md);height:var(--ico-md);color:var(--ink-3);stroke-width:2;flex-shrink:0}
.lz-search input{flex:1;min-width:0;border:none;background:transparent;outline:none;color:var(--ink);
  font-family:inherit;font-size:var(--fs-base);font-weight:600}
.lz-search input::placeholder{color:var(--ink-4);font-weight:500}
.lz-search .lz-rule{margin-left:auto;font-size:var(--fs-cap);color:var(--ink-4);font-weight:600;white-space:nowrap}
.lz-nav-ico{width:36px;height:36px;flex-shrink:0;border-radius:var(--r1);display:flex;align-items:center;justify-content:center;
  color:var(--ink-2);cursor:pointer;border:none;background:transparent;transition:background .18s,color .18s}
.lz-nav-ico:hover{background:var(--raise);color:var(--ink)}
.lz-nav-ico svg{width:var(--ico-md);height:var(--ico-md)}

/* ── 본문: 사이드바 + 워크스페이스 ── */
.lz-body{flex:1;display:flex;min-height:0;overflow:hidden}

/* ── 접이식 사이드바 ── */
.lz-side{width:var(--lz-side-w);flex:0 0 var(--lz-side-w);max-width:var(--lz-side-w);min-width:0;background:var(--surface);border-right:1px solid var(--hair);
  display:flex;flex-direction:column;overflow:hidden;transition:width .26s var(--ease-out),margin .26s var(--ease-out)}
.lz-side.collapsed{width:0;flex-basis:0;max-width:0;margin-left:0;border-right-color:transparent}
.lz-side-h{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px}
.lz-side-h span{font-size:var(--fs-sm);font-weight:700;color:var(--ink-3);letter-spacing:.04em}
.lz-side-nav{padding:2px 10px 12px;display:flex;flex-direction:column;gap:2px}
.lz-side-i{display:flex;align-items:center;gap:11px;padding:8px 11px;border-radius:var(--r1);font-size:var(--fs-base);
  font-weight:600;color:var(--ink-2);cursor:pointer;border:none;background:transparent;font-family:inherit;
  transition:background .13s,color .13s;text-align:left}
.lz-side-i:hover{background:var(--raise)}
.lz-side-i.on{background:var(--raise);color:var(--ink)}
.lz-side-i svg{width:var(--ico-md);height:var(--ico-md);flex-shrink:0}
.lz-browse{border-top:1px solid var(--hair);margin:6px 10px 0;padding:14px 4px 10px;flex:1;min-height:0;
  display:flex;flex-direction:column;overflow:hidden}
.lz-browse-h{display:flex;align-items:center;justify-content:space-between;padding:0 6px;margin-bottom:var(--sp-h2)}
.lz-browse-h span{font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);letter-spacing:.04em}
.lz-side-sect{margin-bottom:var(--sp-5)}
.lz-side-sect:last-child{margin-bottom:0}
.lz-side-sect .lz-dash-chips{padding:0 6px}
.lz-seg{display:flex;gap:2px;background:var(--raise);border-radius:var(--r1);padding:3px;margin:0 6px 11px}
.lz-seg button{flex:1;border:none;background:transparent;font-family:inherit;font-size:var(--fs-sm);font-weight:600;
  padding:5px 0;border-radius:calc(var(--r1) - 3px);color:var(--ink-3);cursor:pointer;transition:.13s}
.lz-seg button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-card)}
.lz-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 6px;overflow-y:auto}
.lz-chip{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--r1);
  border:1px solid var(--hair-2);font-size:var(--fs-base);font-weight:600;color:var(--ink-2);cursor:pointer;
  background:var(--surface);transition:border-color .13s,transform .13s,color .13s}
.lz-chip:hover{border-color:var(--ink-4);transform:translateY(-1px)}
.lz-chip.on{background:var(--good-bg);border-color:var(--good);color:var(--good)}

/* ── 워크스페이스 (2단) ── */
.lz-work{flex:1;overflow:auto;min-width:0}
.lz-work-in{max-width:var(--lz-cap);margin:0 auto;padding:16px 20px 60px;display:grid;
  grid-template-columns:var(--lz-sum-w) 1fr;gap:16px;align-items:start}

/* ── 좌: 글자 프로필 요약 ── */
.lz-sum{display:flex;flex-direction:column;gap:12px;position:sticky;top:16px}
.lz-prof{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);overflow:hidden;
  animation:lzUp .34s var(--ease-out) both}
.lz-prof-top{padding:24px 24px 16px;text-align:center}
.lz-prof.win .lz-prof-top{background:linear-gradient(180deg,var(--good-bg),transparent)}
.lz-prof.lose .lz-prof-top{background:linear-gradient(180deg,var(--danger-bg),transparent)}
.lz-prof.route .lz-prof-top{background:linear-gradient(180deg,var(--warn-bg),transparent)}
.lz-prof-char{width:82px;height:82px;margin:0 auto var(--sp-3);border-radius:var(--r2);background:var(--soft);
  border:1px solid var(--hair-2);display:flex;align-items:center;justify-content:center;font-size:var(--fs-char);
  font-weight:800;letter-spacing:-.03em}
.lz-prof.win .lz-prof-char{color:var(--good)} .lz-prof.lose .lz-prof-char{color:var(--danger)}
.lz-prof.route .lz-prof-char{color:var(--warn)}
.lz-prof-verdict{font-size:19px;font-weight:800;letter-spacing:-.02em} /* 19: 토큰 밖 — 원값 보존 */
.lz-prof.win .lz-prof-verdict{color:var(--good)} .lz-prof.lose .lz-prof-verdict{color:var(--danger)}
.lz-prof.route .lz-prof-verdict{color:var(--warn)}
.lz-prof-sub{font-size:var(--fs-sm);color:var(--ink-2);font-weight:500;margin-top:var(--sp-1);line-height:1.5}
.lz-prof-stats{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--hair)}
.lz-pstat{padding:12px 6px;text-align:center;border-right:1px solid var(--hair)}
.lz-pstat:last-child{border-right:none}
.lz-pstat .n{font-size:16px;font-weight:800;letter-spacing:-.02em}
.lz-pstat .n.w{color:var(--good)} .lz-pstat .n.r{color:var(--warn)} .lz-pstat .n.l{color:var(--danger)}
.lz-pstat .l{font-size:var(--fs-cap);color:var(--ink-3);font-weight:600;margin-top:2px}
/* 프로필 → 플레이 모드 진입 CTA */
.lz-prof-goplay{display:flex;align-items:center;justify-content:center;gap:6px;width:calc(100% - 24px);
  margin:0 12px 12px;padding:9px 0;border:none;border-radius:var(--r1);cursor:pointer;
  background:var(--raise);color:var(--ink);font-family:inherit;font-size:var(--fs-base);font-weight:700;
  border:1px solid var(--hair-2);transition:background .15s,border-color .15s}
.lz-prof-goplay:hover{background:var(--soft);border-color:var(--ink-3)}
.lz-prof-goplay svg{width:var(--ico-xs);height:var(--ico-xs)} /* 13→14 아이콘 흡수 */
/* 이론 검증 진입(상세 → /lab/proto#음절) — goplay와 동일 외형의 링크 */
.lz-prof-goproto{display:flex;align-items:center;justify-content:center;gap:6px;width:calc(100% - 24px);
  margin:0 12px 12px;padding:9px 0;border-radius:var(--r1);cursor:pointer;text-decoration:none;
  background:var(--raise);color:var(--ink);font-family:inherit;font-size:var(--fs-base);font-weight:700;
  border:1px solid var(--hair-2);transition:background .15s,border-color .15s;white-space:nowrap}
.lz-prof-goproto:hover{background:var(--soft);border-color:var(--ink-3)}
/* 두음 법칙 (조건부) */
.lz-dueum-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-h);font-size:var(--fs-sm);color:var(--ink-3);font-weight:600;line-height:1.6}
.lz-dueum-row+.lz-dueum-row{margin-top:var(--sp-2)}
.lz-dueum-lbl,.lz-dueum-suf{white-space:normal}

.lz-card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:16px;
  animation:lzUp .34s var(--ease-out) both}
.lz-card-h{font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase;
  margin-bottom:12px}
.lz-distbar{display:flex;height:9px;border-radius:5px;overflow:hidden;gap:2px;margin-bottom:12px}
.lz-distbar span{display:block;transition:width .5s var(--ease-out)}
.lz-distlist{display:flex;flex-direction:column;gap:8px}
.lz-distrow{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm)}
.lz-distrow .dot{width:8px;height:8px;border-radius:3px;flex-shrink:0}
.lz-distrow .lab{color:var(--ink-2);font-weight:600}
.lz-distrow .val{margin-left:auto;font-weight:700;color:var(--ink)}
.lz-liner{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--hair)}
.lz-liner:last-child{border-bottom:none;padding-bottom:0}
.lz-liner .lw{font-size:var(--fs-base);font-weight:700}
.lz-liner .seq{font-size:var(--fs-cap);color:var(--ink-3);font-family:var(--lz-mono);margin-left:auto}
.lz-liner .bd{font-size:var(--fs-cap);font-weight:700;color:var(--good);background:var(--good-bg);padding:2px 7px;border-radius:5px}

/* ── 우: 수 데이터베이스 ── */
.lz-main{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);overflow:hidden;
  animation:lzUp .34s var(--ease-out) both}
.lz-main-h{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--hair);
  position:sticky;top:0;background:var(--surface);z-index:2}
.lz-filt{display:flex;align-items:center;gap:4px;font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);
  padding:6px 11px;border-radius:var(--r1);cursor:pointer;border:none;background:transparent;
  font-family:inherit;transition:background .12s,color .12s}
.lz-filt:hover{background:var(--raise)}
.lz-filt.on{background:var(--soft);color:var(--ink)}
.lz-filt .c{font-family:var(--lz-mono);color:var(--ink-4);font-size:var(--fs-cap)}
.lz-filt.on .c{color:var(--ink-3)}
.lz-sort{margin-left:auto;display:flex;align-items:center;gap:5px;font-size:var(--fs-sm);color:var(--ink-3);
  font-weight:600;cursor:pointer;border:none;background:transparent;font-family:inherit}
.lz-sort svg{width:var(--ico-xs);height:var(--ico-xs);color:var(--ink-2)}
.lz-thead{display:flex;align-items:center;padding:9px 16px;font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);
  letter-spacing:.03em;border-bottom:1px solid var(--hair)}
.lz-c-w{width:170px} .lz-c-to{width:96px} .lz-c-v{width:74px}
.lz-c-rate{flex:1;min-width:120px} .lz-c-d{width:52px;text-align:right} .lz-c-t{width:58px;text-align:right}

.lz-mv{display:flex;align-items:center;padding:0 16px;height:var(--lz-row-h);border-bottom:1px solid var(--hair);
  cursor:pointer;position:relative;transition:background .1s}
.lz-mv:last-child{border-bottom:none}
.lz-mv::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 2px 2px 0;background:var(--hair-2)}
.lz-mv:hover{background:var(--raise)}
.lz-mv.win::before{background:var(--good)} .lz-mv.route::before{background:var(--warn)}
.lz-mv.lose::before{background:var(--danger)} .lz-mv.loop::before{background:var(--ink-4)}
.lz-mv .w{width:170px;font-size:var(--fs-base);font-weight:700;letter-spacing:-.02em;color:var(--ink)} /* 14→13 B흡수 */
.lz-mv .to{width:96px;font-size:var(--fs-sm);color:var(--ink-2);font-weight:600}
.lz-mv .to b{color:var(--ink);font-weight:700}
.lz-pair{display:inline-flex;align-items:center;gap:var(--sp-1);white-space:nowrap}
.lz-pair-a{font-style:normal;color:var(--ink-4);font-weight:700;font-size:var(--fs-cap)}
.lz-mv .v{width:74px}
.lz-mv .rate{flex:1;min-width:120px;display:flex;align-items:center;gap:8px;padding-right:16px}
.lz-mv .rate .track{flex:1;height:5px;background:var(--soft);border-radius:3px;overflow:hidden}
.lz-mv .rate .fill{height:100%;border-radius:3px;transform-origin:left;animation:lzGrow .5s var(--ease-out) both}
.lz-mv .rate .pct{width:38px;text-align:right;font-size:var(--fs-sm);font-weight:700}
.lz-mv .rate .pct.hi{color:var(--good)} .lz-mv .rate .pct.mid{color:var(--ink)} .lz-mv .rate .pct.lo{color:var(--danger)}
.lz-mv .d{width:52px;text-align:right;font-size:var(--fs-sm);color:var(--ink-2);font-weight:600}
.lz-mv .d.mut{color:var(--ink-4)}
.lz-mv .t{width:58px;text-align:right;font-size:var(--fs-cap);color:var(--ink-3);font-weight:600}

/* op.gg식 판정 뱃지 (기존 .lab-badge 재사용 가능하나 사각형 데이터톤) */
.lz-badge{font-size:var(--fs-cap);font-weight:700;padding:3px 8px;border-radius:5px}
.lz-badge.win{color:var(--good);background:var(--good-bg)}
.lz-badge.lose{color:var(--danger);background:var(--danger-bg)}
.lz-badge.route{color:var(--warn);background:var(--warn-bg)}
.lz-badge.loop{color:var(--ink-3);background:var(--soft)}

/* ── 애니메이션 (transform/opacity 만, 60fps) ── */
@keyframes lzUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes lzGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){
  .lz-prof,.lz-card,.lz-main,.lz-mv .rate .fill,.lz-distbar span{animation:none!important;transition:none!important}
}

/* ── 반응형: 태블릿 이하 = 요약 위로 스택, 사이드바 드로어 ── */
@media (max-width:1080px){
  .lz-work-in{grid-template-columns:1fr}
  .lz-sum{position:static;flex-direction:row;flex-wrap:wrap}
  .lz-sum>*{flex:1 1 260px}
}
/* P4: 사이드바 오버레이 뒤 스크림 (모바일 전용 — JS가 .on 토글) */
.lz-scrim{position:fixed;inset:0;z-index:19;background:rgba(8,8,10,.42);
  opacity:0;pointer-events:none;transition:opacity .18s var(--ease-out)}
.lz-scrim.on{opacity:1;pointer-events:auto}
@media (prefers-reduced-motion:reduce){.lz-scrim{transition:none}}

@media (max-width:720px){
  .lz-side{position:absolute;z-index:20;height:100%;box-shadow:var(--sh-pop)}
  .lz-side.collapsed{box-shadow:none}
  /* 2단 nav: 1행 아이콘·로고·검색, 2행 탭(가로 스크롤) — 601~720(태블릿)은 검색 폭 충분 */
  .lz-nav{gap:8px 12px;flex-wrap:wrap;height:auto;min-height:var(--lz-nav-h);padding:8px 12px}
  .lz-tabs{order:10;flex:1 0 100%}
  .lz-search{width:auto;flex:1;min-width:0}
  .lz-rule-pop{top:calc(var(--lz-nav-h) + 40px)}
}

/* ── 모바일 터치 타깃 ≥44px (히트영역만 확대 — 시각 스타일·데스크톱 밀도 불변) ── */
@media (max-width:600px){
  /* P0: 폰(≤600)에서만 검색을 자체 행으로 — 규칙칩이 input 폭을 잠식(375에서 4px)하던 것 해소.
     601~720 태블릿은 검색 폭이 충분해 원래 행 유지(위 ≤720 블록). */
  .lz-search{order:9;flex:1 0 100%;width:auto;min-width:0}
  .lz-tab{min-height:44px;display:inline-flex;align-items:center}
  .lz-nav-ico{width:44px;height:44px}
  .lz-side-toggle{width:44px;height:44px}
  .rv-seat-tog button{min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
  .pad-rule-seg button,.pad-rule-tog{min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
  .fp-best-line,.fp-best-play,.fp-best-jump,.lz-jump,.lz-liner-play{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .lz-pill{min-height:44px}
  /* 상세: 뷰탭·페이지네이터 44px */
  .lz-vt{min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
  .lz-dpage button{width:44px;height:44px}

  /* P5: 이중 패딩(lz-stage 20 + lz-work-in 20 = 40px) 제거 — 콘텐츠 가로폭 회복.
     외곽 거터는 lz-stage 12px만 남기고 중첩된 lz-work-in 좌우 패딩은 0으로.
     (.lz-app 선행 = base .lz-stage 단축속성보다 특이도 우선) */
  .lz-app .lz-stage{padding-left:12px;padding-right:12px}
  .lz-work-in{padding-left:0;padding-right:0}
  /* P7: 하단 안전영역(홈바) — /lab 콘텐츠 바닥 여백에 반영 */
  .lz-app .lz-stage{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
  .lz-work-in{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
  .lz-nav{padding-top:calc(8px + env(safe-area-inset-top))}
}

/* ── 규칙 칩 (nav 검색 우측) ── */
.lz-search .lz-rule{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:var(--fs-cap);color:var(--ink-3);
  font-weight:600;white-space:nowrap;border:none;background:transparent;cursor:pointer;font-family:inherit;
  padding:4px 6px;border-radius:7px;transition:background .12s,color .12s}
.lz-search .lz-rule:hover{background:var(--soft);color:var(--ink-2)}
.lz-chip-dot{width:6px;height:6px;border-radius:50%;background:var(--good);flex-shrink:0}
.lz-chip-dot.loading{background:var(--ink-4);animation:lzPulse 1.2s ease-in-out infinite}
@keyframes lzPulse{50%{opacity:.35}}

/* ── 규칙 팝오버 ── */
.lz-rule-pop{position:absolute;top:calc(var(--lz-nav-h) - 4px);right:64px;z-index:40;
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r2);box-shadow:var(--sh-pop);
  padding:6px;opacity:0;transform:translateY(-6px);transition:opacity .16s,transform .16s var(--ease-out);
  pointer-events:none}
.lz-rule-pop.open{opacity:1;transform:none;pointer-events:auto}
.lz-rule-pop .pad-rules{margin:0;border:none;background:transparent;padding:8px}

/* ── 워크스페이스 마운트 ── */
.lz-stage{max-width:var(--lz-cap);margin:0 auto;padding:16px 20px 60px;min-height:60vh}
.lz-view{opacity:0;transform:translateY(6px);transition:opacity .26s var(--ease-out),transform .26s var(--ease-out)}
.lz-view.in{opacity:1;transform:none}
.lz-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50vh;
  color:var(--ink-3);font-size:var(--fs-base);font-weight:600}
.lz-spin{width:16px;height:16px;border-radius:50%;border:2px solid var(--hair-2);border-top-color:var(--ink-3);
  animation:lzSpin .7s linear infinite}
@keyframes lzSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.lz-view{transition:none}.lz-spin{animation-duration:1.4s}}

/* ── dict 지도(확정성 3층) ── */
/* 토큰 치환(2026-07-16): gap만 14→12(B 승인 흡수), 나머지 동일값 이름치환/원값 보존 */
.lz-map{display:flex;flex-direction:column;gap:var(--sp-3)}
/* 데스크톱(≥1024): win|lose|route 3열 나란히 — 세로 스택(scrollH~1210) 해소.
   모바일(<1024)은 위 flex-column 그대로(픽셀 불변, 미디어쿼리 안 닿음). */
@media (min-width:1024px){
  .lz-stage:has(.lz-map){max-width:var(--lz-wide)}
  .lz-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3);align-items:start}
}
.lz-map-band{padding:14px var(--sp-4)} /* 세로14=카드 치수 보존, 가로16=sp-4 */
.lz-map-band .lz-card-h{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-h)}
.lz-map-band .lz-card-h i{flex:1;min-width:0}
.lz-map-save{margin-left:auto;white-space:nowrap;font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);
  letter-spacing:0;text-transform:none;border:1px solid var(--hair-2);background:transparent;border-radius:999px;
  padding:var(--sp-1) var(--sp-3);cursor:pointer;font-family:inherit;transition:color .12s,border-color .12s}
.lz-map-save:hover{color:var(--ink);border-color:var(--ink-3)}
@media (max-width:600px){.lz-map-save{min-height:44px}}
.lz-map-band .lz-card-h b{font-size:var(--fs-md);margin-left:var(--sp-0)}
.lz-map-band.win .lz-card-h b{color:var(--good)}
.lz-map-band.lose .lz-card-h b{color:var(--danger)}
.lz-map-band.route .lz-card-h b{color:var(--warn)}
.lz-map-grp{margin-top:var(--sp-h2)}
.lz-map-gl{font-size:var(--fs-sm);font-weight:700;color:var(--ink-3);margin-bottom:var(--sp-h)}
.lz-map-gl b{color:var(--ink-2);font-weight:800}
.lz-map-gl small{font-weight:600;color:var(--ink-4)}
.lz-map-d{display:inline-block;padding:1px 7px;border-radius:999px;background:var(--raise);color:var(--ink-2);font-weight:800;font-size:var(--fs-cap)}
/* 층 색을 음절 칩에 은은하게 — 밴드 구분이 칩 단위에서도 읽히게 */
.lz-map-band.win .lz-chip{background:var(--good-bg);color:var(--good);border-color:transparent}
.lz-map-band.lose .lz-chip{background:var(--danger-bg);color:var(--danger);border-color:transparent}
.lz-map-band.route .lz-chip{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.lz-map-band .lz-chip:hover{border-color:currentColor}
.lz-map-more{border:1px dashed var(--hair-2);background:transparent;color:var(--ink-3);font-size:var(--fs-sm);font-weight:700;
  padding:var(--sp-1) var(--sp-h2);border-radius:999px;cursor:pointer;font-family:inherit;transition:color .12s,border-color .12s}
.lz-map-more:hover{color:var(--ink);border-color:var(--ink-3)}
.lz-map-explore{margin-top:var(--sp-3);width:100%;border:1px solid var(--hair-2);background:var(--raise);color:var(--ink-2);
  font-size:var(--fs-base);font-weight:700;padding:var(--sp-h2) 14px;border-radius:var(--r1);cursor:pointer;font-family:inherit;
  transition:background .12s,color .12s}
.lz-map-explore:hover{background:var(--soft);color:var(--ink)}
@media (max-width:600px){
  .lz-map .lz-chip{min-height:44px;min-width:44px} /* 터치 타깃 44px(2026-07-18 M-2) */
  .lz-map-more{min-height:44px}
}

/* ── dict(탐색) 전용 ── */
.lz-side-toggle{width:26px;height:26px;border:none;background:transparent;color:var(--ink-3);cursor:pointer;
  display:flex;align-items:center;justify-content:center;border-radius:7px;transition:background .13s,color .13s}
.lz-side-toggle:hover{background:var(--raise);color:var(--ink)}
.lz-side-toggle svg{width:var(--ico-sm);height:var(--ico-sm)}
.lz-chip-more{font-size:var(--fs-cap);color:var(--ink-4);font-weight:600;align-self:center;padding:0 4px}

.lz-empty-card{text-align:center;padding:32px 22px}
.lz-empty-ico{width:44px;height:44px;margin:0 auto 12px;border-radius:12px;background:var(--soft);
  display:flex;align-items:center;justify-content:center;color:var(--ink-3)}
.lz-empty-ico svg{width:var(--ico-md);height:var(--ico-md)}
.lz-empty-t{font-size:var(--fs-md);font-weight:700;color:var(--ink)}
.lz-empty-d{font-size:var(--fs-base);color:var(--ink-3);font-weight:500;margin-top:5px;line-height:1.5}
.lz-empty-samples{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:14px}
.lz-main-empty{padding:40px 20px;text-align:center;color:var(--ink-3);font-size:var(--fs-base);font-weight:600}
.lz-main-loading{display:flex;align-items:center;justify-content:center;gap:9px;padding:44px 20px;
  color:var(--ink-3);font-size:var(--fs-base);font-weight:600}

.lz-mw-more{font-size:var(--fs-cap);color:var(--ink-4);font-weight:600;margin-left:6px}
.lz-kill{color:var(--danger);font-weight:700;font-size:var(--fs-sm)}
.lz-mv{flex-wrap:wrap}
.lz-mv{min-height:var(--lz-row-h);height:auto}
.lz-mv>.w,.lz-mv>.to,.lz-mv>.v,.lz-mv>.t{flex-shrink:0}
.lz-mv-words{flex-basis:100%;width:100%;display:flex;flex-wrap:wrap;gap:5px;padding:2px 0 12px 0}
.lz-chipw{font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);background:var(--soft);border-radius:6px;
  padding:3px 8px;white-space:nowrap}
.lz-chipw.rest{color:var(--ink-4)}
/* 실전 주력 단어(DB.xlsx 선별) 표시 — 별 마커 + 강조 칩 */
.lz-chipw.db{color:var(--good);background:var(--good-bg);font-weight:700}
.lz-db-star{font-style:normal;color:var(--good);font-size:var(--fs-cap);margin-right:2px;font-weight:700}
.lz-more{display:flex;align-items:center;gap:6px;width:100%;justify-content:center;padding:12px;
  font-size:var(--fs-base);font-weight:600;color:var(--ink-2);background:transparent;border:none;cursor:pointer;
  font-family:inherit;transition:background .12s}
.lz-more:hover{background:var(--raise);color:var(--ink)}
.lz-more svg{width:var(--ico-xs);height:var(--ico-xs)}
.lz-jump{width:26px;height:26px;flex-shrink:0;border:none;background:transparent;color:var(--ink-4);cursor:pointer;
  display:flex;align-items:center;justify-content:center;border-radius:7px;transition:background .12s,color .12s}
.lz-mv:hover .lz-jump{color:var(--ink-2)}
.lz-jump:hover{background:var(--soft);color:var(--ink)!important}
.lz-jump svg{width:var(--ico-sm);height:var(--ico-sm)}
.lz-mv .rate{align-items:center}

/* 끝나는 단어 */
.lz-prev{border-top:1px solid var(--hair)}
.lz-prev-h{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;cursor:pointer;
  font-size:var(--fs-base);font-weight:700;color:var(--ink-2);transition:color .13s}
.lz-prev-h:hover{color:var(--ink)}
.lz-prev-caret{color:var(--ink-4);display:flex;transition:transform .2s}
.lz-prev-caret svg{width:var(--ico-sm);height:var(--ico-sm)}
.lz-prev-h.open .lz-prev-caret{transform:rotate(180deg)}
.lz-prev-body{display:none;padding:0 16px 14px}
.lz-prev-body.open{display:block}
.lz-prev-row{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-top:1px solid var(--hair)}
.lz-prev-ws{display:flex;flex-wrap:wrap;gap:5px}

/* 모바일: 사이드바 드로어에서 요약 스택 조정 */
@media (max-width:1080px){ .lz-work-in{grid-template-columns:1fr} }

/* 플렉스/그리드 오버플로 방지 */
.lz-work-in{min-width:0}
.lz-main{min-width:0}
.lz-chips{align-content:flex-start}

/* ── 복기(review) P2 ── */
.rv2-hero-ico{width:48px;height:48px;margin:0 auto 12px;border-radius:14px;display:flex;align-items:center;justify-content:center}
.rv2-hero-ico svg{width:var(--ico-lg);height:var(--ico-lg)}
.rv2-hero-ico.win{background:var(--good-bg);color:var(--good)}
.rv2-hero-ico.lose{background:var(--danger-bg);color:var(--danger)}
.rv2-hero-ico.route{background:var(--warn-bg);color:var(--warn)}
.lz-prof.route .lz-prof-verdict{color:var(--warn)}
.rv2-pct{font-size:var(--fs-base);font-weight:700}
.rv2-legend{display:flex;flex-direction:column;gap:9px;font-size:var(--fs-sm);color:var(--ink-2);font-weight:500;line-height:1.4}
.rv2-legend span{display:flex;align-items:center;gap:8px}
.rv2-dot{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.rv2-main{display:flex;flex-direction:column;gap:14px;background:transparent;border:none;overflow:visible}
.rv2-main>.lz-card{border-radius:var(--r1)}
.rv2-graph-card{padding:16px 18px}
.rv2-actions{display:flex;justify-content:center;padding-top:2px}

/* 그래프/타임라인/상세를 카드 안에 맞춤 */
.rv2-main .rv-graph{margin:0}
.rv2-main .rvg-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.rv2-main .rvg-head>span:first-child{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.rv2-main .rvg-note{font-size:var(--fs-cap);color:var(--ink-3);font-weight:500;text-align:right}
.rv2-main .rvg-scroll{overflow-x:auto}
.rvg-mid{stroke:var(--hair-2)}
.rvg-line{stroke:var(--warn);stroke-width:2.5;fill:none}
.rvg-area{fill:var(--warn-bg)}
.rvg-yl,.rvg-xl{fill:var(--ink-4);font-size:var(--fs-micro);font-weight:600}
.rvg-dot{fill:var(--ink-3);cursor:pointer;transition:r .1s}
.rvg-dot.good{fill:var(--good)} .rvg-dot.bad{fill:var(--danger)} .rvg-dot.warn{fill:var(--warn)}
.rvg-dot.swing{fill:var(--ink-2)} .rvg-dot.start{fill:var(--ink-4)}
.rvg-dot.sel{stroke:var(--ink);stroke-width:2}
/* ── 수순 타임라인 (2-B 간판): 등급색 + 근사/정밀 구분 + 깊이 서브라벨 ── */
.rv-tl-card .lz-card-h{display:flex;align-items:baseline;gap:8px}
.rv-tl-prog{margin-left:auto;font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);white-space:nowrap}
.rv-decided{margin:2px 0 12px;padding:10px 14px;border-radius:var(--rs);background:var(--soft);
  border-left:3px solid var(--ink-3);font-size:var(--fs-base);color:var(--ink-2);line-height:1.55}
.rv-decided b{color:var(--ink)}
.rv-tl{display:flex;flex-wrap:wrap;align-items:stretch;gap:6px;row-gap:10px}
.rv-tl-arr{align-self:center;color:var(--ink-4);font-size:var(--fs-sm);user-select:none}
.rv-tl-chip{display:inline-flex;flex-direction:column;gap:2px;padding:6px 10px;border-radius:var(--rs);
  border:1.5px solid var(--hair);background:var(--surface);min-width:0;cursor:pointer;
  transition:border-color .25s,background .25s,opacity .25s,box-shadow .15s}
.rv-tl-chip:hover{border-color:var(--ink-3)}
.rv-tl-chip .t{display:flex;align-items:baseline;gap:5px}
.rv-tl-chip .n{font-style:normal;font-size:var(--fs-micro);color:var(--ink-4);font-weight:800}
.rv-tl-chip .w{font-size:var(--fs-base);font-weight:700;color:var(--ink);letter-spacing:-.01em}
.rv-tl-chip .ap{font-style:normal;font-size:var(--fs-cap);color:var(--ink-4);font-weight:800}
.rv-tl-chip .sub{font-size:var(--fs-cap);font-weight:700;color:var(--ink-4);white-space:nowrap}
/* 등급색 */
.rv-tl-chip.q-best{border-color:var(--good);background:var(--good-bg)}
.rv-tl-chip.q-best .sub{color:var(--good)}
.rv-tl-chip.q-inaccuracy{border-color:var(--warn);background:var(--warn-bg)}
.rv-tl-chip.q-inaccuracy .sub{color:var(--warn)}
.rv-tl-chip.q-blunder,.rv-tl-chip.q-illegal{border-color:var(--danger);background:var(--danger-bg)}
.rv-tl-chip.q-blunder .sub,.rv-tl-chip.q-illegal .sub{color:var(--danger)}
/* 확신도 soft: 대안 미확정 — 색은 유지하되 연하게 (없는 패착을 단정하지 않기) */
.rv-tl-chip.soft{border-style:dashed;opacity:.8}
/* 근사(간이 판정): 점선 테두리 + 저채도 — 정밀(실선)과 한눈에 구분 */
.rv-tl-chip.approx{border-style:dashed;opacity:.62;background:var(--surface)}
.rv-tl-chip.approx .sub{color:var(--ink-4)}
.rv-tl-chip.sel{box-shadow:0 0 0 3px var(--focus)}
/* 차트 ↔ 타임라인 hover 동기화 */
.rv-tl-chip.hl{border-color:var(--ink-2);box-shadow:0 0 0 2px var(--focus)}
.rvg-dot.hl{stroke:var(--ink);stroke-width:2.5}
/* 수 평가 카운트 (강등된 요약) */
.rv2-legend .rv2-cnt{font-family:var(--lz-mono);font-variant-numeric:tabular-nums;color:var(--ink);margin:0 2px}
.rv-tl-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;padding-top:10px;border-top:1px solid var(--hair);
  font-size:var(--fs-cap);font-weight:600;color:var(--ink-3)}
.rv-tl-legend span{display:inline-flex;align-items:center;gap:5px}
.rv-tl-legend .rv-tl-lg-ap{color:var(--ink-4)}
/* 수 상세 패널 확장 (2-C): 둔 수 라인 + 승률 변화 */
.rv-played{margin-top:12px;font-size:var(--fs-base);color:var(--ink-2);font-weight:600}
.rv-played b{color:var(--ink)}
.rv-wr-delta{font-size:var(--fs-sm);color:var(--ink-3);font-weight:600}
.rv-wr-delta.dn{color:var(--danger)}
.rv-best-same{font-size:var(--fs-sm);font-weight:700;color:var(--good)}
.rv-detail{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:18px 20px}
.rv-d-head{font-size:var(--fs-base);font-weight:800;margin-bottom:6px;letter-spacing:-.01em}
.rv-d-head.blunder{color:var(--danger)} .rv-d-head.best{color:var(--good)} .rv-d-head.inaccuracy{color:var(--warn)}
.rv-d-body{font-size:var(--fs-base);color:var(--ink-2);font-weight:500;line-height:1.6}
.rv-d-body b{color:var(--ink);font-weight:700}
.rv-cmp{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.rv-cmp-row{display:flex;align-items:center;gap:12px;background:var(--raise);border:1px solid var(--hair);border-radius:var(--rs);padding:11px 14px}
.rv-cmp-badge{font-size:var(--fs-cap);font-weight:800;padding:3px 8px;border-radius:5px;flex-shrink:0}
.rv-cmp-badge.good{color:var(--good);background:var(--good-bg)} .rv-cmp-badge.bad{color:var(--danger);background:var(--danger-bg)}
.rv-cmp-word{font-size:var(--fs-md);font-weight:700}
.rv-cmp-note{margin-left:auto;font-size:var(--fs-sm);color:var(--ink-3);font-weight:600}
.rv-abtn{height:38px;padding:0 16px;border-radius:9px;border:1px solid var(--hair-2);background:var(--surface);
  color:var(--ink-2);font-family:inherit;font-size:var(--fs-base);font-weight:600;cursor:pointer;transition:.13s}
.rv-abtn:hover{border-color:var(--ink-4);color:var(--ink)}
.rv-abtn.primary{background:var(--primary);color:var(--primary-ink);border-color:var(--primary)}
.rv-loading{display:flex;align-items:center;justify-content:center;gap:9px;padding:30px;color:var(--ink-3);font-size:var(--fs-base);font-weight:600}

/* ── 플레이(freeplay) P3 ── */
.fp2-main{background:transparent;border:none;overflow:visible}
.fp2-tools{display:flex;flex-direction:column;gap:6px}
.fp2-tools .fp-tbtn{width:100%;justify-content:flex-start;height:38px;padding:0 12px;border-radius:9px;
  border:1px solid var(--hair-2);background:var(--surface);color:var(--ink-2);font-family:inherit;font-size:var(--fs-base);
  font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:.13s}
.fp2-tools .fp-tbtn:hover:not(:disabled){border-color:var(--ink-4);color:var(--ink)}
.fp2-tools .fp-tbtn:disabled{opacity:.4;cursor:default}
.fp2-tools .fp-tbtn.hint{color:var(--warn);border-color:var(--warn-bg)}
.fp2-tools .fp-tbtn svg{width:var(--ico-sm);height:var(--ico-sm)}
.fp2 .fp-rail{display:flex;flex-direction:column;gap:4px;max-height:none;overflow:visible}
.fp2 .fp-rail .u-ink4-shrink{display:none}
.fp2 .fp-move{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;background:var(--raise);font-size:var(--fs-base)}
.fp2 .fp-move.me{background:var(--good-bg)}
.fp2 .fp-move .n{font-size:var(--fs-cap);color:var(--ink-4);font-weight:700;flex-shrink:0}
.fp2 .fp-move .w{font-weight:700;color:var(--ink)}
.fp2 .fp-rail-empty{font-size:var(--fs-base);color:var(--ink-3);font-weight:500;padding:4px 2px;line-height:1.5}
.fp2 .fp-turn{display:block;margin-top:6px;padding:8px 10px;border-radius:8px;border:1px dashed var(--hair-2);
  font-size:var(--fs-base);font-weight:700;color:var(--ink-2)}
.fp2-main .fp-current{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--surface);
  border:1px solid var(--hair);border-radius:var(--r1);margin-bottom:12px}
.fp2-main .fp-cur-char{width:44px;height:44px;border-radius:11px;background:var(--soft);display:flex;
  align-items:center;justify-content:center;font-size:var(--fs-xl);font-weight:800;color:var(--ink)}
.fp2-main .fp-cur-who{font-size:var(--fs-base);color:var(--ink-2);font-weight:600}
.fp2-main .fp-loading{display:flex;align-items:center;justify-content:center;gap:9px;padding:30px;color:var(--ink-3);font-size:var(--fs-base);font-weight:600}

/* ── 전략 트리 (P4) ── */
.lz-vtabs{display:flex;gap:var(--sp-0);padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--hair)}
.lz-vt{font-size:var(--fs-base);font-weight:600;color:var(--ink-3);padding:6px 12px;border-radius:var(--rs);
  border:none;background:transparent;font-family:inherit;cursor:pointer;transition:.12s} /* 12.5→13 흡수 */
.lz-vt:hover{background:var(--raise);color:var(--ink-2)}
.lz-vt.on{background:var(--soft);color:var(--ink)}
#d-tree-view{padding:16px}
.lz-crit{background:var(--raise);border:1px solid var(--hair);border-radius:var(--r1);padding:13px 15px;
  font-size:var(--fs-base);color:var(--ink-2);font-weight:500;line-height:1.55;margin-bottom:16px}
.lz-crit.unique{border-color:var(--good);background:var(--good-bg)}
.lz-crit b{color:var(--ink);font-weight:700}
.lz-crit-tag{display:inline-block;font-size:var(--fs-cap);font-weight:800;padding:2px 8px;border-radius:5px;margin-right:8px;
  color:var(--good);background:var(--surface)}
.lz-crit-tag.alt{color:var(--warn)}
.lz-crit-ws{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.lz-tree{display:flex;flex-direction:column;gap:8px}
.lz-tbranch{display:flex;flex-direction:column;gap:6px}
.lz-tmove{display:flex;align-items:center;gap:8px;font-size:var(--fs-base);padding:8px 12px;border-radius:9px;width:fit-content;max-width:100%}
.lz-tmove.me{background:var(--good-bg);border:1px solid var(--good)}
.lz-tmove.opp{background:var(--raise);border:1px solid var(--hair-2)}
.lz-tlabel{font-size:var(--fs-cap);font-weight:800;letter-spacing:.02em;flex-shrink:0}
.lz-tmove.me .lz-tlabel{color:var(--good)} .lz-tmove.opp .lz-tlabel{color:var(--ink-3)}
.lz-tword{font-weight:700;color:var(--ink)}
.lz-tarrow{color:var(--ink-4)}
.lz-tchar{font-weight:800;color:var(--ink);cursor:pointer;border-bottom:1px dashed var(--hair-2)}
.lz-tchar:hover{color:var(--good)}
.lz-tbadge{font-size:var(--fs-micro);font-weight:700;color:var(--good);background:var(--surface);padding:1px 6px;border-radius:4px;margin-left:2px}
.lz-topp{margin-left:18px;padding-left:14px;border-left:2px solid var(--hair);display:flex;flex-direction:column;gap:6px;margin-top:4px}
.lz-tterm{font-size:var(--fs-base);font-weight:600;color:var(--ink-3);padding:4px 12px;margin-left:18px}
.lz-tterm.win{color:var(--good)}
.lz-tmore{font-size:var(--fs-sm);color:var(--ink-4);font-weight:600;padding:2px 12px;margin-left:18px}
.lz-tree-note{font-size:var(--fs-sm);color:var(--ink-4);font-weight:500;line-height:1.5;margin-top:16px;padding-top:12px;border-top:1px solid var(--hair)}

/* ── P5: 연구 노트 저장 + 연출 ── */
.lz-prof{position:relative}
.lz-save{position:absolute;top:12px;right:12px;width:30px;height:30px;border:none;background:transparent;
  color:var(--ink-4);cursor:pointer;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:.14s;z-index:2}
.lz-save svg{width:var(--ico-md);height:var(--ico-md);fill:none;transition:fill .14s}
.lz-save:hover{background:var(--soft);color:var(--ink-2)}
.lz-save.on{color:var(--warn)}
.lz-save.on svg{fill:var(--warn)}
.lz-save:active{transform:scale(.88)}

.lz-notes{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:16px;margin-bottom:14px}
.lz-notes-h{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.lz-notes-h span:first-child{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.lz-notes-cnt{font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);background:var(--soft);padding:1px 7px;border-radius:5px}
.lz-notes-empty{font-size:var(--fs-base);color:var(--ink-3);font-weight:500;line-height:1.55}
.lz-notes-empty b{color:var(--ink-2)}
.lz-note-chips{display:flex;flex-wrap:wrap;gap:7px}
.lz-note-chip{display:flex;align-items:center;border:1px solid var(--hair-2);border-radius:9px;
  background:var(--surface);cursor:pointer;overflow:hidden;transition:.13s;padding:0}
.lz-note-chip:hover{border-color:var(--ink-4);transform:translateY(-1px)}
.lz-note-chip .c{font-size:var(--fs-md);font-weight:800;padding:7px 4px 7px 11px;color:var(--ink)}
.lz-note-chip.win .c{color:var(--good)} .lz-note-chip.lose .c{color:var(--danger)} .lz-note-chip.route .c{color:var(--warn)}
.lz-note-chip .x{font-size:var(--fs-base);color:var(--ink-4);padding:7px 9px 7px 5px;font-weight:700;transition:color .12s}
.lz-note-chip .x:hover{color:var(--danger)}

/* 연출: 데이터 행 스태거 등장, 트리 분기 등장, 글자 팝 */
@keyframes lzRow{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
#d-rows .lz-mv{animation:lzRow .26s var(--ease-out) both}
.lz-tbranch{animation:lzUp .3s var(--ease-out) both}
@keyframes lzPop{0%{transform:scale(.8);opacity:0}60%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}
.lz-prof-char{animation:lzPop .34s var(--ease-out) both}
@media (prefers-reduced-motion:reduce){#d-rows .lz-mv,.lz-tbranch,.lz-prof-char{animation:none!important}}

/* ── R0: 스켈레톤 로딩 ── */
.lz-skel{padding:8px 16px}
.lz-skel-row{height:48px;border-bottom:1px solid var(--hair);position:relative;overflow:hidden}
.lz-skel-row::after{content:"";position:absolute;inset:12px 40% 12px 0;border-radius:6px;background:var(--soft);
  animation:lzShim 1.2s ease-in-out infinite}
@keyframes lzShim{50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.lz-skel-row::after{animation:none}}

/* ── R1: empty 대시보드 ── */
.lz-dash{max-width:var(--lz-cap);margin:0 auto;padding:8px 4px 40px}
.lz-dash-hero{padding:18px 4px 18px}
.lz-dash-title{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em}
.lz-dash-title span{font-size:var(--fs-base);font-weight:600;color:var(--ink-3)}
.lz-dash-sub{font-size:var(--fs-base);color:var(--ink-2);font-weight:500;margin-top:6px}
.lz-dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.lz-dash-big{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em;margin-bottom:12px}
.lz-dash-big span{font-size:var(--fs-sm);font-weight:600;color:var(--ink-3);margin-left:5px}
.lz-dash-chips{display:flex;flex-wrap:wrap;gap:6px}
.lz-dash-pend{font-size:var(--fs-base);color:var(--ink-4);font-weight:600}
.lz-dash-empty{font-size:var(--fs-base);color:var(--ink-3);font-weight:500;line-height:1.5}
.lz-card-h i{font-style:normal;font-weight:600;color:var(--ink-4);text-transform:none;letter-spacing:0;margin-left:4px}
.lz-dash .lz-liner .lw{font-size:var(--fs-base)}

/* ── R1-A: 룰 홈 ── */
.lz-homewrap{max-width:1000px;margin:0 auto;padding:24px 20px 60px}
.lz-home-hero{padding:16px 4px 24px}
.lz-home-title{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em}
.lz-home-sub{font-size:var(--fs-base);color:var(--ink-2);font-weight:500;margin-top:8px;line-height:1.6;max-width:640px}
.lz-home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.lz-rule-card{text-align:left;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r2);
  padding:18px;cursor:pointer;font-family:inherit;transition:border-color .15s,transform .15s,box-shadow .15s;
  display:flex;flex-direction:column;gap:10px;min-height:132px;animation:lzUp .3s var(--ease-out) both}
.lz-rule-card:hover:not(.soon){border-color:var(--ink-4);transform:translateY(-2px);box-shadow:var(--sh-card)}
.lz-rule-card.on{border-color:var(--good)}
.lz-rule-card.soon{opacity:.6;cursor:default}
.lz-rule-top{display:flex;align-items:center;gap:8px}
.lz-rule-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.lz-rule-name{font-size:16px;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.lz-rule-cur{margin-left:auto;font-size:var(--fs-cap);font-weight:700;color:var(--good);background:var(--good-bg);padding:2px 8px;border-radius:5px}
.lz-rule-soon{margin-left:auto;font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);background:var(--soft);padding:2px 8px;border-radius:5px}
.lz-rule-desc{font-size:var(--fs-base);color:var(--ink-2);font-weight:500;line-height:1.55;flex:1}
.lz-rule-stat{font-size:var(--fs-sm);color:var(--ink-3);font-weight:600;display:flex;align-items:center;gap:10px}
.lz-rule-stat .lz-num{font-size:var(--fs-md);font-weight:800;color:var(--ink)}
.lz-rule-mini{flex:1;display:flex;height:6px;border-radius:4px;overflow:hidden;gap:1px}
.lz-rule-mini span{display:block}
.lz-rule-go{font-size:var(--fs-base);font-weight:700;color:var(--ink-3)}
.lz-rule-card:hover .lz-rule-go{color:var(--ink)}
.lz-home-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--hair)}
.lz-home-link{font-size:var(--fs-base);font-weight:600;color:var(--ink-2);background:var(--surface);border:1px solid var(--hair);
  border-radius:10px;padding:10px 14px;cursor:pointer;font-family:inherit;transition:.13s}
.lz-home-link:hover{border-color:var(--ink-4);color:var(--ink)}

/* ── R1: 통계·분포 탭 ── */
.lz-dtabs{display:flex;gap:2px;padding:4px 0 16px;border-bottom:1px solid var(--hair);margin-bottom:16px}
.lz-dtab{font-size:var(--fs-base);font-weight:600;color:var(--ink-3);padding:7px 13px;border-radius:var(--rs);border:none;background:transparent;font-family:inherit;cursor:pointer;transition:.12s}
.lz-dtab:hover{background:var(--raise);color:var(--ink-2)}
.lz-dtab.on{background:var(--soft);color:var(--ink)}
.lz-6grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.lz-6cell{text-align:center}
.lz-6bar{height:64px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:8px}
.lz-6bar span{width:60%;border-radius:3px 3px 0 0;transition:height .5s var(--ease-out)}
.lz-6n{font-size:var(--fs-base);font-weight:800;letter-spacing:-.02em}
.lz-6l{font-size:var(--fs-cap);color:var(--ink-3);font-weight:600;margin-top:2px}
.lz-cmp{width:100%;border-collapse:collapse;font-size:var(--fs-base)}
.lz-cmp th,.lz-cmp td{padding:7px 8px;text-align:right;border-bottom:1px solid var(--hair)}
.lz-cmp thead th{color:var(--ink-3);font-weight:700}
.lz-cmp tbody td:first-child,.lz-cmp thead td{text-align:left;color:var(--ink-2);font-weight:600}
.lz-cmp .cur{color:var(--good)}
.lz-cmp-load{margin-top:12px;width:100%;font-size:var(--fs-base);font-weight:600;color:var(--ink-2);background:var(--raise);border:1px solid var(--hair-2);border-radius:9px;padding:9px;cursor:pointer;font-family:inherit;transition:.13s}
.lz-cmp-load:hover:not(:disabled){border-color:var(--ink-4);color:var(--ink)}
.lz-cmp-load small{color:var(--ink-4)}
.lz-dist-ctl{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.lz-seg2{display:flex;gap:2px;background:var(--raise);border-radius:9px;padding:3px}
.lz-seg2 button{border:none;background:transparent;font-family:inherit;font-size:var(--fs-sm);font-weight:600;padding:6px 11px;border-radius:7px;color:var(--ink-3);cursor:pointer;transition:.12s}
.lz-seg2 button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-card)}
.lz-dtable{width:100%;border-collapse:collapse;font-size:var(--fs-base)}
.lz-dtable th,.lz-dtable td{padding:8px 6px;text-align:right;border-bottom:1px solid var(--hair)}
.lz-dtable thead th{color:var(--ink-3);font-weight:700;position:sticky;top:0;background:var(--surface)}
.lz-dtable .c1{text-align:left;font-weight:800;font-size:var(--fs-base);width:52px}
.lz-dtable tbody tr{cursor:pointer;transition:background .1s}
.lz-dtable tbody tr:hover{background:var(--raise)}
.lz-dtable td.z{color:var(--ink-4)}
.lz-dtable td.tot{font-weight:800;color:var(--ink)}
.lz-dpage{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);padding:14px;font-size:var(--fs-sm);color:var(--ink-3);font-weight:600} /* gap 14→12 흡수 */
.lz-dpage button{width:30px;height:30px;border-radius:8px;border:1px solid var(--hair-2);background:var(--surface);color:var(--ink-2);cursor:pointer;font-size:var(--fs-md)}
.lz-dpage button:disabled{opacity:.35;cursor:default}
.lz-dpage button:hover:not(:disabled){border-color:var(--ink-4);color:var(--ink)}

/* ── R2: 알약 + 뎁스 그룹 ── */
.lz-lvtoggle{display:inline-flex;gap:2px;background:var(--raise);border-radius:8px;padding:3px;margin:4px 0 14px}
.lz-lvtoggle button{border:none;background:transparent;font-family:inherit;font-size:var(--fs-sm);font-weight:600;padding:6px 14px;border-radius:6px;color:var(--ink-3);cursor:pointer;transition:.12s}
.lz-lvtoggle button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-card)}
.lz-acc{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);overflow:hidden}
.lz-band{border-bottom:1px solid var(--hair)}
.lz-band:last-child{border-bottom:none}
.lz-band-h{display:flex;align-items:center;gap:10px;padding:14px 16px;cursor:pointer;user-select:none;transition:background .15s}
.lz-band-h:hover{background:var(--raise)}
.lz-band-dot{width:9px;height:9px;border-radius:3px;flex-shrink:0;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.lz-band.open .lz-band-dot{transform:scale(1.35)}
.lz-band.win .lz-band-dot{background:var(--good)} .lz-band.warn .lz-band-dot{background:var(--warn)} .lz-band.lose .lz-band-dot{background:var(--danger)}
.lz-band-t{font-size:var(--fs-base);font-weight:700} /* 13.5→13 흡수 */
.lz-band.win .lz-band-t{color:var(--good)} .lz-band.warn .lz-band-t{color:var(--warn)} .lz-band.lose .lz-band-t{color:var(--danger)}
.lz-band-n{font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);background:var(--soft);padding:2px 9px;border-radius:20px}
.lz-band-chev{margin-left:auto;color:var(--ink-4);transition:transform .5s cubic-bezier(.16,1,.3,1),color .2s;font-size:var(--fs-cap)}
.lz-band.open .lz-band-chev{transform:rotate(90deg);color:var(--ink-2)}
.lz-band-body{max-height:0;overflow:hidden;opacity:.5;transition:max-height .8s cubic-bezier(.16,1,.3,1),opacity .55s ease}
.lz-band.open .lz-band-body{opacity:1}
.lz-band-inner{padding:2px 16px 16px;opacity:0;transform:translateY(-14px);transition:opacity .55s ease .05s,transform .8s cubic-bezier(.16,1,.3,1) .05s}
.lz-band.open .lz-band-inner{opacity:1;transform:none}
.lz-pills{display:flex;flex-wrap:wrap;gap:7px}
.lz-pill{display:inline-flex;align-items:baseline;padding:8px 12px;border-radius:10px;background:var(--raise);
  border:1px solid var(--hair-2);cursor:pointer;transition:border-color .13s,transform .13s,background .13s;
  animation:lzpop .5s cubic-bezier(.16,1,.3,1) both}
@keyframes lzpop{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.lz-pill{animation:none;opacity:1;transform:none}}
.lz-pill:hover{border-color:var(--ink-4);transform:translateY(-2px);background:var(--soft)}
.lz-pill:active{transform:scale(.96)}
.lz-pill .w{font-size:var(--fs-base);font-weight:700;color:var(--ink)} /* 14→13 B흡수 */
.lz-pill.win .hl{color:var(--good)} .lz-pill.warn .hl{color:var(--warn)} .lz-pill.lose .hl{color:var(--danger)}
.lz-pill .rate{font-size:var(--fs-cap);font-weight:700;color:var(--ink-3);margin-left:var(--sp-2)}
.lz-pgr{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px;font-size:var(--fs-sm);color:var(--ink-3);font-weight:600}
.lz-pgr button{width:28px;height:28px;border-radius:7px;border:1px solid var(--hair-2);background:var(--surface);color:var(--ink-2);cursor:pointer;font-size:var(--fs-base);transition:.13s}
.lz-pgr button:disabled{opacity:.3;cursor:default}
.lz-pgr button:hover:not(:disabled){border-color:var(--ink-4);color:var(--ink)}
@media (prefers-reduced-motion:reduce){.lz-band-body,.lz-band-inner,.lz-pill{transition:none;animation:none}}

/* ── R3: 다운로드 탭 ── */
.lz-dl-note{font-size:var(--fs-base);color:var(--ink-2);line-height:1.6;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:13px 15px;margin-bottom:16px}
.lz-dl-note b{color:var(--ink)}
.lz-dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.lz-dl-card{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:14px 16px}
.lz-dl-label{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.lz-dl-btn{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sm);font-weight:700;color:var(--ink-2);background:var(--raise);border:1px solid var(--hair-2);border-radius:8px;padding:7px 12px;cursor:pointer;font-family:inherit;transition:.13s;white-space:nowrap}
.lz-dl-btn:hover:not(:disabled){border-color:var(--ink-4);color:var(--ink)}
.lz-dl-btn:disabled{opacity:.7;cursor:default}
.lz-dl-btn .ic{font-size:var(--fs-base)}
.lz-dl-btn .ic.spin{animation:lzspin 1s linear infinite;display:inline-block}
@keyframes lzspin{to{transform:rotate(360deg)}}

/* ── R3: 단어 검색 + 제외단어 ── */
.lz-exclude{display:flex;align-items:center;gap:8px;max-width:var(--lz-cap);margin:0 auto 14px;padding:9px 14px;background:var(--surface);border:1px solid var(--hair);border-radius:10px}
.lz-ex-ic{color:var(--ink-4);font-size:var(--fs-sm);font-weight:700}
#d-ex-input{flex:1;background:transparent;border:none;outline:none;color:var(--ink);font-family:inherit;font-size:var(--fs-base)}
#d-ex-input::placeholder{color:var(--ink-4)}
.lz-ex-clear{font-size:var(--fs-sm);font-weight:600;color:var(--ink-3);background:var(--raise);border:1px solid var(--hair-2);border-radius:7px;padding:5px 10px;cursor:pointer;font-family:inherit}
.lz-ex-clear:hover{color:var(--ink);border-color:var(--ink-4)}
.lz-ws-side{padding:4px}
.lz-ws-q{font-size:var(--fs-lg);font-weight:800;letter-spacing:-.02em;margin-bottom:8px}
.lz-ws-hint{font-size:var(--fs-base);color:var(--ink-2);line-height:1.55}
.lz-ws-count{font-size:var(--fs-sm);color:var(--ink-3);font-weight:600;margin-bottom:10px}

/* ── R3: 임계 단어 what-if ── */
.lz-crit-intro{font-size:var(--fs-base);color:var(--ink-2);line-height:1.6;margin-bottom:16px}
.lz-crit-warn{font-size:var(--fs-sm);color:var(--warn);margin-top:6px}
.lz-crit-input{display:flex;gap:8px;margin-bottom:14px}
#crit-in{flex:1;background:var(--surface);border:1px solid var(--hair-2);border-radius:10px;padding:11px 14px;color:var(--ink);font-family:inherit;font-size:var(--fs-base);outline:none}
#crit-in:focus{border-color:var(--ink-4)}
#crit-in::placeholder{color:var(--ink-4)}
.lz-crit-run{font-size:var(--fs-base);font-weight:700;color:var(--bg);background:var(--good);border:none;border-radius:10px;padding:0 20px;cursor:pointer;font-family:inherit;white-space:nowrap}
.lz-crit-run:hover{filter:brightness(1.08)}
.lz-crit-cands{display:flex;align-items:baseline;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.lz-crit-cl{font-size:var(--fs-sm);font-weight:700;color:var(--ink-3);flex-shrink:0}
.lz-crit-chips{display:flex;flex-wrap:wrap;gap:6px}
.lz-crit-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;position:relative;margin-bottom:6px}
.lz-crit-scard{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:14px 16px}
.lz-crit-slabel{font-size:var(--fs-sm);color:var(--ink-3);font-weight:600;margin-bottom:6px}
.lz-crit-scard .lz-num{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em}
.lz-crit-diff{font-size:var(--fs-sm);font-weight:700;margin-left:4px}
.lz-crit-diff.up{color:var(--good)} .lz-crit-diff.dn{color:var(--danger)}
.lz-crit-meta{grid-column:1/-1;font-size:var(--fs-sm);color:var(--ink-4);font-weight:600;text-align:right;margin-top:2px}
.lz-crit-changed{margin-top:16px;display:flex;flex-direction:column;gap:14px}
.lz-crit-cgl{font-size:var(--fs-base);font-weight:700;margin-bottom:8px}
.lz-crit-cgl.good{color:var(--good)} .lz-crit-cgl.danger{color:var(--danger)} .lz-crit-cgl.warn{color:var(--warn)}
.lz-crit-more{font-size:var(--fs-sm);color:var(--ink-4);font-weight:600;align-self:center}

/* ── R5: 지식 베이스 ── */
.kb-wrap{display:grid;grid-template-columns:260px 1fr;gap:28px;max-width:1100px;margin:0 auto;padding:12px 20px 60px}
.kb-nav{position:sticky;top:16px;align-self:start;display:flex;flex-direction:column;gap:4px}
.kb-nav-h{font-size:var(--fs-cap);font-weight:800;color:var(--ink-4);text-transform:uppercase;letter-spacing:.05em;padding:8px 10px 10px}
.kb-nav-item{display:flex;align-items:flex-start;gap:10px;text-align:left;background:transparent;border:1px solid transparent;border-radius:10px;padding:11px 12px;cursor:pointer;font-family:inherit;transition:.13s}
.kb-nav-item:hover{background:var(--surface)}
.kb-nav-item.on{background:var(--surface);border-color:var(--hair)}
.kb-ni-ic{font-size:16px;line-height:1.3;flex-shrink:0}
.kb-ni-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.kb-ni-t b{font-size:var(--fs-base);font-weight:700;color:var(--ink);letter-spacing:-.01em}
.kb-ni-t small{font-size:var(--fs-cap);color:var(--ink-3);font-weight:500}
.kb-nav-item.on .kb-ni-t b{color:var(--good)}
.kb-doc{min-width:0;max-width:680px}
.kb-doc h1{font-size:27px;font-weight:800;letter-spacing:-.025em;margin-bottom:14px}
.kb-doc h2{font-size:17px;font-weight:800;letter-spacing:-.02em;margin:28px 0 10px}
.kb-doc h3{font-size:var(--fs-md);font-weight:700;margin-bottom:6px;color:var(--ink)}
.kb-doc p{font-size:var(--fs-base);line-height:1.75;color:var(--ink-2);margin-bottom:12px}
.kb-lead{font-size:var(--fs-md) !important;color:var(--ink) !important;line-height:1.7 !important}
.kb-doc b{color:var(--ink);font-weight:700}
.kb-doc b.good{color:var(--good)} .kb-doc b.danger{color:var(--danger)} .kb-doc b.warn{color:var(--warn)}
.kb-list,.kb-ol{margin:0 0 14px;padding-left:4px;list-style:none;display:flex;flex-direction:column;gap:9px}
.kb-list li,.kb-ol li{font-size:var(--fs-base);line-height:1.6;color:var(--ink-2);padding-left:22px;position:relative}
.kb-list li::before{content:"";position:absolute;left:4px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--ink-4)}
.kb-ol{counter-reset:kbo}
.kb-ol li{counter-increment:kbo}
.kb-ol li::before{content:counter(kbo);position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;background:var(--soft);color:var(--ink-2);font-size:var(--fs-cap);font-weight:700;display:flex;align-items:center;justify-content:center}
.kb-tip{background:var(--surface);border:1px solid var(--hair);border-left:3px solid var(--good);border-radius:8px;padding:12px 15px;font-size:var(--fs-base) !important;color:var(--ink-2) !important;margin-top:18px}
.kb-link{color:var(--good);font-weight:700;cursor:pointer;text-decoration:none}
.kb-link:hover{text-decoration:underline}
.kb-more{margin:16px 0;background:var(--surface);border:1px solid var(--hair);border-radius:10px;overflow:hidden}
.kb-more summary{padding:12px 15px;font-size:var(--fs-base);font-weight:700;color:var(--ink-2);cursor:pointer;user-select:none;list-style:none}
.kb-more summary::-webkit-details-marker{display:none}
.kb-more summary::before{content:"▸ ";color:var(--ink-4)}
.kb-more[open] summary::before{content:"▾ "}
.kb-more p{padding:0 15px 14px;margin:0;font-size:var(--fs-base)}
.kb-qa{margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid var(--hair)}
.kb-qa:last-child{border-bottom:none}
.kb-ex,.kb-ex-load{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:16px;margin:14px 0}
.kb-ex-load{font-size:var(--fs-base);color:var(--ink-4);font-weight:600}
.kb-ex-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px}
.kb-ex-lb{font-size:var(--fs-sm);font-weight:700;padding:3px 9px;border-radius:6px;flex-shrink:0}
.kb-ex-lb.good{color:var(--good);background:var(--good-bg)} .kb-ex-lb.danger{color:var(--danger);background:var(--danger-bg)} .kb-ex-lb.warn{color:var(--warn);background:var(--warn-bg)}
.kb-ex-chips{display:flex;flex-wrap:wrap;gap:6px}
.kb-chip{font-size:var(--fs-base);font-weight:700;color:var(--ink);background:var(--raise);border:1px solid var(--hair-2);border-radius:8px;padding:6px 10px;cursor:pointer;font-family:inherit;transition:.13s;display:inline-flex;align-items:baseline;gap:5px}
.kb-chip:hover{border-color:var(--ink-4)}
.kb-chip small{font-size:var(--fs-cap);color:var(--ink-3);font-weight:500}
.kb-ex-note{font-size:var(--fs-sm);color:var(--ink-4);margin-top:6px}
.kb-next{margin-top:36px;font-size:var(--fs-base);font-weight:700;color:var(--ink-2);background:var(--surface);border:1px solid var(--hair-2);border-radius:10px;padding:13px 18px;cursor:pointer;font-family:inherit;transition:.13s;width:100%;text-align:left}
.kb-next:hover{border-color:var(--ink-4);color:var(--ink)}
@media (max-width:720px){.kb-wrap{grid-template-columns:1fr}.kb-nav{position:static;flex-direction:row;overflow-x:auto}.kb-nav-h{display:none}.kb-nav-item{flex-shrink:0}.kb-ni-t small{display:none}}

/* ── R5: 전략 탐색 워크스테이션 ── */
.lz-exp-intro{font-size:var(--fs-base);color:var(--ink-2);line-height:1.6;margin-bottom:16px}
.lz-exp-intro b{color:var(--ink)}
.lz-exp-sub{font-size:var(--fs-sm);color:var(--ink-4);margin-top:6px}
.lz-exp-ctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.lz-exp-lb{font-size:var(--fs-sm);font-weight:700;color:var(--ink-3)}
.lz-exp-run{font-size:var(--fs-base);font-weight:700;color:var(--bg);background:var(--good);border:none;border-radius:9px;padding:9px 18px;cursor:pointer;font-family:inherit}
.lz-exp-run:hover{filter:brightness(1.08)}
.lz-exp-stop{font-size:var(--fs-base);font-weight:700;color:var(--danger);background:var(--danger-bg);border:1px solid var(--danger);border-radius:9px;padding:9px 18px;cursor:pointer;font-family:inherit}
.lz-exp-prog{font-size:var(--fs-sm);color:var(--ink-3);font-weight:600}
.lz-exp-table{width:100%;border-collapse:collapse;font-size:var(--fs-base)}
.lz-exp-table th,.lz-exp-table td{padding:9px 10px;border-bottom:1px solid var(--hair);text-align:left}
.lz-exp-table thead th{color:var(--ink-3);font-weight:700;font-size:var(--fs-sm)}
.lz-exp-table .c1{font-weight:800;font-size:var(--fs-md);width:70px}
.lz-exp-table .cr{text-align:right;font-weight:700;width:60px}
.lz-exp-table tbody tr{cursor:pointer;transition:background .1s}
.lz-exp-table tbody tr:hover{background:var(--raise)}
.lz-exp-table td:nth-child(2){display:flex;align-items:center;gap:10px}
.lz-exp-bar{flex:1;max-width:220px;height:6px;background:var(--soft);border-radius:4px;overflow:hidden}
.lz-exp-bar span{display:block;height:100%;border-radius:4px;transition:width .4s var(--ease-out)}
.lz-exp-rate{font-size:var(--fs-base);font-weight:800;min-width:42px;text-align:right}
.lz-exp-hint{font-size:var(--fs-sm);color:var(--ink-4);margin-top:12px}

/* ── R5: 연결 구조 (SCC) ── */
.lz-scc-intro{font-size:var(--fs-base);color:var(--ink-2);line-height:1.65;margin-bottom:18px}
.lz-scc-intro b{color:var(--ink)}
.lz-scc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}
.lz-scc-big{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em;margin:4px 0 8px}
.lz-scc-big span{font-size:var(--fs-sm);font-weight:600;color:var(--ink-3);margin-left:5px}
.lz-scc-meta{font-size:var(--fs-sm);color:var(--ink-3);font-weight:500}
.lz-scc-hood{margin-bottom:22px}
.lz-scc-hh{font-size:var(--fs-base);font-weight:700;color:var(--ink-2);margin-bottom:10px}
.lz-scc-hh small{color:var(--ink-4);font-weight:500}
.lz-scc-mini{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--hair)}
.lz-scc-sz{font-size:var(--fs-cap);font-weight:800;color:var(--ink-4);background:var(--soft);border-radius:5px;padding:3px 8px;flex-shrink:0}
.lz-scc-note{font-size:var(--fs-sm);color:var(--ink-4);margin-top:8px}
@media (max-width:640px){.lz-scc-cards{grid-template-columns:1fr}}

/* ── R5: 봇 대전 ── */
.fp-botcard{margin-top:10px}
.fp-botseg{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:var(--raise);border-radius:9px;padding:3px}
.fp-botseg button{border:none;background:transparent;font-family:inherit;font-size:var(--fs-sm);font-weight:600;padding:7px 4px;border-radius:6px;color:var(--ink-3);cursor:pointer;transition:.12s}
.fp-botseg button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-card)}
.fp-bothint{font-size:var(--fs-sm);color:var(--ink-4);margin-top:8px}
.fp-botthink{font-size:var(--fs-base);color:var(--warn);font-weight:600;padding:10px 0}
.fp-botdbg{margin-top:14px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;overflow:hidden}
.fp-botdbg summary{padding:11px 14px;font-size:var(--fs-base);font-weight:700;color:var(--ink-2);cursor:pointer;user-select:none;list-style:none}
.fp-botdbg summary::-webkit-details-marker{display:none}
.fp-botdbg summary::before{content:"▸ ";color:var(--ink-4)}
.fp-botdbg[open] summary::before{content:"▾ "}
.fp-botdbg-body{padding:0 14px 14px}
.fp-botdbg-pick{font-size:var(--fs-base);color:var(--ink);margin-bottom:12px}
.fp-botdbg-pick b{font-weight:800}
.fp-botdbg-cl{font-size:var(--fs-cap);font-weight:700;color:var(--ink-4);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.fp-botdbg-row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:7px;font-size:var(--fs-base)}
.fp-botdbg-row.on{background:var(--raise)}
.fp-botdbg-row .w{font-weight:700;color:var(--ink)}
.fp-botdbg-row .e{color:var(--ink-3)}
.fp-botdbg-row .rt{margin-left:auto;color:var(--ink-3);font-weight:600;font-size:var(--fs-sm)}
.fp-bv{font-size:var(--fs-cap);font-weight:700;padding:2px 7px;border-radius:5px}
.fp-bv.win{color:var(--good);background:var(--good-bg)} .fp-bv.route{color:var(--warn);background:var(--warn-bg)} .fp-bv.lose,.fp-bv.illegal{color:var(--danger);background:var(--danger-bg)}

/* ── R4: 커스텀 사전 ── */
.set-custom{margin-top:10px}
.set-custom-add{font-size:var(--fs-base);font-weight:700;color:var(--ink-2);background:var(--surface);border:1px dashed var(--hair-2);border-radius:9px;padding:9px 14px;cursor:pointer;font-family:inherit;width:100%;transition:.13s}
.set-custom-add:hover{border-color:var(--ink-4);color:var(--ink)}
.set-custom-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.set-custom-item{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--hair);border-radius:8px;padding:9px 12px}
.set-ci-name{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.set-ci-meta{font-size:var(--fs-sm);color:var(--ink-3);margin-left:2px}
.set-ci-del{margin-left:auto;font-size:var(--fs-sm);color:var(--ink-4);background:transparent;border:none;cursor:pointer;padding:4px 6px;border-radius:5px}
.set-ci-del:hover{color:var(--danger);background:var(--danger-bg)}

/* ── R4: 룰 팝오버 커스텀 사전 ── */
.pad-cd{position:relative;padding-right:22px !important}
.pad-cd-x{position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--ink-4);opacity:0;transition:.12s;padding:2px}
.pad-cd:hover .pad-cd-x{opacity:1}
.pad-cd-x:hover{color:var(--danger)}
.pad-cd-add{font-weight:800;color:var(--ink-3) !important;min-width:28px}
.pad-cd-add:hover{color:var(--ink) !important}

/* ── 모바일 터치 최적화 ── */
@media (max-width:720px){
  .lz-search{min-height:44px}
  #search-input{padding-top:13px;padding-bottom:13px}
  .lz-chip-rule,#rule-chip{min-height:44px;padding-top:8px;padding-bottom:8px}
  .lz-side{width:min(280px,82vw);flex-basis:min(280px,82vw);max-width:82vw}
}

/* ── 모바일: 대시보드 7탭 가로 스크롤 (줄바꿈 방지, 1줄 유지) ── */
@media (max-width:720px){
  .lz-dtabs{
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;              /* Firefox */
    padding-bottom:12px;
    gap:4px;
    /* 오른쪽 끝 페이드로 '더 있음' 신호 */
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);
    mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);
  }
  .lz-dtabs::-webkit-scrollbar{display:none}   /* Safari/Chrome */
  .lz-dtab{
    flex:0 0 auto;                     /* 줄어들지 않음 */
    white-space:nowrap;                /* 라벨 1줄 */
    padding:8px 14px;
    scroll-snap-align:start;
  }
  .lz-dtabs{scroll-snap-type:x proximity}
}

/* ── 단어 칩 (여러 글자 단어용, auto-width) ── */
.lz-wchip{display:inline-flex;align-items:center;font-size:var(--fs-base);font-weight:600;color:var(--ink);background:var(--raise);
  border:1px solid var(--hair-2);border-radius:8px;padding:6px 11px;cursor:pointer;font-family:inherit;
  white-space:nowrap;transition:.12s;line-height:1.2}
.lz-wchip:hover{border-color:var(--ink-4);background:var(--soft)}

/* ── 대시보드 카드 높이 정렬 ── */
.lz-dash-grid{align-items:stretch}
.lz-dash-grid > .lz-card{height:100%;display:flex;flex-direction:column}

/* ── 아코디언 모서리 정리: 마지막 밴드 하단 테두리 제거 ── */
.lz-acc .lz-band:last-child{border-bottom:none}

/* ── 인터랙티브 연출 ── */
.lz-distbar span{transition:width .9s cubic-bezier(.16,1,.3,1)}
.lz-6bar span{transition:height .8s cubic-bezier(.16,1,.3,1)}
.lz-num[data-count]{font-variant-numeric:tabular-nums}
/* SCC 미니 카드 (통계 안에서) */
.lz-scc-mini-card{background:var(--raise);border:1px solid var(--hair);border-radius:var(--r1);padding:16px;text-align:center;transition:border-color .16s,transform .16s}
.lz-scc-mini-card:hover{border-color:var(--hair-2);transform:translateY(-2px)}
.lz-scc-lbl{font-size:var(--fs-sm);color:var(--ink-3);margin-top:6px;font-weight:600}
.lz-scc-lbl b{color:var(--ink-2)}
/* 카드 호버 살짝 들림 */
.lz-dash-grid > .lz-card{transition:border-color .16s,transform .16s,box-shadow .16s}
.lz-dash-grid > .lz-card:hover{border-color:var(--hair-2);transform:translateY(-2px);box-shadow:0 6px 20px -8px rgba(0,0,0,.4)}
/* 칩 호버 색 변화 */
.lz-chip{transition:border-color .13s,background .13s,color .13s,transform .1s}
.lz-chip:hover{transform:translateY(-1px)}
/* 탭 전환 언더라인 */
.lz-dtab{position:relative}
.lz-dtab.on::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--good);border-radius:2px;animation:lzTabIn .25s var(--ease-out)}
@keyframes lzTabIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ── 2단계: 검색 결과 등장 연출 ── */
/* 밴드 순차 등장 */
.lz-acc .lz-band{animation:lzBandIn .4s var(--ease-out) both}
.lz-acc .lz-band:nth-child(1){animation-delay:.02s}
.lz-acc .lz-band:nth-child(2){animation-delay:.06s}
.lz-acc .lz-band:nth-child(3){animation-delay:.10s}
.lz-acc .lz-band:nth-child(4){animation-delay:.14s}
.lz-acc .lz-band:nth-child(5){animation-delay:.18s}
.lz-acc .lz-band:nth-child(n+6){animation-delay:.22s}
@keyframes lzBandIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* 프로필 통계 숫자 강조 */
.lz-pstat .n{transition:transform .2s}
.lz-pstat:hover .n{transform:scale(1.08)}
/* 프로필 판정 글자 등장 유지(lzPop) + 은은한 강조 */
.lz-prof-verdict{animation:lzFadeUp .45s var(--ease-out) both .1s}
.lz-prof-sub{animation:lzFadeUp .45s var(--ease-out) both .18s}
@keyframes lzFadeUp{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.lz-acc .lz-band,.lz-prof-verdict,.lz-prof-sub{animation:none!important}}

/* ── 3단계: 그래프 생동감 ── */
.lz-depthbar{transition:transform .6s cubic-bezier(.16,1,.3,1)}
.lz-exp-bar span{transition:width .7s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){.lz-depthbar,.lz-exp-bar span{transition:none}}

/* ── 4단계: 한눈에 카드 밀도 정리 ── */
.lz-dash-grid-v2{grid-template-columns:repeat(3,1fr)}
.lz-card-hero{grid-row:span 1}
.lz-card-hero .lz-dash-big{font-size:30px}
/* 루트 음절 주요/희귀 2분할 */
.lz-rt-split,.lz-rec-split{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.lz-rt-lbl{font-size:var(--fs-sm);font-weight:700;color:var(--ink-2);margin-bottom:10px;display:flex;align-items:baseline;gap:6px}
.lz-rt-lbl span{font-size:var(--fs-cap);font-weight:500;color:var(--ink-4)}
.lz-rt-col:first-child{border-right:1px solid var(--hair);padding-right:20px}
.lz-rec-col:first-child{border-right:1px solid var(--hair);padding-right:20px}
@media (max-width:860px){.lz-dash-grid-v2{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.lz-dash-grid-v2{grid-template-columns:1fr}.lz-rt-split,.lz-rec-split{grid-template-columns:1fr;gap:16px}.lz-rt-col:first-child,.lz-rec-col:first-child{border-right:none;padding-right:0;border-bottom:1px solid var(--hair);padding-bottom:16px}}

/* ── 5단계: 온보딩/로드맵 ── */
.lz-quickstart{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px}
.lz-qs-lbl{font-size:var(--fs-sm);font-weight:700;color:var(--ink-3)}
.lz-qs-chip{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;
  border-radius:9px;background:var(--good-bg,var(--raise));border:1px solid var(--good-dim,var(--hair-2));
  color:var(--good,var(--ink));font-weight:800;font-size:var(--fs-md);cursor:pointer;font-family:inherit;
  transition:transform .12s,background .12s,box-shadow .12s}
.lz-qs-chip:hover{transform:translateY(-2px);box-shadow:0 4px 12px -4px var(--good-dim,rgba(0,0,0,.3))}
.lz-qs-or{font-size:var(--fs-sm);color:var(--ink-4);margin-left:2px}
.lz-dtab-hint{font-size:var(--fs-base);color:var(--ink-3);margin:-6px 0 16px;padding-left:2px;animation:lzFadeUp .3s var(--ease-out) both}
@media (prefers-reduced-motion:reduce){.lz-dtab-hint{animation:none}}

/* ── 1번 폴리시: 도구 일관성 (빠진 호버·전환 보강) ── */
.rv-go{transition:background .14s,transform .1s,box-shadow .14s}
.rv-go:hover{transform:translateY(-1px);box-shadow:0 4px 14px -6px rgba(0,0,0,.35)}
.rv-go:active{transform:translateY(0)}
/* 지식 문서 전환 부드럽게 */
.kb-doc{animation:lzFadeUp .3s var(--ease-out) both}
.kb-nav-item{transition:background .13s,color .13s,transform .1s}
.kb-nav-item:hover{transform:translateX(2px)}
/* 아카이브 기보 항목 호버 */
.rv-arch-item,[class*="rv-arch"]{transition:background .13s,border-color .13s}
@media (prefers-reduced-motion:reduce){.kb-doc{animation:none}}

/* ══════════ 복기·플레이 UI 개선: 폭 제한 + 카드 구조화 ══════════ */

/* ── 복기 셋업 ── */
.rv-setup{max-width:660px;margin:0 auto;padding:28px 0!important}
.rv-intro{font-size:var(--fs-base)!important;color:var(--ink-2)!important;text-align:center;margin-bottom:22px!important}
/* 입력 영역을 카드로 묶기 */
.rv-setup .rv-field,.rv-setup .rv-seat,.rv-setup .rv-go{position:relative}
.rv-card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);padding:18px;margin-bottom:18px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.rv-flabel{font-size:var(--fs-base)!important;font-weight:700!important;color:var(--ink-2)!important}
/* 아카이브 헤더 강조 */
.rv-arch{margin-top:28px!important}
.rv-arch-item{transition:border-color .14s,transform .12s,box-shadow .14s}
.rv-arch-item:hover{box-shadow:0 4px 14px -6px rgba(0,0,0,.3)}

/* ══════════ 복기·플레이 시각 세련도 (레퍼런스: 체스 게임리뷰) ══════════ */
/* 복기: 정확도 스탯 강조 (체스닷컴식 큰 점수) */
.rv2 .lz-prof-stats{gap:0}
.rv2 .lz-pstat{padding:14px 8px}
.rv2 .lz-pstat .n{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.02em}
.rv2-pct{font-size:var(--fs-base);font-weight:700;margin-left:1px}
.rv2 .lz-pstat > .l:not(.n){font-size:var(--fs-sm);color:var(--ink-3);margin-top:3px}
/* 수순 rail: 무브리스트 느낌 */
/* 그래프 카드 여백 */
.rv2-graph-card{padding:16px 18px}
/* 플레이: 받은 글자 히어로 */
.fp-current{background:linear-gradient(180deg,var(--raise),transparent);border-radius:var(--r1);padding:16px 18px;margin-bottom:12px;align-items:center}
.fp-cur-char{font-size:var(--fs-display)!important;font-weight:800;letter-spacing:-.02em;background:var(--surface);width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;border:1px solid var(--hair)}
.fp-cur-who{font-size:var(--fs-base)!important;font-weight:600;color:var(--ink-2)!important}

/* ══════════ 복기 그래프: 줌·시점·애니메이션 ══════════ */
.rvg-head{position:relative;flex-wrap:wrap}
.rvg-ctl{display:flex;align-items:center;gap:8px;margin-left:auto}
.rvg-pers{font-size:var(--fs-sm);font-weight:700;color:var(--ink-2);background:var(--raise);border:1px solid var(--hair);
  border-radius:999px;padding:5px 11px;cursor:pointer;font-family:inherit;transition:.13s;white-space:nowrap}
.rvg-pers:hover{border-color:var(--ink-4);color:var(--ink)}
.rvg-zoom{display:inline-flex;align-items:center;gap:2px;background:var(--raise);border:1px solid var(--hair);border-radius:999px;padding:2px}
.rvg-zoom button{border:none;background:transparent;color:var(--ink-2);font-size:var(--fs-base);font-weight:700;font-family:inherit;
  cursor:pointer;width:26px;height:24px;border-radius:999px;transition:.12s}
.rvg-zoom button:hover:not(:disabled){background:var(--surface);color:var(--ink)}
.rvg-zoom button.on{background:var(--good);color:#fff}
.rvg-zoom button:disabled{opacity:.3;cursor:default}
.rvg-zoom #rvg-fit{width:auto;padding:0 10px;font-size:var(--fs-cap)}
.rvg-zlbl{font-size:var(--fs-cap);color:var(--ink-4);min-width:26px;text-align:center;font-weight:600}
/* 전체 맞춤: SVG가 컨테이너 폭에 꽉 참 (스크롤 없음) */
.rvg-scroll.fit{overflow-x:hidden}
.rvg-scroll.fit svg{width:100%;height:128px}
/* 선 그려지는 애니메이션 (pathLength=1 기준) */
.rvg-line{transition:stroke-dashoffset .9s ease}
.rvg-area{animation:rvgArea .7s ease both}
@keyframes rvgArea{from{opacity:0}to{opacity:.07}}
.rvg-dot{animation:rvgDot .4s ease both}
@keyframes rvgDot{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.rvg-dot.sel{stroke:var(--ink);stroke-width:2.5}
@media (prefers-reduced-motion:reduce){.rvg-line,.rvg-area,.rvg-dot{animation:none!important;transition:none!important}}


/* ══════════ 복기: 판정 전이 배지 (전문 레이어) ══════════ */
.rv-trans{display:flex;align-items:center;gap:14px;padding:12px 14px;margin:12px 0;
  background:var(--raise);border:1px solid var(--hair);border-radius:var(--r1);flex-wrap:wrap}
.rv-trans-cell{display:flex;flex-direction:column;gap:3px}
.rv-trans-lbl{font-size:var(--fs-cap);color:var(--ink-4)}
.rv-trans-v{font-size:var(--fs-md);font-weight:800;letter-spacing:-.01em}
.rv-trans-v.v-win{color:var(--good)}
.rv-trans-v.v-lose{color:var(--danger)}
.rv-trans-v.v-route{color:var(--warn)}
.rv-trans-arr{font-size:var(--fs-lg);color:var(--ink-4);font-weight:400}
@media (prefers-reduced-motion:no-preference){.rv-trans{animation:lzFadeUp .3s var(--ease-out) both}}

/* ══════════ 플레이 연출 일관성 ══════════ */
.fp-current{animation:lzFadeUp .3s var(--ease-out) both}
.fp-best{animation:lzFadeUp .34s var(--ease-out) both .05s}
/* 실전 정석 주석(복기) — 엔진 최선수 바와 같은 골격, DB 강조색(good) */
.fp-best.rv-db{border-left:2px solid var(--good)}
.fp-best.rv-db .fp-best-lbl{color:var(--good)}
.fp-best-play{transition:transform .12s,box-shadow .14s}
.fp-best-play:hover{transform:translateY(-1px);box-shadow:0 4px 12px -5px rgba(0,0,0,.35)}
.lab-moves .lz-grp,.fp2 .lz-grp{transition:border-color .13s,transform .1s}
@media (prefers-reduced-motion:reduce){.fp-current,.fp-best{animation:none}}


/* ══════════ 이기는 수순 (인라인) ══════════ */
.lz-pill.has-line{padding-right:6px}
.lz-pill-play{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:6px;
  border-radius:50%;background:var(--good);color:#fff;font-size:10px;flex-shrink:0;transition:transform .12s}
.lz-pill.has-line:hover .lz-pill-play{transform:scale(1.15)}
.lz-pill.line-on{box-shadow:0 0 0 2px var(--good)}
.lz-pill.line-on .lz-pill-play{background:var(--ink)}
.lz-line-inline{background:var(--good-bg);border-bottom:1px solid var(--hair);border-left:3px solid var(--good);
  margin:0;overflow:hidden;opacity:0;transform:translateY(-4px);
  transition:opacity .25s var(--ease-out),transform .25s var(--ease-out)}
.lz-line-inline.in{opacity:1;transform:none}
.lz-line-load{padding:22px;text-align:center;color:var(--ink-3);font-size:var(--fs-base)}
.lz-line-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:16px 18px 12px}
.lz-line-title{font-size:var(--fs-base);font-weight:800;color:var(--ink)}
.lz-line-sub{font-size:var(--fs-sm);color:var(--ink-3);flex:1;min-width:160px;line-height:1.5}
.lz-line-x{background:var(--surface);border:1px solid var(--hair);width:26px;height:26px;border-radius:7px;cursor:pointer;
  color:var(--ink-3);font-size:var(--fs-cap);flex-shrink:0;transition:.12s}
.lz-line-x:hover{background:var(--danger-bg);color:var(--danger);border-color:transparent}

/* 이기는 수순 — 가로 흐름 */
.lz-line-flow{display:flex;flex-wrap:wrap;align-items:center;column-gap:5px;row-gap:10px;padding:12px 18px 16px;line-height:1.4}
.lz-seq-w{font-size:var(--fs-base);font-weight:700;padding:5px 11px;border-radius:8px;white-space:nowrap;
  animation:lzSeqPop .3s var(--ease-out) both}
.lz-seq-w.me{background:var(--good-bg);color:var(--good)}
.lz-seq-w.opp{background:var(--surface);color:var(--ink-2);border:1px solid var(--hair)}
@keyframes lzSeqPop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.lz-seq-arr{display:inline-flex;align-items:center;color:var(--ink-4);font-size:var(--fs-sm);margin:0 1px}
.lz-seq-win{display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-base);font-weight:800;color:var(--good);margin-left:2px;
  padding:3px 10px;border-radius:7px;background:var(--good-bg);margin-left:2px}
.lz-line-legend{display:flex;flex-wrap:wrap;gap:14px;padding:4px 18px 16px;font-size:var(--fs-sm);color:var(--ink-3);border-top:1px solid var(--hair-2,rgba(0,0,0,.04));margin-top:2px}
.lz-line-legend span{display:inline-flex;align-items:center;gap:5px}
.lz-line-legend i{width:11px;height:11px;border-radius:3px;display:inline-block}
.lz-line-legend i.me{background:var(--good)}
.lz-line-legend i.opp{background:var(--ink-4)}
@media (prefers-reduced-motion:reduce){.lz-seq-w{animation:none}}

/* 이기는 수순 — 클릭 가능 칩 + 변화수 피커 */
.lz-seq-w{border:none;font-family:inherit;cursor:pointer}
.lz-seq-w:hover{filter:brightness(.96);box-shadow:0 2px 8px -3px rgba(0,0,0,.3)}
.lz-seq-w.changed{outline:2px solid var(--warn);outline-offset:1px}
.lz-seq-win.lose{background:var(--danger-bg);color:var(--danger)}
.lz-line-title.lose{color:var(--danger)}
.lz-line-reset{background:var(--raise);border:1px solid var(--hair);border-radius:7px;font-size:var(--fs-sm);font-weight:700;
  color:var(--ink-2);padding:4px 10px;cursor:pointer;font-family:inherit;transition:.12s;margin-left:auto}
.lz-line-reset:hover{border-color:var(--ink-4);color:var(--ink)}
.lz-line-tip{color:var(--ink-4);font-size:var(--fs-cap)}
.lz-var-picker{margin:0 18px 16px;padding:14px;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r1);
  animation:lzFadeUp .22s var(--ease-out) both}
.lz-var-head{font-size:var(--fs-sm);color:var(--ink-2);margin-bottom:11px;line-height:1.5}
.lz-var-note{color:var(--ink-4)}
.lz-var-list{display:flex;flex-wrap:wrap;gap:8px}
.lz-var-w{display:inline-flex;align-items:center;gap:6px;font-family:inherit;cursor:pointer;font-size:var(--fs-base);font-weight:600;
  padding:5px 10px;border-radius:8px;border:1px solid var(--hair);background:var(--raise);color:var(--ink);transition:.12s}
.lz-var-w i{font-style:normal;font-size:var(--fs-micro);font-weight:700;padding:1px 5px;border-radius:5px}
.lz-var-w.win i{background:var(--good-bg);color:var(--good)}
.lz-var-w.lose i{background:var(--danger-bg);color:var(--danger)}
.lz-var-w.route i{background:var(--warn-bg,#3a2f12);color:var(--warn)}
.lz-var-w:hover{border-color:var(--ink-3);transform:translateY(-1px)}
.lz-var-w.win{border-color:var(--good-dim,var(--hair))}
.lz-var-empty,.lz-var-more{font-size:var(--fs-sm);color:var(--ink-4);padding:4px 2px}
@media (prefers-reduced-motion:reduce){.lz-var-picker{animation:none}}
.lz-seq-win.route{background:var(--warn-bg,#3a2f12);color:var(--warn)}
.lz-line-title.route{color:var(--warn)}

/* 플레이: 이기는 수순 버튼 */
.fp-best-line{background:var(--good-bg);border:1px solid var(--good-dim,var(--good));color:var(--good);
  font-family:inherit;font-size:var(--fs-base);font-weight:700;padding:6px 12px;border-radius:8px;cursor:pointer;transition:.12s;white-space:nowrap}
.fp-best-line:hover{background:var(--good);color:#fff}
.fp-best-line.on{background:var(--good);color:#fff}

/* 핵심 승리 수순 ▶ */
.lz-liner{position:relative}
.lz-liner-play{margin-left:auto;background:var(--good-bg);border:none;color:var(--good);width:20px;height:20px;
  border-radius:50%;font-size:10px;cursor:pointer;flex-shrink:0;transition:transform .12s}
.lz-liner-play:hover{transform:scale(1.15)}
.lz-sum .lz-line-inline{margin-top:8px;border-radius:var(--r1);border:1px solid var(--good-dim,var(--hair));border-left:3px solid var(--good)}

/* ══════════ 인터랙션 보강 (빈 곳 채우기) ══════════ */
/* 플레이 단어 행 — 클릭해서 두기 */
.lab-row{transition:background .13s,transform .1s,box-shadow .13s}
.lab-row:hover{background:var(--raise);transform:translateX(2px)}
.lab-row:active{transform:translateX(2px) scale(.995)}
/* 복기 좌석/관점 토글 버튼 */
.rv-seat-tog button{transition:background .12s,color .12s}
.rv-seat-tog button:hover:not(.on){background:var(--raise);color:var(--ink)}
/* 알약·칩 눌림 피드백 */
.lz-pill:active,.lz-chip:active,.lz-qs-chip:active,.lz-var-w:active{transform:scale(.96)}
.lz-seq-w:active{transform:scale(.96)}
/* 판정 배지 등장 시 은은한 강조 (복기 전이) */
.rv-trans-v{transition:transform .15s}
.rv-trans:hover .rv-trans-v{transform:scale(1.04)}
/* 통계/분포 표 행 호버 */
.lz-dtable tbody tr,.lz-exp-table tbody tr{transition:background .12s}
.lz-dtable tbody tr:hover,.lz-exp-table tbody tr:hover{background:var(--raise)}
/* 6분류 막대 호버 시 값 강조 */
.lz-6cell{transition:transform .12s}
.lz-6cell:hover{transform:translateY(-2px)}

/* ══════════ 유불리 스펙트럼 (가로 포인터) ══════════ */
.lz-eval{display:flex;align-items:center;gap:9px;margin-top:16px;padding:0 2px}
.lz-eval-end{font-size:var(--fs-cap);font-weight:700;flex-shrink:0;color:var(--ink-4)}
.lz-eval-end.lose{color:var(--danger)}
.lz-eval-end.win{color:var(--good)}
.lz-eval-track{position:relative;flex:1;height:8px;border-radius:999px;
  background:linear-gradient(90deg,var(--danger) 0%,var(--warn) 50%,var(--good) 100%);opacity:.9}
.lz-eval-ptr{position:absolute;top:50%;left:50%;width:16px;height:16px;border-radius:50%;
  background:var(--surface);border:3px solid var(--ink-4);transform:translate(-50%,-50%);
  transition:left .7s cubic-bezier(.16,1,.3,1);box-shadow:0 1px 4px rgba(0,0,0,.25)}
.lz-eval.win .lz-eval-ptr{border-color:var(--good)}
.lz-eval.lose .lz-eval-ptr{border-color:var(--danger)}
.lz-eval.route .lz-eval-ptr{border-color:var(--warn)}
@media (prefers-reduced-motion:reduce){.lz-eval-ptr{transition:none}}

/* 빈 상태 이유 설명 (한방단어·돌림단어) */
.lz-empty-why{margin-top:10px;font-size:var(--fs-base);color:var(--ink-3);line-height:1.6;max-width:420px;
  margin-left:auto;margin-right:auto;padding:10px 14px;background:var(--raise);border-radius:var(--r1)}
.lz-empty-why b{color:var(--ink-2);font-weight:700}

/* ══════════ 사이드바 글자 검색 ══════════ */
.lz-side-search{position:relative;margin:0 6px 8px}
.lz-side-search input{width:100%;box-sizing:border-box;padding:7px 26px 7px 11px;border:1px solid var(--hair);
  border-radius:var(--r1);background:var(--surface);color:var(--ink);font-family:inherit;font-size:var(--fs-base);transition:border-color .13s}
.lz-side-search input:focus{outline:none;border-color:var(--good)}
.lz-side-search input::placeholder{color:var(--ink-4)}
.lz-side-qx{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:var(--raise);border:none;
  width:18px;height:18px;border-radius:50%;color:var(--ink-3);font-size:10px;cursor:pointer;transition:.12s}
.lz-side-qx:hover{background:var(--danger-bg);color:var(--danger)}
.lz-seg.dim{opacity:.4;pointer-events:none}
/* 검색 결과 칩: 유형 색 좌측 표시 */
.lz-chip.t-win{border-left:3px solid var(--good)}
.lz-chip.t-route{border-left:3px solid var(--warn)}
.lz-chip.t-lose{border-left:3px solid var(--danger)}

/* ── 접근성: 키보드 포커스 링 (:focus-visible — 마우스 클릭엔 안 뜸) ── */
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}