/* SportBrand AI — identitate „scoreboard / podium".
   Navy de stadion + accent auriu (valoare/premium) + cyan (date/performanță).
   Numerele stau pe font mono, ca la un panou de cronometraj. */

:root {
  color-scheme: dark;

  --bg:#0B0F1C; --surface:#131A2B; --surface-2:#1A2236; --elev:#212B42;
  --text:#EEF1F8; --muted:#8B94A9;
  --line:rgba(255,255,255,.10); --soft:rgba(255,255,255,.05);
  --gold:#F5B841; --gold-soft:rgba(245,184,65,.14); --gold-ink:#0B0F1C;
  --cyan:#37D6CE; --cyan-soft:rgba(55,214,206,.14);
  --danger:#FF6B6B;
  --shadow:0 24px 64px rgba(0,0,0,.45);
  --radius-xl:28px; --radius-lg:22px; --radius-md:16px;
  --space:clamp(16px,2.4vw,32px);

  --font-display:"Archivo","Archivo Expanded",system-ui,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"Space Mono","JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:
    radial-gradient(1100px 620px at 82% -8%, rgba(245,184,65,.10), transparent 60%),
    radial-gradient(900px 560px at -6% 4%, rgba(55,214,206,.09), transparent 58%),
    var(--bg);
}
a { color:inherit; }

/* --- Shell --- */
.app-shell { display:grid; grid-template-columns:300px minmax(0,1fr); min-height:100vh; }
.sidebar {
  position:sticky; top:0; height:100vh; overflow:auto; padding:24px;
  border-right:1px solid var(--line); background:rgba(11,15,28,.82); backdrop-filter:blur(18px);
}
.brand { display:flex; gap:14px; align-items:center; text-decoration:none; margin-bottom:26px; }
.brand-mark, .pdf-logo {
  width:52px; height:52px; border-radius:16px; display:grid; place-items:center;
  font-family:var(--font-display); font-weight:900; letter-spacing:-.06em;
  background:var(--gold); color:var(--gold-ink);
}
.brand strong { display:block; font-family:var(--font-display); font-size:18px; letter-spacing:-.02em; }
.brand span, .side-card small, .muted-text { color:var(--muted); }

.nav { display:grid; gap:6px; margin-bottom:22px; }
.nav a, .nav-item {
  text-decoration:none; color:var(--muted); border:1px solid transparent; border-radius:12px;
  padding:11px 14px; min-height:44px; display:flex; align-items:center; gap:10px; font-size:14px;
  transition:.14s ease; width:100%; text-align:left; background:transparent; cursor:pointer;
  font-family:inherit;
}
.nav a:hover, .nav a:focus-visible, .nav-item:hover, .nav-item:focus-visible {
  color:var(--text); border-color:var(--line); background:var(--soft);
  outline:0; transform:none;
}
.nav-item { justify-content:flex-start; text-align:left; }
.nav-label {
  display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); padding:6px 4px 2px; margin-top:8px;
}
.nav-label:first-child { margin-top:0; }
.nav-item-doc { font-size:13px; color:var(--muted); min-height:38px; }
.nav-item-doc .nav-num { font-size:12px; color:var(--muted); }
.nav-item .nav-num {
  flex:none; width:22px; height:22px; border-radius:7px; display:grid; place-items:center;
  font-family:var(--font-mono); font-size:11px; font-weight:700;
  background:var(--soft); color:var(--muted); border:1px solid var(--line); transition:.14s ease;
}
.nav-item.is-active {
  color:var(--text); background:var(--gold-soft); border-color:rgba(245,184,65,.4);
}
.nav-item.is-active .nav-num { background:var(--gold); color:var(--gold-ink); border-color:var(--gold); }

.side-card {
  border:1px solid var(--line); border-radius:20px; padding:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); margin-top:14px;
}

/* --- Inelul de scor (semnătura) --- */
.gauge-card { text-align:center; }
.gauge { position:relative; width:150px; height:150px; margin:4px auto 10px; }
.gauge svg { transform:rotate(-90deg); }
.gauge .track { fill:none; stroke:rgba(255,255,255,.08); stroke-width:11; }
.gauge .arc {
  fill:none; stroke:var(--gold); stroke-width:11; stroke-linecap:round;
  transition:stroke-dashoffset .5s cubic-bezier(.22,1,.36,1);
}
.gauge-readout { position:absolute; inset:0; display:grid; place-items:center; }
.gauge-readout .score {
  font-family:var(--font-mono); font-size:44px; font-weight:700; line-height:1; color:var(--text);
}
.gauge-readout small { display:block; font-size:10px; letter-spacing:.18em; color:var(--muted); margin-top:2px; }
.gauge-card > p { color:var(--muted); line-height:1.45; margin:6px 0 0; font-size:13px; }

.side-card.mini strong { display:block; font-family:var(--font-display); font-size:26px; margin-top:4px; color:var(--gold); }
.side-card.mini.free strong { color:var(--muted); }
.side-card p { color:var(--muted); line-height:1.45; }

/* --- Main --- */
.main { padding:var(--space); max-width:1440px; width:100%; min-width:0; }

/* --- Sistem de pagini (views) cu glisare din dreapta --- */
.view-stack { position:relative; overflow-x:clip; }
.view { display:none; }
.view.is-active { display:block; }
.view.is-active.slide-in { animation:viewSlideIn .42s cubic-bezier(.22,1,.36,1) both; }
@keyframes viewSlideIn {
  from { opacity:0; transform:translateX(64px); }
  to   { opacity:1; transform:translateX(0); }
}

