:root {
  --bl: #3182F6;
  --bl2: #1B64DA;
  --ind: #6C5CE7;
  --blglow: #EBF3FE;
  --ink: #191F28;
  --g1: #333D4B;
  --g2: #4E5968;
  --g3: #8B95A1;
  --g4: #B0B8C1;
  --g5: #E5E8EB;
  --g6: #F2F4F6;
  --bg: #F7F8FA;
  --wht: #fff;
  --grn: #00C471;
  --grnbg: #E6FAF0;
  --amb: #FF9500;
  --ambbg: #FFF6E9;
  --red: #F04452;
  --redbg: #FDECEE;
  --dark: #0E1626;
  --gold: #B08D57;
  --gold-deep: #8A6A3D;
  --gold-bg: #FBF3E4;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  word-break: keep-all;
  overflow-wrap: break-word;
}

h1, h2, h3, .ld-hero h1, .ld-hero p, .ld-badge, .ld-eyebrow {
  text-wrap: balance;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--bl);
  outline-offset: 2px;
}

.skip-link {
  position: fixed;
  left: 0;
  top: 0;
  transform: translateY(-140%);
  z-index: 240;
  background: var(--bl);
  color: #fff;
  padding: 9px 14px;
  border-radius: 0 0 10px 0;
  text-decoration: none;
  transition: transform .15s;
}

.skip-link:focus-visible {
  transform: translateY(0);
}

.app { display: flex; min-height: 100vh; }

