/* ============================================================
   DMDA SHARED — Calm Blue clinical design system (single source of truth)
   Used by: index.html / intake.html / engine.html / admin.html
   Visual target: modern clinical SaaS (Linear / Notion / Vercel) +
   Lubar/Thatcher qEEG clinical-report formality.
   NOTE: all class + variable names from the previous system are preserved
   (only values/styling changed) so no HTML/JS markup needs to change.
   ============================================================ */

:root{
  /* ---- Calm Blue (primary) ---- */
  --primary: #993C1D;
  --primary-dark: #7A2E15;
  --primary-mid: #D9A583;
  --primary-soft: #F0DDCB;
  --primary-light: #F0DDCB;     /* spec alias of --primary-soft */
  --primary-bg: #FBEEE4;
  --callout-bg: #FBF4EE;        /* key-finding / highlight background */

  /* secondary accent (kept for gradients/secondary actions) */
  --accent: #993C1D;            /* was purple; unified to Calm Blue for clinical tone */
  --accent-soft: #F0DDCB;

  /* ---- semantic ---- */
  --success: #2D7D6F;  --success-soft: #DCEFEB;
  --warning: #C67D2D;  --warn: #C67D2D;  --warning-soft: #F6E8D6;
  --danger:  #C9444F;  --danger-soft:  #F6E0E2;

  /* ---- ink / surfaces ---- */
  --ink: #1a1a2e;
  --ink-soft: #4a5568;
  --muted: #8b95a7;   --ink-mute: #8b95a7;   /* spec alias */
  --line: #EDE0D3;    --border: #EDE0D3;     /* spec alias */
  --line-soft: #F1F5F9;

  --bg: #FDF9F5;
  --bg-page: linear-gradient(160deg, #FDF9F5 0%, #FBEEE4 100%);
  --bg-card: #FFFFFF;  --surface: #FFFFFF;   /* spec alias */

  /* ---- radii ---- */
  --r-xs: 8px;  --r-sm: 12px;  --r-md: 16px;  --r-lg: 16px;  --r-xl: 20px;  --r-pill: 100px;

  /* ---- shadows (soft Calm Blue) ---- */
  --shadow-xs: 0 1px 2px rgba(153,60,29,0.05);
  --shadow-sm: 0 2px 10px rgba(153,60,29,0.07);
  --shadow-md: 0 4px 24px rgba(153,60,29,0.08);   /* spec card shadow */
  --shadow-lg: 0 8px 30px rgba(153,60,29,0.10);
  --shadow-xl: 0 16px 48px rgba(153,60,29,0.14);

  --t-fast: 0.15s ease;
  --t-base: 0.2s ease;            /* spec: 200ms ease */
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}

body{
  font-family:'Noto Sans KR','Inter',system-ui,-apple-system,sans-serif;
  font-size:18px;            /* spec body */
  line-height:1.75;          /* spec */
  color:var(--ink-soft);
  background:var(--bg-page);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
:lang(en), .en-text{font-family:'Inter','Noto Sans KR',system-ui,sans-serif}
code, pre, .mono, .metric-value, .nf-protocol, .session-pill{font-family:'JetBrains Mono',ui-monospace,monospace}

body[data-lang="ko"] .en-text{display:none !important}
body[data-lang="en"] .ko-text{display:none !important}

/* ============================================================
   TOP BAR
   ============================================================ */
.top-bar{
  background:linear-gradient(135deg, var(--primary-dark), var(--primary));
  color:white; padding:16px 28px;
  display:flex; justify-content:space-between; align-items:center;
  position:sticky; top:0; z-index:100;
  box-shadow:var(--shadow-md); flex-wrap:wrap; gap:10px;
}
.top-bar a{
  color:white; text-decoration:none; font-weight:600; font-size:0.85em;
  display:flex; align-items:center; gap:6px;
  padding:8px 14px; border-radius:var(--r-pill); transition:background var(--t-fast);
}
.top-bar a:hover{background:rgba(255,255,255,0.16)}
.top-title{
  font-weight:800; font-size:1.05em; flex:1; text-align:center;
  min-width:150px; letter-spacing:-0.01em;
}
.lang-switch{display:flex; gap:3px; background:rgba(255,255,255,0.18); padding:3px; border-radius:var(--r-pill)}
.lang-btn{
  padding:7px 16px; background:transparent; border:none; border-radius:var(--r-pill);
  font-size:0.78em; font-weight:600; cursor:pointer; color:rgba(255,255,255,0.85);
  font-family:inherit; transition:all var(--t-fast);
}
.lang-btn.active{background:white; color:var(--primary-dark); font-weight:700}

/* ============================================================
   CONTAINER + HERO
   ============================================================ */
.container{max-width:900px; margin:0 auto; padding:40px 24px 96px}
.container.wide, .container-wide{max-width:1200px}   /* dashboards (admin) */

.hero{
  background:var(--bg-card); border-radius:var(--r-xl); padding:48px 40px;
  margin-bottom:32px; box-shadow:var(--shadow-md); text-align:center; border:1px solid var(--line);
}
.hero h1{
  font-size:48px; font-weight:800; color:var(--ink);
  margin-bottom:14px; letter-spacing:-0.025em; line-height:1.1;
}
.hero .gradient{
  background:linear-gradient(120deg, var(--primary), var(--primary-dark));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero .subtitle{color:var(--muted); font-size:1em; max-width:680px; margin:0 auto; line-height:1.7}

.badge{
  display:inline-block; padding:7px 18px;
  background:linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:white; border-radius:var(--r-pill); font-size:0.66em; font-weight:700;
  letter-spacing:0.1em; margin-bottom:18px; text-transform:uppercase; box-shadow:var(--shadow-sm);
}

/* ============================================================
   PANEL — clinical card (each report section = one of these)
   ============================================================ */
.panel{
  background:var(--bg-card); border-radius:var(--r-md); padding:40px;
  margin-bottom:32px; box-shadow:var(--shadow-md); border:1px solid var(--line);
  transition:transform var(--t-base), box-shadow var(--t-base);
}
.panel:hover{transform:translateY(-2px); box-shadow:var(--shadow-lg)}
.panel h2{font-size:32px; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.02em; line-height:1.2}
.panel h3{font-size:22px; font-weight:700; color:var(--ink); margin-bottom:8px; letter-spacing:-0.01em}
.panel h4{font-size:18px; font-weight:700; color:var(--ink)}
.panel .sub{color:var(--muted); font-size:15px; margin-bottom:22px; line-height:1.7}

/* generic small text */
.small, .hint, .sub, .tier-disclaimer{font-size:15px}

/* ============================================================
   FORM
   ============================================================ */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.field{display:flex; flex-direction:column; gap:7px}
.field.full{grid-column:1 / -1}
.field label{font-size:15px; font-weight:600; color:var(--ink); letter-spacing:0.01em}
.field .hint{font-size:14px; color:var(--muted); margin-top:2px; line-height:1.55}
.field input, .field select, .field textarea{
  padding:14px 18px; border:1.5px solid var(--border); border-radius:var(--r-sm);
  font-size:16px; font-family:inherit; color:var(--ink); background:white; transition:all var(--t-fast); width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--primary); box-shadow:0 0 0 4px rgba(153,60,29,0.14);
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  padding:14px 28px; border-radius:12px; font-size:17px; font-weight:700; border:none;
  cursor:pointer; font-family:inherit; transition:all var(--t-base);
  display:inline-flex; align-items:center; justify-content:center; gap:9px; letter-spacing:0.01em;
}
/* Generic disabled state — applies to EVERY .btn variant (incl. .btn-accent, which had no
   :disabled rule, so a disabled run button stayed full-color and looked clickable). */
.btn:disabled, .btn[disabled]{opacity:0.4; cursor:not-allowed; transform:none; box-shadow:none; filter:grayscale(0.35)}
.btn:disabled:hover, .btn[disabled]:hover{transform:none; box-shadow:none}
.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-dark)); color:white; box-shadow:var(--shadow-sm)}
.btn-primary:hover:not(:disabled){transform:translateY(-2px); box-shadow:var(--shadow-md)}
.btn-primary:disabled{opacity:0.4; cursor:not-allowed; transform:none; box-shadow:none}
.btn-accent{background:linear-gradient(135deg, var(--primary), var(--primary-dark)); color:white; box-shadow:var(--shadow-sm)}
.btn-accent:hover:not(:disabled){transform:translateY(-2px); box-shadow:var(--shadow-md)}
.btn-ghost{background:white; color:var(--ink-soft); border:1.5px solid var(--border)}
.btn-ghost:hover{border-color:var(--primary); color:var(--primary); background:var(--primary-bg)}
.btn-outline{background:white; color:var(--primary); border:1.5px solid var(--primary)}
.btn-outline:hover{background:var(--primary-bg); transform:translateY(-2px); box-shadow:var(--shadow-sm)}
.btn-success{background:linear-gradient(135deg, var(--success), #246357); color:white; box-shadow:var(--shadow-sm)}
.btn-success:hover:not(:disabled){transform:translateY(-2px); box-shadow:var(--shadow-md)}
.btn-danger{background:white; color:var(--danger); border:1.5px solid var(--danger-soft)}
.btn-danger:hover{background:var(--danger-soft)}
.btn-sm{padding:9px 16px; font-size:14px; border-radius:var(--r-sm)}
.actions{display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap; margin-top:28px}

/* ---- download bar (engine.html report export: PDF + Word) ---- */
.download-actions{
  display:flex; gap:14px; flex-wrap:wrap; justify-content:center;
  padding:20px; margin:0 0 8px; background:var(--callout-bg);
  border:1px solid var(--primary-soft); border-radius:var(--r-md);
}
.download-actions .btn{min-width:200px}
@media(max-width:768px){
  .download-actions{flex-direction:column}
  .download-actions .btn{width:100%; min-width:0}
}

/* ============================================================
   STATUS MESSAGE
   ============================================================ */
.msg{padding:16px 20px; border-radius:var(--r-sm); margin-bottom:16px; font-size:15px; font-weight:500; line-height:1.6}
.msg-error{background:var(--danger-soft); color:#8E2F38; border-left:4px solid var(--danger)}
.msg-success{background:var(--success-soft); color:#1F5A4F; border-left:4px solid var(--success)}
.msg-info{background:var(--primary-bg); color:var(--primary-dark); border-left:4px solid var(--primary)}
.msg-warning{background:var(--warning-soft); color:#8A571F; border-left:4px solid var(--warning)}

/* key-finding / highlight callout (spec: border-left 4px Calm Blue + bg #FBF4EE) */
.callout, .key-finding{
  background:var(--callout-bg); border-left:4px solid var(--primary);
  border-radius:var(--r-sm); padding:18px 22px; margin-bottom:14px; line-height:1.7;
}

/* ============================================================
   PROGRESS BAR (sticky)
   ============================================================ */
.progress-wrap{
  background:var(--bg-card); border-radius:var(--r-md); padding:16px 22px; margin-bottom:24px;
  box-shadow:var(--shadow-sm); border:1px solid var(--line); display:flex; align-items:center; gap:16px;
  position:sticky; top:68px; z-index:50;
}
.progress-label{font-size:15px; font-weight:600; color:var(--ink); white-space:nowrap; min-width:60px}
.progress-bar{flex:1; height:9px; background:var(--line-soft); border-radius:var(--r-pill); overflow:hidden}
.progress-fill{height:100%; background:linear-gradient(90deg, var(--primary), var(--primary-mid)); width:0; transition:width var(--t-base); border-radius:var(--r-pill)}
.progress-count{font-family:'JetBrains Mono',monospace; font-size:14px; font-weight:700; color:var(--primary); min-width:60px; text-align:right}

/* ============================================================
   SUMMARY CARD
   ============================================================ */
.summary-card{background:linear-gradient(135deg, var(--primary-bg), #FBEEE4); border:1px solid var(--primary-soft); border-radius:var(--r-md); padding:28px; margin-bottom:24px}
.summary-row{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.7); font-size:15px; gap:12px; flex-wrap:wrap}
.summary-row:last-child{border-bottom:none}
.summary-row strong{color:var(--ink); font-weight:700}

/* ============================================================
   TIER OPTIONS (intake.html)
   ============================================================ */
.tier-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; margin-top:14px}
.tier-opt{border:1.5px solid var(--border); border-radius:var(--r-md); padding:22px; cursor:pointer; transition:all var(--t-base); background:white; position:relative}
.tier-opt:hover{border-color:var(--primary); transform:translateY(-2px); box-shadow:var(--shadow-md)}
.tier-opt.selected{border-color:var(--primary); background:var(--callout-bg); box-shadow:var(--shadow-sm)}
.tier-opt.selected::after{content:'✓'; position:absolute; top:12px; right:14px; width:24px; height:24px; border-radius:50%; background:linear-gradient(135deg, var(--primary), var(--primary-dark)); color:white; display:flex; align-items:center; justify-content:center; font-size:0.7em; font-weight:900}
.tier-opt-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; gap:8px}
.tier-opt-num{display:inline-block; padding:4px 12px; background:linear-gradient(135deg, var(--primary), var(--primary-dark)); color:white; border-radius:var(--r-pill); font-size:0.62em; font-weight:800; letter-spacing:0.06em}
.tier-opt-pct{font-family:'JetBrains Mono',monospace; font-size:14px; font-weight:800; color:var(--primary-dark); background:var(--primary-bg); padding:4px 12px; border-radius:var(--r-pill); white-space:nowrap}
.tier-opt-title{font-weight:700; color:var(--ink); margin-bottom:5px; font-size:17px}
.tier-opt-desc{font-size:14px; color:var(--muted); line-height:1.6}
.tier-help{font-size:15px; color:var(--ink-soft); margin-top:14px; padding:14px 18px; background:var(--bg); border-radius:var(--r-sm); border-left:4px solid var(--primary)}
.tier-total{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:16px; padding:18px 22px; background:linear-gradient(135deg, var(--primary-bg), #FBEEE4); border:1px solid var(--primary-soft); border-radius:var(--r-md)}
.tier-total-label{font-size:15px; font-weight:600; color:var(--ink)}
.tier-total-bar{flex:1; height:11px; background:white; border-radius:var(--r-pill); overflow:hidden; border:1px solid var(--line-soft)}
.tier-total-fill{height:100%; background:linear-gradient(90deg, var(--primary), var(--primary-mid)); width:0%; transition:width var(--t-base); border-radius:var(--r-pill)}
.tier-total-pct{font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:800; color:var(--primary-dark); min-width:58px; text-align:right}
.tier-disclaimer{color:var(--muted); margin-top:10px; line-height:1.6; font-style:italic}

/* ============================================================
   ANALYSIS PANELS (engine.html report)
   ============================================================ */
.analysis-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:16px}
.analysis-card{background:white; border:1px solid var(--line); border-radius:var(--r-md); padding:22px; box-shadow:var(--shadow-xs); transition:transform var(--t-base), box-shadow var(--t-base)}
.analysis-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm)}
.analysis-card-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; gap:8px}
.analysis-card-title{font-weight:700; font-size:17px; color:var(--ink)}
.analysis-card-tag{font-size:12px; font-weight:700; padding:3px 12px; border-radius:var(--r-pill); text-transform:uppercase; letter-spacing:0.05em}
.tag-normal{background:var(--success-soft); color:#1F5A4F}
.tag-elevated{background:var(--warning-soft); color:#8A571F}
.tag-abnormal{background:var(--danger-soft); color:#8E2F38}
.tag-info{background:var(--primary-bg); color:var(--primary-dark)}

.metric-row{display:flex; justify-content:space-between; padding:8px 0; font-size:15px; border-bottom:1px dashed var(--line-soft)}
.metric-row:last-child{border-bottom:none}
.metric-label{color:var(--muted)}
.metric-value{font-family:'JetBrains Mono', monospace; font-weight:700; color:var(--ink)}

/* ---- data table (QEEG numeric values) ---- */
.data-table{width:100%; border-collapse:collapse; font-size:15px; margin:8px 0 4px}
.data-table th, .data-table td{padding:10px 14px; text-align:left; border-bottom:1px solid var(--line)}
.data-table thead th{background:#F1F5F9; color:var(--ink); font-weight:700; font-size:14px; letter-spacing:0.02em}
.data-table tbody tr{transition:background var(--t-fast)}
.data-table tbody tr:hover{background:#FDF9F5}
.data-table td.num, .data-table th.num{text-align:right; font-family:'JetBrains Mono',monospace}

/* Neurofeedback recommendation cards */
.nf-rec{background:var(--callout-bg); border:1px solid var(--primary-soft); border-radius:var(--r-md); padding:22px; margin-bottom:14px}
.nf-rec-head{display:flex; align-items:center; gap:12px; margin-bottom:10px; flex-wrap:wrap}
.nf-protocol{font-family:'JetBrains Mono', monospace; font-weight:800; font-size:16px; color:var(--primary-dark); background:white; padding:5px 12px; border-radius:var(--r-xs); border:1px solid var(--primary-soft)}
.nf-priority{font-size:12px; font-weight:700; padding:3px 12px; border-radius:var(--r-pill); text-transform:uppercase; letter-spacing:0.05em}
.priority-high{background:var(--danger-soft); color:#8E2F38}
.priority-medium{background:var(--warning-soft); color:#8A571F}
.priority-low{background:var(--primary-bg); color:var(--primary-dark)}
.nf-rationale{font-size:15px; color:var(--ink-soft); line-height:1.7; margin-top:6px}

/* numbered clinical recommendation list */
.rec-list{list-style:none; counter-reset:rec; margin:8px 0; padding:0}
.rec-list > li{counter-increment:rec; position:relative; padding:14px 18px 14px 56px; margin-bottom:10px; background:white; border:1px solid var(--line); border-radius:var(--r-sm); line-height:1.7}
.rec-list > li::before{content:counter(rec); position:absolute; left:16px; top:14px; width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg, var(--primary), var(--primary-dark)); color:white; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center}

/* ============================================================
   ADMIN SLIDERS (admin.html)
   ============================================================ */
.slider-row{display:grid; grid-template-columns:140px 1fr 64px; gap:16px; align-items:center; padding:14px; background:var(--bg); border-radius:var(--r-sm); margin-bottom:12px}
.slider-label{font-weight:700; color:var(--ink); font-size:15px}
.slider-row input[type="range"]{-webkit-appearance:none; appearance:none; width:100%; height:9px; background:var(--line); border-radius:var(--r-pill); outline:none}
.slider-row input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none; width:24px; height:24px; background:linear-gradient(135deg, var(--primary), var(--primary-dark)); border-radius:50%; cursor:pointer; box-shadow:var(--shadow-sm)}
.slider-row input[type="range"]::-moz-range-thumb{width:24px; height:24px; background:linear-gradient(135deg, var(--primary), var(--primary-dark)); border:none; border-radius:50%; cursor:pointer; box-shadow:var(--shadow-sm)}
.slider-pct{font-family:'JetBrains Mono', monospace; font-weight:800; color:var(--primary-dark); text-align:right; font-size:16px}
.sum-row{display:flex; justify-content:space-between; padding:16px 20px; background:var(--primary-bg); border:1px solid var(--primary-soft); border-radius:var(--r-sm); margin-top:14px; font-weight:700}
.sum-row .sum-val{font-family:'JetBrains Mono', monospace; color:var(--primary-dark)}
.sum-row.invalid{background:var(--danger-soft); border-color:var(--danger)}
.sum-row.invalid .sum-val{color:var(--danger)}

/* ============================================================
   HUB CARDS (index.html / admin.html landing)
   ============================================================ */
.hub-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:18px; margin-top:24px}
.hub-card{background:white; border:1px solid var(--line); border-radius:var(--r-md); padding:28px; text-decoration:none; color:var(--ink); transition:all var(--t-base); box-shadow:var(--shadow-xs); display:flex; flex-direction:column; gap:10px}
.hub-card:hover{transform:translateY(-2px); border-color:var(--primary-soft); box-shadow:var(--shadow-md)}
.hub-card-icon{font-size:2.2em; line-height:1}
.hub-card-title{font-weight:800; font-size:20px; color:var(--ink); letter-spacing:-0.01em}
.hub-card-desc{font-size:15px; color:var(--muted); line-height:1.6}
.hub-card-arrow{margin-top:auto; color:var(--primary); font-weight:700; font-size:15px}

/* ============================================================
   LOADER + OVERLAY
   ============================================================ */
.loader{display:inline-block; width:18px; height:18px; border:2px solid rgba(255,255,255,0.3); border-top-color:white; border-radius:50%; animation:spin 0.8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-overlay{position:fixed; inset:0; background:rgba(26,26,46,0.5); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:1000}
.loading-overlay.visible{display:flex}
.loading-card{background:white; padding:40px 48px; border-radius:var(--r-lg); box-shadow:var(--shadow-xl); text-align:center; max-width:380px}
.loading-card .loader{width:40px; height:40px; border-width:3px; border-color:var(--line); border-top-color:var(--primary); margin-bottom:16px}
.loading-card-title{font-weight:700; font-size:18px; color:var(--ink); margin-bottom:6px}
.loading-card-sub{font-size:15px; color:var(--muted)}

.sr-only{position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}

/* ============================================================
   REPORT COVER + DISCLAIMER (used by PDF/Word export, Stage 2)
   ============================================================ */
.report-cover{text-align:center; padding:64px 40px}
.report-cover .rc-logo{font-size:15px; font-weight:800; letter-spacing:0.16em; color:var(--primary); text-transform:uppercase}
.report-cover .rc-title{font-size:40px; font-weight:800; color:var(--ink); margin:18px 0 8px; line-height:1.2}
.report-cover .rc-meta{font-size:16px; color:var(--ink-soft); line-height:2}
.report-disclaimer{margin-top:40px; padding:22px 26px; background:var(--bg); border:1px solid var(--line); border-radius:var(--r-sm); font-size:14px; color:var(--muted); line-height:1.7}

/* ============================================================
   RESPONSIVE — 768px breakpoint
   ============================================================ */
@media(max-width:768px){
  body{font-size:16px; line-height:1.7}
  .container{padding:24px 16px 64px}
  .hero{padding:32px 22px; border-radius:var(--r-md)}
  .hero h1{font-size:32px}
  .panel{padding:24px 20px; margin-bottom:20px}
  .panel h2{font-size:24px}
  .panel h3{font-size:19px}
  .form-grid, .tier-grid, .analysis-grid, .hub-grid{grid-template-columns:1fr}
  .slider-row{grid-template-columns:1fr; gap:8px}
  .actions{justify-content:stretch}
  .actions .btn{flex:1}
  .top-bar{padding:12px 16px}
  .data-table{font-size:14px}
  .data-table th, .data-table td{padding:8px 10px}
}

/* ============================================================
   PRINT — PDF backup (window.print) + html2pdf base
   ============================================================ */
@media print{
  :root{--bg-page:#FFFFFF}
  html, body{background:#FFFFFF !important; font-size:13px}
  body{-webkit-print-color-adjust:exact; print-color-adjust:exact; color-adjust:exact}
  .top-bar, .lang-switch, .actions, .download-actions, .loading-overlay,
  .progress-wrap, .btn, #apiKeyWarning, [data-no-print]{display:none !important}
  .container{max-width:100%; padding:0}
  .panel, .analysis-card, .nf-rec, .callout, .summary-card, .report-cover, .rec-list > li{
    box-shadow:none !important; break-inside:avoid; page-break-inside:avoid;
  }
  .panel{border:1px solid var(--line); margin-bottom:18px; padding:22px; transform:none !important}
  .panel h2{font-size:20px}
  .report-cover{page-break-after:always}
  .report-disclaimer{page-break-before:auto}
  a{color:var(--primary-dark); text-decoration:none}
  .report-tabs{display:none !important}
}

/* ============================================================
   DUAL-AUDIENCE — report tabs + client-facing view
   ============================================================ */
.report-tabs{display:flex; gap:8px; margin-bottom:28px; border-bottom:2px solid var(--line)}
.report-tab{padding:13px 26px; border:none; background:none; font-family:inherit; font-size:17px; font-weight:700; color:var(--muted); cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-2px; border-radius:var(--r-sm) var(--r-sm) 0 0; transition:all var(--t-fast)}
.report-tab:hover{color:var(--primary); background:var(--primary-bg)}
.report-tab.active{color:var(--primary-dark); border-bottom-color:var(--primary)}

/* report-type selector (on-demand tiered reports) */
.report-type-grid{display:flex; flex-wrap:wrap; gap:10px}
.report-type-chip{display:flex; align-items:center; gap:10px; padding:12px 18px; border:1.5px solid var(--border); border-radius:var(--r-sm); background:white; font-family:inherit; font-size:15px; font-weight:600; color:var(--ink-soft); cursor:pointer; transition:all var(--t-base)}
.report-type-chip:hover{border-color:var(--primary); color:var(--primary); box-shadow:var(--shadow-xs)}
.report-type-chip.active{border-color:var(--primary); background:var(--callout-bg); color:var(--primary-dark); box-shadow:var(--shadow-sm)}
.report-type-chip.disabled{opacity:0.45; cursor:not-allowed; background:var(--line-soft); color:var(--ink-mute); border-color:var(--line)}
.report-type-chip.disabled:hover{border-color:var(--line); color:var(--ink-mute); box-shadow:none}
.report-type-chip .rtc-icon{font-size:1.2em; line-height:1}
.report-type-chip .rtc-tag{font-size:11px; font-weight:800; padding:2px 8px; border-radius:var(--r-pill); background:var(--primary-bg); color:var(--primary-dark); text-transform:uppercase; letter-spacing:0.04em}
@media(max-width:768px){ .report-type-grid{flex-direction:column} .report-type-chip{width:100%} }

.client-report{font-size:20px; line-height:1.8}
.client-card{background:var(--callout-bg); border:1px solid var(--primary-soft); border-radius:var(--r-md); padding:32px; margin-bottom:24px; box-shadow:var(--shadow-sm)}
.client-card h2{font-size:26px; font-weight:800; color:var(--primary-dark); margin-bottom:14px; letter-spacing:-0.01em}
.client-card p{font-size:20px; line-height:1.8; color:var(--ink-soft)}
.client-list{list-style:none; padding:0; margin:0}
.client-list li{font-size:20px; line-height:1.7; padding:12px 4px; border-bottom:1px solid rgba(153,60,29,0.12)}
.client-list li:last-child{border-bottom:none}
.client-card.cc-strength{background:#EAF6F1; border-color:#A9D9C9}
.client-card.cc-encourage{background:#FFF6E9; border-color:#F0D9AE}
.client-card .rec-list > li{font-size:19px}
@media(max-width:768px){
  .report-tab{padding:11px 16px; font-size:15px}
  .client-report{font-size:18px}
  .client-card{padding:22px}
  .client-card h2{font-size:21px}
  .client-card p, .client-list li{font-size:18px}
}