/* --- Bara de navigare între pagini --- */
.view-nav {
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  margin-top:24px; padding-top:20px; border-top:1px solid var(--line);
}
.view-nav-group { display:flex; gap:10px; flex-wrap:wrap; }
.view-nav-hint { color:var(--muted); font-size:13px; }

.hero {
  display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:22px; align-items:stretch;
  border:1px solid var(--line); border-radius:var(--radius-xl); padding:clamp(24px,3vw,40px);
  background:linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow:var(--shadow); margin-bottom:16px; position:relative; overflow:hidden;
}
.hero::before {
  content:""; position:absolute; inset:0 0 auto 0; height:3px;
  background:linear-gradient(90deg, var(--gold), var(--cyan)); opacity:.9;
}
.eyebrow {
  text-transform:uppercase; letter-spacing:.16em; font-size:12px; font-weight:800;
  color:var(--cyan); margin:0 0 14px; font-family:var(--font-mono);
}
h1 {
  font-family:var(--font-display); font-size:clamp(34px,5vw,64px); line-height:.96;
  letter-spacing:-.045em; margin:0 0 18px; text-wrap:balance; font-weight:900;
}
.hero p:not(.eyebrow) { color:var(--muted); font-size:clamp(15px,2vw,18px); line-height:1.55; max-width:760px; }
.hero-actions, .button-row, .order-actions, .action-buttons { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

.hero-card {
  border:1px solid var(--gold-soft); border-radius:20px; background:var(--gold-soft);
  padding:22px; display:flex; flex-direction:column; justify-content:center;
}
.hero-card span { color:var(--gold); font-size:12px; letter-spacing:.1em; text-transform:uppercase; font-weight:800; }
.hero-card strong { font-family:var(--font-display); font-size:clamp(22px,3vw,30px); line-height:1.08; letter-spacing:-.03em; margin:8px 0; }
.hero-card p { color:var(--muted); line-height:1.45; margin:0; }

.value-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:24px; }
.value-grid article { border:1px solid var(--line); border-radius:16px; padding:16px; background:var(--soft); }
.value-grid strong { display:block; font-family:var(--font-display); font-size:20px; letter-spacing:-.02em; }
.value-grid span { display:block; color:var(--muted); font-size:13px; margin-top:5px; }

.grid { display:grid; grid-template-columns:minmax(340px,480px) minmax(0,1fr); gap:24px; align-items:start; min-width:0; }
.module-grid, .order-grid { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:24px; }

.panel {
  border:1px solid var(--line); border-radius:var(--radius-lg); background:rgba(19,26,43,.9);
  padding:clamp(18px,2.2vw,24px); box-shadow:var(--shadow); min-width:0;
}
.section-title { display:flex; gap:12px; align-items:center; margin-bottom:18px; }
.section-title span {
  flex:0 0 auto; width:36px; height:36px; border:1px solid var(--line); border-radius:11px;
  display:grid; place-items:center; font-family:var(--font-mono); font-weight:700; font-size:12px; color:var(--cyan);
}
h2 { margin:0; font-family:var(--font-display); font-size:clamp(20px,2.4vw,24px); letter-spacing:-.02em; font-weight:800; }
h3 { margin:0 0 10px; font-family:var(--font-display); letter-spacing:-.01em; }

/* --- Form --- */
label { display:grid; gap:8px; color:var(--muted); font-size:13px; margin-bottom:14px; }
input, select, textarea {
  width:100%; border:1px solid var(--line); background:#0C1120; color:var(--text);
  border-radius:12px; padding:13px 14px; min-height:48px; outline:0; font-family:inherit; font-size:15px;
  transition:border-color .14s ease, box-shadow .14s ease;
}
textarea { min-height:96px; resize:vertical; }
select optgroup, select option { background:#0C1120; color:var(--text); }
input:focus, select:focus, textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px var(--cyan-soft); }
.two-cols { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }

/* --- Buttons --- */
button, .button-link {
  cursor:pointer; border-radius:999px; padding:13px 18px; min-height:48px; font-weight:800;
  border:1px solid var(--line); text-decoration:none; display:inline-flex; align-items:center;
  justify-content:center; transition:.16s ease; white-space:nowrap; font-family:inherit; font-size:15px; color:var(--text);
}
button:hover, .button-link:hover { transform:translateY(-1px); }
button:focus-visible, .button-link:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
.primary { background:var(--gold); color:var(--gold-ink); border-color:var(--gold); }
.primary:hover { box-shadow:0 10px 30px rgba(245,184,65,.28); }
.secondary, .button-link.outline { background:transparent; color:var(--text); }
.secondary:hover { border-color:var(--cyan); color:var(--cyan); }
.full { width:100%; }

/* --- Dashboard --- */
.dashboard-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.dashboard-grid article { background:var(--soft); border:1px solid var(--line); border-radius:16px; padding:16px; }
.dashboard-grid span, .dashboard-grid small { display:block; color:var(--muted); font-size:12px; }
.dashboard-grid strong { display:block; font-family:var(--font-display); font-size:20px; margin:4px 0; }
.dashboard-grid article.score-cell strong { font-family:var(--font-mono); color:var(--gold); }

.value-readout {
  margin-top:16px; border:1px solid var(--gold-soft); background:var(--gold-soft);
  border-radius:16px; padding:16px;
}
.value-readout span { display:block; color:var(--gold); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; }
.value-readout strong { display:block; font-family:var(--font-mono); font-size:24px; margin:6px 0 2px; letter-spacing:-.02em; }
.value-readout small { color:var(--muted); }