/* ===== SIDEBAR ===== */
.side {
  width: 220px;
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--dark) 0%, #0a0f1a 100%);
  padding: 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: sticky;
  top: 0;
  height: 100vh;
}
.logo { display: flex; align-items: center; gap: 10px; padding: 6px 10px 22px; }
.logo .mk { width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg, var(--bl), var(--ind)); display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 16px; box-shadow: 0 0 0 2px rgba(176, 141, 87, .35), 0 6px 14px rgba(0, 0, 0, .28); }
.logo .tx { font-size: 14px; font-weight: 700; color: #fff; line-height: 1.25; }
.logo .tx small { display: block; font-size: 10px; color: #7A8394; font-weight: 500; }
.nav { display: flex; flex-direction: column; gap: 3px; }
.nav-i { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border-radius: 10px; font-size: 14px; font-weight: 600; color: #9AA4B2; text-decoration: none; transition: all .12s; }
.nav-i i { font-size: 18px; }
.nav-i:hover { background: rgba(255,255,255,.06); color: #fff; }
.nav-i.on { background: rgba(49,130,246,.16); color: #5B9BF7; box-shadow: inset 2px 0 0 var(--gold); }
.side-foot { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 12px 8px 4px; border-top: 1px solid rgba(255,255,255,.08); }
.av { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, var(--ind), var(--bl)); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; font-weight: 700; flex-shrink: 0; }
.side-id { display: flex; flex-direction: column; }
.side-id .nm { font-size: 13px; font-weight: 600; color: #E5E8EB; line-height: 1.2; }
.side-id .rl { font-size: 10px; color: #7A8394; }

/* ===== MAIN ===== */
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.top { height: 62px; background: var(--wht); border-bottom: 1px solid var(--g5); display: flex; align-items: center; padding: 0 22px; gap: 16px; position: sticky; top: 0; z-index: 30; }
.menu-btn { display: none; background: var(--g6); border: none; width: 38px; height: 38px; border-radius: 9px; color: var(--g2); font-size: 18px; cursor: pointer; }
.ptitle { font-size: 17px; font-weight: 700; color: var(--ink); letter-spacing: -.01em; }
.ptitle small { display: block; font-size: 11px; font-weight: 500; color: var(--g3); letter-spacing: 0; margin-top: 2px; }
.search { margin-left: auto; display: flex; align-items: center; gap: 8px; background: var(--g6); border-radius: 10px; padding: 9px 14px; width: 200px; }
.search i { font-size: 15px; color: var(--g3); }
.search span { font-size: 13px; color: var(--g4); }
.tbtn { width: 38px; height: 38px; border-radius: 10px; background: var(--g6); border: none; display: flex; align-items: center; justify-content: center; color: var(--g2); position: relative; cursor: pointer; font-size: 17px; }
.tbtn .badge { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }

.alert-bar { display: flex; align-items: center; gap: 9px; background: var(--ambbg); color: #C56F00; font-size: 13px; font-weight: 600; padding: 11px 22px; border-bottom: 1px solid #FAE2BD; }
.alert-bar i { font-size: 16px; }

.tabs { display: flex; gap: 4px; padding: 16px 22px 0; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab { padding: 10px 18px; border-radius: 11px 11px 0 0; font-size: 14px; font-weight: 600; color: var(--g3); cursor: pointer; display: flex; align-items: center; gap: 7px; transition: all .12s; border: 1px solid transparent; border-bottom: none; background: transparent; font-family: inherit; flex: 0 0 auto; white-space: nowrap; }
.tab i { font-size: 16px; }
.tab.on { background: var(--wht); color: var(--bl); border-color: var(--g5); box-shadow: inset 0 2px 0 var(--gold); }

.content { padding: 22px; flex: 1; }

/* ===== KPI ===== */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 22px; }
.kpi { background: var(--wht); border: 1px solid var(--g5); border-radius: 14px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(24, 32, 44, .03), 0 12px 28px rgba(24, 32, 44, .06); }
.kpi .lb { font-size: 12px; color: var(--g3); font-weight: 600; margin-bottom: 9px; display: flex; align-items: center; gap: 5px; }
.kpi .lb i { font-size: 14px; }
.kpi .v { font-size: 28px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; line-height: 1; display: block; }
.kpi .v small { font-size: 15px; color: var(--g4); font-weight: 600; }
.kpi .d { font-size: 11px; font-weight: 600; margin-top: 8px; display: flex; align-items: center; gap: 4px; }
.kpi .d.up { color: var(--grn); }
.kpi .d.down { color: var(--red); }
.kpi .d.warn { color: var(--amb); }

/* ===== PANEL ===== */
.panel { background: var(--wht); border: 1px solid var(--g5); border-radius: 14px; padding: 18px; margin-bottom: 16px; box-shadow: 0 1px 2px rgba(24, 32, 44, .03), 0 16px 32px rgba(24, 32, 44, .06); }
.panel-h { font-size: 15px; font-weight: 700; color: var(--ink); margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.panel-h .sub { font-size: 12px; font-weight: 600; color: var(--g3); }

/* funnel */
.funnel { display: flex; flex-direction: column; gap: 12px; }
.frow { display: flex; align-items: center; gap: 14px; }
.fname { width: 96px; font-size: 13px; font-weight: 600; color: var(--g1); flex-shrink: 0; display: flex; align-items: center; gap: 7px; }
.fdot { width: 9px; height: 9px; border-radius: 3px; }
.fbar-wrap { flex: 1; height: 28px; background: var(--g6); border-radius: 9px; overflow: hidden; }
.fbar { height: 100%; width: 0; border-radius: 9px; display: flex; align-items: center; padding-left: 12px; color: #fff; font-size: 13px; font-weight: 700; }

/* table */
.tbl-wrap { overflow-x: auto; max-width: 100%; padding-bottom: 2px; }
.tbl { width: 100%; border-collapse: collapse; min-width: 1120px; table-layout: fixed; }
.tbl th { font-size: 11px; font-weight: 700; color: var(--g3); text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--g5); text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; word-break: keep-all; }
.tbl td { padding: 12px 10px; border-bottom: 1px solid var(--g6); font-size: 13px; color: var(--g1); vertical-align: middle; white-space: normal; word-break: keep-all; overflow-wrap: anywhere; }
.trow { opacity: 0; transform: translateX(-8px); transition: opacity .4s, transform .4s; }
.trow.in { opacity: 1; transform: translateX(0); }
.trow:hover td { background: var(--bg); }
.tbl-empty {
  color: var(--g3);
  text-align: center;
  padding: 18px 12px;
  font-size: 13px;
  line-height: 1.6;
}
.tbl-empty i { margin-right: 4px; }
.cust { display: flex; align-items: center; gap: 10px; }
.cust .ca { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; flex-shrink: 0; }
.cust .cn { font-weight: 700; color: var(--ink); font-size: 13px; }
.cust .ci { font-size: 11px; color: var(--g3); }
.pill { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.pill.ok { background: var(--grnbg); color: #00874E; }
.pill.wait { background: var(--ambbg); color: #C56F00; }
.pill.miss { background: var(--redbg); color: #C2293A; }
.pill.blue { background: var(--blglow); color: var(--bl2); }
.scope { display: flex; gap: 4px; }
.chip { font-size: 10px; font-weight: 600; padding: 3px 8px; border-radius: 6px; background: var(--g6); color: var(--g3); }
.chip.on { background: var(--blglow); color: var(--bl2); }
.risk { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; }
.risk .rd { width: 8px; height: 8px; border-radius: 50%; }
.csvbtn { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--g2); background: var(--g6); border: 1px solid var(--g5); border-radius: 9px; padding: 7px 13px; cursor: pointer; font-family: inherit; transition: all .12s; }
.csvbtn:hover { color: var(--bl); border-color: var(--bl); }

/* consent */
.consent-grid { display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: center; }
.ring-big { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.ring-label { font-size: 13px; color: var(--g3); font-weight: 600; text-align: center; }
.ring-label b { color: var(--ink); }
.cbar { display: flex; flex-direction: column; gap: 14px; }
.cbtop { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--g1); margin-bottom: 6px; }
.cbtrack { height: 10px; background: var(--g6); border-radius: 999px; overflow: hidden; }
.cbfill { height: 100%; width: 0; border-radius: 999px; }

/* guard */
.guard { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gcol { border-radius: 14px; padding: 18px; border: 1px solid; }
.gcol.no { background: #FFF7F8; border-color: #FAD7DC; }
.gcol.yes { background: #F2FCF7; border-color: #C8F0DC; }
.gcol-h { font-size: 14px; font-weight: 800; margin-bottom: 14px; display: flex; align-items: center; gap: 7px; }
.gcol.no .gcol-h { color: #C2293A; }
.gcol.yes .gcol-h { color: #00874E; }
.gitem { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; line-height: 1.5; color: var(--g1); margin-bottom: 11px; }
.gitem:last-child { margin-bottom: 0; }
.gitem i { font-size: 17px; flex-shrink: 0; margin-top: 1px; }
.gcol.no i { color: var(--red); }
.gcol.yes i { color: var(--grn); }

.note { font-size: 12px; color: var(--g3); background: var(--g6); border-radius: 11px; padding: 12px 15px; display: flex; align-items: center; gap: 9px; margin-top: 16px; }
.note i { color: var(--bl); font-size: 16px; flex-shrink: 0; }

.prep-card { display: grid; gap: 16px; }
.lead-grid-help {
  margin: 6px 0 12px;
  border: 1px solid var(--g5);
  border-radius: 11px;
  padding: 10px 12px;
  background: #fff;
  color: var(--g1);
  font-size: 12px;
  line-height: 1.55;
  display: flex;
  align-items: center;
  gap: 8px;
}
.lead-grid-help::before {
  content: 'i';
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid var(--g5);
  color: var(--g3);
  font-size: 10px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.detail-grid { display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr); margin: 10px 0; }
.detail-card { border: 1px solid var(--g5); border-radius: 12px; padding: 12px; background: var(--bg); }
.detail-card h5 { font-size: 13px; color: var(--ink); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.note-mini { color: var(--amb); font-size: 11px; font-weight: 600; margin-top: 8px; }
.lead-filters { display: inline-flex; gap: 6px; }
.filter-pill { border: 1px solid var(--g5); background: var(--wht); color: var(--g2); border-radius: 999px; padding: 6px 10px; font-size: 11px; font-weight: 700; cursor: pointer; }
.filter-pill.on { border-color: var(--bl); color: var(--bl2); background: var(--blglow); }
.timeline { display: grid; gap: 8px; margin-top: 10px; }
.timeline-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--g6); font-size: 11px; color: var(--g1); }
.timeline-item .timeline-time { width: 46px; color: var(--g3); font-weight: 700; }
.timeline-item strong { font-size: 11px; margin-right: auto; }
.prep-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px; border-radius: 13px; background: var(--bg); }
.prep-head strong { display: block; font-size: 15px; color: var(--ink); margin-bottom: 4px; }
.prep-head span { display: block; font-size: 12px; color: var(--g3); }
.prep-head em { font-style: normal; font-size: 12px; font-weight: 800; color: var(--bl2); background: var(--blglow); border-radius: 999px; padding: 6px 10px; white-space: nowrap; }
.prep-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.prep-grid div { background: var(--bg); border: 1px solid var(--g5); border-radius: 12px; padding: 12px; }
.prep-grid span { display: block; font-size: 11px; color: var(--g3); font-weight: 700; margin-bottom: 6px; }
.prep-grid strong { display: block; font-size: 13px; color: var(--g1); line-height: 1.45; }
.prep-card h4 { font-size: 14px; color: var(--ink); }
.prep-card ul { display: grid; gap: 8px; padding-left: 18px; color: var(--g1); font-size: 13px; line-height: 1.55; }
.memo-box { width: 100%; min-height: 92px; resize: vertical; border: 1px solid var(--g5); border-radius: 13px; padding: 12px; font: inherit; font-size: 13px; color: var(--g1); background: #fff; }
.prep-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.prep-actions button { border: 1px solid var(--g5); background: var(--g6); color: var(--g1); border-radius: 9px; padding: 8px 12px; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.prep-actions button:hover { border-color: var(--bl); color: var(--bl); }
.prep-actions button:first-child {
  background: var(--blglow);
  border-color: #9BC0FF;
  color: var(--bl2);
}
.prep-actions button:first-child:hover {
  background: #DDEBFF;
}
.prep-actions button:disabled { color: var(--g4); border-color: var(--g5); background: #f5f6f8; cursor: not-allowed; }
.quality-metrics { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 18px; }
.metric { border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); padding: 13px; }
.metric span { display: block; font-size: 11px; color: var(--g3); font-weight: 700; margin-bottom: 8px; }
.metric strong { font-size: 24px; color: var(--ink); }

.scrim { display: none; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1040px) {
  .kpis { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  .side {
    position: fixed;
    left: 0; top: 0; bottom: 0;
    transform: translateX(-100%);
    transition: transform .25s ease;
    z-index: 60;
    height: 100vh;
  }
  .side.open { transform: translateX(0); }
  .menu-btn { display: flex; align-items: center; justify-content: center; }
  .search { display: none; }
  .ptitle small { display: none; }
  .scrim.show { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 55; }
  .consent-grid { grid-template-columns: 1fr; }
  .ring-big { margin: 0 auto; }
  .guard { grid-template-columns: 1fr; }
  .prep-grid { grid-template-columns: 1fr 1fr; }
  .quality-metrics { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 520px) {
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi .v { font-size: 22px; }
  .content { padding: 16px; }
  .tabs { padding: 14px 16px 0; }
  .tab { padding: 9px 13px; font-size: 12px; }
  .prep-grid, .quality-metrics { grid-template-columns: 1fr; }
  .panel-h { flex-wrap: wrap; row-gap: 10px; align-items: flex-start; }
  .detail-card { padding: 10px; }
  .lead-grid-help { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}

/* ===== 통합 관리 시스템 ===== */
.admin-only[hidden] { display: none !important; }
.admin-view .content > .kpis { display: none; }
.management-shell { display: grid; gap: 16px; animation: management-enter 180ms ease-out both; }
.management-hero {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 22px 24px; border: 1px solid #DCE7F7; border-radius: 16px;
  background: linear-gradient(135deg, #FFFFFF 0%, #F4F8FF 100%);
  box-shadow: 0 18px 48px rgba(24, 32, 44, .07);
}
.management-kicker { display: block; margin-bottom: 6px; color: var(--bl2); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.management-hero h2 { font-size: 24px; line-height: 1.2; letter-spacing: -.03em; }
.management-hero p { margin-top: 7px; color: var(--g2); font-size: 13px; line-height: 1.55; }
.management-nav { display: flex; gap: 6px; padding: 6px; overflow-x: auto; border: 1px solid var(--g5); border-radius: 14px; background: var(--wht); scrollbar-width: none; }
.management-nav::-webkit-scrollbar { display: none; }
.management-nav-btn { flex: 0 0 auto; min-height: 42px; padding: 0 14px; border: 0; border-radius: 10px; background: transparent; color: var(--g2); font: 600 13px/1 'Pretendard', sans-serif; cursor: pointer; transition: color 160ms ease, background 160ms ease, transform 160ms ease; }
.management-nav-btn i { margin-right: 7px; font-size: 16px; }
.management-nav-btn:hover { background: var(--g6); color: var(--ink); }
.management-nav-btn.on { background: var(--blglow); color: var(--bl2); box-shadow: inset 0 0 0 1px #D8E8FD; }
.management-notice { min-height: 0; margin: -4px 0; padding: 0 4px; color: var(--g2); font-size: 13px; font-weight: 600; transition: color 160ms ease, background 160ms ease, border-color 160ms ease; }
.management-notice:not(:empty) { min-height: 40px; padding: 10px 13px; border: 1px solid var(--g5); border-radius: 10px; background: var(--wht); }
.management-notice.success { color: #007946; background: var(--grnbg); border-color: #BCEFD7; }
.management-notice.error { color: #B42336; background: var(--redbg); border-color: #F7C8CF; }
.management-body { min-width: 0; }
.management-loading, .management-empty { min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 28px; color: var(--g3); text-align: center; }
.management-loading p, .management-empty p { font-size: 13px; line-height: 1.55; }
.management-empty > i { font-size: 30px; color: var(--g4); }
.management-empty strong { color: var(--g1); font-size: 15px; }
.management-spinner { width: 24px; height: 24px; border: 3px solid var(--g5); border-top-color: var(--bl); border-radius: 50%; animation: management-spin .8s linear infinite; }
.management-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.management-metric { min-width: 0; padding: 16px; border: 1px solid var(--g5); border-radius: 14px; background: var(--wht); box-shadow: 0 12px 30px rgba(24, 32, 44, .05); }
.management-metric > span { display: flex; align-items: center; gap: 6px; color: var(--g3); font-size: 11px; font-weight: 700; }
.management-metric > span i { font-size: 15px; }
.management-metric strong { display: block; margin-top: 10px; overflow: hidden; color: var(--ink); font-size: 24px; line-height: 1.1; letter-spacing: -.03em; text-overflow: ellipsis; white-space: nowrap; }
.management-metric small { display: block; margin-top: 7px; color: var(--g3); font-size: 11px; }
.management-metric.blue { border-color: #D7E7FB; background: #F8FBFF; }
.management-metric.success { border-color: #CBEFDD; background: #F7FFFB; }
.management-metric.warning { border-color: #F4D8AD; background: #FFFBF5; }
.management-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.management-status-row { display: flex; align-items: center; justify-content: space-between; min-height: 42px; border-bottom: 1px solid var(--g6); font-size: 13px; color: var(--g1); }
.management-footnote, .management-section-note { margin-top: 12px; color: var(--g3); font-size: 11px; line-height: 1.55; }
.management-actions { display: grid; gap: 8px; }
.management-action { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 62px; padding: 11px 13px; border: 1px solid var(--g5); border-radius: 11px; background: var(--wht); color: var(--ink); text-align: left; cursor: pointer; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }
.management-action:hover { border-color: #BCD6F7; background: #F8FBFF; transform: translateY(-1px); }
.management-action > i { color: var(--bl); font-size: 21px; }
.management-action span { display: grid; gap: 3px; }
.management-action strong { font-size: 13px; }
.management-action small { color: var(--g3); font-size: 11px; }
.management-create summary { display: flex; align-items: center; gap: 8px; min-height: 42px; color: var(--bl2); font-size: 14px; font-weight: 700; cursor: pointer; }
.management-create summary::marker { display: none; }
.management-form, .management-member-edit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--g5); }
.management-field { display: grid; gap: 6px; min-width: 0; color: var(--g2); font-size: 11px; font-weight: 700; }
.management-field :is(input, select) { width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid var(--g5); border-radius: 10px; background: var(--wht); color: var(--ink); font: 500 13px/1.4 'Pretendard', sans-serif; }
.management-field :is(input, select):focus { border-color: var(--bl); box-shadow: 0 0 0 3px rgba(49, 130, 246, .12); outline: 0; }
.management-form-actions { display: flex; align-items: flex-end; gap: 8px; grid-column: 1 / -1; flex-wrap: wrap; }
.management-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.management-toolbar h3 { font-size: 15px; }
.management-toolbar p { margin-top: 4px; color: var(--g3); font-size: 11px; }
.management-search { display: flex; align-items: center; gap: 7px; width: min(320px, 100%); min-height: 42px; padding: 0 11px; border: 1px solid var(--g5); border-radius: 11px; background: var(--g6); }
.management-search i { color: var(--g3); }
.management-search input { width: 100%; border: 0; background: transparent; color: var(--ink); font: 500 13px/1 'Pretendard', sans-serif; outline: 0; }
.management-member-list { display: grid; gap: 9px; }
.management-member { display: grid; grid-template-columns: minmax(220px, 1.1fr) minmax(290px, 1.5fr) auto; align-items: center; gap: 14px; padding: 13px; border: 1px solid var(--g5); border-radius: 12px; background: var(--wht); transition: border-color 160ms ease, box-shadow 160ms ease; }
.management-member:hover { border-color: #CCD8E5; box-shadow: 0 8px 22px rgba(24, 32, 44, .05); }
.management-member-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.management-avatar { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: linear-gradient(135deg, var(--bl), var(--ind)); color: #fff; font-size: 13px; font-weight: 800; }
.management-member-main div { min-width: 0; }
.management-member-main strong { font-size: 13px; }
.management-member-main p { margin-top: 4px; overflow: hidden; color: var(--g3); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.management-member-main code, .management-setting-card code { color: var(--bl2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.management-member-tags, .management-member-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.management-member-actions { justify-content: flex-end; }
.management-member-edit { grid-column: 1 / -1; width: 100%; }
.management-pii { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid #F0D5A8; border-radius: 12px; background: var(--ambbg); color: #9A5B00; font-size: 12px; line-height: 1.5; }
.management-pii i { flex: 0 0 auto; font-size: 20px; }
.management-pii strong { display: block; }
.management-table { min-width: 760px; table-layout: auto; }
.management-table .pill { white-space: nowrap; }
.management-count { display: inline-flex; margin-left: 8px; padding: 3px 7px; border-radius: 999px; background: var(--g6); color: var(--g3); font-size: 10px; font-weight: 700; vertical-align: middle; }
.management-back { margin-bottom: 12px; }
.management-setting-card { display: grid; grid-template-columns: auto 1fr; gap: 16px; max-width: 820px; }
.management-setting-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; background: var(--blglow); color: var(--bl); font-size: 22px; }
.management-setting-card .panel-h { justify-content: flex-start; margin-bottom: 7px; }
.management-setting-card p { color: var(--g2); font-size: 13px; line-height: 1.65; }
.management-owner-form { display: flex; align-items: flex-end; gap: 10px; margin-top: 16px; }
.management-owner-form .management-field { flex: 1; }

@keyframes management-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes management-spin { to { transform: rotate(360deg); } }

@media (max-width: 1100px) {
  .management-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-member { grid-template-columns: minmax(220px, 1fr) minmax(260px, 1fr); }
  .management-member-actions { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 760px) {
  .management-hero { align-items: flex-start; padding: 18px; }
  .management-hero > .pill { display: none; }
  .management-grid, .management-form, .management-member { grid-template-columns: 1fr; }
  .management-member-tags, .management-member-actions { grid-column: auto; justify-content: flex-start; }
  .management-toolbar { align-items: stretch; flex-direction: column; }
  .management-search { width: 100%; }
  .management-owner-form { align-items: stretch; flex-direction: column; }
  .management-setting-card { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .management-shell, .management-spinner { animation: none; }
  .management-action:hover { transform: none; }
}


/* KINDRED_LAYER2_CONTROL_APPLY: safe top-notch design polish */
:where(.top, .panel, .kpi, .card, .tbl-wrap) {
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

:where(.panel, .kpi, .card) {
  box-shadow: 0 18px 48px rgba(24, 32, 44, 0.08);
}

:where(.top) {
  backdrop-filter: blur(10px);
}

:where(.nav-i, .btn, button, [role="button"]) {
  min-height: 42px;
}

:where(.tbl-wrap, .table-wrap) {
  border-radius: 14px;
  overflow: hidden;
}

/* ===== 상담 녹음 고급 요약 ===== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.audio-coach { display: grid; gap: 16px; }
.audio-coach-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 24px;
  border-radius: 16px;
  color: #f7f5ef;
  background: linear-gradient(120deg, #101728 0%, #1d2940 58%, #233557 100%);
  box-shadow: 0 18px 42px rgba(14, 22, 38, .18);
}
.audio-kicker { display: inline-flex; align-items: center; gap: 6px; color: #d9b98a; font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.audio-coach-hero h2 { margin-top: 8px; font-size: 26px; letter-spacing: -.035em; color: #fff; }
.audio-coach-hero p { max-width: 620px; margin-top: 8px; color: #c7cfdb; font-size: 14px; line-height: 1.65; }
.audio-usage { flex: 0 0 auto; display: grid; gap: 5px; min-width: 190px; padding: 14px 16px; border: 1px solid rgba(217, 185, 138, .42); border-radius: 13px; background: rgba(255,255,255,.07); }
.audio-usage strong { color: #fff; font-size: 16px; }
.audio-usage span { color: #d8deea; font-size: 12px; line-height: 1.45; }
.audio-coach-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 16px; }
.audio-upload-card, .audio-policy-card { margin: 0; min-height: 282px; }
.audio-file-picker { display: grid; justify-items: center; gap: 7px; padding: 27px 18px; border: 1px dashed #9eb4d7; border-radius: 13px; background: #f7faff; color: var(--g2); cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.audio-file-picker:hover, .audio-file-picker:focus-visible { border-color: var(--bl); background: var(--blglow); transform: translateY(-1px); outline: none; }
.audio-file-picker.is-dragging { border-color: var(--bl); border-style: solid; background: #edf5ff; box-shadow: 0 0 0 4px rgba(49, 130, 246, .14); transform: translateY(-1px); }
.audio-file-picker.is-ready { border-color: #6aaf92; border-style: solid; background: #f2fbf6; }
.audio-file-picker i { color: var(--bl); font-size: 26px; }
.audio-file-picker strong { color: var(--ink); font-size: 14px; }
.audio-file-picker span { text-align: center; font-size: 11px; line-height: 1.5; color: var(--g3); }
.audio-file-info { min-height: 21px; margin-top: 10px; font-size: 12px; line-height: 1.55; color: var(--g2); }
.audio-hint { margin-top: 10px; color: var(--g3); font-size: 11px; line-height: 1.55; }

/* 인앱 녹음 — 테마 변수만 사용해 다크/그레이에서도 자동으로 대비가 잡힌다. */
.audio-record { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--sep); }
.audio-record-or { display: flex; align-items: center; gap: 10px; color: var(--g3); font-size: 11px; }
.audio-record-or::before, .audio-record-or::after { content: ""; flex: 1; height: 1px; background: var(--sep); }
.audio-record-row { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.audio-record-btn { display: inline-flex; align-items: center; gap: 9px; padding: 11px 18px; border: 1px solid var(--bl); border-radius: 11px; background: var(--blglow); color: var(--bl); font-size: 13px; font-weight: 800; cursor: pointer; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.audio-record-btn:hover, .audio-record-btn:focus-visible { transform: translateY(-1px); outline: none; }
.audio-record-btn.is-recording { border-color: var(--red); background: var(--redbg); color: var(--red); }
.audio-record-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--bl); transition: background .18s ease; }
.audio-record-btn.is-recording .audio-record-dot { background: var(--red); animation: audioRecPulse 1.1s ease-in-out infinite; }
@keyframes audioRecPulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.82); } }
.audio-record-timer { font-variant-numeric: tabular-nums; font-size: 15px; font-weight: 800; color: var(--g2); letter-spacing: .5px; }
.audio-record.is-recording .audio-record-timer { color: var(--red); }
.audio-record-hint { margin-top: 10px; color: var(--g3); font-size: 11px; line-height: 1.6; }
.audio-record-hint strong { color: var(--g2); }
@media (prefers-reduced-motion: reduce) { .audio-record-btn.is-recording .audio-record-dot { animation: none; } }
.audio-record-pause { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; border: 1px solid var(--sep); border-radius: 10px; background: transparent; color: var(--g2); font-size: 12px; font-weight: 700; cursor: pointer; }
.audio-record-pause:hover, .audio-record-pause:focus-visible { border-color: var(--bl); color: var(--bl); outline: none; }
.audio-record-meters { display: flex; align-items: baseline; gap: 10px; margin-top: 12px; }
.audio-record-size { font-variant-numeric: tabular-nums; font-size: 12px; font-weight: 700; color: var(--g2); }
.audio-record-cap { font-size: 11px; color: var(--g3); }
.audio-record.is-paused .audio-record-timer { color: var(--g3); }
.audio-record-done { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.audio-record-summarize { display: inline-flex; align-items: center; gap: 7px; padding: 11px 18px; border: none; border-radius: 11px; background: var(--bl); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; transition: transform .18s ease, filter .18s ease; }
.audio-record-summarize:hover, .audio-record-summarize:focus-visible { transform: translateY(-1px); filter: brightness(1.05); outline: none; }
.audio-record-save, .audio-record-discard { display: inline-flex; align-items: center; gap: 6px; padding: 11px 15px; border: 1px solid var(--sep); border-radius: 11px; background: transparent; color: var(--g2); font-size: 12px; font-weight: 700; cursor: pointer; }
.audio-record-save:hover, .audio-record-save:focus-visible { border-color: var(--bl); color: var(--bl); outline: none; }
.audio-record-discard:hover, .audio-record-discard:focus-visible { border-color: var(--red); color: var(--red); outline: none; }
.audio-record-privacy { display: flex; align-items: flex-start; gap: 7px; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: var(--grnbg); color: var(--g2); font-size: 11px; line-height: 1.6; }
.audio-record-privacy i { color: var(--grn); font-size: 14px; margin-top: 1px; }
.audio-recover { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 13px 15px; border: 1px solid var(--gold); border-radius: 12px; background: var(--ambbg); }
.audio-recover > i { color: var(--gold); font-size: 20px; }
.audio-recover strong { display: block; color: var(--ink); font-size: 13px; }
.audio-recover span { color: var(--g2); font-size: 11px; line-height: 1.5; }
.audio-recover-actions { margin-left: auto; display: flex; gap: 7px; }
.audio-recover-actions button { padding: 8px 13px; border: none; border-radius: 9px; background: var(--gold); color: #fff; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.audio-recover-actions button.ghost { background: transparent; border: 1px solid var(--sep); color: var(--g2); }
.audio-field { display: grid; gap: 7px; margin-bottom: 14px; color: var(--g2); font-size: 12px; font-weight: 700; }
.audio-field small { color: var(--g3); font-weight: 500; }
.audio-field select { min-height: 44px; width: 100%; padding: 0 12px; border: 1px solid var(--g5); border-radius: 10px; background: #fff; color: var(--g1); font: inherit; font-size: 13px; }
.audio-consent { display: flex; align-items: flex-start; gap: 9px; margin: 16px 0; color: var(--g1); font-size: 12px; line-height: 1.55; cursor: pointer; }
.audio-consent input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--bl); flex: 0 0 auto; }
.audio-lock-note { display: flex; align-items: flex-start; gap: 8px; padding: 10px; border-radius: 10px; background: #f9f5ed; color: #705426; font-size: 11px; line-height: 1.55; }
.audio-lock-note i { margin-top: 1px; color: var(--gold-deep); font-size: 16px; flex: 0 0 auto; }
.audio-start { width: 100%; min-height: 46px; margin-top: 14px; border: 1px solid #a6814c; border-radius: 11px; background: var(--gold); color: #fff; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: background .18s ease, transform .18s ease, opacity .18s ease; }
.audio-start:hover:not(:disabled) { background: var(--gold-deep); transform: translateY(-1px); }
.audio-start:disabled { opacity: .48; cursor: not-allowed; }
.audio-status { min-height: 20px; margin-top: 9px; color: var(--g3); font-size: 12px; line-height: 1.5; }
.audio-status.success { color: #00874e; font-weight: 700; }
.audio-status.error { color: #c2293a; font-weight: 700; }
.audio-status.info { color: var(--g2); }
.audio-progress { display: grid; gap: 7px; margin-top: 10px; padding: 10px; border: 1px solid #d6e2f3; border-radius: 10px; background: #f5f9ff; color: #36557e; font-size: 11px; }
.audio-progress.hidden { display: none; }
.audio-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 700; }
.audio-progress-head strong { color: #254d80; font-variant-numeric: tabular-nums; }
.audio-progress-track { height: 6px; overflow: hidden; border-radius: 99px; background: #dce8f7; }
.audio-progress-track span { display: block; width: 100%; height: 100%; border-radius: inherit; background: var(--bl); transform: scaleX(0); transform-origin: left; transition: transform .2s ease-out; }
.audio-progress.is-indeterminate .audio-progress-track span { animation: audio-progress-slide 1.1s ease-in-out infinite; }
@keyframes audio-progress-slide { 0%, 100% { transform: translateX(-65%) scaleX(.38); } 50% { transform: translateX(155%) scaleX(.38); } }
.audio-result-wrap { min-height: 130px; }
.audio-empty { min-height: 130px; display: grid; justify-items: center; align-content: center; gap: 6px; padding: 24px; border: 1px dashed var(--g5); border-radius: 14px; color: var(--g3); text-align: center; }
.audio-empty i { color: var(--bl); font-size: 23px; }
.audio-empty strong { color: var(--g2); font-size: 14px; }
.audio-empty span { font-size: 12px; line-height: 1.5; }
.audio-refusal { display: flex; align-items: center; gap: 10px; padding: 20px; border: 1px solid #f0d2d6; border-radius: 14px; background: #fff7f8; color: #a32e3c; }
.audio-refusal i { font-size: 22px; }
.audio-report { padding: 21px; border: 1px solid #dbe2ec; border-radius: 16px; background: #fff; box-shadow: 0 14px 34px rgba(24, 32, 44, .06); }
.audio-report-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.audio-report-head strong { color: var(--g2); font-size: 12px; }
.audio-report > h3 { max-width: 830px; margin: 12px 0 19px; color: var(--ink); font-size: 18px; line-height: 1.55; letter-spacing: -.02em; }
.audio-report-meta { display: flex; flex-wrap: wrap; gap: 7px; margin: -8px 0 14px; color: var(--g3); font-size: 10.5px; }
.audio-report-meta span { display: inline-flex; min-height: 26px; align-items: center; gap: 4px; padding: 0 8px; border: 1px solid var(--g5); border-radius: 999px; background: var(--bg); }
.audio-legacy-note { display: flex; gap: 9px; margin: 0 0 16px; padding: 11px 13px; border: 1px solid #e4d3ad; border-radius: 10px; background: #fdf8ec; color: #6b5726; }
.audio-legacy-note i { flex: none; margin-top: 1px; font-size: 15px; color: #b08d57; }
.audio-legacy-note strong { display: block; margin-bottom: 3px; font-size: 12.5px; }
.audio-legacy-note span { display: block; font-size: 11.5px; line-height: 1.6; color: #7d6835; }
.audio-segment-summaries { margin: 0 0 12px; padding: 14px; border: 1px solid #d6e2f3; border-radius: 12px; background: #f7faff; }
.audio-segment-summaries > h4 { margin-bottom: 8px; }
.audio-segment-summaries details { border-top: 1px solid #dce5f1; }
.audio-segment-summaries details:first-of-type { border-top: 0; }
.audio-segment-summaries summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ink); cursor: pointer; font-size: 12px; font-weight: 800; }
.audio-segment-summaries summary em { color: #386999; font-size: 10px; font-style: normal; white-space: nowrap; }
.audio-segment-summaries details > p { padding: 0 3px 12px; color: var(--g1); font-family: "Times New Roman", "Noto Serif KR", Batang, serif; font-size: 12pt; line-height: 1.65; }
.audio-segment-summaries details > ul { padding: 0 3px 14px 22px; }
.audio-report-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.audio-report-grid section, .audio-next-actions, .audio-signals, .audio-customer-analysis { padding: 14px; border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); }
.audio-report h4 { display: flex; align-items: center; gap: 6px; margin-bottom: 9px; color: var(--ink); font-size: 13px; }
.audio-report h4 small { color: var(--g3); font-size: 10px; font-weight: 600; }
.audio-report ul { display: grid; gap: 7px; padding-left: 18px; color: var(--g1); font-size: 12px; line-height: 1.55; }
.audio-report li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.audio-item-timeline { align-self: start; color: #386999; font-size: 10px; font-style: normal; font-weight: 750; white-space: nowrap; }
.audio-item-timeline.is-unverified { color: var(--gold-deep); }
.audio-customer-analysis { margin-top: 12px; background: #f7f8f3; border-color: #dfe5cd; }
.audio-customer-analysis > h4 i { color: #728043; }
.audio-next-actions { margin-top: 12px; background: #f8f4eb; border-color: #ead9b9; }
.audio-next-actions p { display: flex; align-items: flex-start; gap: 8px; margin-top: 8px; color: var(--g1); font-size: 12px; line-height: 1.55; }
.audio-next-actions p > span:last-child { display: grid; gap: 3px; }
.audio-priority { min-width: 48px; padding: 3px 6px; border-radius: 99px; background: #e8eaf0; color: var(--g2); font-size: 10px; font-weight: 800; text-align: center; text-transform: uppercase; }
.audio-priority.high { background: var(--redbg); color: #b3273a; }.audio-priority.medium { background: var(--ambbg); color: #a45a00; }.audio-priority.low { background: var(--grnbg); color: #007e48; }
.audio-signals { margin-top: 12px; background: #f3f7fd; border-color: #d4e0f0; }
.audio-signals h4 i { color: var(--bl); }.audio-signals h4 small { color: var(--g3); font-size: 10px; font-weight: 600; }
.audio-signals > div { display: grid; grid-template-columns: 120px 1fr auto; gap: 12px; padding: 10px 0; border-top: 1px solid #dbe5f2; color: var(--g1); font-size: 12px; line-height: 1.5; }
.audio-signals > div:first-of-type { border-top: 0; }.audio-signals em { color: var(--g3); font-size: 11px; font-style: normal; white-space: nowrap; }
.audio-export-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.audio-export-actions button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid #d8c29a; border-radius: 10px; padding: 0 13px; background: #fff; color: var(--gold-deep); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; transition: transform 90ms ease, background 180ms ease, border-color 180ms ease; }
.audio-export-actions button:hover { border-color: var(--gold); background: var(--gold-bg); }.audio-export-actions button:active { transform: scale(.99); }
.audio-export-actions .audio-transcript-once { border-color: #8ca9cf; color: #25598f; }
.audio-export-actions button:disabled { opacity: .62; cursor: not-allowed; }
.audio-transcript-state { min-height: 44px; display: inline-flex; align-items: center; color: var(--g3); font-size: 11px; }
.audio-transcript-note { margin-top: 8px; color: var(--g3); font-size: 10.5px; line-height: 1.55; }
.audio-disclaimer { padding: 0 5px; color: var(--g3); font-size: 11px; line-height: 1.65; }

.boost-link-card { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; gap: 10px; margin: 0 0 16px; padding: 15px 16px; border: 1px solid rgba(176,141,87,.38); border-radius: 13px; background: linear-gradient(135deg, #fffdf8, #f7f9fc); }
.boost-link-copy { min-width: 0; display: grid; gap: 3px; }
.boost-link-copy span { color: var(--gold-deep); font-size: 11px; font-weight: 850; }
.boost-link-copy strong { min-width: 0; overflow: hidden; color: var(--ink); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.boost-link-copy small { color: var(--g3); font-size: 10.5px; line-height: 1.45; }
.boost-link-card button, .boost-link-card a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid #d8c29a; border-radius: 10px; padding: 0 13px; background: #fff; color: var(--gold-deep); font: inherit; font-size: 12px; font-weight: 800; text-decoration: none; cursor: pointer; transition: transform 90ms ease, background 180ms ease, border-color 180ms ease; }
.boost-link-card button:hover, .boost-link-card a:hover { border-color: var(--gold); background: var(--gold-bg); }
.boost-link-card button:active, .boost-link-card a:active { transform: scale(.99); }

@media (max-width: 860px) {
  .audio-coach-hero { align-items: flex-start; flex-direction: column; }.audio-coach-grid { grid-template-columns: 1fr; }.audio-usage { width: 100%; }
}
@media (max-width: 520px) {
  .audio-coach-hero { padding: 19px; }.audio-coach-hero h2 { font-size: 22px; }.audio-report { padding: 15px; }.audio-report-grid { grid-template-columns: 1fr; }.audio-report li { grid-template-columns: 1fr; gap: 2px; }.audio-item-timeline { white-space: normal; }.audio-signals > div { grid-template-columns: 1fr; gap: 3px; }.audio-signals em { white-space: normal; }.audio-segment-summaries summary { align-items: flex-start; flex-direction: column; justify-content: center; gap: 3px; }.audio-export-actions { display: grid; grid-template-columns: 1fr; }.audio-export-actions button { width: 100%; }
  .boost-link-card { grid-template-columns: 1fr 1fr; align-items: stretch; }.boost-link-copy { grid-column: 1 / -1; }.boost-link-card button, .boost-link-card a { width: 100%; }
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(49, 130, 206, 0.32);
  outline-offset: 3px;
}

@media (max-width: 760px) {
  :where(.grid, .dashboard-grid, .hero-grid) {
    grid-template-columns: 1fr;
  }
}
/* KINDRED_LAYER1_UX_BUGS_APPLY: safe UX and bug-prevention polish */
:where(button, [role="button"], a, input, select, textarea) {
  -webkit-tap-highlight-color: transparent;
}

:where(button, [role="button"], input, select, textarea) {
  min-height: 40px;
}

:where(button, [role="button"], a, input, select, textarea):focus-visible {
  outline-offset: 3px;
}

:where(img, video, canvas, svg) {
  max-width: 100%;
}

:where(table) {
  max-width: 100%;
}

:where([data-ux-bugs-layer-scroll], .table-wrap, .tbl-wrap) {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (prefers-reduced-motion: reduce) {
  :where(*, *::before, *::after) {
    scroll-behavior: auto !important;
  }
  .audio-progress.is-indeterminate .audio-progress-track span { animation: none; }
}

/* ===== AI 도우미 채팅 패널 ===== */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ai-chat-box {
  display: grid;
  gap: 12px;
}

.ai-chat-log {
  display: grid;
  gap: 10px;
  min-height: 220px;
  max-height: 420px;
  overflow-y: auto;
  padding: 6px 2px;
}

.ai-chat-msg {
  max-width: 82%;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.6;
}

.ai-chat-msg strong {
  display: block;
  font-size: 12px;
  color: var(--g3);
  margin-bottom: 4px;
}

.ai-chat-msg.ai {
  justify-self: start;
  background: var(--bg);
  color: var(--g1);
}

.ai-chat-msg.user {
  justify-self: end;
  background: var(--bl);
  color: #fff;
}

.ai-chat-msg.user strong {
  color: rgba(255, 255, 255, .72);
}

.ai-chat-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.ai-chat-form input[type="text"] {
  min-height: 44px;
  border: 1px solid var(--g5);
  border-radius: 12px;
  padding: 0 14px;
  font: inherit;
  color: var(--ink);
  background: var(--wht);
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}

.ai-chat-form input[type="text"]:focus {
  border-color: var(--bl);
  box-shadow: 0 0 0 3px var(--blglow);
}

.btn-ai-send {
  min-height: 44px;
  padding: 0 18px;
  border: none;
  border-radius: 12px;
  background: var(--bl);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: background .12s ease, transform .12s ease;
}

.btn-ai-send:hover {
  background: var(--bl2);
}

.btn-ai-send:disabled {
  background: var(--g4);
  cursor: not-allowed;
}

.ai-chat-note {
  font-size: 12px;
  color: var(--g3);
  line-height: 1.6;
}

.ai-answer { display: grid; gap: 8px; }
.ai-answer h4 { margin: 4px 0 0; color: var(--ink); font-size: 13px; line-height: 1.45; }
.ai-answer p { margin: 0; white-space: pre-wrap; word-break: keep-all; overflow-wrap: anywhere; }
.ai-answer ul { display: grid; gap: 5px; margin: 0; padding-left: 18px; }
.ai-answer li { padding-left: 2px; }
.ai-answer hr { width: 100%; height: 1px; margin: 2px 0; border: 0; background: var(--sep); }
.ai-answer strong { color: var(--ink); font-weight: 750; }
.ai-answer-sources { margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--sep); }
.ai-answer-sources a { color: var(--bl2); font-weight: 700; text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; }
.ai-answer-sources a:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 3px; }
.ai-search-toggle { position: relative; grid-column: 1 / -1; display: flex; align-items: center; cursor: pointer; }
.ai-search-toggle > input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.ai-search-toggle > span { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; width: fit-content; min-height: 42px; align-items: center; padding: 7px 11px; border: 1px solid var(--g5); border-radius: 11px; background: var(--bg); color: var(--g2); transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }
.ai-search-toggle i { grid-row: 1 / 3; color: var(--g3); font-size: 20px; }
.ai-search-toggle b { font-size: 12px; }
.ai-search-toggle small { color: var(--g4); font-size: 10px; }
.ai-search-toggle input:checked + span { border-color: var(--bl); background: #EEF5FF; color: var(--bl); transform: translateY(-1px); }
.ai-search-toggle input:focus-visible + span { outline: 3px solid var(--blglow); outline-offset: 2px; }

/* ===== 고객편 보장분석실 ===== */
.rose-shell {
  --rose-brand-blue: #0064ff;
  --rose-action-blue: #3182f6;
  --rose-blue-50: #e8f3ff;
  --rose-ink: #191f28;
  --rose-gray-900: #202632;
  --rose-gray-800: #333d4b;
  --rose-gray-700: #4e5968;
  --rose-gray-600: #6b7684;
  --rose-gray-500: #8b95a1;
  --rose-gray-300: #d1d6db;
  --rose-gray-200: #e5e8eb;
  --rose-gray-100: #f2f4f6;
  --rose-gray-50: #f9fafb;
  --rose-danger: #f04452;
}

.rose-panel-head > span:first-child { display: inline-flex; align-items: center; gap: 10px; }
.rose-panel-head em {
  padding: 5px 9px;
  border: 1px solid color-mix(in srgb, var(--rose-action-blue) 28%, transparent);
  border-radius: 999px;
  background: var(--rose-blue-50);
  color: var(--rose-action-blue);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.rose-mode-tabs {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 18px;
  padding: 4px;
  border: 1px solid var(--g5);
  border-radius: 13px;
  background: var(--bg);
}

.rose-mode {
  min-height: 44px;
  padding: 8px 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--g2);
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  cursor: pointer;
  transition: color 180ms cubic-bezier(.2,.8,.2,1), background 180ms cubic-bezier(.2,.8,.2,1), box-shadow 180ms cubic-bezier(.2,.8,.2,1);
}

.rose-mode i { margin-right: 5px; font-size: 18px; vertical-align: -2px; }
.rose-mode.on { background: var(--wht); color: var(--rose-action-blue); box-shadow: 0 2px 10px rgba(14, 22, 38, .08); }

.rose-privacy {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--rose-action-blue) 24%, var(--g5));
  border-radius: 14px;
  background: color-mix(in srgb, var(--rose-blue-50) 72%, var(--wht));
  color: var(--g1);
}
.rose-privacy > i { color: var(--rose-action-blue); font-size: 23px; }
.rose-privacy b { display: block; margin-bottom: 3px; font-size: 13px; }
.rose-privacy p { color: var(--g2); font-size: 12px; line-height: 1.55; }

.rose-interview-intro {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  justify-content: space-between;
  margin: 24px 0 12px;
}
.rose-interview-intro span { color: var(--rose-action-blue); font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.rose-interview-intro h2 { margin: 5px 0 6px; color: var(--rose-gray-900); font-size: clamp(21px, 2.5vw, 29px); letter-spacing: -.035em; }
.rose-interview-intro p { max-width: 720px; color: var(--rose-gray-600); font-size: 13px; line-height: 1.6; }
.rose-interview-intro strong { flex: 0 0 auto; padding: 8px 11px; border-radius: 999px; background: var(--rose-blue-50); color: var(--rose-action-blue); font-size: 13px; }
.rose-progress { height: 6px; overflow: hidden; border-radius: 999px; background: var(--rose-gray-100); }
.rose-progress > span { display: block; width: 10%; height: 100%; border-radius: inherit; background: var(--rose-action-blue); }
.rose-question-map { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; margin: 12px 0 24px; padding: 0; list-style: none; }
.rose-question-map button { width: 100%; min-height: 36px; border: 0; border-radius: 10px; background: transparent; color: var(--rose-gray-500); font: inherit; cursor: pointer; transition: background 160ms ease, color 160ms ease, transform 160ms cubic-bezier(.2,.8,.2,1); }
.rose-question-map button span { display: grid; width: 28px; height: 28px; margin: auto; place-items: center; border: 1px solid var(--rose-gray-200); border-radius: 50%; background: var(--wht); font-size: 11px; font-weight: 800; }
.rose-question-map button.on { color: var(--rose-action-blue); }
.rose-question-map button.on span { border-color: var(--rose-action-blue); background: var(--rose-blue-50); }
.rose-question-map button.done span { border-color: var(--rose-action-blue); background: var(--rose-action-blue); color: #fff; }
.rose-question-map button:not(:disabled):hover { transform: translateY(-1px); }
.rose-question-map button:disabled { cursor: not-allowed; opacity: .42; }
.rose-interview-question { display: grid; gap: 14px; }
.rose-assistant-bubble { position: relative; max-width: 780px; padding: 20px 22px; border-radius: 6px 20px 20px 20px; background: var(--rose-gray-900); color: #fff; box-shadow: 0 10px 28px rgba(32, 38, 50, .12); }
.rose-assistant-bubble::before { position: absolute; top: 0; left: -8px; width: 16px; height: 16px; border-radius: 4px 0 0; background: var(--rose-gray-900); content: ''; clip-path: polygon(100% 0, 100% 100%, 0 0); }
.rose-assistant-bubble span { color: #8fc4ff; font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.rose-assistant-bubble h2 { margin: 7px 0 6px; color: #fff; font-size: clamp(23px, 2.7vw, 31px); letter-spacing: -.03em; }
.rose-assistant-bubble p { color: #d1d6db; font-size: 14.5px; line-height: 1.6; }
.rose-answer-card { margin-left: clamp(0px, 4vw, 52px); padding: 22px; border: 1px solid var(--rose-gray-200); border-radius: 20px 6px 20px 20px; background: var(--wht); box-shadow: 0 8px 24px rgba(14, 22, 38, .06); }
.rose-answer-card > b { display: block; margin-bottom: 16px; color: var(--rose-gray-700); font-size: 12px; }
.rose-report-stage { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--rose-gray-200); }
.rose-report-stage-head { margin-bottom: 18px; }
.rose-report-stage-head > span { color: var(--rose-action-blue); font-size: 12px; font-weight: 800; }
.rose-report-stage-head h2 { margin: 6px 0; color: var(--rose-gray-900); font-size: 26px; }
.rose-report-stage-head p { color: var(--rose-gray-600); font-size: 13px; }

.rose-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
}
.rose-steps button {
  display: flex;
  min-height: 48px;
  width: 100%;
  gap: 7px;
  align-items: center;
  justify-content: center;
  padding: 8px;
  border: 1px solid var(--g5);
  border-radius: 12px;
  background: var(--wht);
  color: var(--g3);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
  transition: transform 180ms cubic-bezier(.2,.8,.2,1), border-color 180ms ease, color 180ms ease, background 180ms ease;
}
.rose-steps button span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--g6);
  font-size: 11px;
}
.rose-steps button.on { border-color: var(--rose-action-blue); background: var(--rose-blue-50); color: var(--rose-action-blue); transform: translateY(-1px); }
.rose-steps button.done { border-color: color-mix(in srgb, var(--rose-action-blue) 32%, var(--g5)); color: var(--rose-action-blue); }
.rose-steps button:disabled { cursor: not-allowed; opacity: .48; }

.rose-step { animation: rose-step-in 220ms cubic-bezier(.16,1,.3,1) both; }
@keyframes rose-step-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.rose-step-head { margin-bottom: 20px; max-width: 760px; }
.rose-step-head > p { margin-bottom: 5px; color: var(--rose-action-blue); font-size: 11px; font-weight: 850; letter-spacing: .12em; }
.rose-step-head h2 { margin: 0 0 6px; color: var(--ink); font-size: clamp(20px, 2.4vw, 27px); letter-spacing: -.035em; }
.rose-step-head small { color: var(--g3); font-size: 13px; line-height: 1.55; }

.rose-grid { display: grid; gap: 14px; }
.rose-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rose-grid.coverage { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rose-field { display: grid; align-content: start; gap: 7px; min-width: 0; color: var(--g1); font-size: 14.5px; font-weight: 700; }
.rose-field.full { grid-column: 1 / -1; }
/* 만원 단위 입력: 숫자칸 옆에 '만원' 접미사를 붙인다(의뢰인 v9). */
.rose-amount { display: flex; align-items: stretch; gap: 8px; }
.rose-amount input { flex: 1; min-width: 0; }
.rose-unit { display: inline-flex; align-items: center; padding: 0 12px; border-radius: 11px; background: var(--g6, rgba(0,0,0,.05)); color: var(--g2); font-size: 14px; font-weight: 800; white-space: nowrap; }
.rose-field input,
.rose-field select,
.rose-field textarea {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--g5);
  border-radius: 11px;
  padding: 10px 12px;
  background: var(--wht);
  color: var(--ink);
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.rose-field textarea { resize: vertical; }
.rose-field input:focus,
.rose-field select:focus,
.rose-field textarea:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.rose-field small { color: var(--g3); font-size: 11px; font-weight: 500; line-height: 1.45; }
.rose-check { position: relative; display: flex; min-height: 44px; gap: 9px; align-items: flex-start; color: var(--g2); font-size: 13px; line-height: 1.45; cursor: pointer; }
.rose-check input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; accent-color: var(--bl); }
.rose-check span { display: grid; gap: 3px; }
.rose-check small { color: var(--g3); font-size: 11px; font-weight: 500; }

.rose-details { margin-top: 18px; border: 1px solid var(--g5); border-radius: 14px; background: var(--wht); }
.rose-details summary { min-height: 48px; padding: 14px 16px; color: var(--g1); font-size: 13px; font-weight: 800; cursor: pointer; }
.rose-details .rose-grid { padding: 4px 16px 18px; }
.rose-inline-note { padding: 0 16px 16px; color: var(--g3); font-size: 11px; }
.rose-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.rose-quote { min-width: 0; padding: 16px; border: 1px solid var(--g5); border-radius: 15px; background: var(--bg); }
.rose-quote legend { padding: 0 7px; color: var(--rose-action-blue); font-size: 13px; font-weight: 850; }
.rose-comparable { padding: 14px 15px; border: 1px solid var(--g5); border-radius: 13px; background: var(--wht); }
.rose-sensitive { display: grid; gap: 10px; margin-top: 16px; padding: 16px; border: 1px dashed var(--g4); border-radius: 14px; background: var(--bg); }
.rose-sensitive > p { color: var(--g3); font-size: 11px; line-height: 1.55; }

.rose-evidence-actions { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.rose-evidence-actions span { color: var(--g3); font-size: 12px; line-height: 1.5; }
.rose-evidence-answer { min-height: 140px; max-height: 320px; overflow: auto; margin-bottom: 16px; padding: 16px; border: 1px solid var(--g5); border-radius: 14px; background: var(--bg); color: var(--g1); font-size: 13px; line-height: 1.7; white-space: pre-wrap; }
.rose-primary,
.rose-secondary {
  display: inline-flex;
  min-height: 44px;
  gap: 7px;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border-radius: 11px;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: transform 160ms cubic-bezier(.2,.8,.2,1), background 160ms ease, border-color 160ms ease;
}
.rose-primary { border: 1px solid var(--rose-action-blue); background: var(--rose-action-blue); color: #fff; }
.rose-primary:hover:not(:disabled) { background: var(--rose-brand-blue); transform: translateY(-1px); }
.rose-primary:disabled { border-color: var(--g4); background: var(--g4); cursor: not-allowed; }
.rose-secondary { border: 1px solid var(--g5); background: var(--wht); color: var(--g1); }
.rose-secondary:hover:not(:disabled) { border-color: var(--g4); transform: translateY(-1px); }
.rose-secondary:disabled { opacity: .55; cursor: wait; }
.rose-nav { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--g5); }
.rose-form-error { min-height: 22px; margin-top: 12px; color: var(--red); font-size: 12px; font-weight: 700; }
.rose-empty { display: grid; min-height: 220px; place-items: center; align-content: center; gap: 9px; border: 1px dashed var(--g4); border-radius: 15px; color: var(--g3); text-align: center; }
.rose-empty i { font-size: 32px; }

.rose-report {
  width: 100%;
  margin: 0 auto;
  padding: 24px;
  border-radius: 20px;
  background: var(--rose-gray-100);
  color: var(--rose-ink);
  font-size: 13px;
  line-height: 1.65;
}
.rose-report-page {
  display: flex;
  min-height: 980px;
  flex-direction: column;
  margin: 0 auto 24px;
  padding: 48px 52px 34px;
  border: 1px solid var(--rose-gray-200);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 38px rgba(25, 31, 40, .08);
}
.rose-report-page:last-child { margin-bottom: 0; }
.rose-report h1,
.rose-report h2,
.rose-report h3 { color: var(--rose-ink); letter-spacing: -.035em; }
.rose-report h3 { margin-bottom: 10px; font-size: 16px; }
.rose-report ul,
.rose-report ol { display: grid; gap: 7px; padding-left: 20px; }
.rose-cover-mark { display: flex; gap: 9px; align-items: center; color: var(--rose-gray-600); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.rose-cover-mark > span { width: 11px; height: 11px; border-radius: 4px; background: var(--rose-brand-blue); transform: rotate(-18deg); }
.rose-cover-main { margin: 112px 0 58px; }
.rose-cover-main > p { margin-bottom: 12px; color: var(--rose-action-blue); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.rose-cover-main h1 { max-width: 720px; margin: 0 0 18px; font-size: clamp(36px, 5vw, 56px); line-height: 1.13; }
.rose-cover-main h1 em { color: var(--rose-brand-blue); font-style: normal; }
.rose-cover-main strong { color: var(--rose-gray-600); font-size: 15px; font-weight: 600; }
.rose-cover-profile { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin-bottom: 24px; border-radius: 16px; background: var(--rose-gray-200); }
.rose-cover-profile > div { display: grid; gap: 6px; padding: 18px; background: var(--rose-gray-50); }
.rose-cover-profile span { color: var(--rose-gray-600); font-size: 11px; }
.rose-cover-profile b { font-size: 14px; }
.rose-cover-goal { display: grid; grid-template-columns: 90px 1fr; gap: 16px; margin-bottom: 20px; padding: 20px; border-radius: 16px; background: var(--rose-blue-50); }
.rose-cover-goal span { color: var(--rose-action-blue); font-weight: 800; }
.rose-cover-goal p { font-size: 14px; font-weight: 700; }
.rose-cover-note { padding: 20px; border-radius: 16px; background: var(--rose-gray-50); }
.rose-cover-note b { display: block; margin-bottom: 5px; }
.rose-cover-note p { color: var(--rose-gray-700); }
.rose-running-title { margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--rose-gray-200); color: var(--rose-gray-700); font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: -.015em; }
.rose-page-head { margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--rose-gray-200); }
.rose-page-head > div { display: flex; gap: 12px; align-items: center; }
.rose-page-head > div > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 11px; background: var(--rose-blue-50); color: var(--rose-action-blue); font-size: 11px; font-weight: 800; }
.rose-page-head h2 { margin: 0; font-size: 28px; }
.rose-page-head > p { margin: 8px 0 0 44px; color: var(--rose-gray-600); }
.rose-decision { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; margin-bottom: 18px; padding: 22px 24px; border-radius: 18px; background: var(--rose-blue-50); }
.rose-decision span { color: var(--rose-action-blue); font-size: 11px; font-weight: 800; }
.rose-decision h3 { margin: 4px 0 6px; font-size: 23px; }
.rose-decision p { color: var(--rose-gray-700); }
.rose-budget { display: grid; justify-items: end; }
.rose-budget b { font-size: 23px; font-variant-numeric: tabular-nums; }
.rose-budget small { color: var(--rose-gray-600); font-size: 10px; }
.rose-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }
.rose-metric-grid > div { display: grid; gap: 6px; padding: 16px; border-radius: 14px; background: var(--rose-gray-50); }
.rose-metric-grid span { color: var(--rose-gray-600); font-size: 10px; }
.rose-metric-grid b { font-size: 14px; font-variant-numeric: tabular-nums; }
.rose-paper-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.rose-card { padding: 18px; border: 1px solid var(--rose-gray-200); border-radius: 16px; background: #fff; }
.rose-card p { color: var(--rose-gray-700); }
.rose-callout { margin-top: 20px; padding: 20px; border-radius: 16px; background: var(--rose-gray-50); }
.rose-callout.blue { background: var(--rose-blue-50); }
.rose-callout p { color: var(--rose-gray-700); }
.rose-section-line { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.rose-badge { padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 850; }
.rose-badge.ok { background: var(--rose-blue-50); color: var(--rose-action-blue); }
.rose-badge.warn { background: var(--rose-gray-100); color: var(--rose-gray-700); }
.rose-table-wrap { overflow-x: auto; margin: 12px 0 18px; border: 1px solid var(--rose-gray-200); border-radius: 14px; }
.rose-data-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 11px; line-height: 1.45; }
.rose-data-table th,
.rose-data-table td { padding: 10px 11px; border-right: 1px solid var(--rose-gray-200); border-bottom: 1px solid var(--rose-gray-200); text-align: left; vertical-align: top; }
.rose-data-table tr > :last-child { border-right: 0; }
.rose-data-table tbody tr:last-child > * { border-bottom: 0; }
.rose-data-table thead th { background: var(--rose-gray-100); color: var(--rose-gray-700); font-weight: 700; }
.rose-data-table tbody th { color: var(--rose-gray-800); font-weight: 700; }
.rose-data-table td { color: var(--rose-gray-700); }
.rose-number { font-variant-numeric: tabular-nums; text-align: right !important; white-space: nowrap; }
.rose-priority { color: var(--rose-action-blue); font-size: 10px; font-weight: 800; }
.rose-summary-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.rose-summary-strip span { padding: 8px 11px; border-radius: 10px; background: var(--rose-gray-100); color: var(--rose-gray-600); font-size: 10px; }
.rose-summary-strip b { margin-left: 4px; color: var(--rose-ink); }
.rose-table-note { color: var(--rose-gray-600); font-size: 10px; }
.rose-advisor-note { margin-top: 20px; padding: 20px; border-radius: 16px; background: var(--rose-blue-50); }
.rose-advisor-note h3 { color: var(--rose-action-blue); }
.rose-advisor-note p { color: var(--rose-gray-800); }
.rose-danger-list { margin-top: 18px; padding: 18px 20px; border: 1px solid #f1cbd1; border-radius: 14px; background: #fff6f7; }
.rose-danger-list h3 { color: var(--rose-danger); }
.rose-assumptions { margin-top: 18px; color: var(--rose-gray-700); font-size: 11px; }
.rose-assumptions > p { margin-top: 9px; padding: 11px 13px; border-radius: 12px; background: var(--rose-gray-100); }
.rose-sources ul { padding: 0; list-style: none; }
.rose-sources li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 8px; }
.rose-sources li span { color: var(--rose-action-blue); font-weight: 800; }
.rose-sources a { color: var(--rose-action-blue); overflow-wrap: anywhere; }
.rose-sources > p { margin-top: 8px; color: var(--rose-gray-600); font-size: 10px; }
.rose-final-principle { margin-top: 20px; padding: 20px; border-radius: 16px; background: var(--rose-gray-900); color: #fff; }
.rose-final-principle h3 { color: #fff; }
.rose-final-principle p { color: #e5e8eb; }
.rose-paper-foot { display: grid; gap: 12px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--rose-gray-200); }
.rose-paper-foot > div { display: flex; flex-wrap: wrap; gap: 18px; }
.rose-paper-foot > p { color: var(--rose-gray-600); font-size: 10px; }
.rose-page-foot { display: flex; justify-content: space-between; margin-top: auto; padding-top: 20px; color: var(--rose-gray-500); font-size: 9px; }
.rose-approval { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 16px; padding: 16px; border: 1px solid var(--g5); border-radius: 14px; background: var(--bg); }
.rose-approval > p { grid-column: 1 / -1; color: var(--g3); font-size: 11px; }

@media (max-width: 900px) {
  .rose-grid.coverage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rose-quotes { grid-template-columns: 1fr; }
  .rose-report { padding: 16px; }
  .rose-report-page { min-height: 0; padding: 36px 32px 28px; }
}

@media (max-width: 620px) {
  .rose-panel-head > span:first-child { display: flex; flex-wrap: wrap; }
  .rose-mode-tabs { width: 100%; }
  .rose-interview-intro { gap: 10px; }
  .rose-interview-intro h2 { font-size: 23px; }
  .rose-question-map { gap: 2px; }
  .rose-question-map button { min-height: 32px; }
  .rose-question-map button span { width: 26px; height: 26px; }
  .rose-assistant-bubble { padding: 18px; }
  .rose-answer-card { margin-left: 0; padding: 18px 14px; }
  .rose-steps { gap: 4px; }
  .rose-steps button { min-height: 46px; padding: 5px; font-size: 0; }
  .rose-steps button span { font-size: 11px; }
  .rose-grid.two,
  .rose-grid.coverage,
  .rose-paper-grid,
  .rose-decision { grid-template-columns: 1fr; }
  .rose-budget { justify-items: start; }
  .rose-report { padding: 8px; border-radius: 14px; }
  .rose-report-page { padding: 28px 18px 22px; border-radius: 14px; }
  .rose-cover-main { margin: 68px 0 38px; }
  .rose-cover-main h1 { font-size: 34px; }
  .rose-cover-profile,
  .rose-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rose-cover-goal { grid-template-columns: 1fr; }
  .rose-page-head h2 { font-size: 23px; }
  .rose-page-head > p { margin-left: 0; }
  .rose-table-wrap { overscroll-behavior-inline: contain; }
  .rose-data-table { min-width: 680px; }
  .rose-limit-table { min-width: 620px; }
  .rose-evidence-actions { display: grid; }
  .rose-approval { grid-template-columns: 1fr; }
  .rose-approval .rose-primary { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .rose-step { animation: none; }
  .rose-mode,
  .rose-progress > span,
  .rose-question-map button,
  .rose-steps button,
  .rose-primary,
  .rose-secondary { transition: none; }
}

@media print {
  @page { size: A4; margin: 12mm; }
  body { background: #fff !important; }
  body * { visibility: hidden !important; }
  .rose-step { animation: none !important; transform: none !important; }
  #rosePrintableReport,
  #rosePrintableReport * { visibility: visible !important; }
  #rosePrintableReport {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: #fff !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    font-size: 10.5px;
    line-height: 1.48;
  }
  .rose-report-page {
    min-height: 273mm;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    break-after: page;
    box-shadow: none;
  }
  .rose-report-page:last-child { break-after: auto; }
  .rose-cover-main { margin: 38mm 0 18mm; }
  .rose-cover-main h1 { font-size: 32px; }
  .rose-running-title { margin-bottom: 10px; padding-bottom: 7px; font-size: 8.5px; }
  .rose-page-head { margin-bottom: 18px; padding-bottom: 12px; }
  .rose-page-head h2 { font-size: 23px; }
  .rose-decision { margin-bottom: 12px; padding: 16px 18px; }
  .rose-decision h3 { font-size: 19px; }
  .rose-metric-grid,
  .rose-paper-grid { gap: 10px; margin-bottom: 12px; }
  .rose-card,
  .rose-callout,
  .rose-advisor-note { padding: 14px; }
  .rose-data-table { font-size: 9px; }
  .rose-data-table th,
  .rose-data-table td { padding: 6px 7px; }
  .rose-table-wrap { overflow: visible; margin: 8px 0 12px; }
  .rose-paper-foot { break-inside: avoid; gap: 8px; margin-top: 12px; padding-top: 8px; }
  .rose-data-table tr,
  .rose-callout,
  .rose-card,
  .rose-advisor-note,
  .rose-final-principle { break-inside: avoid; }
}

/* ===== 로그인 게이트 ===== */
.hidden {
  display: none !important;
}

.login-gate {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg);
  padding: 20px;
}

.login-card {
  width: min(360px, 100%);
  background: var(--wht);
  border: 1px solid var(--g5);
  border-radius: 16px;
  padding: 28px 26px;
  box-shadow: 0 1px 2px rgba(24, 32, 44, .04), 0 24px 56px rgba(24, 32, 44, .1);
}

.login-field {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--g2);
  margin-bottom: 14px;
}

.login-field input {
  display: block;
  width: 100%;
  min-height: 44px;
  margin-top: 6px;
  border: 1px solid var(--g5);
  border-radius: 12px;
  padding: 0 14px;
  font: inherit;
  color: var(--ink);
  background: var(--wht);
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}

.login-field input:focus {
  border-color: var(--bl);
  box-shadow: 0 0 0 3px var(--blglow);
}

.login-error {
  min-height: 18px;
  margin-top: 10px;
  font-size: 12px;
  color: var(--red);
  text-align: center;
}

.login-help { margin: 10px 0 0; color: var(--g3); font-size: 12px; line-height: 1.55; }
.login-tab-btn { flex: 1; justify-content: center; }
.login-tab-btn.on { background: var(--wht); color: var(--bl); border-color: var(--g5); box-shadow: inset 0 2px 0 var(--gold); }
.login-recovery-action { display: flex; justify-content: flex-end; margin: -9px 0 12px; }
.login-recovery-action button,
.login-back-btn {
  min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--bl);
  font: 700 12px/1.4 'Pretendard', sans-serif; cursor: pointer;
  transition: color 180ms ease, opacity 180ms ease;
}
.login-recovery-action button:hover, .login-back-btn:hover { color: var(--bl2); text-decoration: underline; }
.login-recovery-action button:focus-visible, .login-back-btn:focus-visible { outline: 2px solid var(--bl); outline-offset: 3px; border-radius: 4px; }
.login-recovery-form:not(.hidden) { animation: login-recovery-enter 180ms ease-out both; }
.login-recovery-intro { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
.login-recovery-icon {
  display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px;
  border-radius: 12px; background: var(--blglow); color: var(--bl); font-size: 20px;
}
.login-recovery-intro strong { display: block; color: var(--ink); font-size: 17px; line-height: 1.3; }
.login-recovery-intro p { margin-top: 5px; color: var(--g3); font-size: 12px; line-height: 1.55; }
.login-recovery-status { min-height: 18px; margin-top: 12px; color: var(--grn); font-size: 12px; line-height: 1.55; text-align: center; }
.login-back-btn { display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; margin-top: 2px; color: var(--g2); }
@keyframes login-recovery-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.side-foot {
  position: relative;
}

.logout-btn {
  margin-left: auto;
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #9AA4B2;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .12s, color .12s;
}

.logout-btn:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.lead-stage-select {
  min-height: 32px;
  border: 1px solid var(--g5);
  border-radius: 8px;
  padding: 0 8px;
  font: inherit;
  font-size: 12px;
  color: var(--g1);
  background: var(--wht);
  cursor: pointer;
}

/* ===== Admin 멤버 수정 폼 ===== */
.member-edit-row td {
  background: var(--bg);
  padding: 16px 14px;
}

.member-edit-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  max-width: 640px;
}

.member-edit-form label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--g2);
}

.member-edit-form input,
.member-edit-form select {
  display: block;
  width: 100%;
  min-height: 40px;
  margin-top: 5px;
  border: 1px solid var(--g5);
  border-radius: 10px;
  padding: 0 12px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  background: var(--wht);
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}

.member-edit-form input:focus,
.member-edit-form select:focus {
  border-color: var(--bl);
  box-shadow: 0 0 0 3px var(--blglow);
}

.member-edit-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 8px;
  align-items: center;
}

.member-edit-actions .btn-ai-send {
  min-height: 38px;
  padding: 0 16px;
}

.member-edit-form .login-error {
  grid-column: 1 / -1;
  margin: 0;
  min-height: 0;
}

@media (max-width: 640px) {
  .member-edit-form {
    grid-template-columns: 1fr;
  }
}

/* ===== DB 내보내기 툴바 ===== */
.export-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--g5);
  border-radius: 12px;
  background: var(--bg);
}

.export-selectall {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--g2);
  cursor: pointer;
}

.export-status {
  font-size: 12px;
  color: var(--g3);
}

.lead-select {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

/* ═══════ 설계사 랜딩페이지 ═══════ */
.landing { min-height: 100vh; background: var(--bg); }

.ld-nav { position: sticky; top: 0; z-index: 50; background: rgba(14,22,38,.97); backdrop-filter: blur(10px); }
.ld-nav-inner { max-width: 1080px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 14px 24px; }
.ld-nav-left { flex: 1 1 0; display: flex; align-items: center; gap: 18px; }
.ld-brand { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 10px; color: #fff; font-weight: 800; font-size: 15px; white-space: nowrap; }
.ld-brand .mk { width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--bl), var(--ind)); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; box-shadow: 0 0 0 2px rgba(176,141,87,.35); }
.ld-nav-actions { flex: 1 1 0; display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
.ld-nav-link { color: #C9D2DC; text-decoration: none; font-size: 14px; font-weight: 600; }
.ld-nav-link:hover { color: #fff; }
.ld-btn-ghost { background: transparent; border: 1px solid rgba(255,255,255,.3); color: #fff; border-radius: 10px; padding: 9px 18px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: all .15s; }
.ld-btn-ghost:hover { border-color: var(--gold); color: var(--gold); }

.ld-hero { background: linear-gradient(180deg, #0E1626 0%, #141F33 100%); padding: 88px 24px 72px; }
.ld-hero-inner { max-width: 860px; margin: 0 auto; text-align: center; }
.ld-eyebrow { color: var(--gold); font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 18px; }
.ld-hero h1 { color: #fff; font-size: clamp(32px, 5vw, 52px); line-height: 1.25; letter-spacing: -.03em; margin-bottom: 20px; }
.ld-gold { color: #D9B98A; }
.ld-sub { color: #C9D2DC; font-size: 17px; line-height: 1.75; max-width: 640px; margin: 0 auto 30px; }
.ld-cta-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.ld-btn-primary { background: linear-gradient(135deg, var(--bl), var(--bl2)); color: #fff; border: none; border-radius: 12px; padding: 15px 30px; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; box-shadow: 0 10px 26px rgba(49,130,246,.35); transition: transform .15s, box-shadow .15s; }
.ld-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(49,130,246,.45); }
.ld-btn-secondary { display: inline-flex; align-items: center; background: transparent; border: 1px solid rgba(255,255,255,.32); color: #fff; border-radius: 12px; padding: 15px 30px; font-size: 16px; font-weight: 700; text-decoration: none; transition: all .15s; }
.ld-btn-secondary:hover { border-color: var(--gold); color: var(--gold); }
.ld-trust { margin-top: 26px; color: #8B95A1; font-size: 12.5px; }

.ld-section { padding: 72px 24px; }
.ld-section-inner { max-width: 1080px; margin: 0 auto; }
.ld-section h2 { text-align: center; font-size: clamp(24px, 3.4vw, 34px); letter-spacing: -.02em; color: var(--ink); margin-bottom: 10px; }
.ld-section-sub { text-align: center; color: var(--g2); font-size: 15px; margin-bottom: 40px; }

.ld-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-top: 36px; }
.ld-card { background: var(--wht); border: 1px solid var(--g5); border-radius: 16px; padding: 22px 20px; box-shadow: 0 1px 2px rgba(24,32,44,.03), 0 14px 30px rgba(24,32,44,.06); transition: transform .15s, box-shadow .15s, border-color .15s; }
.ld-card:hover { transform: translateY(-3px); border-color: rgba(176,141,87,.5); box-shadow: 0 18px 40px rgba(24,32,44,.1); }
.ld-card h3 { font-size: 15.5px; color: var(--ink); margin-bottom: 8px; letter-spacing: -.01em; }
.ld-card p { font-size: 13px; color: var(--g2); line-height: 1.65; }

.ld-flow-section { background: #fff; border-top: 1px solid var(--g5); border-bottom: 1px solid var(--g5); }
.ld-flow { display: flex; align-items: stretch; justify-content: center; gap: 14px; margin-top: 38px; flex-wrap: wrap; }
.ld-flow-step { flex: 0 1 260px; background: var(--bg); border: 1px solid var(--g5); border-radius: 16px; padding: 22px; text-align: center; }
.ld-flow-step span { display: inline-flex; width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: #fff; font-weight: 800; align-items: center; justify-content: center; margin-bottom: 12px; }
.ld-flow-step strong { display: block; color: var(--ink); margin-bottom: 8px; }
.ld-flow-step p { font-size: 12.5px; color: var(--g2); line-height: 1.6; }
.ld-flow-arrow { align-self: center; color: var(--g4); font-size: 22px; font-weight: 800; }

.ld-pricing { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; justify-content: center; margin-top: 38px; }
.ld-price-card { position: relative; background: var(--wht); border: 1px solid var(--g5); border-radius: 18px; padding: 30px 26px; box-shadow: 0 1px 2px rgba(24,32,44,.03), 0 16px 36px rgba(24,32,44,.07); }
.ld-price-featured { border-color: rgba(176,141,87,.6); box-shadow: 0 1px 2px rgba(24,32,44,.04), 0 22px 48px rgba(138,106,61,.16); }
.ld-price-badge { position: absolute; top: -12px; left: 26px; background: var(--gold); color: #fff; font-size: 11px; font-weight: 800; padding: 4px 12px; border-radius: 999px; }
.ld-price-card h3 { font-size: 16px; color: var(--g2); margin-bottom: 6px; }
.ld-price { font-size: 30px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; margin-bottom: 18px; }
.ld-price-card ul { list-style: none; display: grid; gap: 9px; }
.ld-price-card li { font-size: 13.5px; color: var(--g1); padding-left: 22px; position: relative; line-height: 1.5; }
.ld-price-card li::before { content: '✓'; position: absolute; left: 0; color: var(--gold); font-weight: 800; }
.ld-pricing-note { text-align: center; margin-top: 26px; font-size: 13px; color: var(--g3); margin-bottom: 18px; }
.ld-pricing .ld-price-card { display: flex; flex-direction: column; padding: 28px 20px; }
.ld-pricing .ld-price { font-size: clamp(22px, 2.2vw, 30px); font-variant-numeric: tabular-nums; }
.ld-pricing .ld-plan-btn { margin-top: auto; min-height: 44px; }
.ld-pricing ul { margin-bottom: 24px; }
.ld-pricing .ld-price-card li { font-size: 14px; }
#ld-pricing .ld-pricing-note { color: var(--g2); font-size: 14px; line-height: 1.7; }
#ld-pricing .ld-plan-btn-featured, #ld-pricing .ld-price-badge { color: #221D12; }
.ld-plan-purpose { color: var(--g2); font-size: 14px; line-height: 1.6; margin-bottom: 20px; }
.ld-usage-policy { max-width: 880px; margin: 24px auto; border-block: 1px solid var(--g4); color: var(--g1); }
.ld-usage-policy summary { cursor: pointer; padding: 18px 4px; min-height: 44px; font-weight: 700; }
.ld-usage-policy > div { padding: 0 4px 20px; font-size: 14px; line-height: 1.8; }
.ld-usage-policy p + p { margin-top: 12px; }
.ld-usage-policy ul { padding-left: 20px; margin-block: 12px; }
.ld-plan-btn:focus-visible, .ld-usage-policy summary:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .ld-pricing .ld-plan-btn { transition: none; transform: none; }
}

.ld-footer { background: #0E1626; padding: 34px 24px; text-align: center; }
.ld-footer p { color: #8B95A1; font-size: 12.5px; margin-bottom: 4px; }
.ld-footer a { color: #C9D2DC; text-decoration: none; }
.ld-footer a:hover { color: var(--gold); }

.gate-close { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; border: none; background: var(--g6); border-radius: 8px; font-size: 18px; color: var(--g2); cursor: pointer; }
.login-card { position: relative; }
.login-gate { background: rgba(14,22,38,.55); backdrop-filter: blur(6px); }

@media (max-width: 900px) {
  .ld-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ld-pricing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ld-flow-arrow { display: none; }
}
@media (max-width: 560px) {
  .ld-grid { grid-template-columns: 1fr; }
  .ld-pricing { grid-template-columns: minmax(0, 400px); }
  .ld-pricing .ld-price { font-size: 28px; }
}
@media (max-width: 560px) {
  /* 폰폭에서 커뮤니티·요금제 링크를 접어 로그인·회원가입 CTA가 화면 밖으로 밀리지 않게 한다. */
  .ld-nav-link { display: none; }
}

/* ===== 팀 보드 ===== */
.team-root { display: flex; flex-direction: column; gap: 16px; }
.team-loading, .team-empty { color: var(--g3); font-size: 14px; padding: 24px 4px; text-align: center; }

.team-invites { display: flex; flex-direction: column; gap: 8px; }
.team-invite-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: var(--gold-bg); border: 1px solid #EBD9BE; border-radius: 12px; padding: 12px 14px; }
.team-invite-text { font-size: 14px; color: var(--g1); }
.team-invite-actions { display: flex; gap: 8px; }
.btn-team-accept, .btn-team-decline { min-height: 36px; padding: 0 14px; border-radius: 9px; font: inherit; font-weight: 700; cursor: pointer; border: 1px solid transparent; }
.btn-team-accept { background: var(--bl); color: #fff; }
.btn-team-accept:hover { background: var(--bl2); }
.btn-team-decline { background: var(--wht); color: var(--g2); border-color: var(--g5); }
.btn-team-decline:hover { background: var(--g6); }

.team-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid var(--g5); padding-bottom: 12px; }
.team-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.team-tab { padding: 8px 14px; border-radius: 10px; font: inherit; font-weight: 600; font-size: 13px; color: var(--g2);
  background: var(--g6); border: 1px solid transparent; cursor: pointer; display: flex; align-items: center; gap: 6px; }
.team-tab.on { background: var(--wht); color: var(--bl); border-color: var(--g5); box-shadow: inset 0 2px 0 var(--gold); }
.team-tab-count { font-size: 11px; background: rgba(0,0,0,.06); border-radius: 20px; padding: 1px 7px; color: var(--g3); }
.team-new { display: flex; gap: 6px; }
.team-new input { min-height: 40px; border: 1px solid var(--g5); border-radius: 10px; padding: 0 12px; font: inherit; color: var(--ink); background: var(--wht); outline: none; }
.team-new input:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.team-new button { min-height: 40px; padding: 0 16px; border: none; border-radius: 10px; background: var(--gold); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.team-new button:hover { background: var(--gold-deep); }

.team-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.team-members-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; color: var(--g3); }
.team-members-line i { font-size: 16px; }
.team-chip { background: var(--g6); border: 1px solid var(--g5); border-radius: 20px; padding: 3px 10px; font-size: 12px; font-weight: 600; color: var(--g2); }
.team-chip.owner { background: var(--gold-bg); border-color: #EBD9BE; color: var(--gold-deep); }
.team-head-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.team-head-actions input { min-height: 40px; border: 1px solid var(--g5); border-radius: 10px; padding: 0 12px; font: inherit; color: var(--ink); background: var(--wht); outline: none; min-width: 200px; }
.team-head-actions input:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.team-head-actions button { min-height: 40px; padding: 0 14px; border: none; border-radius: 10px; background: var(--bl); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.team-head-actions button:hover { background: var(--bl2); }
.team-danger { background: var(--wht) !important; color: var(--red) !important; border: 1px solid var(--g5) !important; }
.team-danger:hover { background: var(--redbg) !important; }

.team-add-row { display: flex; gap: 6px; }
.team-add-row input { flex: 1; min-height: 42px; border: 1px solid var(--g5); border-radius: 11px; padding: 0 14px; font: inherit; color: var(--ink); background: var(--wht); outline: none; }
.team-add-row input:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.team-add-row button { min-height: 42px; padding: 0 18px; border: none; border-radius: 11px; background: var(--bl); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.team-add-row button:hover { background: var(--bl2); }

.personal-board-tabs { display: none; }
.team-kanban { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.team-col { background: var(--bg); border: 1px solid var(--g5); border-radius: 13px; padding: 12px; min-height: 120px; }
.team-col-h { font-size: 13px; font-weight: 700; color: var(--g2); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.team-col-h span { font-size: 11px; background: rgba(0,0,0,.06); border-radius: 20px; padding: 1px 7px; color: var(--g3); }
.team-col-body { display: flex; flex-direction: column; gap: 8px; }
.team-card { background: var(--wht); border: 1px solid var(--g5); border-radius: 11px; padding: 10px 11px; }
.team-card-title { font-size: 13.5px; color: var(--ink); line-height: 1.4; word-break: break-word; }
.personal-customer-context { margin-top:8px; padding-top:8px; border-top:1px solid var(--g5); }
.personal-customer-context strong { display:block; color:var(--ink); font-size:12px; }
.personal-customer-context p { margin:5px 0 0; color:var(--g3); font-size:12px; line-height:1.5; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.team-card-meta { font-size: 11px; color: var(--g4); margin-top: 6px; }
.team-card-actions { display: flex; gap: 4px; margin-top: 8px; justify-content: flex-end; }
.personal-card-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; justify-content: flex-end; }
.personal-card-actions button { min-width: 44px; min-height: 44px; padding: 6px 10px; border: 1px solid var(--g5); border-radius: 8px; background: var(--wht); color: var(--ink); cursor: pointer; font: inherit; }
.personal-card-actions button:hover { background: var(--bg); border-color: var(--g3); }
.personal-card-actions .personal-edit-save { background: var(--bl); color: #fff; border-color: var(--bl); }
.personal-card-actions .personal-complete { background: var(--bl); color: #fff; border-color: var(--bl); font-weight: 700; }
.personal-progress { color: var(--bl); font-weight: 700; }
.personal-card-actions .personal-edit-save:hover { background: var(--bl2); border-color: var(--bl2); }
.personal-card-actions button:disabled { opacity: .6; cursor: wait; }
.personal-card-actions button:focus-visible, .personal-edit-form textarea:focus-visible { outline: 2px solid var(--bl); outline-offset: 3px; }
.personal-edit-form label { display: block; margin-bottom: 8px; font-size: 13px; color: var(--ink); font-weight: 700; }
.personal-edit-form textarea { display: block; width: 100%; max-width: 100%; min-height: 90px; resize: vertical; border: 1px solid var(--g5); border-radius: 8px; padding: 10px; background: var(--wht); color: var(--ink); font: inherit; line-height: 1.5; }
.personal-edit-error { color: var(--red); font-size: 13px; line-height: 1.5; }
.personal-edit-error:empty, .personal-board-status:empty { display: none; }
.personal-board-status { margin: 0; color: var(--ink); font-size: 13px; }
#personalBoardRoot .team-card-title { white-space: pre-wrap; }
.tbl.my-leads-table { table-layout: fixed; min-width: 1180px; }
.tbl.my-leads-table th { text-transform: none; padding-inline: 8px; }
.tbl.my-leads-table td { padding-inline: 8px; }
.tbl.my-leads-table .lead-stage-select { width: 100%; max-width: 100%; min-height: 44px; }
.tbl.my-leads-table [data-outreach-id] { width: 100%; min-height: 44px; }
.tbl td.lead-customer-concern { white-space: pre-wrap; overflow-wrap: anywhere; }
.team-move, .team-del { min-width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--g5); background: var(--wht); color: var(--g3); cursor: pointer; font-size: 12px; line-height: 1; }
.team-move:hover { background: var(--blglow); color: var(--bl); border-color: var(--bl); }
.team-del:hover { background: var(--redbg); color: var(--red); border-color: var(--red); }

.team-activity { border: 1px solid var(--g5); border-radius: 13px; padding: 14px; background: var(--wht); }
.team-activity-h { font-size: 13px; font-weight: 700; color: var(--g2); margin-bottom: 10px; }
.team-activity-empty { font-size: 13px; color: var(--g4); }
.team-activity-list { list-style: none; display: flex; flex-direction: column; gap: 7px; }
.team-activity-list li { font-size: 13px; color: var(--g1); line-height: 1.5; }
.team-activity-time { font-size: 11px; color: var(--g4); margin-left: 4px; }

@media (max-width: 720px) {
  .team-kanban { grid-template-columns: 1fr; }
  .team-head-actions input { min-width: 0; flex: 1; }
  .personal-board-tabs { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 4px; padding: 4px; border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); }
  .personal-board-tabs button { min-width: 0; min-height: 44px; border: 0; border-radius: 9px; background: transparent; color: var(--g3); font: inherit; font-size: 12px; font-weight: 750; cursor: pointer; }
  .personal-board-tabs button[aria-pressed="true"] { background: var(--wht); color: var(--bl); box-shadow: 0 2px 8px rgba(0,0,0,.08); }
  .personal-board-tabs button:focus-visible { outline: 2px solid var(--bl); outline-offset: 2px; }
  .personal-board-kanban[data-active-col="todo"] .team-col:not([data-col="todo"]),
  .personal-board-kanban[data-active-col="doing"] .team-col:not([data-col="doing"]),
  .personal-board-kanban[data-active-col="done"] .team-col:not([data-col="done"]) { display: none; }
}

/* ===== 고객 청구지원 ===== */
.claim-care { display: flex; flex-direction: column; gap: 16px; color: var(--ink); }
.claim-hero { position: relative; overflow: hidden; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 28px 30px; border-radius: 18px; color: #fff; background: radial-gradient(circle at 80% 12%, rgba(202,165,101,.26), transparent 35%), linear-gradient(135deg, #101B30 0%, #162743 58%, #203A60 100%); box-shadow: 0 16px 40px rgba(14,25,43,.18); }
.claim-hero::after { content: ''; position: absolute; width: 260px; height: 260px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; right: -80px; bottom: -180px; }
.claim-hero > * { position: relative; z-index: 1; }
.claim-eyebrow, .claim-title-line span, .claim-case-head > div > span, .claim-queue-head span, .claim-next > span, .claim-draft > span, .claim-section-title span { display: block; color: #D8B87C; font-size: 10px; font-weight: 850; letter-spacing: .13em; }
.claim-eyebrow { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 11px; }
.claim-hero h2 { font-size: clamp(22px, 2.3vw, 32px); line-height: 1.22; letter-spacing: -.035em; }
.claim-hero h2 em { color: #F0D39E; font-style: normal; }
.claim-hero p { max-width: 700px; margin-top: 9px; color: #C3CEDC; font-size: 13.5px; line-height: 1.65; }
.claim-primary { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 7px; padding: 0 18px; border: 1px solid rgba(255,255,255,.2); border-radius: 12px; background: linear-gradient(180deg, #C6A163, #A67B3E); color: #fff; font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; white-space: nowrap; box-shadow: 0 8px 22px rgba(116,80,28,.28); transition: transform 90ms ease, filter 180ms ease, box-shadow 180ms ease; }
.claim-primary:hover { filter: brightness(1.07); box-shadow: 0 10px 28px rgba(116,80,28,.34); }
.claim-primary:active { transform: translateY(1px) scale(.99); }
.claim-primary:focus-visible, .claim-care button:focus-visible, .claim-care input:focus-visible, .claim-care select:focus-visible, .claim-care textarea:focus-visible { outline: 3px solid rgba(49,130,246,.28); outline-offset: 2px; }

.claim-boundary { display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 10px; padding: 12px 15px; border: 1px solid #E6D9C5; border-radius: 12px; background: #FFFBF4; color: #72542C; font-size: 12.5px; line-height: 1.5; }
.claim-boundary i { font-size: 20px; color: var(--gold-deep); }
.claim-boundary strong { white-space: nowrap; }
.claim-boundary span { color: #766953; }

.claim-quick-path { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.claim-quick-path > * { min-width: 0; min-height: 72px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 13px 14px; border: 1px solid var(--g5); border-radius: 13px; background: #fff; color: var(--ink); font: inherit; text-align: left; text-decoration: none; box-shadow: 0 6px 18px rgba(24,32,44,.04); transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease; }
.claim-quick-path > a, .claim-quick-path > button { cursor: pointer; }
.claim-quick-path > button { appearance: none; }
.claim-quick-path > a:hover, .claim-quick-path > button:hover { border-color: #D1B989; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(24,32,44,.08); }
.claim-quick-path > * > span { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 9px; background: var(--ink); color: #fff; font-size: 12px; font-weight: 850; }
.claim-quick-path div { display: grid; gap: 3px; min-width: 0; }
.claim-quick-path b { font-size: 13px; }
.claim-quick-path small { color: var(--g3); font-size: 10.5px; line-height: 1.4; }
.claim-quick-path > * > i { color: var(--gold-deep); font-size: 20px; }

.claim-steps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); list-style: none; border: 1px solid var(--g5); border-radius: 14px; background: var(--wht); overflow: hidden; }
.claim-steps li { position: relative; display: flex; align-items: center; gap: 8px; min-height: 56px; padding: 0 13px; color: var(--g3); font-size: 11.5px; }
.claim-steps li:not(:last-child)::after { content: ''; position: absolute; top: 16px; right: 0; width: 1px; height: 24px; background: var(--g5); }
.claim-steps li span { display: inline-flex; flex: 0 0 25px; width: 25px; height: 25px; border-radius: 50%; align-items: center; justify-content: center; background: var(--g6); font-size: 10px; }
.claim-steps li.on { color: var(--bl); background: linear-gradient(180deg, #F8FBFF, #fff); }
.claim-steps li.on span { background: var(--bl); color: #fff; box-shadow: 0 0 0 4px var(--blglow); }

.claim-create { padding: 24px; border: 1px solid rgba(176,141,87,.45); border-radius: 17px; background: #fff; box-shadow: 0 18px 46px rgba(38,47,62,.1); animation: claimPanelIn 260ms cubic-bezier(.2,.8,.2,1); }
.claim-create.hidden { display: none; }
.claim-section-title, .claim-title-line, .claim-case-head, .claim-queue-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.claim-section-title h3, .claim-title-line h3, .claim-queue-head h3, .claim-next h3, .claim-draft h3 { margin-top: 3px; font-size: 16px; letter-spacing: -.02em; }
.claim-section-title > button { width: 40px; height: 40px; border: 1px solid var(--g5); border-radius: 10px; background: #fff; color: var(--g2); cursor: pointer; }
.claim-mode-choice { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin-top: 18px; border: 0; }
.claim-mode-choice legend { margin-bottom: 8px; color: var(--g2); font-size: 12px; font-weight: 700; }
.claim-mode-choice label { cursor: pointer; }
.claim-mode-choice input { position: absolute; opacity: 0; pointer-events: none; }
.claim-mode-choice label > span { display: grid; grid-template-columns: auto 1fr; column-gap: 11px; padding: 15px; border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); transition: border-color 180ms ease, background 180ms ease, transform 180ms ease; }
.claim-mode-choice label > span i { grid-row: span 2; align-self: center; font-size: 24px; color: var(--g3); }
.claim-mode-choice label > span b { font-size: 13.5px; }
.claim-mode-choice label > span small { margin-top: 3px; color: var(--g3); font-size: 11.5px; }
.claim-mode-choice input:checked + span { border-color: var(--gold); background: var(--gold-bg); box-shadow: inset 0 0 0 1px rgba(176,141,87,.2); transform: translateY(-1px); }
.claim-mode-choice input:checked + span i { color: var(--gold-deep); }
.claim-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; margin-top: 16px; }
.claim-form-grid label { display: grid; gap: 6px; color: var(--g2); font-size: 12px; font-weight: 700; }
.claim-form-grid .claim-wide { grid-column: 1 / -1; }
.claim-history-field { padding: 12px; border: 1px solid #dfe5cd; border-radius: 12px; background: #fafbf6; }
.claim-history-field > small { color: #728043; font-size: 10px; font-weight: 700; }
.claim-form input, .claim-form select, .claim-form textarea { width: 100%; min-height: 44px; border: 1px solid var(--g5); border-radius: 10px; background: #fff; padding: 10px 12px; color: var(--ink); font: inherit; font-size: 13px; resize: vertical; }
.claim-form textarea { min-height: 76px; line-height: 1.55; }
.claim-form input:focus, .claim-form select:focus, .claim-form textarea:focus { border-color: var(--bl); }
.claim-history-notice { display: flex; gap: 7px; margin-top: 12px; padding: 11px 12px; border: 1px solid #dfe5cd; border-radius: 10px; background: #f8f9f3; color: #59683a; font-size: 11px; line-height: 1.55; }
.claim-history-notice i { flex: 0 0 auto; margin-top: 1px; }
.claim-advanced { margin-top: 14px; border: 1px solid var(--g5); border-radius: 11px; background: #FAFBFC; }
.claim-advanced summary { min-height: 44px; display: flex; align-items: center; gap: 6px; padding: 0 13px; color: var(--g2); font-size: 12px; font-weight: 750; cursor: pointer; }
.claim-advanced summary small { color: var(--g4); font-weight: 500; }
.claim-advanced[open] { padding: 0 13px 13px; }
.claim-one-consent { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 14px; border: 1px solid #CFDDF0; border-radius: 12px; background: #F6F9FD; cursor: pointer; }
.claim-one-consent input { flex: 0 0 19px; width: 19px; height: 19px; margin-top: 2px; accent-color: var(--bl); }
.claim-one-consent span { display: grid; gap: 3px; }
.claim-one-consent b { font-size: 12.5px; }
.claim-one-consent small { color: var(--g3); font-size: 11px; line-height: 1.5; }
.claim-consents { display: grid; gap: 8px; margin-top: 16px; padding: 14px; border-radius: 12px; background: var(--bg); }
.claim-consents label { display: flex; align-items: flex-start; gap: 9px; color: var(--g1); font-size: 12.5px; line-height: 1.5; }
.claim-consents input { flex: 0 0 17px; width: 17px; height: 17px; margin-top: 1px; accent-color: var(--bl); }
.claim-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 16px; }
.claim-form-actions p { flex: 1; color: var(--red); font-size: 12px; }

.claim-workspace { display: grid; grid-template-columns: 260px minmax(0,1fr); min-height: 560px; border: 1px solid var(--g5); border-radius: 17px; background: #fff; overflow: hidden; box-shadow: 0 10px 30px rgba(24,32,44,.06); }
.claim-loading, .claim-service-error { grid-column: 1 / -1; min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--g3); font-size: 13px; text-align: center; }
.claim-loading span, .claim-button-spinner { width: 20px; height: 20px; border: 2px solid var(--g5); border-top-color: var(--gold); border-radius: 50%; animation: claimSpin .7s linear infinite; }
.claim-service-error i { font-size: 34px; color: var(--g4); }
.claim-service-error b { color: var(--ink); font-size: 15px; }
.claim-service-error button, .claim-queue-empty button { min-height: 40px; border: 1px solid var(--g5); border-radius: 10px; padding: 0 14px; background: #fff; color: var(--bl); font: inherit; font-weight: 750; cursor: pointer; }
.claim-queue { min-width: 0; border-right: 1px solid var(--g5); background: #F8F9FB; }
.claim-queue-head { min-height: 75px; padding: 16px; border-bottom: 1px solid var(--g5); }
.claim-queue-head b { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 9px; background: #E9EEF6; color: var(--bl); font-size: 12px; }
.claim-queue-list { display: grid; gap: 7px; padding: 10px; max-height: 980px; overflow-y: auto; }
.claim-queue-item { width: 100%; padding: 13px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--g2); text-align: left; font: inherit; cursor: pointer; transition: transform 90ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.claim-queue-item:hover { background: #fff; }
.claim-queue-item.on { border-color: #D9C7A8; background: #fff; box-shadow: 0 7px 20px rgba(32,43,60,.08); }
.claim-queue-item:active { transform: scale(.99); }
.claim-queue-item > span:not(.claim-queue-top), .claim-queue-item small { display: block; margin-top: 7px; font-size: 11.5px; }
.claim-queue-item small { color: var(--g4); }
.claim-queue-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.claim-queue-top b { color: var(--ink); font-size: 13.5px; }
.claim-status { display: inline-flex; min-height: 23px; align-items: center; padding: 0 8px; border-radius: 999px; background: #EEF4FD; color: var(--bl); font-size: 10px; font-weight: 800; white-space: nowrap; }
.claim-status.high { background: #FFF0F1; color: #D33D4C; }
.claim-status.low { background: #EAF8F0; color: #217B4B; }
.claim-queue-empty { min-height: 250px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 20px; text-align: center; color: var(--g3); }
.claim-queue-empty i { font-size: 32px; color: var(--gold); }
.claim-queue-empty b { color: var(--ink); }
.claim-queue-empty span { font-size: 11.5px; line-height: 1.55; }

.claim-detail { min-width: 0; background: #fff; }
.claim-detail-empty { min-height: 500px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--g4); text-align: center; line-height: 1.7; }
.claim-detail-empty i { margin-bottom: 10px; font-size: 34px; }
.claim-case-head { min-height: 75px; padding: 13px 20px; border-bottom: 1px solid var(--g5); }
.claim-case-head h3 { margin: 3px 0; font-size: 17px; }
.claim-case-head p { color: var(--g3); font-size: 11.5px; }
.claim-case-head-actions { display: flex; align-items: center; gap: 8px; }
.claim-case-head-actions > button { min-height: 34px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--g5); border-radius: 9px; padding: 0 10px; background: #fff; color: var(--g2); font: inherit; font-size: 10.5px; font-weight: 750; cursor: pointer; }
.claim-case-head-actions > button:hover { border-color: var(--gold); color: var(--gold-deep); }
.claim-money-review { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--g5); background: linear-gradient(180deg, #F8FBFF, #fff); }
.claim-money-review article { display: grid; gap: 5px; padding: 14px; border: 1px solid #D9E5F3; border-radius: 12px; background: #fff; }
.claim-money-review article span { color: var(--g3); font-size: 10.5px; font-weight: 750; }
.claim-money-review article strong { color: #17375F; font-size: clamp(20px, 2vw, 27px); letter-spacing: -.035em; }
.claim-money-review > p { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--g3); font-size: 10.5px; line-height: 1.5; }
.claim-money-review > p > i { color: var(--bl); font-size: 16px; }
.claim-case-layout { display: grid; grid-template-columns: minmax(0,1fr) 292px; align-items: start; }
.claim-case-main { min-width: 0; padding: 20px; border-right: 1px solid var(--g5); }
.claim-case-main > section + section { margin-top: 25px; padding-top: 22px; border-top: 1px solid var(--g5); }
.claim-title-line small { color: var(--g4); font-size: 10.5px; }
.claim-evidence-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; margin-top: 13px; }
.claim-evidence { min-width: 0; min-height: 165px; padding: 14px; border: 1px solid var(--g5); border-radius: 12px; background: linear-gradient(180deg, #fff, #FAFBFC); transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.claim-evidence header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.claim-evidence header span { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); font-size: 11.5px; font-weight: 800; }
.claim-evidence header i { color: var(--gold-deep); font-size: 16px; }
.claim-evidence header em { color: var(--g4); font-size: 9.5px; font-style: normal; }
.claim-evidence p { display: -webkit-box; margin-top: 12px; overflow: hidden; color: var(--g2); font-size: 11.5px; line-height: 1.65; -webkit-line-clamp: 5; -webkit-box-orient: vertical; word-break: break-word; }
.claim-evidence > button { margin-top: 10px; border: 0; background: transparent; color: var(--bl); font: inherit; font-size: 10.5px; font-weight: 750; cursor: pointer; }
.claim-evidence.pulse { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(176,141,87,.16); transform: translateY(-2px); }
.claim-source-details { margin-top: 15px; border: 1px solid var(--g5); border-radius: 11px; background: var(--bg); }
.claim-source-details > summary { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 10px; padding: 0 13px; color: var(--g2); font-size: 11.5px; font-weight: 750; cursor: pointer; }
.claim-source-details > summary small { color: var(--g4); font-size: 10px; font-weight: 500; }
.claim-source-details[open] { padding-bottom: 13px; }
.claim-source-details[open] > summary { border-bottom: 1px solid var(--g5); }
.claim-source-details[open] .claim-evidence-grid { padding: 0 13px; }
.claim-documents > .claim-title-line { justify-content: center; text-align: center; }
.claim-documents > .claim-title-line > div { margin-inline: auto; }
.claim-documents > .claim-title-line > small { max-width: 250px; text-align: left; }
.claim-documents > ul { display: grid; gap: 7px; margin-top: 12px; list-style: none; }
.claim-documents > ul li { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 8px 11px; border: 1px solid var(--g5); border-radius: 10px; }
.claim-documents > ul li > span { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 9px; }
.claim-documents > ul li > span i { grid-row: span 2; color: var(--gold-deep); font-size: 18px; }
.claim-documents > ul b { font-size: 11.5px; }
.claim-documents > ul small { margin-top: 2px; color: var(--g4); font-size: 9.5px; }
.claim-documents > ul li > button { width: 34px; height: 34px; border: 0; border-radius: 9px; background: transparent; color: var(--g4); cursor: pointer; }
.claim-documents > ul li > button:hover { background: var(--redbg); color: var(--red); }
.claim-documents > ul .empty { justify-content: center; color: var(--g4); font-size: 11.5px; }
.claim-upload { display: grid; grid-template-columns: 130px minmax(0,1fr) auto; gap: 7px; margin-top: 9px; }
.claim-upload select, .claim-upload label, .claim-upload button { min-height: 42px; border: 1px solid var(--g5); border-radius: 10px; background: #fff; color: var(--g2); font: inherit; font-size: 11.5px; }
.claim-upload select { padding: 0 8px; }
.claim-upload label { display: flex; align-items: center; gap: 7px; padding: 0 11px; cursor: pointer; overflow: hidden; }
.claim-upload label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.claim-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.claim-upload button { padding: 0 13px; background: var(--bl); border-color: var(--bl); color: #fff; font-weight: 750; cursor: pointer; }
/* 오늘: 실제 배정 DB와 개인 보드에서 계산한 일일 운영 요약 */
.today-overview {
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(176,141,87,.28);
  border-radius: 16px;
  background: linear-gradient(135deg, var(--wht) 0%, color-mix(in srgb, var(--wht) 88%, var(--gold) 12%) 100%);
  box-shadow: 0 16px 38px rgba(14,22,38,.08);
  animation: today-enter 220ms ease-out both;
}
.today-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.today-kicker { display: block; margin-bottom: 6px; color: var(--gold-deep); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.today-head h2 { color: var(--ink); font-size: 23px; letter-spacing: -.025em; }
.today-head p { margin-top: 6px; color: var(--g3); font-size: 12px; }
.today-refresh { display: inline-flex; min-height: 44px; align-items: center; gap: 7px; padding: 0 14px; border: 1px solid var(--g5); border-radius: 11px; background: var(--wht); color: var(--g2); font: 700 12px/1 'Pretendard', sans-serif; cursor: pointer; }
.today-refresh:hover { border-color: var(--gold); color: var(--ink); }
.today-refresh:disabled { cursor: wait; opacity: .55; }
.today-focus-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 18px; }
.today-focus { min-width: 0; min-height: 132px; padding: 15px; border: 1px solid var(--g5); border-radius: 13px; background: var(--wht); color: var(--ink); text-align: left; font-family: inherit; cursor: pointer; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.today-focus:hover { border-color: rgba(176,141,87,.7); box-shadow: 0 10px 24px rgba(14,22,38,.08); transform: translateY(-2px); }
.today-focus:focus-visible, .today-refresh:focus-visible { outline: 3px solid rgba(49,130,246,.28); outline-offset: 2px; }
.today-focus span { display: flex; align-items: center; gap: 7px; color: var(--g2); font-size: 12px; font-weight: 750; }
.today-focus span i { color: var(--gold-deep); font-size: 17px; }
.today-focus strong { display: block; margin-top: 12px; color: var(--ink); font-size: 29px; line-height: 1; }
.today-focus small { display: block; margin-top: 8px; overflow: hidden; color: var(--g3); font-size: 10.5px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.today-flow { margin-top: 18px; padding: 16px; border: 1px solid rgba(49,130,246,.16); border-radius: 14px; background: rgba(255,255,255,.78); }
.today-flow-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.today-flow-kicker { display: block; margin-bottom: 5px; color: var(--bl); font-size: 9.5px; font-weight: 800; letter-spacing: .12em; }
.today-flow-head h3 { color: var(--ink); font-size: 16px; letter-spacing: -.015em; }
.today-flow-head p { margin-top: 5px; color: var(--g3); font-size: 11px; line-height: 1.55; }
.today-flow-badge { display: inline-flex; min-height: 30px; align-items: center; gap: 5px; padding: 0 9px; border: 1px solid #cfe0f7; border-radius: 999px; background: #f4f8fe; color: #315f91; font-size: 10px; font-weight: 800; white-space: nowrap; }
.today-flow-badge i { font-size: 14px; }
.daily-note-root { margin-top: 15px; }
.daily-note-loading, .daily-note-empty { display: flex; min-height: 76px; align-items: center; gap: 10px; padding: 14px; border: 1px dashed var(--g5); border-radius: 12px; background: var(--bg); color: var(--g3); font-size: 11px; }
.daily-note-loading i { color: var(--gold-deep); font-size: 18px; animation: daily-note-spin 1s linear infinite; }
.daily-note-empty > i { flex: none; color: var(--gold-deep); font-size: 22px; }
.daily-note-empty div { display: grid; gap: 3px; }
.daily-note-empty strong { color: var(--ink); font-size: 11.5px; }
.daily-note-empty span { line-height: 1.5; }
.daily-note-empty.is-error { border-color: #efc7cb; background: var(--redbg); color: var(--red); }
.daily-note-list { display: grid; gap: 11px; }
.daily-note-card { padding: 15px; border: 1px solid rgba(176,141,87,.48); border-radius: 13px; background: var(--wht); box-shadow: 0 8px 22px rgba(14,22,38,.06); animation: daily-note-enter 200ms ease-out both; }
.daily-note-card.is-approved { border-color: #bfe3cd; background: color-mix(in srgb, var(--wht) 94%, #dff5e7 6%); }
.daily-note-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.daily-note-label { display: inline-flex; align-items: center; gap: 5px; color: var(--gold-deep); font-size: 9.5px; font-weight: 800; }
.daily-note-card h4 { margin-top: 4px; color: var(--ink); font-size: 14px; }
.daily-note-status { display: inline-flex; min-height: 28px; align-items: center; padding: 0 9px; border-radius: 999px; font-size: 9.5px; font-weight: 800; white-space: nowrap; }
.daily-note-status.draft { border: 1px solid #e4d3ad; background: var(--gold-bg); color: var(--gold-deep); }
.daily-note-status.approved { border: 1px solid #bfe3cd; background: #e9f7ee; color: #1c6b39; }
.daily-note-memo-label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 13px; color: var(--ink); font-size: 11px; font-weight: 800; }
.daily-note-memo-label small { color: var(--g4); font-size: 9.5px; font-weight: 500; }
.daily-note-memo { display: block; width: 100%; min-height: 152px; margin-top: 7px; padding: 12px; resize: vertical; border: 1px solid var(--g5); border-radius: 10px; background: var(--bg); color: var(--g1); font: 500 11.5px/1.65 'Pretendard', sans-serif; }
.daily-note-memo:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); outline: none; }
.daily-note-memo-readonly { margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--bg); color: var(--g2); font-size: 11.5px; line-height: 1.65; }
.daily-note-actions-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 14px; }
.daily-note-actions-head strong { color: var(--ink); font-size: 11px; }
.daily-note-actions-head small { color: var(--g4); font-size: 9.5px; }
.daily-note-action-list { display: grid; gap: 7px; margin-top: 8px; }
.daily-note-action { display: grid; grid-template-columns: 20px 54px minmax(0,1fr); min-height: 46px; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--g5); border-radius: 10px; background: var(--bg); cursor: pointer; }
.daily-note-action:focus-within { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.daily-note-action-check { width: 18px; height: 18px; accent-color: var(--bl); }
.daily-note-priority { display: inline-flex; min-height: 24px; align-items: center; justify-content: center; border-radius: 999px; background: var(--gold-bg); color: var(--gold-deep); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.daily-note-priority.high { background: #fff0f1; color: #a93843; }
.daily-note-priority.low { background: #edf4fd; color: #315f91; }
.daily-note-action-title { min-width: 0; min-height: 36px; padding: 0 9px; border: 1px solid transparent; border-radius: 8px; background: var(--wht); color: var(--g1); font: 600 11px/1.4 'Pretendard', sans-serif; }
.daily-note-action-title:focus { border-color: var(--bl); outline: none; }
.daily-note-approval { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--g5); }
.daily-note-approval p { display: flex; max-width: 460px; align-items: flex-start; gap: 6px; color: var(--g3); font-size: 9.5px; line-height: 1.5; }
.daily-note-approval p i { flex: none; color: #268257; font-size: 14px; }
.daily-note-approval button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 6px; padding: 0 14px; border: 1px solid var(--bl); border-radius: 10px; background: var(--bl); color: #fff; font: 800 10.5px/1 'Pretendard', sans-serif; cursor: pointer; transition: opacity 160ms ease, transform 160ms ease; white-space: nowrap; }
.daily-note-approval button:hover { transform: translateY(-1px); }
.daily-note-approval button:focus-visible { outline: 3px solid rgba(49,130,246,.28); outline-offset: 2px; }
.daily-note-approval button:disabled { cursor: wait; opacity: .58; transform: none; }
.daily-note-approved-list { display: grid; gap: 7px; margin-top: 8px; padding: 0; list-style: none; }
.daily-note-approved-action { display: grid; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 7px; min-height: 42px; padding: 7px 9px; border: 1px solid #cfe8d8; border-radius: 9px; background: #f1faf4; color: #285f3b; font-size: 10.5px; }
.daily-note-approved-action small { color: #4b8060; font-size: 9px; }
.daily-note-empty-action { padding: 9px; color: var(--g4); font-size: 10px; }
.audio-daily-note { margin-top: 14px; padding: 0 !important; border: 0 !important; background: transparent !important; }
.personal-note-source { color: var(--gold-deep); font-weight: 750; }
@keyframes daily-note-spin { to { transform: rotate(360deg); } }
@keyframes daily-note-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.today-flow-steps { display: grid; gap: 8px; margin: 15px 0 0; padding: 0; list-style: none; }
.today-flow-step { display: grid; grid-template-columns: 31px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 58px; padding: 9px 10px; border: 1px solid var(--g5); border-radius: 11px; background: var(--wht); }
.today-flow-step-coach { grid-template-columns: 31px minmax(0,1fr); align-items: start; border-color: rgba(176,141,87,.48); background: linear-gradient(110deg, #fffdf7, #fff); }
.today-flow-index { display: inline-flex; width: 31px; height: 31px; align-items: center; justify-content: center; border-radius: 9px; background: var(--bg); color: var(--gold-deep); font-size: 10px; font-variant-numeric: tabular-nums; font-weight: 850; }
.today-flow-step strong { display: block; color: var(--ink); font-size: 12px; font-weight: 800; }
.today-flow-step small { display: block; margin-top: 3px; color: var(--g3); font-size: 10.5px; line-height: 1.45; }
.today-flow-step > button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 0 11px; border: 1px solid #d7e2f1; border-radius: 9px; background: #f8fbff; color: #315f91; font: inherit; font-size: 10.5px; font-weight: 750; cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease; white-space: nowrap; }
.today-flow-step > button:hover { border-color: #9ab9df; background: #eff6ff; transform: translateY(-1px); }
.today-flow-step > button:focus-visible, .today-coach-actions button:focus-visible { outline: 3px solid rgba(49,130,246,.28); outline-offset: 2px; }
.today-flow-state { display: inline-flex; min-height: 30px; align-items: center; gap: 5px; padding: 0 9px; border: 1px solid #e4d3ad; border-radius: 999px; background: var(--gold-bg); color: var(--gold-deep); font-size: 10px; font-weight: 800; white-space: nowrap; }
.today-flow-state i { font-size: 14px; }
.today-coach-copy { min-width: 0; }
.today-coach-actions { grid-column: 2; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 7px; margin-top: 9px; }
.today-coach-actions button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 5px; padding: 0 7px; border: 1px solid #eadfca; border-radius: 8px; background: #fff; color: var(--g2); font: inherit; font-size: 10px; font-weight: 750; cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease; }
.today-coach-actions button:hover { border-color: var(--gold); background: #fffaf0; transform: translateY(-1px); }
.today-coach-actions button i { color: var(--gold-deep); font-size: 15px; }
.today-flow-note { display: flex; align-items: flex-start; gap: 6px; margin-top: 11px; color: var(--g3); font-size: 10px; line-height: 1.55; }
.today-flow-note i { flex: none; margin-top: 1px; color: var(--bl); font-size: 14px; }
.today-boundary { display: flex; align-items: flex-start; gap: 7px; margin-top: 14px; color: var(--g3); font-size: 10.5px; line-height: 1.55; }
.today-boundary i { margin-top: 1px; color: var(--gold-deep); font-size: 15px; }
@keyframes today-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 720px) {
  .top { min-width: 0; padding: 0 10px; gap: 7px; }
  .ptitle { display: none; }
  .top .theme-btn { width: 36px; padding: 0; }
  .top .theme-btn .theme-btn-label { display: none; }
  .today-overview { padding: 17px; }
  .today-head h2 { font-size: 20px; }
  .today-refresh { padding: 0 11px; }
  .today-focus-grid { grid-template-columns: 1fr; }
  .today-focus { min-height: 0; }
  .today-focus small { white-space: normal; }
  .today-flow { padding: 13px; }
  .today-flow-head { display: block; }
  .today-flow-badge { margin-top: 10px; }
  .today-flow-step { grid-template-columns: 31px minmax(0,1fr); align-items: start; }
  .today-flow-step > button, .today-flow-state { grid-column: 2; justify-self: start; margin-top: 2px; }
  .today-coach-actions { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .today-coach-actions button:last-child { grid-column: 1 / -1; }
  .daily-note-card > header, .daily-note-approval, .daily-note-actions-head { align-items: stretch; flex-direction: column; }
  .daily-note-action { grid-template-columns: 20px 48px minmax(0,1fr); }
  .daily-note-approval button { width: 100%; }
  .daily-note-approved-action { grid-template-columns: 20px minmax(0,1fr); }
  .daily-note-approved-action small { grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) { .today-overview, .daily-note-card, .daily-note-loading i { animation: none; } .today-focus, .today-flow-step > button, .today-coach-actions button, .daily-note-approval button { transition: none; } }

/* 오늘: 상단 전체 폭 내 DB, 아래 좌(동의 상태+개인 보드)/우(팀 보드) */
.dash { display: flex; flex-direction: column; gap: 14px; }
.dash-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.dash-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
@media (max-width: 1100px) { .dash-split { grid-template-columns: minmax(0, 1fr); } }

/* 오늘 화면: Help에서 들어온 DB를 먼저 보고, 길어지는 자동 메모는 좌측 기록 탭에 담는다. */
.today-workspace { display: grid; grid-template-columns: 166px minmax(0, 1fr); min-height: 360px; border: 1px solid var(--g5); border-radius: 16px; background: var(--wht); overflow: hidden; box-shadow: 0 10px 30px rgba(14,22,38,.05); }
.today-workspace-tabs { display: grid; align-content: start; gap: 7px; padding: 12px; border-right: 1px solid var(--g5); background: color-mix(in srgb, var(--bg) 72%, var(--wht) 28%); }
.today-workspace-tab { min-height: 74px; display: grid; grid-template-columns: 23px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 8px; padding: 11px 9px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--g3); font: inherit; text-align: left; cursor: pointer; transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease, transform 180ms ease; }
.today-workspace-tab i { grid-row: span 2; color: var(--gold-deep); font-size: 18px; }
.today-workspace-tab span { color: inherit; font-size: 11px; font-weight: 800; }
.today-workspace-tab small { margin-top: 2px; color: var(--g4); font-size: 9.5px; }
.today-workspace-tab:hover { border-color: var(--g5); background: var(--wht); color: var(--g1); }
.today-workspace-tab.on { border-color: rgba(176,141,87,.42); background: var(--wht); color: var(--ink); box-shadow: 0 6px 16px rgba(14,22,38,.06); }
.today-workspace-tab.on i { color: var(--gold-deep); }
.today-workspace-tab:focus-visible { outline: 3px solid var(--blglow); outline-offset: 2px; }
.today-workspace-root { min-width: 0; }
.today-workspace-pane { min-width: 0; padding: 19px; }
.today-workspace-pane > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.today-workspace-kicker { display: block; margin-bottom: 5px; color: var(--gold-deep); font-size: 9.5px; font-weight: 850; letter-spacing: .11em; }
.today-workspace-pane h3 { color: var(--ink); font-size: 16px; letter-spacing: -.02em; }
.today-workspace-pane > header p { margin-top: 4px; color: var(--g3); font-size: 11px; line-height: 1.5; }
.today-workspace-pane .panel { margin-top: 15px; }
.daily-note-drawer { max-height: 640px; margin-top: 15px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; }
.daily-note-drawer .daily-note-list { padding-bottom: 3px; }
.daily-note-card { padding: 0; overflow: hidden; }
.daily-note-card > .daily-note-details { display: block; }
.daily-note-card > .daily-note-details > summary { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 13px 14px; list-style: none; cursor: pointer; }
.daily-note-card > .daily-note-details > summary::-webkit-details-marker { display: none; }
.daily-note-card > .daily-note-details > summary:hover { background: color-mix(in srgb, var(--bg) 48%, transparent); }
.daily-note-card > .daily-note-details[open] > summary { border-bottom: 1px solid var(--g5); }
.daily-note-summary-meta { display: inline-flex; align-items: center; gap: 8px; color: var(--g4); }
.daily-note-summary-meta > i { font-size: 17px; transition: transform 180ms ease; }
.daily-note-details[open] .daily-note-summary-meta > i { transform: rotate(180deg); }
.daily-note-body { padding: 0 14px 14px; }
.daily-note-body .daily-note-memo-label { margin-top: 13px; }
@media (max-width: 720px) {
  .today-workspace { grid-template-columns: 1fr; }
  .today-workspace-tabs { grid-template-columns: repeat(2, minmax(0,1fr)); border-right: 0; border-bottom: 1px solid var(--g5); }
  .today-workspace-tab { min-height: 58px; }
  .today-workspace-pane { padding: 14px; }
  .daily-note-drawer { max-height: none; overflow: visible; }
  .daily-note-card > .daily-note-details > summary, .daily-note-approval, .daily-note-actions-head { align-items: stretch; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .today-workspace-tab, .daily-note-summary-meta > i { transition: none; } }

/* 두 파일 필수 안내 + 등록 상태 칩 */
.claim-two-files { margin: 12px 0 14px; padding: 12px 14px; border: 1px solid #cfd9ea; border-radius: 10px; background: #f2f6fd; }
.claim-two-files strong { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #23406b; }
.claim-file-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 9px 0 7px; }
.claim-file-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border: 1px dashed #b7c4da; border-radius: 999px; background: var(--wht); color: #6c7c96; font-size: 11.5px; font-weight: 600; }
.claim-file-chip.is-done { border: 1px solid #bfe3cd; background: #e9f7ee; color: #1c6b39; }
.claim-two-files small { display: block; color: #52658a; font-size: 11px; line-height: 1.55; }
.claim-two-files small b { color: #23406b; font-weight: 700; }

/* 기지급 파일 화질 안내 — 테마 변수만 써서 화이트/그레이/다크 3종에 그대로 따라간다. */
.claim-prior-source { margin: 0 0 14px; padding: 13px 15px; border: 1px solid var(--amb); border-radius: 10px; background: var(--ambbg); }
.claim-prior-source strong { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 800; color: var(--ink); }
.claim-prior-source > strong > i { font-size: 15px; color: var(--amb); flex: none; }
.claim-prior-source > p { margin: 8px 0 10px; font-size: 11.5px; line-height: 1.6; color: var(--g2); }
.claim-prior-source > p b { color: var(--ink); font-weight: 700; }
.claim-prior-rank { list-style: none; display: grid; gap: 7px; margin: 0; padding: 0; }
.claim-prior-rank li { display: flex; align-items: flex-start; gap: 9px; padding: 8px 10px; border: 1px solid var(--g5); border-radius: 9px; background: var(--wht); }
.claim-prior-rank li > span { flex: none; min-width: 38px; padding: 3px 0; border-radius: 6px; font-size: 10.5px; font-weight: 800; text-align: center; letter-spacing: 0; }
.claim-prior-rank li b { display: block; font-size: 11.5px; font-weight: 700; color: var(--ink); }
.claim-prior-rank li small { display: block; margin-top: 2px; font-size: 11px; line-height: 1.5; color: var(--g2); }
.claim-prior-rank li.is-best { border-color: var(--grn); }
.claim-prior-rank li.is-best > span { background: var(--grnbg); color: var(--grn); }
.claim-prior-rank li.is-ok > span { background: var(--g6); color: var(--g2); }
.claim-prior-rank li.is-weak { border-color: var(--amb); }
.claim-prior-rank li.is-weak > span { background: var(--ambbg); color: var(--amb); }
.claim-prior-source-tip { display: flex; align-items: flex-start; gap: 7px; margin-top: 10px; font-size: 11px; line-height: 1.6; color: var(--g2); }
.claim-prior-source-tip > i { font-size: 14px; color: var(--amb); flex: none; margin-top: 1px; }
.claim-prior-source-tip b { color: var(--ink); font-weight: 700; }

/* HIRA PDF 비밀번호 — 폼 폭 전체를 쓰는 한 줄 카드 */
.claim-pdf-password { grid-column: 1 / -1; display: block; width: 100%; margin-top: 10px; padding: 12px 14px; border: 1px solid var(--g5); border-radius: 11px; background: var(--bg); }
.claim-pdf-password.is-hidden { display: none; }
.claim-pdf-password > span { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; font-size: 12px; font-weight: 700; color: var(--ink); }
.claim-pdf-password > span small { font-weight: 500; color: var(--g3); }
/* ⚠️ .claim-upload input(파일 input 숨김: position:absolute;width:1px;opacity:0)이 이 비밀번호
   input에도 상속돼 입력칸이 안 보였다(v11.1 3번). position/opacity/height를 명시해 되살린다. */
.claim-pdf-password input { position: static; display: block; width: 100%; height: auto; box-sizing: border-box; min-height: 40px; padding: 0 13px; border: 1px solid var(--g5); border-radius: 9px; font: inherit; color: var(--ink); background: var(--wht); opacity: 1; }
.claim-pdf-password input:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); outline: none; }
.claim-pdf-password-note { display: block; margin-top: 7px; color: var(--g3); font-size: 10.5px; line-height: 1.5; }
/* 과거 지급 기준 참고 범위 카드 */
.claim-est { flex: 1 1 190px; padding: 11px 13px; border: 1px solid #bfe3cd; border-radius: 10px; background: #eefaf1; }
.claim-est span { display: block; color: #1c6b39; font-size: 10.5px; }
.claim-est span small { color: #3f8a5c; }
.claim-est strong { display: block; margin-top: 3px; color: #145a2e; font-size: 19px; font-weight: 700; }
/* 구버전 배너 행동 버튼 */
.audio-legacy-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 9px; padding: 8px 14px; border: none; border-radius: 9px; background: #b08d57; color: #fff; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.audio-legacy-cta:hover { background: #9a7a49; }
.audio-reset { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 44px; margin-top: 8px; padding: 10px 14px; border: 1px solid #e0b088; border-radius: 10px; background: #fdf4e9; color: #8a5a22; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.audio-reset:hover { background: #fbe9d4; }
.audio-reset.hidden { display: none; }

.claim-unclaimed { margin-top: 18px; padding: 16px 18px; border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); }
.claim-unclaimed-sum { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.claim-unclaimed-sum > div { flex: 1 1 190px; padding: 11px 13px; border: 1px solid #e4d3ad; border-radius: 10px; background: #fdf8ec; }
.claim-unclaimed-sum span { display: block; color: #7d6835; font-size: 10.5px; }
.claim-unclaimed-sum strong { display: block; margin-top: 3px; color: #6b5726; font-size: 19px; font-weight: 700; }
.claim-unclaimed-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.claim-unclaimed-table { width: 100%; margin-top: 4px; border-collapse: collapse; font-size: 11.5px; }
.claim-unclaimed-table th { padding: 7px 8px; border-bottom: 1px solid var(--g5); color: var(--g3); font-size: 10.5px; font-weight: 600; text-align: left; }
.claim-unclaimed-table td { padding: 8px; border-bottom: 1px solid var(--g6, #eef1f6); }
.claim-unclaimed-table .claim-amt { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.claim-unclaimed-note { display: flex; gap: 7px; margin-top: 12px; padding: 10px 12px; border: 1px solid #e6c9a8; border-radius: 9px; background: #fdf4e9; color: #8a5a22; font-size: 11px; line-height: 1.6; }
.claim-unclaimed-note i { flex: none; margin-top: 1px; }
.claim-unclaimed-meta { margin-top: 8px; color: var(--g3); font-size: 10.5px; }
.claim-unclaimed-empty { display: flex; gap: 7px; align-items: flex-start; margin-top: 10px; color: var(--g3); font-size: 11.5px; line-height: 1.6; }
.claim-unclaimed-empty i { flex: none; margin-top: 2px; }
@media (max-width: 640px) { .claim-unclaimed { padding: 13px 12px; } .claim-unclaimed-table { min-width: 560px; font-size: 11px; } .claim-documents > .claim-title-line { align-items: center; flex-direction: column; } .claim-documents > .claim-title-line > small { text-align: center; } }
.claim-upload-status { margin-top: 8px; color: var(--g3); font-size: 10.5px; line-height: 1.5; }
.claim-upload-status.is-warn { padding: 8px 10px; border: 1px solid #e6c9a8; border-radius: 8px; background: #fdf4e9; color: #8a5a22; font-weight: 600; }
.claim-hira-verification { display: flex; gap: 10px; align-items: flex-start; margin: 12px 0 2px; padding: 11px 12px; border: 1px solid var(--g5); border-radius: 10px; background: var(--bg); color: var(--g2); }
.claim-hira-verification > i { flex: none; margin-top: 1px; font-size: 18px; }
.claim-hira-verification b { display: block; color: inherit; font-size: 11.5px; }
.claim-hira-verification p { margin-top: 3px; color: inherit; font-size: 10.5px; line-height: 1.55; }
.claim-hira-verification-verified { border-color: #b9dfc4; background: #f1fbf4; color: #216d3b; }
.claim-hira-verification-review, .claim-hira-verification-pending { border-color: #e6c9a8; background: #fdf4e9; color: #8a5a22; }
.claim-hira-preview { margin: 12px 0 2px; padding: 14px; border: 1px solid var(--g5); border-radius: 12px; background: var(--bg); }
.claim-hira-preview .claim-title-line { align-items: flex-end; }
.claim-hira-preview-intro { display: flex; gap: 8px; margin: 10px 0; color: var(--g2); font-size: 11px; line-height: 1.6; }
.claim-hira-preview-intro > i { flex: none; margin-top: 2px; color: var(--gold-deep); font-size: 16px; }
.claim-hira-preview-metrics { display: flex; flex-wrap: wrap; gap: 7px; margin: 10px 0; }
.claim-hira-preview-metrics span { padding: 6px 8px; border: 1px solid var(--g5); border-radius: 7px; background: var(--surface, #fff); color: var(--g3); font-size: 10.5px; }
.claim-hira-preview-metrics b { margin-left: 4px; color: var(--ink); font-variant-numeric: tabular-nums; }
.claim-hira-preview-table-wrap { overflow-x: auto; border: 1px solid var(--g5); border-radius: 8px; }
.claim-hira-preview-table { width: 100%; min-width: 540px; border-collapse: collapse; color: var(--g2); font-size: 10.5px; }
.claim-hira-preview-table th, .claim-hira-preview-table td { padding: 8px 9px; border-bottom: 1px solid var(--g6, #eef1f6); text-align: left; }
.claim-hira-preview-table th { background: var(--surface, #f7f8fa); color: var(--g3); font-size: 10px; font-weight: 750; }
.claim-hira-preview-table .claim-amt { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.claim-hira-preview-more, .claim-hira-preview-notice { margin-top: 8px; color: var(--g3); font-size: 10.5px; line-height: 1.55; }
.claim-hira-preview-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.claim-hira-preview-actions > label { display: inline-flex; align-items: flex-start; gap: 6px; max-width: 260px; color: var(--g2); font-size: 10.5px; line-height: 1.45; cursor: pointer; }
.claim-hira-preview-actions input { width: 16px; height: 16px; margin-top: 0; accent-color: var(--bl); }
.claim-hira-confirm, .claim-hira-cancel { min-height: 38px; border-radius: 9px; padding: 0 11px; font: inherit; font-size: 11px; font-weight: 750; cursor: pointer; }
.claim-hira-confirm { border: 1px solid var(--bl); background: var(--bl); color: #fff; }
.claim-hira-confirm:disabled { opacity: .48; cursor: not-allowed; }
.claim-hira-cancel { border: 1px solid var(--g5); background: transparent; color: var(--g3); }
@media (max-width: 640px) { .claim-hira-preview { padding: 12px; } .claim-hira-preview-actions { align-items: stretch; } .claim-hira-preview-actions > label { max-width: none; width: 100%; } .claim-hira-confirm, .claim-hira-cancel { min-height: 42px; } }
.claim-unclaimed-blocked { border-color: #e6c9a8; background: #fffaf2; }
@media (prefers-reduced-motion: no-preference) { .claim-hira-verification { transition: border-color 180ms ease, background-color 180ms ease; } }
.claim-analysis .claim-title-line { align-items: flex-end; }
.claim-analyze { min-height: 40px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #DCC8A6; border-radius: 10px; padding: 0 13px; background: var(--gold-bg); color: var(--gold-deep); font: inherit; font-size: 11.5px; font-weight: 800; cursor: pointer; }
.claim-analysis-empty { display: flex; flex-direction: column; align-items: center; margin-top: 12px; padding: 30px 20px; border: 1px dashed var(--g5); border-radius: 12px; background: var(--bg); color: var(--g3); text-align: center; }
.claim-analysis-empty i { color: var(--gold); font-size: 28px; }
.claim-analysis-empty b { margin: 8px 0 4px; color: var(--ink); }
.claim-analysis-empty p { max-width: 440px; font-size: 11.5px; line-height: 1.6; }
.claim-analysis-block { margin-top: 12px; padding: 14px; border: 1px solid var(--g5); border-radius: 12px; }
.claim-analysis-block h4 { display: flex; align-items: center; gap: 7px; color: var(--ink); font-size: 12.5px; }
.claim-analysis-block h4 i { color: var(--gold-deep); font-size: 17px; }
.claim-analysis-block ul { display: grid; gap: 10px; margin-top: 11px; list-style: none; }
.claim-analysis-block li { padding-top: 9px; border-top: 1px dashed var(--g5); }
.claim-analysis-block li:first-child { padding-top: 0; border-top: 0; }
.claim-analysis-block li p { color: var(--g2); font-size: 11.5px; line-height: 1.6; }
.claim-citations { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.claim-citations button, .claim-no-source { display: inline-flex; min-height: 24px; align-items: center; gap: 3px; border: 1px solid #D7E5F7; border-radius: 999px; padding: 0 7px; background: #F5F9FE; color: #386999; font: inherit; font-size: 9.5px; cursor: pointer; }
.claim-no-source { border-color: var(--g5); background: var(--bg); color: var(--g4); cursor: default; }

.claim-action-rail { position: sticky; top: 0; display: grid; gap: 10px; padding: 14px; background: #FAFBFC; }
.claim-action-rail > section { padding: 14px; border: 1px solid var(--g5); border-radius: 12px; background: #fff; }
.claim-next ol { display: grid; gap: 12px; margin-top: 13px; list-style: none; }
.claim-next li { display: flex; align-items: flex-start; gap: 9px; }
.claim-next li > span { display: inline-flex; flex: 0 0 23px; width: 23px; height: 23px; align-items: center; justify-content: center; border-radius: 7px; background: var(--ink); color: #fff; font-size: 10px; font-weight: 800; }
.claim-next li b { color: var(--gold-deep); font-size: 9px; text-transform: uppercase; }
.claim-next li p { margin-top: 2px; color: var(--g2); font-size: 11px; line-height: 1.55; }
.claim-next li.empty { color: var(--g4); font-size: 11px; }
.claim-draft > p { margin-top: 11px; padding: 12px; border-radius: 10px; background: #F6F8FA; color: var(--g2); font-size: 11px; line-height: 1.65; white-space: pre-wrap; }
.claim-approve-check { display: flex; align-items: flex-start; gap: 8px; margin-top: 11px; cursor: pointer; }
.claim-approve-check input { flex: 0 0 17px; width: 17px; height: 17px; margin-top: 2px; accent-color: var(--bl); }
.claim-approve-check span { display: grid; }
.claim-approve-check b { font-size: 11.5px; }
.claim-approve-check small { margin-top: 2px; color: var(--g4); font-size: 9.5px; line-height: 1.4; }
.claim-approve, .claim-copy { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 9px; border: 1px solid var(--bl); border-radius: 10px; background: var(--bl); color: #fff; font: inherit; font-size: 11.5px; font-weight: 800; cursor: pointer; }
.claim-copy { background: #fff; color: var(--bl); }
.claim-approve:disabled, .claim-copy:disabled { border-color: var(--g5); background: var(--g6); color: var(--g4); cursor: not-allowed; }
.claim-guardrail { display: flex; gap: 9px; background: #F8FAFC !important; }
.claim-guardrail i { color: #268257; font-size: 20px; }
.claim-guardrail b { font-size: 11.5px; }
.claim-guardrail p { margin-top: 3px; color: var(--g3); font-size: 10px; line-height: 1.5; }
.claim-status-actions h3 { margin-bottom: 8px; font-size: 11.5px; }
.claim-status-actions button { width: 100%; min-height: 36px; margin-top: 5px; border: 1px solid var(--g5); border-radius: 9px; background: #fff; color: var(--g2); font: inherit; font-size: 10.5px; cursor: pointer; }
.claim-status-actions button:hover { border-color: var(--gold); color: var(--gold-deep); }
.claim-status-actions .claim-delete-case { margin-top: 10px; border-color: #F1D3D6; color: #C33A48; }
.claim-status-actions .claim-delete-case:hover { border-color: var(--red); background: var(--redbg); color: var(--red); }

@keyframes claimPanelIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes claimSpin { to { transform: rotate(360deg); } }

@media (max-width: 1180px) {
  .claim-workspace { grid-template-columns: 220px minmax(0,1fr); }
  .claim-case-layout { grid-template-columns: 1fr; }
  .claim-case-main { border-right: 0; }
  .claim-action-rail { position: static; grid-template-columns: repeat(2, minmax(0,1fr)); border-top: 1px solid var(--g5); }
}

@media (max-width: 900px) {
  .claim-quick-path { grid-template-columns: 1fr; }
  .claim-steps { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .claim-steps li:nth-child(3)::after { display: none; }
  .claim-workspace { grid-template-columns: 1fr; }
  .claim-queue { border-right: 0; border-bottom: 1px solid var(--g5); }
  .claim-queue-list { display: flex; max-height: none; overflow-x: auto; scroll-snap-type: x proximity; }
  .claim-queue-item { flex: 0 0 230px; scroll-snap-align: start; }
  .claim-evidence-grid { grid-template-columns: 1fr; }
  .claim-evidence { min-height: 0; }
}

@media (max-width: 620px) {
  .claim-care { gap: 12px; }
  .claim-hero { align-items: stretch; flex-direction: column; padding: 22px 18px; }
  .claim-hero .claim-primary { width: 100%; }
  .claim-boundary { grid-template-columns: auto 1fr; }
  .claim-boundary span { grid-column: 1 / -1; }
  .claim-steps li { min-height: 48px; padding: 0 8px; }
  .claim-steps li b { font-size: 10px; }
  .claim-steps li span { flex-basis: 22px; width: 22px; height: 22px; }
  .claim-create { padding: 17px; }
  .claim-mode-choice, .claim-form-grid { grid-template-columns: 1fr; }
  .claim-form-grid .claim-wide { grid-column: auto; }
  .claim-form-actions { align-items: stretch; flex-direction: column; }
  .claim-form-actions .claim-primary { width: 100%; }
  .claim-case-head { align-items: flex-start; }
  .claim-case-head-actions { align-items: flex-end; flex-direction: column-reverse; }
  .claim-money-review { grid-template-columns: 1fr; padding: 12px 15px; }
  .claim-case-main { padding: 15px; }
  .claim-title-line { align-items: flex-start; flex-direction: column; }
  .claim-analysis .claim-title-line { align-items: stretch; }
  .claim-upload { grid-template-columns: 1fr; }
  .claim-action-rail { grid-template-columns: 1fr; padding: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .claim-create, .claim-loading span, .claim-button-spinner { animation: none !important; }
  .claim-care *, .claim-care *::before, .claim-care *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   화면 테마 — 화이트(기본) / 그레이 / 다크
   화이트는 :root 그대로이며 아래 규칙이 하나도 적용되지 않는다(100% 불변).
   그레이·다크는 Apple 다크모드 규칙을 따른다: 표면을 계층으로 쌓고
   (base → elevated → raised), 구분선은 흰색 알파, 라벨은 불투명도 위계,
   떠 있는 크롬은 반투명 재질(backdrop-filter)로 처리한다.
   ═══════════════════════════════════════════════════════════════════ */

/* 다크 — 첨부 시안 기준 near-black + Apple 시스템 컬러 */
html[data-theme="dark"] {
  --surface-0: #0D0D0D;   /* 페이지 바탕 */
  --surface-1: #171717;   /* 카드·패널 */
  --surface-2: #1F1F1F;   /* 카드 위 요소 */
  --surface-3: #272727;   /* 입력·호버 */
  --sep: rgba(255, 255, 255, .09);
  --sep-strong: rgba(255, 255, 255, .16);
  --label-1: #FFFFFF;
  --label-2: rgba(255, 255, 255, .68);
  --label-3: rgba(255, 255, 255, .46);
  --label-4: rgba(255, 255, 255, .30);
  --chrome: rgba(20, 20, 20, .72);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .6);
  --shadow-2: 0 8px 24px rgba(0, 0, 0, .55);
  --tint-blue: rgba(10, 132, 255, .14);
  --tint-blue-line: rgba(10, 132, 255, .30);
  --tint-blue-ink: #6FB4FF;
  --tint-green: rgba(48, 209, 88, .13);
  --tint-green-line: rgba(48, 209, 88, .28);
  --tint-green-ink: #56DE7C;
  --tint-gold: rgba(217, 185, 138, .12);
  --tint-gold-line: rgba(217, 185, 138, .28);
  --tint-gold-ink: #E3C79E;
  --tint-red: rgba(255, 69, 58, .13);
  --tint-red-line: rgba(255, 69, 58, .30);
  --tint-red-ink: #FF7B72;
  --tint-neutral: rgba(255, 255, 255, .06);
}

/* 그레이 — Apple elevated 다크 그레이. 다크(near-black)와 한눈에 구분되도록
   systemGray5/4 단계를 base로 올려 "검정"이 아니라 "회색"으로 읽히게 한다. */
html[data-theme="gray"] {
  --surface-0: #2C2C2E;
  --surface-1: #3A3A3C;
  --surface-2: #48484A;
  --surface-3: #545456;
  --sep: rgba(255, 255, 255, .13);
  --sep-strong: rgba(255, 255, 255, .22);
  --label-1: #F5F5F7;
  --label-2: rgba(255, 255, 255, .72);
  --label-3: rgba(255, 255, 255, .52);
  --label-4: rgba(255, 255, 255, .36);
  --chrome: rgba(44, 44, 46, .74);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .45);
  --shadow-2: 0 8px 24px rgba(0, 0, 0, .42);
  --tint-blue: rgba(10, 132, 255, .18);
  --tint-blue-line: rgba(10, 132, 255, .34);
  --tint-blue-ink: #7CBBFF;
  --tint-green: rgba(48, 209, 88, .16);
  --tint-green-line: rgba(48, 209, 88, .32);
  --tint-green-ink: #63E288;
  --tint-gold: rgba(217, 185, 138, .16);
  --tint-gold-line: rgba(217, 185, 138, .32);
  --tint-gold-ink: #E8D0AC;
  --tint-red: rgba(255, 69, 58, .16);
  --tint-red-line: rgba(255, 69, 58, .34);
  --tint-red-ink: #FF8B84;
  --tint-neutral: rgba(255, 255, 255, .08);
}

/* 두 테마 공통 — 기존 변수 재매핑 */
html[data-theme="dark"], html[data-theme="gray"] {
  --bg: var(--surface-0);
  --wht: var(--surface-1);
  --ink: var(--label-1);
  --g1: var(--label-1);
  --g2: var(--label-2);
  --g3: var(--label-3);
  --g4: var(--label-4);
  --g5: var(--sep);
  --g6: var(--tint-neutral);
  --bl: #0A84FF;
  --bl2: #409CFF;
  --blglow: rgba(10, 132, 255, .28);
  --ind: #A78BFA;
  --grn: #30D158;
  --grnbg: var(--tint-green);
  --amb: #FF9F0A;
  --ambbg: var(--tint-gold);
  --red: #FF453A;
  --redbg: var(--tint-red);
  --gold: #D9B98A;
  --gold-deep: #C8A26B;
  --gold-bg: var(--tint-gold);
  --dark: var(--surface-1);
  color-scheme: dark;
}

html[data-theme="dark"] body, html[data-theme="gray"] body { background: var(--surface-0); color: var(--label-1); }

/* 표면 계층 — 카드는 base 위에 한 단계 올라온 것으로 읽혀야 한다 */
html[data-theme="dark"] .panel, html[data-theme="gray"] .panel,
html[data-theme="dark"] .kpi, html[data-theme="gray"] .kpi,
html[data-theme="dark"] .claim-case, html[data-theme="gray"] .claim-case,
html[data-theme="dark"] .team-card, html[data-theme="gray"] .team-card,
html[data-theme="dark"] .claim-unclaimed, html[data-theme="gray"] .claim-unclaimed,
html[data-theme="dark"] .claim-hira-verification, html[data-theme="gray"] .claim-hira-verification,
html[data-theme="dark"] .claim-hira-preview, html[data-theme="gray"] .claim-hira-preview,
html[data-theme="dark"] .audio-report, html[data-theme="gray"] .audio-report {
  background: var(--surface-1);
  border-color: var(--sep);
  box-shadow: var(--shadow-1);
}
html[data-theme="dark"] .daily-note-card, html[data-theme="gray"] .daily-note-card,
html[data-theme="dark"] .daily-note-loading, html[data-theme="gray"] .daily-note-loading,
html[data-theme="dark"] .daily-note-empty, html[data-theme="gray"] .daily-note-empty,
html[data-theme="dark"] .daily-note-action, html[data-theme="gray"] .daily-note-action,
html[data-theme="dark"] .daily-note-memo-readonly, html[data-theme="gray"] .daily-note-memo-readonly {
  background: var(--surface-2);
  border-color: var(--sep);
  color: var(--label-2);
}
html[data-theme="dark"] .daily-note-card.is-approved, html[data-theme="gray"] .daily-note-card.is-approved { background: var(--surface-2); border-color: var(--tint-green-line); }
html[data-theme="dark"] .daily-note-action-title, html[data-theme="gray"] .daily-note-action-title { background: var(--surface-3); color: var(--label-1); }
html[data-theme="dark"] .daily-note-status.approved, html[data-theme="gray"] .daily-note-status.approved,
html[data-theme="dark"] .daily-note-approved-action, html[data-theme="gray"] .daily-note-approved-action { background: var(--tint-green); border-color: var(--tint-green-line); color: var(--tint-green-ink); }
html[data-theme="dark"] .daily-note-approved-action small, html[data-theme="gray"] .daily-note-approved-action small { color: var(--label-2); }
html[data-theme="dark"] .team-col, html[data-theme="gray"] .team-col,
html[data-theme="dark"] .claim-evidence-card, html[data-theme="gray"] .claim-evidence-card,
html[data-theme="dark"] .audio-upload-card, html[data-theme="gray"] .audio-upload-card,
html[data-theme="dark"] .audio-policy-card, html[data-theme="gray"] .audio-policy-card {
  background: var(--surface-2);
  border-color: var(--sep);
}

/* 청구지원(고객 청구지원) 다크/그레이 대비 (의뢰인 v9: "화이트는 되고 그레이·다크에선 안 보임").
   이 밴드들은 배경을 흰색으로 하드코딩했는데 다크 오버라이드가 없어, 안의 var(--g2/--g3)
   텍스트가 다크에서 밝은 회색으로 뒤집혀 흰 배경 위에서 사라졌다. 화이트 모드는 그대로 두고
   다크/그레이에서만 배경을 표면색으로, 하드코딩된 진한 글자색을 밝은 값으로 덮는다. */
html[data-theme="dark"] .claim-create, html[data-theme="gray"] .claim-create,
html[data-theme="dark"] .claim-form, html[data-theme="gray"] .claim-form,
html[data-theme="dark"] .claim-detail, html[data-theme="gray"] .claim-detail,
html[data-theme="dark"] .claim-upload, html[data-theme="gray"] .claim-upload,
html[data-theme="dark"] .claim-queue-item, html[data-theme="gray"] .claim-queue-item,
html[data-theme="dark"] .claim-service-error, html[data-theme="gray"] .claim-service-error {
  background: var(--surface-1);
  border-color: var(--sep);
}
html[data-theme="dark"] .claim-evidence, html[data-theme="gray"] .claim-evidence,
html[data-theme="dark"] .claim-money-review article, html[data-theme="gray"] .claim-money-review article,
html[data-theme="dark"] .claim-citations, html[data-theme="gray"] .claim-citations,
html[data-theme="dark"] .claim-action-rail, html[data-theme="gray"] .claim-action-rail,
html[data-theme="dark"] .claim-draft, html[data-theme="gray"] .claim-draft {
  background: var(--surface-2);
  border-color: var(--sep);
}
/* 밴드 자체(그라디언트/구분선)는 투명 처리해 카드 표면이 그대로 비치게 한다 */
html[data-theme="dark"] .claim-steps, html[data-theme="gray"] .claim-steps,
html[data-theme="dark"] .claim-money-review, html[data-theme="gray"] .claim-money-review,
html[data-theme="dark"] .claim-section-title, html[data-theme="gray"] .claim-section-title,
html[data-theme="dark"] .claim-status-actions, html[data-theme="gray"] .claim-status-actions {
  background: transparent;
  border-color: var(--sep);
}
/* 하드코딩된 진한 글자색을 다크에서 밝게 (진한 남색·파랑은 다크 배경에서 안 읽힌다) */
html[data-theme="dark"] .claim-money-review article strong, html[data-theme="gray"] .claim-money-review article strong { color: var(--ink); }
html[data-theme="dark"] .claim-citations button, html[data-theme="gray"] .claim-citations button,
html[data-theme="dark"] .claim-no-source, html[data-theme="gray"] .claim-no-source { color: var(--bl); }

/* 떠 있는 크롬은 반투명 재질 — 콘텐츠가 아래로 흐른다 */
html[data-theme="dark"] .top, html[data-theme="gray"] .top,
html[data-theme="dark"] .side, html[data-theme="gray"] .side {
  background: var(--chrome);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-color: var(--sep);
}
html[data-theme="dark"] .tabs, html[data-theme="gray"] .tabs { background: transparent; border-color: var(--sep); }
html[data-theme="dark"] .tab, html[data-theme="gray"] .tab { color: var(--label-3); }
html[data-theme="dark"] .tab:hover, html[data-theme="gray"] .tab:hover { color: var(--label-1); background: var(--tint-neutral); }
html[data-theme="dark"] .tab.on, html[data-theme="gray"] .tab.on { color: var(--bl); }
html[data-theme="dark"] .nav-i, html[data-theme="gray"] .nav-i { color: var(--label-2); }
html[data-theme="dark"] .nav-i:hover, html[data-theme="gray"] .nav-i:hover { background: var(--tint-neutral); color: var(--label-1); }
html[data-theme="dark"] .nav-i.on, html[data-theme="gray"] .nav-i.on { background: var(--tint-blue); color: var(--tint-blue-ink); }

/* 입력·폼 */
html[data-theme="dark"] input, html[data-theme="gray"] input,
html[data-theme="dark"] select, html[data-theme="gray"] select,
html[data-theme="dark"] textarea, html[data-theme="gray"] textarea {
  background: var(--surface-3);
  border-color: var(--sep-strong);
  color: var(--label-1);
}
html[data-theme="dark"] input::placeholder, html[data-theme="gray"] input::placeholder,
html[data-theme="dark"] textarea::placeholder, html[data-theme="gray"] textarea::placeholder { color: var(--label-4); }
html[data-theme="dark"] .search, html[data-theme="gray"] .search { background: var(--surface-2); border-color: var(--sep); color: var(--label-3); }
html[data-theme="dark"] .tbtn, html[data-theme="gray"] .tbtn { background: var(--surface-2); border-color: var(--sep); color: var(--label-2); }
html[data-theme="dark"] .tbtn:hover, html[data-theme="gray"] .tbtn:hover { background: var(--surface-3); color: var(--label-1); }

/* 표·구분선 */
html[data-theme="dark"] table th, html[data-theme="gray"] table th,
html[data-theme="dark"] table td, html[data-theme="gray"] table td,
html[data-theme="dark"] .claim-unclaimed-table th, html[data-theme="gray"] .claim-unclaimed-table th,
html[data-theme="dark"] .claim-unclaimed-table td, html[data-theme="gray"] .claim-unclaimed-table td { border-color: var(--sep); }
html[data-theme="dark"] .trow:hover, html[data-theme="gray"] .trow:hover { background: var(--tint-neutral); }

/* 계열별 틴트 — 밝은 파스텔을 알파 틴트로 치환 */
html[data-theme="dark"] .management-metric.blue, html[data-theme="gray"] .management-metric.blue,
html[data-theme="dark"] .audio-progress, html[data-theme="gray"] .audio-progress,
html[data-theme="dark"] .audio-segment-summaries, html[data-theme="gray"] .audio-segment-summaries,
html[data-theme="dark"] .audio-signals, html[data-theme="gray"] .audio-signals,
html[data-theme="dark"] .claim-one-consent, html[data-theme="gray"] .claim-one-consent,
html[data-theme="dark"] .claim-queue, html[data-theme="gray"] .claim-queue,
html[data-theme="dark"] .claim-advanced, html[data-theme="gray"] .claim-advanced,
html[data-theme="dark"] .claim-two-files, html[data-theme="gray"] .claim-two-files,
html[data-theme="dark"] .audio-file-picker.is-dragging, html[data-theme="gray"] .audio-file-picker.is-dragging {
  background: var(--tint-blue);
  border-color: var(--tint-blue-line);
  color: var(--label-1);
}
html[data-theme="dark"] .claim-two-files strong, html[data-theme="gray"] .claim-two-files strong,
html[data-theme="dark"] .claim-two-files small, html[data-theme="gray"] .claim-two-files small,
html[data-theme="dark"] .audio-progress, html[data-theme="gray"] .audio-progress { color: var(--tint-blue-ink); }
html[data-theme="dark"] .claim-status, html[data-theme="gray"] .claim-status,
html[data-theme="dark"] .claim-queue-head b, html[data-theme="gray"] .claim-queue-head b,
html[data-theme="dark"] .ai-search-toggle input:checked + span, html[data-theme="gray"] .ai-search-toggle input:checked + span {
  background: var(--tint-blue); color: var(--tint-blue-ink);
}

html[data-theme="dark"] .gcol.yes, html[data-theme="gray"] .gcol.yes,
html[data-theme="dark"] .management-metric.success, html[data-theme="gray"] .management-metric.success,
html[data-theme="dark"] .audio-file-picker.is-ready, html[data-theme="gray"] .audio-file-picker.is-ready,
html[data-theme="dark"] .claim-est, html[data-theme="gray"] .claim-est,
html[data-theme="dark"] .claim-file-chip.is-done, html[data-theme="gray"] .claim-file-chip.is-done {
  background: var(--tint-green);
  border-color: var(--tint-green-line);
  color: var(--tint-green-ink);
}
html[data-theme="dark"] .claim-est span, html[data-theme="gray"] .claim-est span,
html[data-theme="dark"] .claim-est span small, html[data-theme="gray"] .claim-est span small,
html[data-theme="dark"] .claim-est strong, html[data-theme="gray"] .claim-est strong,
html[data-theme="dark"] .claim-status.low, html[data-theme="gray"] .claim-status.low { color: var(--tint-green-ink); }
html[data-theme="dark"] .claim-status.low, html[data-theme="gray"] .claim-status.low { background: var(--tint-green); }

html[data-theme="dark"] .audio-lock-note, html[data-theme="gray"] .audio-lock-note,
html[data-theme="dark"] .audio-legacy-note, html[data-theme="gray"] .audio-legacy-note,
html[data-theme="dark"] .audio-next-actions, html[data-theme="gray"] .audio-next-actions,
html[data-theme="dark"] .claim-boundary, html[data-theme="gray"] .claim-boundary,
html[data-theme="dark"] .claim-unclaimed-sum > div, html[data-theme="gray"] .claim-unclaimed-sum > div,
html[data-theme="dark"] .claim-unclaimed-note, html[data-theme="gray"] .claim-unclaimed-note,
html[data-theme="dark"] .audio-reset, html[data-theme="gray"] .audio-reset,
html[data-theme="dark"] .claim-upload-status.is-warn, html[data-theme="gray"] .claim-upload-status.is-warn,
html[data-theme="dark"] .management-metric.warning, html[data-theme="gray"] .management-metric.warning,
html[data-theme="dark"] .alert-bar, html[data-theme="gray"] .alert-bar {
  background: var(--tint-gold);
  border-color: var(--tint-gold-line);
  color: var(--tint-gold-ink);
}
html[data-theme="dark"] .claim-hira-verification-review, html[data-theme="gray"] .claim-hira-verification-review,
html[data-theme="dark"] .claim-hira-verification-pending, html[data-theme="gray"] .claim-hira-verification-pending,
html[data-theme="dark"] .claim-unclaimed-blocked, html[data-theme="gray"] .claim-unclaimed-blocked {
  background: var(--tint-gold); border-color: var(--tint-gold-line); color: var(--tint-gold-ink);
}
html[data-theme="dark"] .claim-hira-verification-verified, html[data-theme="gray"] .claim-hira-verification-verified {
  background: var(--tint-green); border-color: var(--tint-green-line); color: var(--tint-green-ink);
}
html[data-theme="dark"] .claim-hira-preview-metrics span, html[data-theme="gray"] .claim-hira-preview-metrics span,
html[data-theme="dark"] .claim-hira-preview-table th, html[data-theme="gray"] .claim-hira-preview-table th {
  background: var(--surface-2); border-color: var(--sep); color: var(--label-2);
}
html[data-theme="dark"] .claim-hira-preview-table, html[data-theme="gray"] .claim-hira-preview-table,
html[data-theme="dark"] .claim-hira-preview-table-wrap, html[data-theme="gray"] .claim-hira-preview-table-wrap {
  border-color: var(--sep); color: var(--label-1);
}
html[data-theme="dark"] .claim-unclaimed-sum span, html[data-theme="gray"] .claim-unclaimed-sum span,
html[data-theme="dark"] .claim-unclaimed-sum strong, html[data-theme="gray"] .claim-unclaimed-sum strong,
html[data-theme="dark"] .audio-legacy-note strong, html[data-theme="gray"] .audio-legacy-note strong,
html[data-theme="dark"] .audio-legacy-note span, html[data-theme="gray"] .audio-legacy-note span { color: var(--tint-gold-ink); }
html[data-theme="dark"] .audio-legacy-cta, html[data-theme="gray"] .audio-legacy-cta { background: var(--gold-deep); color: #1A1305; }

html[data-theme="dark"] .gcol.no, html[data-theme="gray"] .gcol.no,
html[data-theme="dark"] .audio-refusal, html[data-theme="gray"] .audio-refusal,
html[data-theme="dark"] .claim-status.high, html[data-theme="gray"] .claim-status.high {
  background: var(--tint-red);
  border-color: var(--tint-red-line);
  color: var(--tint-red-ink);
}

html[data-theme="dark"] .prep-actions button:disabled, html[data-theme="gray"] .prep-actions button:disabled,
html[data-theme="dark"] .audio-priority, html[data-theme="gray"] .audio-priority,
html[data-theme="dark"] .claim-history-field, html[data-theme="gray"] .claim-history-field,
html[data-theme="dark"] .claim-history-notice, html[data-theme="gray"] .claim-history-notice,
html[data-theme="dark"] .audio-customer-analysis, html[data-theme="gray"] .audio-customer-analysis,
html[data-theme="dark"] .management-action:hover, html[data-theme="gray"] .management-action:hover,
html[data-theme="dark"] .audio-file-picker, html[data-theme="gray"] .audio-file-picker,
html[data-theme="dark"] .claim-pdf-password, html[data-theme="gray"] .claim-pdf-password,
html[data-theme="dark"] .team-activity, html[data-theme="gray"] .team-activity {
  background: var(--tint-neutral);
  border-color: var(--sep);
  color: var(--label-2);
}
html[data-theme="dark"] .claim-file-chip, html[data-theme="gray"] .claim-file-chip { background: var(--surface-2); border-color: var(--sep-strong); color: var(--label-3); }

/* 다크에서 흰 배경을 직접 쓰던 버튼·칩 */
html[data-theme="dark"] .audio-report-meta span, html[data-theme="gray"] .audio-report-meta span { background: var(--surface-2); border-color: var(--sep); color: var(--label-2); }
html[data-theme="dark"] .audio-export-actions button, html[data-theme="gray"] .audio-export-actions button { background: var(--surface-2); border-color: var(--sep-strong); color: var(--label-1); }
html[data-theme="dark"] .audio-export-actions button:disabled, html[data-theme="gray"] .audio-export-actions button:disabled { color: var(--label-4); }

/* 테마 전환 버튼·드롭다운 (Apple 팝오버 재질) */
.theme-menu { position: relative; display: inline-flex; }
.theme-pop {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 60;
  display: flex; flex-direction: column; gap: 2px; min-width: 168px; padding: 6px;
  border: 1px solid var(--g5); border-radius: 14px; background: var(--wht);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .16);
  transform-origin: top right;
}
.theme-pop.hidden { display: none; }
html[data-theme="dark"] .theme-pop, html[data-theme="gray"] .theme-pop {
  background: var(--chrome); border-color: var(--sep-strong);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  backdrop-filter: blur(24px) saturate(180%);
  box-shadow: var(--shadow-2);
}
.theme-opt {
  display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 11px;
  border: none; border-radius: 9px; background: none; color: var(--g1);
  font: inherit; font-size: 13px; text-align: left; cursor: pointer;
}
.theme-opt i:first-child { font-size: 15px; color: var(--g3); }
.theme-opt span { flex: 1; }
.theme-opt:hover { background: var(--g6); }
.theme-opt[aria-checked="true"] { color: var(--bl); font-weight: 700; }
.theme-opt[aria-checked="true"] i:first-child { color: var(--bl); }
.theme-tick { font-size: 15px; opacity: 0; }
.theme-opt[aria-checked="true"] .theme-tick { opacity: 1; }
html[data-theme="dark"] .theme-opt, html[data-theme="gray"] .theme-opt { color: var(--label-1); }
html[data-theme="dark"] .theme-opt:hover, html[data-theme="gray"] .theme-opt:hover { background: var(--tint-neutral); }

/* 테마 전환 시에만 밝기 점프를 부드럽게 (평상시 화이트 렌더에는 영향 없음) */
html.theme-switching, html.theme-switching body,
html.theme-switching .panel, html.theme-switching .kpi,
html.theme-switching .top, html.theme-switching .side, html.theme-switching .content {
  transition: background-color .28s ease, color .28s ease, border-color .28s ease;
}

/* 접근성 — 투명도·대비 사용자 설정 존중 */
@media (prefers-reduced-transparency: reduce) {
  html[data-theme="dark"] .top, html[data-theme="gray"] .top,
  html[data-theme="dark"] .side, html[data-theme="gray"] .side,
  html[data-theme="dark"] .theme-pop, html[data-theme="gray"] .theme-pop {
    background: var(--surface-1); -webkit-backdrop-filter: none; backdrop-filter: none;
  }
}
@media (prefers-contrast: more) {
  html[data-theme="dark"], html[data-theme="gray"] { --sep: rgba(255, 255, 255, .3); --label-2: rgba(255, 255, 255, .88); --label-3: rgba(255, 255, 255, .7); }
}
@media (prefers-reduced-motion: reduce) {
  html.theme-switching, html.theme-switching body, html.theme-switching .panel,
  html.theme-switching .kpi, html.theme-switching .top, html.theme-switching .side,
  html.theme-switching .content { transition: none; }
}

/* 다크·그레이 저대비 보정 — 밝은 그라데이션/흰 배경을 쓰던 요소 */
html[data-theme="dark"] .boost-link-card, html[data-theme="gray"] .boost-link-card {
  background: var(--tint-gold);
  border-color: var(--tint-gold-line);
}
html[data-theme="dark"] .boost-link-copy strong, html[data-theme="gray"] .boost-link-copy strong { color: var(--label-1); }
html[data-theme="dark"] .boost-link-copy span, html[data-theme="gray"] .boost-link-copy span { color: var(--gold); }
html[data-theme="dark"] .boost-link-copy small, html[data-theme="gray"] .boost-link-copy small { color: var(--label-3); }
html[data-theme="dark"] .boost-link-card button, html[data-theme="gray"] .boost-link-card button,
html[data-theme="dark"] .boost-link-card a, html[data-theme="gray"] .boost-link-card a {
  background: var(--surface-2); border-color: var(--tint-gold-line); color: var(--gold);
}
html[data-theme="dark"] .boost-link-card button:hover, html[data-theme="gray"] .boost-link-card button:hover,
html[data-theme="dark"] .boost-link-card a:hover, html[data-theme="gray"] .boost-link-card a:hover { background: var(--surface-3); border-color: var(--gold); }

/* 도넛/막대 차트 — 트랙은 알파, 라벨은 위계대로 */
html[data-theme="dark"] .cring-track, html[data-theme="gray"] .cring-track,
html[data-theme="dark"] .cbar, html[data-theme="gray"] .cbar { stroke: var(--sep); background: var(--tint-neutral); }
html[data-theme="dark"] #cpct, html[data-theme="gray"] #cpct,
html[data-theme="dark"] .consent-ring text, html[data-theme="gray"] .consent-ring text { fill: var(--label-1); color: var(--label-1); }
html[data-theme="dark"] .consent-ring, html[data-theme="gray"] .consent-ring { color: var(--label-1); }

/* 스크립트·CSV 등 흰 배경 보조 버튼 */
html[data-theme="dark"] .csvbtn, html[data-theme="gray"] .csvbtn,
html[data-theme="dark"] .prep-actions button, html[data-theme="gray"] .prep-actions button,
html[data-theme="dark"] select, html[data-theme="gray"] select {
  background: var(--surface-2); border-color: var(--sep-strong); color: var(--label-1);
}
html[data-theme="dark"] .csvbtn:hover, html[data-theme="gray"] .csvbtn:hover { background: var(--surface-3); }

/* 다크·그레이 전수 보정: 초기 화면에만 없던 흰 카드와 밝은 그라데이션을
   같은 표면 토큰으로 묶는다. 색을 덮어 쓰는 대신 표면 단계와 구분선을 명시해
   카드 경계가 배경에 녹지 않도록 한다. 화이트 모드에는 적용하지 않는다. */
html[data-theme="dark"] .lead-grid-help, html[data-theme="gray"] .lead-grid-help,
html[data-theme="dark"] .timeline-item, html[data-theme="gray"] .timeline-item,
html[data-theme="dark"] .memo-box, html[data-theme="gray"] .memo-box,
html[data-theme="dark"] .management-hero, html[data-theme="gray"] .management-hero,
html[data-theme="dark"] .management-notice:not(:empty), html[data-theme="gray"] .management-notice:not(:empty),
html[data-theme="dark"] .management-metric, html[data-theme="gray"] .management-metric,
html[data-theme="dark"] .management-action, html[data-theme="gray"] .management-action,
html[data-theme="dark"] .rose-card, html[data-theme="gray"] .rose-card,
html[data-theme="dark"] .rose-data-table, html[data-theme="gray"] .rose-data-table,
html[data-theme="dark"] .claim-workspace, html[data-theme="gray"] .claim-workspace,
html[data-theme="dark"] .claim-quick-path > *, html[data-theme="gray"] .claim-quick-path > *,
html[data-theme="dark"] .claim-section-title > button, html[data-theme="gray"] .claim-section-title > button,
html[data-theme="dark"] .claim-queue-item.on, html[data-theme="gray"] .claim-queue-item.on,
html[data-theme="dark"] .claim-action-rail > section, html[data-theme="gray"] .claim-action-rail > section,
html[data-theme="dark"] .today-flow-step-coach, html[data-theme="gray"] .today-flow-step-coach,
html[data-theme="dark"] .today-coach-actions button, html[data-theme="gray"] .today-coach-actions button,
html[data-theme="dark"] .bonus-popup, html[data-theme="gray"] .bonus-popup {
  background: var(--surface-1);
  border-color: var(--sep-strong);
  color: var(--label-1);
}
html[data-theme="dark"] .claim-queue-item, html[data-theme="gray"] .claim-queue-item,
html[data-theme="dark"] .detail-card, html[data-theme="gray"] .detail-card,
html[data-theme="dark"] .prep-head, html[data-theme="gray"] .prep-head,
html[data-theme="dark"] .prep-grid div, html[data-theme="gray"] .prep-grid div,
html[data-theme="dark"] .metric, html[data-theme="gray"] .metric,
html[data-theme="dark"] .claim-draft > p, html[data-theme="gray"] .claim-draft > p,
html[data-theme="dark"] .claim-history-field, html[data-theme="gray"] .claim-history-field {
  background: var(--surface-2);
  border-color: var(--sep);
  color: var(--label-2);
}
html[data-theme="dark"] .management-hero h2, html[data-theme="gray"] .management-hero h2,
html[data-theme="dark"] .management-action strong, html[data-theme="gray"] .management-action strong,
html[data-theme="dark"] .rose-card h1, html[data-theme="gray"] .rose-card h1,
html[data-theme="dark"] .rose-card h2, html[data-theme="gray"] .rose-card h2,
html[data-theme="dark"] .rose-card h3, html[data-theme="gray"] .rose-card h3 { color: var(--label-1); }
html[data-theme="dark"] .management-hero p, html[data-theme="gray"] .management-hero p,
html[data-theme="dark"] .management-action span, html[data-theme="gray"] .management-action span,
html[data-theme="dark"] .rose-card p, html[data-theme="gray"] .rose-card p,
html[data-theme="dark"] .rose-card td, html[data-theme="gray"] .rose-card td { color: var(--label-2); }

/* 청구 흐름의 상태칩·단계·행동 버튼은 원래 화이트 전용 색을 썼다. 다크에서
   빈 흰 상자로 보이지 않도록 표면 단계와 텍스트 대비를 명시한다. */
html[data-theme="dark"] .claim-quick-path > * > span, html[data-theme="gray"] .claim-quick-path > * > span,
html[data-theme="dark"] .claim-steps li.on, html[data-theme="gray"] .claim-steps li.on,
html[data-theme="dark"] .claim-status-actions button, html[data-theme="gray"] .claim-status-actions button {
  background: var(--surface-3);
  background-image: none;
  border-color: var(--sep-strong);
  color: var(--label-1);
}
html[data-theme="dark"] .claim-guardrail, html[data-theme="gray"] .claim-guardrail {
  background: var(--surface-2) !important;
  border-color: var(--sep);
  color: var(--label-2);
}
html[data-theme="dark"] .claim-guardrail b, html[data-theme="gray"] .claim-guardrail b { color: var(--label-1); }
html[data-theme="dark"] .claim-status-actions .claim-delete-case, html[data-theme="gray"] .claim-status-actions .claim-delete-case {
  background: var(--tint-red);
  border-color: var(--tint-red-line);
  color: var(--tint-red-ink);
}

/* 랜딩(로그인 전) 테마 버튼 — 랜딩은 잠긴 디자인(2026-08-21부터 한지 서재)이므로
   콘솔 라이트/그레이/다크 토글과 무관하게 고정 스타일을 쓴다. 실제 배색은 파일 끝
   "설계사 랜딩 — 한지 서재" 레이어가 최종 결정한다. */
.ld-theme-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0;
  border: 1px solid rgba(255, 255, 255, .18); border-radius: 10px;
  background: rgba(255, 255, 255, .06); color: #E8EDF5;
  font-size: 16px; cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease;
}
.ld-theme-btn:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); }
.ld-theme .theme-pop {
  background: rgba(20, 28, 45, .92); border-color: rgba(255, 255, 255, .16);
  -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 14px 36px rgba(0, 0, 0, .5);
}
.ld-theme .theme-opt { color: #E8EDF5; }
.ld-theme .theme-opt i:first-child { color: #9FB0C8; }
.ld-theme .theme-opt:hover { background: rgba(255, 255, 255, .08); }
.ld-theme .theme-opt[aria-checked="true"] { color: var(--gold, #D9B98A); }
.ld-theme .theme-opt[aria-checked="true"] i:first-child { color: var(--gold, #D9B98A); }
@media (max-width: 640px) { .ld-theme-btn { width: 34px; height: 34px; font-size: 15px; } }

/* ───────────────────────────────────────────────────────────────────
   랜딩(로그인 전)도 다크·그레이를 따른다.
   화이트 모드에서는 이 블록이 하나도 매칭되지 않으므로 잠긴 네이비+골드
   디자인이 100% 그대로 유지된다. 다크·그레이에서는 네이비 대신 Apple의
   평평한 근-검정 표면 + 헤어라인 구분선으로 통일한다.
   ─────────────────────────────────────────────────────────────────── */

/* 상단 네비 — 떠 있는 반투명 재질, 아래로 콘텐츠가 흐른다 */
html[data-theme="dark"] .ld-nav, html[data-theme="gray"] .ld-nav {
  background: var(--chrome);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--sep);
}
html[data-theme="dark"] .ld-brand, html[data-theme="gray"] .ld-brand { color: var(--label-1); }
html[data-theme="dark"] .ld-nav-link, html[data-theme="gray"] .ld-nav-link { color: var(--label-2); }
html[data-theme="dark"] .ld-nav-link:hover, html[data-theme="gray"] .ld-nav-link:hover { color: var(--label-1); }
html[data-theme="dark"] .ld-btn-ghost, html[data-theme="gray"] .ld-btn-ghost {
  border-color: var(--sep-strong); color: var(--label-1); background: var(--tint-neutral);
}
html[data-theme="dark"] .ld-btn-ghost:hover, html[data-theme="gray"] .ld-btn-ghost:hover { background: var(--surface-3); }

/* 히어로 — 네이비 그라데이션 대신 평평한 표면. 애플처럼 조용하게. */
html[data-theme="dark"] .ld-hero, html[data-theme="gray"] .ld-hero {
  background: var(--surface-0);
  border-bottom: 1px solid var(--sep);
}
html[data-theme="dark"] .ld-hero h1, html[data-theme="gray"] .ld-hero h1 { color: var(--label-1); }
html[data-theme="dark"] .ld-sub, html[data-theme="gray"] .ld-sub { color: var(--label-2); }
html[data-theme="dark"] .ld-trust, html[data-theme="gray"] .ld-trust { color: var(--label-3); }
html[data-theme="dark"] .ld-eyebrow, html[data-theme="gray"] .ld-eyebrow { color: var(--gold); }
html[data-theme="dark"] .ld-btn-secondary, html[data-theme="gray"] .ld-btn-secondary {
  border-color: var(--sep-strong); color: var(--label-1); background: var(--tint-neutral);
}
html[data-theme="dark"] .ld-btn-secondary:hover, html[data-theme="gray"] .ld-btn-secondary:hover { background: var(--surface-3); }
/* 화이트모드: 밝은 .ld-section 안의 보조 버튼(요금제 하단 '이미 계정이 있어요 — 로그인' 등)은
   흰 텍스트라 안 보인다 → 어두운 아웃라인으로. 네이비 히어로·헤더·about-final의 흰 버튼은 건드리지 않음. */
html:not([data-theme]) .ld-section .ld-btn-secondary,
html:not([data-theme]) .ld-section .ld-btn-ghost { color: var(--ink); border-color: var(--g4); }
html:not([data-theme]) .ld-section .ld-btn-secondary:hover,
html:not([data-theme]) .ld-section .ld-btn-ghost:hover { color: var(--gold); border-color: var(--gold); }

/* 본문 섹션 — 흰 배경 구간을 표면 계층으로.
   .ld-flow-section은 .ld-section도 함께 달고 있어 특이도가 같다.
   밴드로 한 단 올려 보이게 하려면 반드시 .ld-section 뒤에 와야 한다. */
html[data-theme="dark"] .ld-section, html[data-theme="gray"] .ld-section,
html[data-theme="dark"] .ld-pricing, html[data-theme="gray"] .ld-pricing { background: var(--surface-0); }
html[data-theme="dark"] .ld-flow-section, html[data-theme="gray"] .ld-flow-section {
  background: var(--surface-1);
  border-top: 1px solid var(--sep);
  border-bottom: 1px solid var(--sep);
}
html[data-theme="dark"] .ld-card, html[data-theme="gray"] .ld-card,
html[data-theme="dark"] .ld-price-card, html[data-theme="gray"] .ld-price-card {
  background: var(--surface-1); border-color: var(--sep); box-shadow: var(--shadow-1);
}
html[data-theme="dark"] .ld-card:hover, html[data-theme="gray"] .ld-card:hover {
  border-color: var(--tint-gold-line); box-shadow: var(--shadow-2);
}
html[data-theme="dark"] .ld-price-featured, html[data-theme="gray"] .ld-price-featured {
  border-color: var(--tint-gold-line); box-shadow: var(--shadow-2);
}
html[data-theme="dark"] .ld-price-badge, html[data-theme="gray"] .ld-price-badge { background: var(--gold); color: #1A1305; }
/* 흐름 카드는 한 단 올라간 밴드 위에 있으므로 다시 한 단 더 올린다(애플 표면 계층). */
html[data-theme="dark"] .ld-flow-step, html[data-theme="gray"] .ld-flow-step {
  background: var(--surface-2); border-color: var(--sep);
}
html[data-theme="dark"] .ld-flow-step span, html[data-theme="gray"] .ld-flow-step span { background: var(--gold); color: #1A1305; }
html[data-theme="dark"] .ld-flow-arrow, html[data-theme="gray"] .ld-flow-arrow { color: var(--label-3); }

/* 푸터 */
html[data-theme="dark"] .ld-footer, html[data-theme="gray"] .ld-footer {
  background: var(--surface-1); border-top: 1px solid var(--sep);
}
html[data-theme="dark"] .ld-footer p, html[data-theme="gray"] .ld-footer p { color: var(--label-3); }
html[data-theme="dark"] .ld-footer a, html[data-theme="gray"] .ld-footer a { color: var(--label-2); }

/* 랜딩 테마 버튼도 테마 표면을 따른다(화이트에서는 기존 네이비 전용 스타일 유지) */
html[data-theme="dark"] .ld-theme-btn, html[data-theme="gray"] .ld-theme-btn {
  background: var(--surface-2); border-color: var(--sep); color: var(--label-2);
}
html[data-theme="dark"] .ld-theme-btn:hover, html[data-theme="gray"] .ld-theme-btn:hover {
  background: var(--surface-3); border-color: var(--sep-strong); color: var(--label-1);
}
html[data-theme="dark"] .ld-theme .theme-pop, html[data-theme="gray"] .ld-theme .theme-pop {
  background: var(--chrome); border-color: var(--sep-strong); box-shadow: var(--shadow-2);
}
html[data-theme="dark"] .ld-theme .theme-opt, html[data-theme="gray"] .ld-theme .theme-opt { color: var(--label-1); }
html[data-theme="dark"] .ld-theme .theme-opt i:first-child, html[data-theme="gray"] .ld-theme .theme-opt i:first-child { color: var(--label-3); }
html[data-theme="dark"] .ld-theme .theme-opt:hover, html[data-theme="gray"] .ld-theme .theme-opt:hover { background: var(--tint-neutral); }

/* 로그인 게이트 — 카드 배경은 --wht 리맵으로 이미 표면-1이 된다.
   여기서는 네이비 스크림만 중성 블랙으로 바꾸고, 카드 그림자·활성 탭처럼
   라이트 전용 값이 남은 곳만 표면 계층에 맞춘다. */
html[data-theme="dark"] .login-gate, html[data-theme="gray"] .login-gate {
  background: rgba(0, 0, 0, .6);
}
html[data-theme="dark"] .login-card, html[data-theme="gray"] .login-card {
  box-shadow: var(--shadow-2);
}
html[data-theme="dark"] .login-tab-btn.on, html[data-theme="gray"] .login-tab-btn.on {
  background: var(--surface-3); color: var(--label-1); border-color: var(--sep-strong);
}

/* ───────────────────────────────────────────────────────────────────
   관리자 워크스페이스 · 쪽지함 (2026-07-22)
   색은 전부 테마 토큰만 쓴다 — 화이트/그레이/다크가 자동으로 따라온다.
   다크·그레이 전용 하드코딩을 여기서 하지 않는 이유는, 라이트에서
   --wht/--g5 같은 레거시 토큰이 이미 리맵되어 있기 때문이다.
   ─────────────────────────────────────────────────────────────────── */

/* 상단 우측 관리자 버튼 — 아이콘 + 라벨 */
#adminBtn { width: auto; gap: 6px; padding: 0 12px; font-size: 13px; font-weight: 700; }
#adminBtn[hidden] { display: none; }
@media (max-width: 720px) { #adminBtn span { display: none; } #adminBtn { width: 36px; padding: 0; } }

/* 쪽지함 */
.inbox-menu { position: relative; display: inline-flex; }
.inbox-menu .badge {
  position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: var(--red); color: #fff;
  font-size: 10px; font-weight: 800; line-height: 16px; text-align: center;
}
.inbox-pop {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 220;
  width: min(360px, calc(100vw - 32px)); max-height: 60vh; overflow-y: auto;
  background: var(--wht); border: 1px solid var(--g5); border-radius: 14px;
  box-shadow: 0 12px 32px rgba(24, 32, 44, .16);
}
.inbox-pop.hidden { display: none; }
.inbox-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 12px 14px; border-bottom: 1px solid var(--g5);
  font-size: 13px; font-weight: 800; color: var(--ink);
}
.inbox-head small { font-size: 11px; font-weight: 600; color: var(--g3); }
.inbox-empty { padding: 24px 14px; text-align: center; font-size: 13px; color: var(--g3); }
.inbox-list { list-style: none; margin: 0; padding: 0; }
.inbox-item { padding: 12px 14px; border-bottom: 1px solid var(--g6); cursor: default; }
.inbox-item:last-child { border-bottom: none; }
.inbox-item.is-unread { cursor: pointer; background: var(--g6); }
.inbox-item-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.inbox-item-h strong { font-size: 13px; color: var(--ink); }
.inbox-item.is-unread .inbox-item-h strong::before {
  content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 6px;
  border-radius: 50%; background: var(--bl); vertical-align: middle;
}
.inbox-item-h span { font-size: 11px; color: var(--g3); white-space: nowrap; }
.inbox-item p { margin: 6px 0 0; font-size: 12px; line-height: 1.6; color: var(--g2); white-space: pre-wrap; }

/* 워크스페이스 전체 화면 */
.aw-overlay {
  position: fixed; inset: 0; z-index: 260; overflow-y: auto;
  background: var(--bg); padding: 24px;
}
.aw-overlay.hidden { display: none; }
body.aw-open { overflow: hidden; }
.aw-shell { max-width: 1180px; margin: 0 auto; }

.aw-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.aw-head-main h2 { margin: 0; font-size: 26px; font-weight: 800; color: var(--ink); }
.aw-head-main p { margin: 6px 0 0; font-size: 13px; color: var(--g3); }
.aw-head-side { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.aw-owner-pill {
  display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px;
  background: var(--gold-bg); color: var(--gold-deep); font-size: 12px; font-weight: 700;
}
.aw-close { flex: none; }

.aw-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.aw-stat {
  background: var(--wht); border: 1px solid var(--g5); border-radius: 14px; padding: 16px 18px;
  display: flex; flex-direction: column; gap: 4px; min-height: 96px;
}
.aw-stat.is-loading { opacity: .4; }
.aw-stat-label { font-size: 12px; font-weight: 700; color: var(--g3); }
.aw-stat-value { font-size: 26px; font-weight: 800; color: var(--ink); line-height: 1.2; }
.aw-stat-detail { font-size: 11px; color: var(--g4); }

.aw-notice { margin-bottom: 12px; padding: 12px 14px; border-radius: 12px; font-size: 13px; font-weight: 600; border: 1px solid var(--g5); background: var(--wht); color: var(--g2); }
.aw-notice.ok { background: var(--grnbg); border-color: transparent; color: var(--grn); }
.aw-notice.bad { background: var(--redbg); border-color: transparent; color: var(--red); }

.aw-tabs { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.aw-tab {
  border: 1px solid var(--g5); background: var(--wht); color: var(--g2);
  border-radius: 10px; padding: 8px 16px; font: inherit; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: background .12s, color .12s, border-color .12s;
}
.aw-tab:hover { color: var(--ink); }
.aw-tab.on { background: var(--bl); border-color: var(--bl); color: #fff; }

.aw-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.aw-search { display: flex; gap: 8px; flex: 1 1 280px; }
.aw-search input {
  flex: 1; min-height: 40px; padding: 0 14px; font: inherit; font-size: 13px;
  border: 1px solid var(--g5); border-radius: 10px; background: var(--wht); color: var(--ink); outline: none;
}
.aw-search input:focus { border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow); }
.aw-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.aw-filter {
  border: 1px solid var(--g5); background: var(--wht); color: var(--g2);
  border-radius: 999px; padding: 7px 15px; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer;
}
.aw-filter.on { background: var(--bl); border-color: var(--bl); color: #fff; }

.aw-table { min-width: 980px; }
.aw-table-members { min-width: 1040px; }
/* .tbl은 table-layout: fixed라 th에 폭을 주지 않으면 전부 같은 너비로 눌린다. */
.aw-table-members thead th:nth-child(1) { width: 44px; }
.aw-table-members thead th:nth-child(2) { width: auto; min-width: 240px; }
.aw-table-members thead th:nth-child(3) { width: 104px; }
.aw-table-members thead th:nth-child(4) { width: 104px; }
.aw-table-members thead th:nth-child(5) { width: 128px; }
.aw-table-members thead th:nth-child(6) { width: 84px; }
.aw-table-members thead th:nth-child(7) { width: 92px; }
.aw-table-members thead th:nth-child(8) { width: 104px; }
.aw-table-members thead th:nth-child(9) { width: 112px; }
.aw-member strong { overflow-wrap: anywhere; }
.aw-table tbody tr.is-selected { background: var(--blglow); }
.aw-table .aw-num { text-align: right; font-variant-numeric: tabular-nums; }
.aw-table .aw-num.is-plus { color: var(--grn); font-weight: 700; }
.aw-table .aw-num.is-minus { color: var(--red); font-weight: 700; }
.aw-table .aw-clamp { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aw-member { display: flex; flex-direction: column; gap: 2px; }
.aw-member strong { font-size: 13px; color: var(--ink); }
.aw-member span { font-size: 11px; color: var(--g3); }
.aw-table input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--bl); cursor: pointer; }

.aw-state {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 40px 16px; text-align: center; color: var(--g3); font-size: 13px;
}
.aw-state i { font-size: 26px; color: var(--g4); }
.aw-state strong { font-size: 14px; color: var(--g2); }
.aw-hint { margin: 10px 0 0; font-size: 12px; line-height: 1.6; color: var(--g3); }

/* 하단 플로팅 일괄 작업 바 */
.aw-bulk {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 270;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center;
  max-width: calc(100vw - 32px); padding: 12px 16px; border-radius: 14px;
  background: var(--wht); border: 1px solid var(--g5);
  box-shadow: 0 12px 32px rgba(24, 32, 44, .2);
}
.aw-bulk.hidden { display: none; }
.aw-bulk-count { font-size: 13px; font-weight: 800; color: var(--ink); margin-right: 4px; }
.aw-act {
  display: inline-flex; align-items: center; gap: 5px;
  border: 1px solid var(--g5); background: var(--g6); color: var(--g1);
  border-radius: 9px; padding: 8px 13px; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer;
  transition: background .12s, color .12s, border-color .12s;
}
.aw-act:hover:not(:disabled) { border-color: var(--bl); color: var(--bl); }
.aw-act:disabled { opacity: .45; cursor: not-allowed; }
.aw-act.primary { background: var(--bl); border-color: var(--bl); color: #fff; }
.aw-act.primary:hover { background: var(--bl2); color: #fff; }
.aw-act.danger { background: var(--redbg); border-color: transparent; color: var(--red); }
.aw-act.danger:hover { border-color: var(--red); color: var(--red); }
.aw-act.ghost { background: transparent; color: var(--g3); }

/* 작업 다이얼로그 */
.aw-modal {
  position: fixed; inset: 0; z-index: 280; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(0, 0, 0, .45);
}
.aw-modal-card {
  width: min(440px, 100%); background: var(--wht); border: 1px solid var(--g5);
  border-radius: 16px; overflow: hidden; box-shadow: 0 24px 56px rgba(0, 0, 0, .3);
}
.aw-modal-head { padding: 18px 20px 12px; display: flex; flex-direction: column; gap: 3px; }
.aw-modal-head strong { font-size: 16px; font-weight: 800; color: var(--ink); }
.aw-modal-head span { font-size: 12px; color: var(--g3); }
.aw-modal-body { padding: 0 20px 8px; }
.aw-field { display: block; font-size: 12px; font-weight: 700; color: var(--g2); margin-bottom: 12px; }
.aw-field input, .aw-field select, .aw-field textarea {
  display: block; width: 100%; margin-top: 6px; padding: 10px 12px; font: inherit; font-size: 13px;
  border: 1px solid var(--g5); border-radius: 10px; background: var(--wht); color: var(--ink); outline: none;
}
.aw-field textarea { resize: vertical; line-height: 1.6; }
.aw-field input:focus, .aw-field select:focus, .aw-field textarea:focus {
  border-color: var(--bl); box-shadow: 0 0 0 3px var(--blglow);
}
.aw-modal-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px 18px; }
.aw-modal-foot .btn-ai-send { width: auto; padding: 10px 20px; }

@media (max-width: 900px) { .aw-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) {
  .aw-overlay { padding: 16px; }
  .aw-head { flex-direction: column; }
  .aw-head-side { justify-content: flex-start; }
  .aw-bulk { bottom: 12px; padding: 10px 12px; gap: 6px; }
  .aw-act { padding: 7px 11px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .aw-tab, .aw-filter, .aw-act { transition: none; }
}

/* ───────────────────────────────────────────────────────────────────
   회원가입 · 구글 로그인 · 승인 대기 (2026-07-22)
   테마 토큰만 사용 — 화이트/그레이/다크가 자동으로 따라온다.
   ─────────────────────────────────────────────────────────────────── */

/* 랜딩 네비의 가입 버튼은 히어로 CTA보다 작게 */
.ld-btn-nav { padding: 9px 16px; font-size: 13px; }

/* 구글 버튼 — 구글 브랜드 가이드대로 흰 바탕 + 원본 마크를 유지한다.
   테마를 따라 색을 바꾸면 로고 대비가 깨지므로 여기만 예외로 고정색을 쓴다. */
.google-btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; min-height: 44px; margin-bottom: 10px;
  border: 1px solid #DADCE0; border-radius: 12px;
  background: #FFFFFF; color: #1F1F1F;
  font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
  transition: background .12s, box-shadow .12s;
}
.google-btn:hover { background: #F7F8F8; box-shadow: 0 1px 3px rgba(0, 0, 0, .16); }
.google-btn:disabled { opacity: .6; cursor: not-allowed; }
.google-btn[hidden] { display: none; }
.google-mark { width: 18px; height: 18px; flex: none; }

.login-divider {
  display: flex; align-items: center; gap: 10px;
  margin: 4px 0 14px; color: var(--g3); font-size: 12px;
}
.login-divider::before, .login-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--g5);
}

/* 승인 대기 배너 */
.pending-bar {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 20px; border-bottom: 1px solid var(--g5);
  background: var(--ambbg); color: var(--g1); font-size: 13px; line-height: 1.6;
}
.pending-bar.hidden { display: none; }
.pending-bar > i { font-size: 18px; color: var(--amb); margin-top: 1px; flex: none; }
.pending-bar strong { display: block; font-weight: 800; color: var(--ink); }
.pending-bar span { color: var(--g2); }
.pending-bar b { color: var(--ink); font-weight: 700; }

/* 승인 전 잠긴 탭 */
.tab.is-locked { opacity: .45; }
/* 아이콘 폰트 코드포인트는 버전마다 달라 네모(두부)가 나기 쉽다 — 항상 렌더되는 글자를 쓴다. */
.tab.is-locked::after {
  content: '승인 후';
  margin-left: 6px; padding: 2px 6px; border-radius: 6px;
  background: var(--ambbg); color: var(--amb);
  font-size: 10px; font-weight: 800; letter-spacing: 0;
}

@media (max-width: 620px) {
  .pending-bar { padding: 10px 14px; font-size: 12px; }
  .ld-btn-nav { padding: 8px 12px; font-size: 12px; }
}

/* AI 이용량 잔액 칩 (2026-07-22) */
.credit-chip {
  display: inline-flex; align-items: center; gap: 5px;
  height: 36px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--g5); background: var(--g6);
  font-size: 13px; color: var(--g2); white-space: nowrap;
}
.credit-chip[hidden] { display: none; }
.credit-chip i { font-size: 15px; color: var(--gold); }
.credit-chip b { font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.credit-chip span { font-size: 11px; color: var(--g3); }
.credit-chip.is-low { border-color: var(--amb); background: var(--ambbg); }
.credit-chip.is-low b, .credit-chip.is-low i { color: var(--amb); }
.credit-chip.is-empty { border-color: var(--red); background: var(--redbg); }
.credit-chip.is-empty b, .credit-chip.is-empty i { color: var(--red); }
@media (max-width: 720px) { .credit-chip span { display: none; } .credit-chip { padding: 0 10px; } }

/* ── 네비 브랜드 홈링크 · 중앙 골드 필 · 테마 버튼 라벨 (2026-07-23 오너 지시) ── */
a.ld-brand { text-decoration: none; }
.logo-home { display: inline-flex; gap: 10px; align-items: center; text-decoration: none; }
.ld-nav-inner { position: relative; }
.ld-nav-center { flex: 0 0 auto; position: relative; }
.ld-pill-gold { display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border-radius: 999px; font-size: 13.5px; font-weight: 800; color: #14100a; text-decoration: none; white-space: nowrap; background: linear-gradient(120deg, #B08D57, #E7CD94 45%, #B08D57); background-size: 200% 100%; box-shadow: 0 6px 18px rgba(176, 141, 87, .45), inset 0 0 0 1px rgba(255, 255, 255, .28); animation: pillShimmer 3.4s linear infinite; transition: transform .15s, box-shadow .15s; }
.ld-pill-gold i { font-size: 15px; }
.ld-pill-gold:hover { transform: scale(1.05); box-shadow: 0 10px 26px rgba(176, 141, 87, .6), inset 0 0 0 1px rgba(255, 255, 255, .35); }
@keyframes pillShimmer { to { background-position: -200% 0; } }
.theme-btn-label { font-size: 12.5px; font-weight: 700; margin-left: 6px; white-space: nowrap; }
.tbtn.theme-btn { width: auto; padding: 0 12px; }
@media (max-width: 920px) { .ld-nav-center { display: none; } }
@media (prefers-reduced-motion: reduce) { .ld-pill-gold { animation: none; } }
/* 테마 버튼에 모드 라벨이 붙으면서 원형 고정폭이 좁아짐 — pill 형태로 확장 */
.ld-theme-btn { width: auto; padding: 0 14px; border-radius: 999px; gap: 6px; }
/* 폰폭에서 테마버튼을 아이콘 전용으로(라벨 "화이트 모드" 제거) — 네비 가로 오버플로우 방지.
   위 2301의 34px 규칙과 값을 일치시켜 충돌도 없앤다. */
@media (max-width: 640px) { .ld-theme-btn { width: 34px; height: 34px; padding: 0; } .ld-theme-btn .theme-btn-label { display: none; } }

/* ── 조언서 가독성 상향 (오너 v10, 2026-07-23): 노안 고객이 화면으로 같이 보기 쉽게
   전 페이지 폰트를 키운다. 화면 기준으로 올리고, A4 인쇄(@media print)는 표가 넘치지
   않게 소폭만 — "빨간 박스"로 지목된 05 발주표를 포함한 모든 rose-data-table에 적용된다. ── */
.rose-report .rose-data-table { font-size: 13.5px; line-height: 1.5; }
.rose-report .rose-data-table th,
.rose-report .rose-data-table td { padding: 12px 13px; }
.rose-report .rose-inline-note { font-size: 13px; }
.rose-report .rose-metric-grid span { font-size: 12px; }
.rose-report .rose-metric-grid b { font-size: 17px; }
.rose-report .rose-table-note { font-size: 12px; }
.rose-report .rose-page-foot { font-size: 11px; }
.rose-report .rose-cover-mark { font-size: 11px; }
.rose-report .rose-cover-profile span { font-size: 12.5px; }
.rose-report .rose-cover-profile b { font-size: 16px; }
.rose-report h3 { font-size: 18px; }
.rose-report .rose-callout p,
.rose-report .rose-callout li,
.rose-report .rose-conclusion p { font-size: 14.5px; line-height: 1.6; }
.rose-report .rose-list li,
.rose-report .rose-keepgap li { font-size: 14px; line-height: 1.6; }
@media print {
  /* A4 인쇄 안전선(오너 2026-07-23 재검증): playwright로 실제 A4 PDF를 렌더해
     페이지 수(8p 유지=밀림 없음)와 표 가로넘침(0px=안 깨짐)을 측정한 결과, 표 12px /
     본문 13px까지 8페이지가 유지된다(발주표 세로 여백도 넉넉). 노안 가독성을 위해
     이 안전선까지 키운다. 더 키우려면 반드시 PDF 페이지 수를 다시 재고 8p인지 확인. */
  .rose-report .rose-data-table { font-size: 12px; }
  .rose-report .rose-data-table th,
  .rose-report .rose-data-table td { padding: 8px 9px; }
  .rose-report .rose-callout p,
  .rose-report .rose-callout li,
  .rose-report .rose-conclusion p,
  .rose-report .rose-list li,
  .rose-report .rose-keepgap li { font-size: 13px; }
  .rose-report .rose-inline-note { font-size: 12px; }
  .rose-report .rose-table-note { font-size: 11px; }
}

/* ══════ V10 온보딩·헤더 (2026-07-24 오너 승인) ══════ */

/* 네비 "정직한 완벽주의" 필 — 꼭 눌러보게 크게 + 펄스 링 + 반짝임 + 화살표 */
.ld-pill-gold { padding: 11px 22px; font-size: 14.5px; animation: pillShimmer 3.4s linear infinite, pillPulse 2s ease-in-out infinite; }
.ld-pill-gold i.ti-sparkles { animation: pillSpark 2s ease-in-out infinite; }
.ld-pill-gold .pill-arrow { font-size: 15px; animation: pillArrow 1.3s ease-in-out infinite; }
.ld-pill-gold:hover { transform: scale(1.08); box-shadow: 0 12px 30px rgba(176, 141, 87, .65), inset 0 0 0 1px rgba(255, 255, 255, .4); }
.ld-pill-gold::after {
  content: '눌러보세요 👀'; position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%);
  font-size: 10px; font-weight: 800; letter-spacing: .2px; color: #B08D57; pointer-events: none;
  background: rgba(217, 185, 138, .16); padding: 2px 9px; border-radius: 999px; white-space: nowrap;
  animation: pokeBob 1.5s ease-in-out infinite;
}
.ld-pill-gold[aria-current="page"]::after { display: none; } /* about 페이지 자신에선 유도 힌트 숨김 */
@keyframes pillPulse {
  0%, 100% { box-shadow: 0 6px 18px rgba(176, 141, 87, .45), inset 0 0 0 1px rgba(255, 255, 255, .28), 0 0 0 0 rgba(217, 185, 138, .5); }
  50% { box-shadow: 0 9px 24px rgba(176, 141, 87, .62), inset 0 0 0 1px rgba(255, 255, 255, .4), 0 0 0 9px rgba(217, 185, 138, 0); }
}
@keyframes pillSpark { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .6; transform: scale(1.18) rotate(8deg); } }
@keyframes pillArrow { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(3px); } }
@keyframes pokeBob { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(2px); } }
@media (prefers-reduced-motion: reduce) {
  .ld-pill-gold, .ld-pill-gold i.ti-sparkles, .ld-pill-gold .pill-arrow, .ld-pill-gold::after { animation: none; }
}

/* 헤더 우측 등급 배지 (로그인 후 모든 화면 상시 노출) */
.tier-badge {
  display: inline-flex; align-items: center; gap: 5px; height: 36px; padding: 0 12px;
  border-radius: 999px; font-size: 12.5px; font-weight: 800; white-space: nowrap;
  border: 1px solid var(--g5); background: var(--g6); color: var(--g2);
}
.tier-badge[hidden] { display: none; }
.tier-badge i { font-size: 14px; }
.tier-badge.tier-standard { border-color: #7CA6E8; color: #3B6FBE; background: rgba(124, 166, 232, .12); }
.tier-badge.tier-plus { border-color: #9B7BE0; color: #6B45C7; background: rgba(155, 123, 224, .12); }
.tier-badge.tier-pro { border-color: var(--gold); color: #8A6A2F; background: linear-gradient(120deg, rgba(176, 141, 87, .16), rgba(231, 205, 148, .22)); }
.tier-badge.tier-pro i { color: var(--gold); }
@media (max-width: 720px) { .tier-badge { padding: 0 9px; font-size: 11px; } }

/* Pro 전용 상담 페이지 주소 링크 */
.pro-help-link {
  display: inline-flex; align-items: center; gap: 5px; height: 36px; padding: 0 12px;
  border-radius: 999px; font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap;
  border: 1px solid var(--gold); color: #8A6A2F; background: rgba(176, 141, 87, .08);
}
.pro-help-link[hidden] { display: none; }
.pro-help-link:hover { background: rgba(176, 141, 87, .18); }
.pro-help-link i { font-size: 14px; color: var(--gold); }
@media (max-width: 960px) { .pro-help-link span { display: none; } .pro-help-link { padding: 0 10px; } }

.billing-portal-link {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 12px;
  border: 1px solid var(--g5); border-radius: 10px; background: var(--g6); color: var(--g2);
  font: 700 12px/1.2 'Pretendard', sans-serif; white-space: nowrap; cursor: pointer;
}
.billing-portal-link:hover { border-color: var(--gold); color: #8A6A2F; }
.billing-portal-link:disabled { opacity: .65; cursor: wait; }
.billing-portal-link i { font-size: 15px; }
@media (max-width: 1120px) {
  .billing-portal-link span { display: none; }
  .billing-portal-link { width: 44px; padding: 0; }
}

/* 가입 폼 상단 무료 100단위 배너 + 기능 리스트 */
.signup-bonus-banner { margin: 0 0 16px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, #141F33, #0E1626); color: #fff; box-shadow: 0 8px 24px rgba(14, 22, 51, .25); }
.sbb-head { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.sbb-head i { font-size: 20px; color: #E7CD94; }
.sbb-head strong { font-weight: 800; }
.sbb-head em { font-style: normal; color: #E7CD94; }
.sbb-sub { margin: 6px 0 10px; font-size: 12.5px; color: rgba(255, 255, 255, .82); }
.sbb-sub b { color: #E7CD94; }
.sbb-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.sbb-list li { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: rgba(255, 255, 255, .9); }
.sbb-list i { font-size: 15px; color: #D9B98A; width: 18px; text-align: center; }
.sbb-note { margin: 10px 0 0; font-size: 11px; color: rgba(255, 255, 255, .6); }
.cf-turnstile { margin: 4px 0 12px; }
.cf-turnstile[hidden] { display: none; }

/* 가입 직후 100단위 안내 팝업 */
.bonus-popup-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: rgba(10, 14, 25, .55); backdrop-filter: blur(4px); padding: 20px; }
.bonus-popup-overlay.hidden { display: none; }
.bonus-popup { width: 100%; max-width: 400px; background: var(--card, #fff); border-radius: 20px; padding: 30px 26px 22px; text-align: center; box-shadow: 0 24px 60px rgba(0, 0, 0, .3); animation: bonusPopIn .32s cubic-bezier(.16, 1, .3, 1); }
@keyframes bonusPopIn { from { opacity: 0; transform: translateY(16px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
.bonus-popup-icon { width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #B08D57, #E7CD94); box-shadow: 0 8px 20px rgba(176, 141, 87, .4); }
.bonus-popup-icon i { font-size: 30px; color: #fff; }
.bonus-popup h3 { margin: 0 0 10px; font-size: 20px; font-weight: 800; color: var(--ink); }
.bonus-popup-body { margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: var(--g2); }
.bonus-popup-body b { color: var(--ink); }
.bonus-popup-expiry { display: flex; align-items: flex-start; gap: 7px; text-align: left; margin: 0 0 18px; padding: 10px 12px; border-radius: 12px; background: var(--ambbg); font-size: 12px; line-height: 1.5; color: var(--amb); }
.bonus-popup-expiry i { font-size: 15px; flex-shrink: 0; margin-top: 1px; }
.bonus-popup-expiry b { font-weight: 800; }
.bonus-popup-cta { width: 100%; height: 48px; border: 0; border-radius: 12px; font-size: 15px; font-weight: 800; color: #fff; cursor: pointer; background: linear-gradient(120deg, #B08D57, #C99F63); box-shadow: 0 8px 20px rgba(176, 141, 87, .35); }
.bonus-popup-cta:hover { filter: brightness(1.05); }
.bonus-popup-dismiss { display: flex; gap: 12px; justify-content: center; margin-top: 14px; }
.bonus-popup-dismiss button { background: none; border: 0; font-size: 12px; color: var(--g3); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.bonus-popup-dismiss button:hover { color: var(--g2); }

/* 요금제 카드 결제(선택) 버튼 */
.ld-plan-btn { display: block; width: 100%; margin-top: 16px; height: 44px; border: 1px solid var(--gold); border-radius: 12px; background: transparent; color: #8A6A2F; font-size: 14px; font-weight: 800; cursor: pointer; transition: background .15s, transform .1s, filter .15s; }
.ld-plan-btn:hover { background: rgba(176, 141, 87, .1); }
.ld-plan-btn:active { transform: translateY(1px); }
.ld-plan-btn:disabled { opacity: .65; cursor: wait; transform: none; }
.ld-plan-btn-featured { background: linear-gradient(120deg, #B08D57, #C99F63); color: #fff; border-color: transparent; }
.ld-plan-btn-featured:hover { filter: brightness(1.06); background: linear-gradient(120deg, #B08D57, #C99F63); }

/* 사이드바 커뮤니티 닉네임 (2026-07-25) */
.side-nick { display: flex; align-items: center; gap: 7px; padding: 9px 16px; font-size: 12px; color: var(--g3); border-top: 1px solid var(--g5); }
.side-nick i { font-size: 14px; color: var(--gold); }
.side-nick #sideNickname { color: var(--gold); font-weight: 700; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-nick #sideNickBtn { margin-left: auto; background: none; border: 0; color: var(--g3); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; font-size: 11px; font-family: inherit; }
.side-nick #sideNickBtn:hover { color: var(--ink); }

/* 마지막 테마 안전망 — 이후에 추가된 화면 규칙이 기본 화이트를 다시 선언해도
   다크/그레이의 카드·버튼이 흰 상자로 되돌아가지 않게 한다. */
html[data-theme="dark"] .kpi, html[data-theme="gray"] .kpi,
html[data-theme="dark"] .claim-case-head-actions > button, html[data-theme="gray"] .claim-case-head-actions > button,
html[data-theme="dark"] .claim-upload label, html[data-theme="gray"] .claim-upload label,
html[data-theme="dark"] .claim-citations button, html[data-theme="gray"] .claim-citations button,
html[data-theme="dark"] .claim-no-source, html[data-theme="gray"] .claim-no-source {
  background: var(--surface-2);
  border-color: var(--sep-strong);
  color: var(--label-1);
}
html[data-theme="dark"] .tab.on, html[data-theme="gray"] .tab.on {
  background: var(--surface-1);
  border-color: var(--sep-strong);
  color: var(--bl);
}

/* ============================================================
   설계사 랜딩 — 한지 서재 (Hanji Study) 확정 (2026-08-21, 대표님 승인)
   help 페이지와 공유하는 히어로/네비/푸터/eyebrow만 대상. 범위는
   `.ld-*` 클래스로 한정하고 전역 --gold/--ink 등 공유 변수는 건드리지
   않는다(콘솔 다른 화면이 같은 변수를 쓴다). 로그인 모달·콘솔 자체
   라이트/그레이/다크 테마 시스템은 이 레이어의 대상이 아니다.
   data-theme="dark"/"gray" 랜딩 오버라이드(기존 룰)는 이 블록보다
   선택자 특이도가 높아 자동으로 우선 적용되므로 그대로 둔다.
   ============================================================ */

.ld-nav {
  background: rgba(247, 241, 227, .92);
  border-bottom: 1px solid rgba(34, 29, 18, .1);
  box-shadow: 0 1px 0 rgba(34, 29, 18, .04);
}
.ld-brand { color: #221d12; }
.ld-brand .mk {
  background: linear-gradient(145deg, #3c7454, #24462f);
  box-shadow: 0 0 0 2px rgba(184, 134, 59, .32);
  color: #f2eeda;
}
.ld-nav-link { color: #6d6352; }
.ld-nav-link:hover { color: #221d12; }
.ld-btn-ghost { border-color: rgba(34, 29, 18, .26); color: #221d12; }
.ld-btn-ghost:hover { border-color: #96702c; color: #96702c; }

.ld-pill-gold {
  color: #14100a;
  background: linear-gradient(120deg, #b8863b, #f1d28b 45%, #b8863b);
  background-size: 200% 100%;
  box-shadow: 0 6px 18px rgba(184, 134, 59, .38), inset 0 0 0 1px rgba(255, 255, 255, .3);
}
.ld-pill-gold:hover { box-shadow: 0 10px 26px rgba(184, 134, 59, .5), inset 0 0 0 1px rgba(255, 255, 255, .38); }

.ld-hero {
  background:
    radial-gradient(circle at 80% 15%, rgba(184, 134, 59, .16), transparent 30%),
    radial-gradient(circle at 20% 90%, rgba(46, 87, 65, .12), transparent 34%),
    linear-gradient(135deg, #f3ecd9 0%, #efe6cf 58%, #eadfc2 100%);
}
.ld-eyebrow { color: #7c5a1e; }
.ld-hero h1 { color: #221d12; }
.ld-gold { color: #96702c; }
.ld-sub { color: #6d6352; }
.ld-trust { color: #8a7f6a; }
/* Service scope is substantive product information, not a faint legal footnote. */
#landing .ld-service-boundary { max-width:74ch; margin:24px auto; color:var(--g1); font-size:16px; line-height:1.8; text-align:left; }
.legal-card [data-service-boundary] { font-size:16px; line-height:1.8; }

.ld-btn-primary {
  background: linear-gradient(135deg, #35634a, #274f38);
  box-shadow: 0 10px 26px rgba(46, 87, 65, .32), inset 0 1px rgba(255, 255, 255, .2);
}
.ld-btn-primary:hover { box-shadow: 0 14px 34px rgba(46, 87, 65, .4), inset 0 1px rgba(255, 255, 255, .26); }
.ld-btn-secondary { border-color: rgba(34, 29, 18, .28); color: #221d12; }
.ld-btn-secondary:hover { border-color: #96702c; color: #96702c; }

/* 테마 선택 버튼도 이제 밝은 네비 위에 있다. */
.ld-theme-btn {
  border-color: rgba(34, 29, 18, .18);
  background: rgba(34, 29, 18, .04);
  color: #221d12;
}
.ld-theme-btn:hover { background: rgba(34, 29, 18, .08); border-color: rgba(34, 29, 18, .3); }
.ld-theme .theme-pop {
  background: rgba(255, 253, 246, .97);
  border-color: rgba(34, 29, 18, .12);
  box-shadow: 0 14px 36px rgba(88, 72, 35, .18);
}
.ld-theme .theme-opt { color: #221d12; }
.ld-theme .theme-opt i:first-child { color: #6d6352; }
.ld-theme .theme-opt:hover { background: rgba(34, 29, 18, .06); }
.ld-theme .theme-opt[aria-checked="true"] { color: #96702c; }
.ld-theme .theme-opt[aria-checked="true"] i:first-child { color: #96702c; }

/* 요금제·플로우·카드의 골드 강조만 새 금박 톤으로 맞춘다(본문 잉크/배경은 유지). */
.ld-card:hover { border-color: rgba(184, 134, 59, .5); }
.ld-flow-step span { background: #b8863b; }
.ld-price-featured { border-color: rgba(184, 134, 59, .55); box-shadow: 0 1px 2px rgba(24,32,44,.04), 0 22px 48px rgba(124, 90, 30, .16); }
.ld-price-badge { background: #b8863b; }
.ld-price-card li::before { color: #b8863b; }
.ld-plan-btn { border-color: #b8863b; color: #7c5a1e; }
.ld-plan-btn:hover { background: rgba(184, 134, 59, .1); }
.ld-plan-btn-featured { background: linear-gradient(120deg, #b8863b, #cda04f); color: #fff; }
.ld-plan-btn-featured:hover { background: linear-gradient(120deg, #b8863b, #cda04f); }

.ld-footer { background: #241f14; }
.ld-footer p { color: #b3a78b; }
.ld-footer a { color: #d8cdb0; }
.ld-footer a:hover { color: #d8b76e; }

@media (max-width: 920px) {
  /* 모바일 네비에서 브랜드만 남을 때도 대비 유지 (레이아웃 규칙은 원본 유지, 색만). */
  .ld-nav-link { color: #6d6352; }
}

/* IH-003 (2026-10-09) 거절 화면·대기열·샘플 리포트 */
.audio-refusal { align-items: flex-start; }
.audio-refusal-body { display: grid; gap: 8px; }
.audio-refusal-body strong { line-height: 1.45; }
.audio-refusal-note { font-size: 12px; font-weight: 600; color: var(--g2); }
.audio-refusal .audio-legacy-cta { justify-self: start; margin-top: 2px; }
.audio-sample-badge { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 10px 12px; border: 1px dashed var(--gold); border-radius: 10px; background: #fdf6e8; color: #6b4f1d; font-size: 12.5px; line-height: 1.5; }
.audio-sample-badge i { font-size: 16px; flex: none; }
html[data-theme="dark"] .audio-sample-badge, html[data-theme="gray"] .audio-sample-badge { background: rgba(176,141,87,.14); color: #e8d4b0; }