.subscores { margin-top:16px; display:grid; gap:12px; }
.subscore-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px; }
.subscore-top span { color:var(--muted); font-size:13px; }
.subscore-top strong { font-family:var(--font-mono); font-size:14px; color:var(--text); }
.meter { height:7px; background:rgba(255,255,255,.08); border-radius:99px; overflow:hidden; }
.meter span { display:block; height:100%; width:0; background:linear-gradient(90deg, var(--cyan), var(--gold)); transition:width .5s cubic-bezier(.22,1,.36,1); }

.module-map { margin-top:18px; border-top:1px solid var(--line); padding-top:18px; }
.module-map ol { margin:0; padding-left:20px; color:var(--muted); line-height:1.8; }

/* --- Outputs --- */
.output { white-space:pre-wrap; line-height:1.58; color:var(--text); overflow-wrap:anywhere; font-size:14px; }
.output.empty { color:var(--muted); }

.plan-pill {
  font-style:normal; font-size:11px; padding:5px 9px; border-radius:99px; border:1px solid var(--line);
  vertical-align:middle; color:var(--text); font-family:var(--font-mono);
}
.free-pill { background:var(--soft); }
.premium-pill { background:var(--gold); color:var(--gold-ink); border-color:var(--gold); }
.mixed-pill { background:linear-gradient(90deg, var(--gold-soft), var(--cyan-soft)); }

.locked-output {
  border:1px dashed rgba(245,184,65,.35); border-radius:16px; padding:18px;
  background:var(--gold-soft); white-space:normal;
}
.locked-output strong, .locked-output span { display:block; }
.locked-output span { color:var(--muted); margin:6px 0; }
.locked-output ul { margin:6px 0 0; padding-left:18px; color:var(--muted); }
.lock-icon { font-size:28px; margin-bottom:8px; }

/* --- Tabs --- */
.tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.tab {
  min-height:38px; padding:9px 14px; font-size:13px; border-color:var(--line);
  background:transparent; color:var(--text);
}
.tab.active { background:var(--cyan); color:var(--gold-ink); border-color:var(--cyan); }
.outreach-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }

/* --- Premium + pricing --- */
.premium-panel { background:linear-gradient(180deg, var(--gold-soft), rgba(19,26,43,.9)); border-color:var(--gold-soft); }
.premium-status { font-weight:800; }
.premium-code-box { margin-top:6px; }

.livepage-panel .livepage-intro { color:var(--muted); margin:0 0 14px; max-width:64ch; }
.livepage-link-row { display:flex; gap:10px; align-items:center; margin-top:14px; flex-wrap:wrap; }
.livepage-link-row input { flex:1 1 260px; min-width:0; background:var(--surface); border:1px solid var(--line); color:var(--text); padding:10px 12px; border-radius:8px; font-family:var(--font-mono); font-size:.85rem; }
.livepage-note { display:block; color:var(--muted); margin-top:12px; font-size:.8rem; }
.livepage-note code { color:var(--cyan); }
.livepage-stats { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:14px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.livepage-stat { font-size:13px; color:var(--muted); }
.livepage-stat em { font-family:var(--font-mono); font-style:normal; font-weight:700; font-size:1.05rem; color:var(--cyan); margin-right:4px; }
.link-btn { background:none; border:none; color:var(--gold); cursor:pointer; font-size:12.5px; padding:0; text-decoration:underline; width:auto; margin-left:auto; }

.ai-btn {
  display:inline-flex; align-items:center; gap:6px; margin:0 0 10px;
  background:linear-gradient(135deg, rgba(245,184,65,.16), rgba(55,214,206,.14));
  border:1px solid rgba(55,214,206,.45); color:var(--cyan); border-radius:9px;
  padding:7px 12px; font-size:12.5px; font-weight:600; cursor:pointer; width:auto;
  transition:.14s ease;
}
.ai-btn:hover:not(:disabled) { border-color:var(--cyan); transform:none; box-shadow:0 4px 18px rgba(55,214,206,.18); }
.ai-btn:disabled { opacity:.6; cursor:wait; }

.install-btn {
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  margin-top:14px; padding:11px 14px; border-radius:12px; cursor:pointer;
  background:var(--gold-soft); border:1px solid rgba(245,184,65,.45); color:var(--gold);
  font-size:13.5px; font-weight:600; font-family:inherit; transition:.14s ease;
}
.install-btn:hover { background:var(--gold); color:var(--gold-ink); border-color:var(--gold); transform:none; }
@media (max-width:720px) { .livepage-link-row { flex-direction:column; align-items:stretch; } }

.roster-panel .roster-intro { color:var(--muted); margin:0 0 14px; max-width:70ch; }
.roster-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:14px 0; }
.roster-stats article { background:var(--elev, var(--surface)); border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.roster-stats span { display:block; color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; }
.roster-stats strong { font-family:var(--font-mono); font-size:1.1rem; }
.roster-table-wrap { overflow-x:auto; margin-top:8px; }
.roster-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.roster-table th, .roster-table td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); white-space:nowrap; }
.roster-table th { color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; font-weight:600; }
.roster-table td:first-child, .roster-table th:first-child { white-space:normal; }
.roster-empty { color:var(--muted); text-align:center !important; padding:22px 12px !important; }
.roster-row-actions { display:flex; gap:8px; flex-wrap:wrap; }
.roster-row-actions button { background:transparent; border:1px solid var(--line); color:var(--text); border-radius:6px; padding:5px 9px; font-size:.78rem; cursor:pointer; }
.roster-row-actions button:hover { border-color:var(--cyan); color:var(--cyan); }
.roster-row-actions button.danger:hover { border-color:#e8636b; color:#e8636b; }
.roster-io-row { margin-top:16px; }
.secondary.danger:hover { border-color:#e8636b; color:#e8636b; }
.file-btn { position:relative; overflow:hidden; display:inline-flex; align-items:center; }

/* --- Simulator de creștere --- */
.sim-badge {
  font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.04em;
  background:var(--cyan); color:var(--gold-ink); border:none;
}
.simulator-panel .sim-intro { color:var(--muted); margin:0 0 18px; max-width:70ch; }
.sim-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:24px; align-items:start; }
.sim-field { display:block; margin-bottom:16px; }
.sim-label-row { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13px; color:var(--muted); margin-bottom:8px; }
.sim-label-row output { font-family:var(--font-mono); color:var(--cyan); font-weight:700; flex:none; }
.sim-field select { width:100%; }
.sim-field input[type="range"] {
  width:100%; -webkit-appearance:none; appearance:none; height:6px; border-radius:6px;
  background:linear-gradient(90deg, var(--gold), var(--cyan)); outline:none;
}
.sim-field input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%;
  background:var(--text); border:3px solid var(--gold); cursor:pointer;
}
.sim-field input[type="range"]::-moz-range-thumb {
  width:20px; height:20px; border-radius:50%; background:var(--text); border:3px solid var(--gold); cursor:pointer;
}
.segmented { display:flex; gap:6px; }
.segmented button {
  flex:1 1 0; min-width:0; padding:9px 4px; border:1px solid var(--line); border-radius:10px; background:var(--soft);
  color:var(--muted); font-size:12px; cursor:pointer; transition:.14s ease; font-family:inherit;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.segmented button:hover { color:var(--text); border-color:var(--cyan); transform:none; }
.segmented button.is-on { background:var(--gold-soft); border-color:rgba(245,184,65,.5); color:var(--text); }
.sim-toggle { display:flex; align-items:center; gap:10px; margin:10px 0; font-size:14px; color:var(--text); cursor:pointer; }
.sim-toggle input { width:18px; height:18px; accent-color:var(--gold); flex:none; }

.sim-readout { border:1px solid var(--line); border-radius:var(--radius-md); padding:18px; background:var(--soft); min-width:0; }
.sim-top { display:flex; gap:18px; align-items:center; flex-wrap:wrap; margin-bottom:16px; }
.sim-gauge { position:relative; width:130px; height:130px; flex:none; }
.sim-gauge svg { width:130px; height:130px; display:block; }
.sim-track { fill:none; stroke:rgba(255,255,255,.08); stroke-width:11; }
.sim-ghost { fill:none; stroke:var(--muted); stroke-width:11; stroke-linecap:round; opacity:.45; transition:stroke-dashoffset .35s ease; }
.sim-arc { fill:none; stroke:var(--gold); stroke-width:11; stroke-linecap:round; transition:stroke-dashoffset .35s cubic-bezier(.22,1,.36,1); }
.sim-gauge-readout { position:absolute; inset:0; display:grid; place-items:center; text-align:center; }
.sim-gauge-readout span { font-family:var(--font-mono); font-size:34px; font-weight:700; line-height:1; }
.sim-delta { display:block; font-family:var(--font-mono); font-size:13px; font-weight:700; margin-top:2px; }
.sim-delta.up, .sim-value-delta.up { color:var(--cyan); }
.sim-delta.down, .sim-value-delta.down { color:var(--danger); }
.sim-delta.flat, .sim-value-delta.flat { color:var(--muted); }
.sim-value { flex:1 1 180px; min-width:0; }
.sim-value > span { display:block; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; }
.sim-value strong { font-family:var(--font-mono); font-size:1.1rem; color:var(--gold); display:block; overflow-wrap:anywhere; line-height:1.25; }
.sim-value-delta { display:block; font-size:12.5px; margin-top:4px; overflow-wrap:anywhere; line-height:1.4; }
.sim-legend { margin-top:8px; font-size:11px; color:var(--muted); }
.sim-legend em { display:inline-block; width:9px; height:9px; border-radius:50%; vertical-align:middle; margin-right:2px; }
.sim-legend .dot-ghost { background:var(--muted); opacity:.6; }
.sim-legend .dot-arc { background:var(--gold); margin-left:6px; }

.sim-sub { margin-bottom:10px; }
.sim-sub-top { display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:12.5px; margin-bottom:5px; }
.sim-sub-top span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); }
.sim-sub-top strong { font-family:var(--font-mono); color:var(--text); flex:none; white-space:nowrap; }
.sim-meter { position:relative; height:8px; background:var(--elev); border-radius:6px; overflow:hidden; }
.sim-meter-ghost { position:absolute; inset:0 auto 0 0; height:100%; background:var(--muted); opacity:.35; border-radius:6px; }
.sim-meter-fill { position:absolute; inset:0 auto 0 0; height:100%; background:var(--cyan); border-radius:6px; transition:width .35s ease; }
.sim-plan { margin-top:16px; border-top:1px solid var(--line); padding-top:14px; }
.sim-plan h3 { font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:0 0 10px; }
.sim-plan ol { margin:0; padding-left:20px; }
.sim-plan li { margin-bottom:8px; line-height:1.5; font-size:14px; overflow-wrap:anywhere; }
@media (max-width:820px) { .sim-body { grid-template-columns:1fr; } }
@media (max-width:420px) {
  .sim-top { gap:12px; }
  .sim-gauge, .sim-gauge svg { width:104px; height:104px; }
  .sim-gauge-readout span { font-size:27px; }
  .sim-value { flex:1 1 140px; }
  .segmented button { font-size:11px; padding:9px 2px; }
}

/* --- Pagini informative (ghid + legale) --- */
.doc-badge {
  font-family:var(--font-mono); font-weight:700; background:var(--surface-2);
  color:var(--cyan); border:1px solid var(--line);
}
.doc { max-width:820px; }
.doc h3 {
  font-family:var(--font-display); font-size:19px; letter-spacing:-.02em;
  margin:26px 0 8px; color:var(--text);
}
.doc p { color:var(--muted); line-height:1.65; margin:0 0 12px; }
.doc .doc-lead { font-size:16px; color:var(--text); line-height:1.65; margin-bottom:8px; }
.doc-updated { font-family:var(--font-mono); font-size:12px; color:var(--muted); margin-bottom:6px; }
.doc-steps, .doc-list { margin:6px 0 12px; padding-left:22px; }
.doc-steps li { color:var(--muted); line-height:1.6; margin-bottom:10px; }
.doc-steps strong, .doc-list strong, .doc p strong { color:var(--text); }
.doc-list li { color:var(--muted); line-height:1.6; margin-bottom:8px; }
.doc-disclaimer {
  margin-top:22px; padding:14px 16px; border:1px solid var(--line); border-left:3px solid var(--gold);
  border-radius:12px; background:var(--gold-soft); color:var(--text); font-size:13.5px; line-height:1.6;
}

/* --- Footer aplicație --- */
.app-footer {
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  margin-top:32px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:13px;
}
.app-footer-nav { display:flex; gap:6px; flex-wrap:wrap; }
.app-footer-nav button {
  background:transparent; border:1px solid transparent; color:var(--muted); cursor:pointer;
  font-size:13px; padding:6px 10px; border-radius:8px; font-family:inherit; width:auto;
}
.app-footer-nav button:hover { color:var(--text); border-color:var(--line); background:var(--soft); transform:none; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.price-card { border:1px solid var(--line); border-radius:20px; padding:20px; background:var(--soft); }
.price-card.featured { background:var(--gold); color:var(--gold-ink); border-color:var(--gold); }
.price-card.featured p { color:rgba(11,15,28,.72); }
.price-card h3 { color:inherit; }
.price-card strong { display:block; font-family:var(--font-mono); font-size:28px; letter-spacing:-.03em; margin:4px 0 8px; }
.price-card p { color:var(--muted); line-height:1.45; }
.badge {
  display:inline-flex; border:1px solid currentColor; border-radius:99px; padding:5px 9px;
  font-size:11px; font-weight:800; margin-bottom:12px; letter-spacing:.06em; font-family:var(--font-mono);
}

/* --- Actions --- */
.actions { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:24px; }
.actions h2 { margin-bottom:2px; }
.actions p { color:var(--muted); margin:6px 0 0; }

/* --- Toast --- */
.toast {
  position:fixed; right:16px; bottom:16px; z-index:50; max-width:calc(100vw - 32px);
  background:var(--gold); color:var(--gold-ink); border-radius:999px; padding:12px 18px; font-weight:800;
  opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s ease; box-shadow:var(--shadow);
}
.toast.show { opacity:1; transform:translateY(0); }

.print-only { display:none; }

/* --- Responsive --- */
@media (max-width:1100px) {
  .app-shell { grid-template-columns:260px minmax(0,1fr); }
  .hero { grid-template-columns:1fr; }
  .value-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid { grid-template-columns:1fr; }
  .module-grid, .order-grid { grid-template-columns:1fr; }
}
@media (max-width:860px) {
  .app-shell { grid-template-columns:1fr; }
  .sidebar { position:static; height:auto; border-right:0; border-bottom:1px solid var(--line); }
  .nav { display:flex; overflow-x:auto; padding-bottom:8px; }
  .nav a, .nav-item { flex:0 0 auto; width:auto; background:var(--soft); }
  .nav-label { display:none; }
  .app-footer { flex-direction:column; align-items:flex-start; gap:10px; }
  .side-card { display:inline-block; width:calc(50% - 8px); vertical-align:top; }
  .gauge-card { display:block; width:100%; }
  .main { padding:18px; }
  .pricing-grid { grid-template-columns:1fr; }
  .actions { flex-direction:column; align-items:stretch; }
  .action-buttons { display:grid; grid-template-columns:1fr; }
  .action-buttons button { width:100%; }
}
@media (max-width:620px) {
  .hero, .panel { border-radius:18px; }
  .two-cols, .dashboard-grid, .value-grid, .roster-stats { grid-template-columns:1fr; }
  .side-card { display:block; width:100%; }
  button, .button-link { width:100%; white-space:normal; }
  .segmented button, .roster-row-actions button, .app-footer-nav button, .sim-toggle input, .ai-btn { width:auto; }
  .hero-actions, .button-row, .order-actions, .outreach-actions { display:grid; grid-template-columns:1fr; }
  .view-nav { flex-direction:column; align-items:stretch; }
  .view-nav-group { display:grid; grid-template-columns:1fr; gap:10px; width:100%; }
  .view-nav-hint { text-align:center; }
  .toast { border-radius:16px; width:calc(100vw - 32px); text-align:center; }
  h1 { line-height:1; }
}
@media (max-width:380px) {
  .main, .sidebar { padding:14px; }
  .brand-mark { width:44px; height:44px; border-radius:13px; }
  .panel, .hero { padding:16px; }
  .section-title { align-items:flex-start; }
  .section-title span { width:32px; height:32px; }
}
@media (hover:none) { button:hover, .button-link:hover { transform:none; } }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition-duration:.001ms !important; animation-duration:.001ms !important; }
}

/* --- Print / PDF (A4, forțat monocrom light) --- */
@media print {
  * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; box-shadow:none !important; }
  html, body { background:#fff !important; color:#101418 !important; font-family:Arial,Helvetica,sans-serif; font-size:11px; line-height:1.45; }
  .sidebar, .hero, .value-grid, .form-panel, .premium-panel, .monetization, .order-grid, .actions, .toast, .tabs, .button-row, .hero-actions, .outreach-actions, .livepage-panel, .roster-panel, .view-nav, .simulator-panel, .app-footer, .doc-view { display:none !important; }
  .app-shell, .main, .grid, .module-grid, .view-stack { display:block !important; padding:0 !important; margin:0 !important; max-width:none !important; min-height:0 !important; width:auto !important; }
  .view { display:none !important; }
  .view[data-view="raport"] { display:block !important; animation:none !important; transform:none !important; opacity:1 !important; }
  .grid.module-grid { columns:2; column-gap:7mm; margin-bottom:0 !important; }
  .print-only { display:block !important; }
  a { text-decoration:none; color:inherit; }

  .pdf-cover { min-height:255mm; padding:10mm 0 0; break-after:page; position:relative; }
  .pdf-kicker { text-transform:uppercase; letter-spacing:.18em; color:#667085 !important; font-weight:900; font-size:9px; margin:0 0 6mm; }
  .pdf-cover-grid { display:grid; grid-template-columns:1fr 76mm; gap:15mm; margin-top:25mm; align-items:start; }
  .pdf-logo { width:22mm; height:22mm; color:#101418 !important; border:1.4px solid #101418 !important; border-radius:7mm; margin-bottom:16mm; font-size:18px; background:#fff !important; }
  .pdf-cover h1 { font-size:39px !important; line-height:.96 !important; letter-spacing:-.055em !important; color:#101418 !important; margin:0 0 7mm; max-width:112mm; }
  .pdf-subtitle { font-size:14px !important; color:#4b5563 !important; line-height:1.55 !important; max-width:118mm; margin:0; }
  .pdf-meta-card { border:1px solid #d7dce5; border-radius:14px; padding:16px; background:#f7f8fb !important; }
  .pdf-meta-card span { display:block; color:#667085 !important; font-size:8.5px; text-transform:uppercase; letter-spacing:.13em; margin-top:11px; font-weight:900; }
  .pdf-meta-card span:first-child { margin-top:0; }
  .pdf-meta-card strong { display:block; color:#101418 !important; margin-top:3px; font-size:13px; }
  .pdf-cover-bottom { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:42mm; border-top:1px solid #d7dce5; padding-top:10px; }
  .pdf-cover-bottom span { display:block; color:#667085 !important; font-size:8.5px; text-transform:uppercase; letter-spacing:.1em; font-weight:900; }
  .pdf-cover-bottom strong { color:#101418 !important; font-size:12px; }
  .pdf-footer { position:fixed; bottom:5mm; left:13mm; right:13mm; border-top:1px solid #d7dce5; padding-top:4px; color:#667085 !important; font-size:9px; z-index:20; }

  .pdf-executive { padding-top:2mm; }
  .pdf-section-header { display:flex; gap:9mm; align-items:flex-start; margin-bottom:10mm; border-bottom:1px solid #d7dce5; padding-bottom:7mm; }
  .pdf-section-header>span { width:13mm; height:13mm; border:1.2px solid #101418; border-radius:4mm; display:grid; place-items:center; font-weight:900; font-size:10px; }
  .pdf-section-header h2 { font-size:28px !important; line-height:1.05 !important; letter-spacing:-.04em !important; color:#101418 !important; margin:0; }
  .pdf-exec-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:4mm; margin-bottom:8mm; }
  .pdf-exec-grid article { border:1px solid #d7dce5; background:#f7f8fb !important; border-radius:10px; padding:10px; min-height:22mm; }
  .pdf-exec-grid span, .pdf-insight-box span { display:block; text-transform:uppercase; letter-spacing:.12em; color:#667085 !important; font-size:8px; font-weight:900; margin-bottom:5px; }
  .pdf-exec-grid strong { display:block; color:#101418 !important; font-size:13px; line-height:1.2; }
  .pdf-insight-box { border:1.4px solid #101418; border-radius:14px; padding:13px 16px; margin:7mm 0 9mm; background:#fff !important; }
  .pdf-insight-box p { font-size:13px; line-height:1.55; margin:0; color:#101418 !important; }
  .pdf-toc { border-top:1px solid #d7dce5; padding-top:7mm; }
  .pdf-toc h3 { font-size:18px !important; color:#101418 !important; margin:0 0 5mm; }
  .pdf-toc ol { columns:2; column-gap:14mm; margin:0; padding-left:18px; color:#344054 !important; line-height:1.9; }

  .dashboard-panel { break-inside:avoid; margin-bottom:5mm !important; }
  .module-map, .value-readout, .subscores { display:none !important; }
  .panel { box-shadow:none !important; border:1px solid #d7dce5 !important; background:#fff !important; color:#101418 !important; border-radius:10px !important; margin:0 0 5mm !important; break-inside:avoid !important; page-break-inside:avoid !important; padding:6mm !important; }
  .section-title { display:flex !important; gap:7px !important; align-items:center !important; margin-bottom:3.5mm !important; border-bottom:1px solid #edf0f5; padding-bottom:3mm; }
  .section-title span { border-color:#101418 !important; color:#101418 !important; background:#fff !important; width:9mm !important; height:9mm !important; border-radius:3mm !important; font-size:8.5px !important; }
  h2 { font-size:17px !important; letter-spacing:-.03em !important; color:#101418 !important; margin:0 !important; }
  h3 { color:#101418 !important; }
  .dashboard-grid { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:3mm !important; }
  .dashboard-grid article { background:#f7f8fb !important; border:1px solid #d7dce5 !important; border-radius:10px !important; padding:8px !important; }
  .dashboard-grid span, .dashboard-grid small { color:#667085 !important; font-size:8px !important; text-transform:uppercase; letter-spacing:.08em; font-weight:900; }
  .dashboard-grid strong { font-size:13px !important; color:#101418 !important; margin:2px 0 !important; line-height:1.15; }
  .output { color:#101418 !important; font-size:9.5px !important; line-height:1.42 !important; white-space:pre-wrap !important; overflow-wrap:anywhere !important; }
  .output.empty { color:#667085 !important; }
  .locked-output { display:none !important; }
  .plan-pill { border-color:#d7dce5 !important; color:#101418 !important; background:#fff !important; font-size:7.5px !important; padding:2px 5px !important; }
  .premium-pill { background:#101418 !important; color:#fff !important; border-color:#101418 !important; }
  .free-pill, .mixed-pill { background:#f7f8fb !important; color:#101418 !important; }
  @page { size:A4; margin:12mm 12mm 15mm; }
}

/* ==========================================================
   UI refinement — ritm vertical, carduri și cadrane
   ========================================================== */

/* Ritm coerent între blocurile principale ale fiecărei pagini. */
.view > :is(.panel, .grid, .value-grid, .pricing-grid, .actions, .livepage-panel, .roster-panel, .order-grid) +
:is(.panel, .grid, .value-grid, .pricing-grid, .actions, .livepage-panel, .roster-panel, .order-grid) {
  margin-top:clamp(18px,2vw,24px);
}

/* Evită dublarea spațiului acolo unde componentele aveau deja margin-top. */
.view > .module-grid,
.view > .order-grid { margin-top:clamp(18px,2vw,24px); }

/* Distanțe mai aerisite și uniforme între cardurile din grile. */
.value-grid,
.dashboard-grid { gap:clamp(12px,1.4vw,16px); }

.module-grid,
.order-grid,
.pricing-grid { gap:clamp(16px,1.8vw,22px); }

/* Cardurile păstrează un ritm intern stabil indiferent de cantitatea de text. */
.panel,
.value-grid article,
.pricing-card,
.sim-readout,
.side-card {
  overflow-wrap:anywhere;
}

.panel > :first-child { margin-top:0; }
.panel > :last-child { margin-bottom:0; }

/* Simulator: separare vizuală mai clară între control și rezultat. */
.sim-body { gap:clamp(20px,2.4vw,30px); }
.sim-controls { min-width:0; }
.sim-readout {
  padding:clamp(18px,2vw,24px);
  align-self:stretch;
}
.sim-top {
  display:grid;
  grid-template-columns:130px minmax(0,1fr);
  gap:clamp(18px,2vw,26px);
  align-items:center;
}

/* Centrează matematic scorul și variația în mijlocul cercului. */
.sim-gauge-readout,
.gauge-readout {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  text-align:center;
  pointer-events:none;
  transform:translateY(0);
}

.sim-gauge-readout span,
.gauge-readout .score {
  display:block;
  margin:0;
  line-height:.92;
  font-variant-numeric:tabular-nums;
}

.sim-gauge-readout small,
.gauge-readout small {
  display:block;
  min-height:1em;
  margin:0;
  line-height:1;
}

/* SVG-ul ocupă exact cadranul, fără baseline sau offset accidental. */
.sim-gauge,
.gauge { display:grid; place-items:center; }
.sim-gauge svg,
.gauge svg { position:absolute; inset:0; width:100%; height:100%; display:block; }

/* Barele și planul respiră mai bine. */
.sim-subs { display:grid; gap:12px; }
.sim-sub { margin:0; }
.sim-plan { margin-top:20px; padding-top:18px; }

@media (max-width:820px) {
  .sim-top { grid-template-columns:130px minmax(0,1fr); }
}

@media (max-width:560px) {
  .view > :is(.panel, .grid, .value-grid, .pricing-grid, .actions, .livepage-panel, .roster-panel, .order-grid) +
  :is(.panel, .grid, .value-grid, .pricing-grid, .actions, .livepage-panel, .roster-panel, .order-grid) {
    margin-top:16px;
  }

  .panel { padding:18px; }
  .sim-top {
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }
  .sim-value { width:100%; }
  .sim-legend { line-height:1.55; }
  .button-row > button,
  .button-row > .button-link { flex:1 1 180px; }
}

@media (max-width:420px) {
  .sim-gauge { width:112px; height:112px; }
  .sim-gauge svg { width:100%; height:100%; }
  .sim-gauge-readout span { font-size:30px; }
}

/* Consimțământ juridic comandă */
.legal-consent {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 14px 0 18px;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.5;
}
.legal-consent input {
  width: 20px;
  height: 20px;
  margin: 2px 0 0;
  accent-color: var(--accent);
}
.inline-legal-link {
  display: inline;
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.inline-legal-link:hover { opacity: .82; }
.doc a { color: var(--accent); overflow-wrap: anywhere; }
.doc h3 { scroll-margin-top: 90px; }

/* ==========================================================
   PDF comercial v4 - raport vandabil, lizibil, sponsor-ready
   ========================================================== */
@media print {
  :root {
    --pdf-ink:#101828;
    --pdf-muted:#667085;
    --pdf-line:#d9dee8;
    --pdf-soft:#f4f6fa;
    --pdf-accent:#d99a18;
    --pdf-navy:#182230;
  }

  html, body { font-size:11.4px !important; line-height:1.52 !important; }
  body { orphans:3; widows:3; }
  .main { width:100% !important; }

  /* Nu mai comprimăm raportul în coloane înguste. */
  .grid.module-grid {
    columns:auto !important;
    column-count:1 !important;
    display:block !important;
  }

  .pdf-cover {
    min-height:255mm;
    padding:12mm 0 0;
    background:linear-gradient(145deg,#fff 0%,#fff 64%,#f4f6fa 64%,#f4f6fa 100%) !important;
  }
  .pdf-cover-grid { grid-template-columns:minmax(0,1fr) 70mm; gap:13mm; margin-top:20mm; }
  .pdf-cover h1 { font-size:36px !important; line-height:1.02 !important; max-width:108mm; }
  .pdf-logo { background:var(--pdf-navy) !important; color:#fff !important; border-color:var(--pdf-navy) !important; }
  .pdf-meta-card { border-top:4px solid var(--pdf-accent) !important; }
  .pdf-cover-bottom { margin-top:34mm; }

  .pdf-executive,
  .pdf-commercial { min-height:252mm; break-after:page; padding-top:2mm; }

  .pdf-commercial-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 42mm;
    gap:10mm;
    align-items:center;
    background:var(--pdf-navy) !important;
    color:#fff !important;
    border-radius:6mm;
    padding:9mm;
    margin-bottom:7mm;
  }
  .pdf-commercial-hero span,
  .pdf-commercial-score span { display:block; text-transform:uppercase; letter-spacing:.12em; font-size:8px; font-weight:900; color:#cbd5e1 !important; }
  .pdf-commercial-hero h3 { color:#fff !important; font-size:24px !important; line-height:1.1; margin:3mm 0 2mm; }
  .pdf-commercial-hero p { color:#e5e7eb !important; font-size:12px; margin:0; max-width:120mm; }
  .pdf-commercial-score { text-align:center; border-left:1px solid rgba(255,255,255,.25); padding-left:7mm; }
  .pdf-commercial-score strong { font-size:39px; line-height:1; color:#f4b740 !important; display:inline-block; }
  .pdf-commercial-score small { font-size:13px; color:#fff !important; }

  .pdf-decision-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:4mm; margin-bottom:7mm; }
  .pdf-decision-grid article { border:1px solid var(--pdf-line); border-radius:4mm; padding:5mm; min-height:30mm; background:#fff !important; }
  .pdf-decision-grid span,
  .pdf-next-step span,
  .pdf-contact-box span { display:block; color:var(--pdf-muted) !important; font-size:8px; text-transform:uppercase; letter-spacing:.1em; font-weight:900; margin-bottom:2mm; }
  .pdf-decision-grid strong { display:block; color:var(--pdf-ink) !important; font-size:14px; line-height:1.18; }
  .pdf-decision-grid small { display:block; color:var(--pdf-muted) !important; margin-top:2mm; }

  .pdf-value-proposition { border-top:1px solid var(--pdf-line); border-bottom:1px solid var(--pdf-line); padding:6mm 0; }
  .pdf-value-proposition h3 { font-size:19px !important; margin:0 0 4mm; }
  .pdf-benefit-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:4mm; }
  .pdf-benefit-grid article { background:var(--pdf-soft) !important; border-radius:4mm; padding:5mm; }
  .pdf-benefit-grid b { display:block; font-size:13px; color:var(--pdf-ink) !important; margin-bottom:1mm; }
  .pdf-benefit-grid span { color:#475467 !important; }

  .pdf-next-step { display:grid; grid-template-columns:minmax(0,1fr) 65mm; gap:7mm; align-items:stretch; margin-top:7mm; }
  .pdf-next-step > div { border:1px solid var(--pdf-line); border-radius:4mm; padding:5mm; }
  .pdf-next-step strong { color:var(--pdf-ink) !important; font-size:13px; line-height:1.35; }
  .pdf-contact-box { border-color:var(--pdf-accent) !important; background:#fff9ea !important; }

  /* O secțiune importantă = un bloc clar, fără text miniatural. */
  .view[data-view="raport"] > .panel,
  .view[data-view="raport"] > .grid.module-grid > .panel {
    width:100% !important;
    padding:8mm !important;
    margin:0 0 7mm !important;
    border-radius:5mm !important;
    break-inside:avoid-page !important;
    page-break-inside:avoid !important;
  }

  .view[data-view="raport"] > .grid.module-grid > .panel:not(:last-child),
  #strategie, #continut, #calendar, #media-kit, #outreach {
    break-after:page;
    page-break-after:always;
  }

  #dashboard { break-after:page; page-break-after:always; }
  #offer { min-height:225mm; margin-bottom:0 !important; }

  .section-title { margin-bottom:5mm !important; padding-bottom:4mm !important; }
  .section-title span { width:11mm !important; height:11mm !important; font-size:9px !important; }
  .section-title h2, h2 { font-size:22px !important; line-height:1.1 !important; }
  .output { font-size:11.2px !important; line-height:1.58 !important; }
  .output br { line-height:1.8; }

  .dashboard-grid { gap:4mm !important; }
  .dashboard-grid article { padding:5mm !important; min-height:29mm; }
  .dashboard-grid strong { font-size:15px !important; }

  /* Pachetele devin o ofertă comparabilă, nu un bloc de text continuu. */
  #offer .output { white-space:pre-wrap !important; font-size:12px !important; line-height:1.7 !important; }
  #offer::after {
    content:'Recomandare: pachetul final se contractează după validarea livrabilelor, perioadei, exclusivității, drepturilor de imagine și indicatorilor de raportare.';
    display:block;
    margin-top:8mm;
    padding:5mm;
    border-left:4px solid var(--pdf-accent);
    background:#fff9ea !important;
    color:#344054 !important;
    font-size:10.5px;
    line-height:1.5;
  }

  .pdf-footer { color:#98a2b3 !important; }
  .pdf-footer::after { content:' · Confidențial - destinat evaluării unei colaborări comerciale'; }

  @page { size:A4 portrait; margin:13mm 13mm 17mm; }
}
