/* EL PALCO Tracker · desktop shell · Vestuario FM + EU4 hybrid */
:root{
  --rail-w:56px;--insp-w:300px;--desk-pad:24px;
  --glow-pos:0 0 12px rgba(48,209,88,.25);
  --glow-neg:0 0 12px rgba(255,69,58,.2);
  --glow-warn:0 0 10px rgba(255,214,10,.2);
}

/* ── Mobile HUD (híbrido B+A) ── */
.mob-hud{
  display:none;margin:0 -4px 14px;padding:12px 14px;
  border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,#0d0d0d 0%,#000 100%);
  position:relative;overflow:hidden;
}
.mob-hud::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% -20%,rgba(48,209,88,.08),transparent 70%);
  pointer-events:none;
}
.mob-hud-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;position:relative}
.mob-hud-label{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
.mob-hud-hero{font-family:var(--mono);font-size:22px;font-weight:600;line-height:1}
.mob-hud-sub{font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:4px}
.mob-hud-sparks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.mob-hud-sparks .spark-lbl{font-size:7px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.spark-canvas{width:100%;height:28px;display:block;border-radius:4px;background:#0a0a0a}

html[data-device="mobile"] .mob-hud{display:block}

/* Day pills · Jornada mobile */
.day-pills{display:flex;gap:6px;overflow-x:auto;padding:4px 0 12px;margin-bottom:4px;-webkit-overflow-scrolling:touch}
.day-pill{
  flex:none;min-width:52px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;
  background:var(--card);text-align:center;cursor:pointer;font-family:var(--mono);font-size:10px;
}
.day-pill .d{font-size:16px;font-weight:700;display:block;line-height:1}
.day-pill .w{font-size:7px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.day-pill.on{border-color:var(--text);box-shadow:var(--glow-pos)}
.day-pill.win{border-color:rgba(48,209,88,.4);background:rgba(48,209,88,.06)}
.day-pill.loss{border-color:rgba(255,69,58,.35);background:rgba(255,69,58,.05)}
.day-pill .pnl{font-size:8px;margin-top:3px}
html[data-device="desktop"] .day-pills{display:none}

/* ── Desktop app root ── */
html[data-device="desktop"] .nav{display:none!important}
html[data-device="desktop"] .shell,
html[data-device="desktop"] .ledger-shell{
  max-width:none;margin:0;padding:0 var(--desk-pad) 32px;width:100%;
}
html[data-device="desktop"] .ledger-shell{min-height:calc(100vh - 0px)}

.app-root{display:contents}
html[data-device="desktop"] .app-root{
  display:grid;
  grid-template-columns:var(--rail-w) 1fr var(--insp-w);
  min-height:100vh;
  background:var(--bg);
}

/* Rail · Vestuario FM */
html[data-device="desktop"] .desk-rail{
  display:flex;flex-direction:column;align-items:center;
  padding:16px 0;gap:4px;
  border-right:1px solid var(--border);
  background:linear-gradient(180deg,#050505 0%,#000 100%);
  position:sticky;top:0;height:100vh;z-index:30;
}
html[data-device="desktop"] .desk-rail .rail-logo{
  width:36px;height:36px;border:1px solid var(--border);border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:800;letter-spacing:.04em;margin-bottom:16px;
  background:var(--card);
}
html[data-device="desktop"] .desk-rail a{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  width:44px;padding:10px 4px;border-radius:10px;text-decoration:none;
  color:var(--muted);font-size:8px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  transition:.12s;
}
html[data-device="desktop"] .desk-rail a:hover{color:var(--text);background:rgba(255,255,255,.04)}
html[data-device="desktop"] .desk-rail a.on{color:var(--text);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px var(--border2)}
html[data-device="desktop"] .desk-rail a .ico{font-size:16px;line-height:1;opacity:.85}
html[data-device="desktop"] .desk-rail .rail-spacer{flex:1}
html[data-device="desktop"] .desk-rail .rail-live{
  font-family:var(--mono);font-size:7px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);writing-mode:vertical-rl;transform:rotate(180deg);padding:8px 0;
}
html[data-device="desktop"] .desk-rail .rail-live.on{color:var(--pos);text-shadow:var(--glow-pos)}
html[data-device="mobile"] .desk-rail{display:none}
html[data-device="mobile"] .desk-inspector{display:none}

/* Inspector panel */
html[data-device="desktop"] .desk-inspector{
  border-left:1px solid var(--border);
  background:linear-gradient(180deg,#080808 0%,#000 100%);
  padding:18px 16px;overflow-y:auto;
  position:sticky;top:0;height:100vh;
}
.insp-placeholder{font-size:11px;text-align:center;padding:40px 12px;line-height:1.5}
.insp-block{margin-bottom:16px}
.insp-hd{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:8px;
  display:flex;justify-content:space-between;align-items:center}
.insp-hero{font-family:var(--mono);font-size:26px;font-weight:600;text-align:right;margin-bottom:12px}

/* EU4 platform map · Caja desktop */
.eu4-map{
  display:none;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0;
}
html[data-device="desktop"] .eu4-map{display:grid}
.eu4-zone{
  border:1px solid var(--border);border-radius:12px;padding:14px;
  background:var(--card);position:relative;overflow:hidden;min-height:120px;
}
.eu4-zone::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
}
.eu4-zone.b365::before{background:linear-gradient(90deg,#30d158,#1a8f3a)}
.eu4-zone.pm::before{background:linear-gradient(90deg,#60a5fa,#3b82f6)}
.eu4-zone .plat{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.eu4-zone .cash{font-family:var(--mono);font-size:22px;font-weight:600;margin:8px 0 4px}
.eu4-zone .sub{font-family:var(--mono);font-size:10px;color:var(--muted)}
.eu4-zone .bar{margin-top:10px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.eu4-zone .bar i{display:block;height:100%;background:var(--text);border-radius:2px}
.eu4-timeline{
  display:none;grid-column:1/-1;height:32px;border:1px solid var(--border);border-radius:8px;
  background:linear-gradient(90deg,#141414 0%,rgba(48,209,88,.15) 35%,rgba(255,69,58,.12) 65%,#141414 100%);
  position:relative;margin-top:4px;
}
html[data-device="desktop"] .eu4-timeline{display:block}
.eu4-timeline .lbl{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* Caja desktop grid */
html[data-device="desktop"] .caja-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;
}
html[data-device="desktop"] .caja-grid .caja-hero-col{grid-column:1}
html[data-device="desktop"] .caja-grid .caja-pm-col{grid-column:2}

/* Exposure donut */
.expo-donut-wrap{display:flex;align-items:center;gap:14px;margin:12px 0}
.expo-donut{position:relative;width:72px;height:72px;flex:none}
.expo-donut canvas{width:72px!important;height:72px!important}
.expo-donut .center{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:var(--mono);pointer-events:none;
}
.expo-donut .center .amt{font-size:11px;font-weight:700}
.expo-donut .center .lbl{font-size:7px;color:var(--muted);text-transform:uppercase}
.expo-legend{flex:1;font-size:11px}
.expo-legend .row{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px solid #111}
.expo-legend .dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px}

/* Heatmap calendar */
.cal-cell.heat-win,.cal-cell.heat-loss{position:relative}
.cal-cell .heat-int{
  position:absolute;inset:2px;border-radius:4px;pointer-events:none;opacity:.35;
}
.cal-cell .heat-val{
  position:relative;z-index:1;font-size:8px;display:block;margin-top:auto;padding-bottom:2px;
}
.cal-cell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}

/* Align traffic light */
.traffic{display:inline-flex;align-items:center;gap:5px;font-size:10px}
.traffic .bulb{width:8px;height:8px;border-radius:50%;flex:none}
.traffic .bulb.con{background:var(--pos);box-shadow:var(--glow-pos)}
.traffic .bulb.contra{background:var(--neg);box-shadow:var(--glow-neg)}
.traffic .bulb.na{background:var(--muted);opacity:.5}

/* Positions board */
.pos-board{display:grid;gap:8px}
html[data-device="desktop"] .pos-board{grid-template-columns:repeat(2,1fr)}
.pos-card-dense{
  border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--card);
  position:relative;overflow:hidden;
}
.pos-card-dense.urgent{border-color:rgba(255,69,58,.5);animation:pulse-urgent 2s ease infinite}
@keyframes pulse-urgent{0%,100%{box-shadow:none}50%{box-shadow:var(--glow-neg)}}
.pos-card-dense .kick{font-family:var(--mono);font-size:9px;color:var(--warn);margin-bottom:6px}
.pos-card-dense .kick.urgent{color:var(--neg)}
.pos-card-dense .title{font-size:12px;font-weight:600;line-height:1.25}
.pos-card-dense .nums{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:11px}

/* Fixture cluster */
.fixture-cluster{margin-bottom:14px;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.fixture-hd{
  padding:10px 12px;background:var(--card);border-bottom:1px solid var(--border);
  display:flex;justify-content:space-between;align-items:center;cursor:pointer;
}
.fixture-hd:hover{background:#1a1a1a}
.fixture-hd .match{font-size:13px;font-weight:600}
.fixture-hd .agg{font-family:var(--mono);font-size:12px}
.fixture-legs{padding:4px 0}
.fixture-leg{
  display:flex;justify-content:space-between;align-items:center;padding:8px 12px 8px 24px;
  border-bottom:1px solid #111;font-size:11px;cursor:pointer;
}
.fixture-leg:hover{background:var(--card)}
.fixture-leg::before{content:'└';position:absolute;margin-left:-14px;color:var(--muted);font-family:var(--mono)}
.fixture-leg{position:relative}

/* CK3 drawer blocks */
.ck3-blocks{display:grid;gap:10px}
.ck3-block{
  border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--surface);
  border-left:3px solid var(--border2);
}
.ck3-block.traits{border-left-color:var(--pos)}
.ck3-block.relations{border-left-color:#60a5fa}
.ck3-block.engine{border-left-color:var(--warn)}
.ck3-block h4{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.ck3-trait{display:inline-block;font-size:9px;padding:3px 8px;border:1px solid var(--border);border-radius:4px;margin:2px 4px 2px 0}

/* Bankroll gauge */
.bank-gauge{margin:12px 0}
.bank-gauge .track{height:8px;background:var(--border);border-radius:4px;overflow:hidden}
.bank-gauge .fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--pos),var(--warn));transition:width .4s}
.bank-gauge .labels{display:flex;justify-content:space-between;font-family:var(--mono);font-size:9px;color:var(--muted);margin-top:4px}

/* Rolling heat strip */
.heat-strip{
  display:flex;gap:3px;height:24px;margin-bottom:12px;padding:4px;
  border:1px solid var(--border);border-radius:8px;background:var(--card);
}
.heat-strip .day{
  flex:1;border-radius:4px;min-width:8px;cursor:pointer;position:relative;
  border:1px solid transparent;
}
.heat-strip .day:hover{border-color:var(--border2)}
.heat-strip .day.sel{outline:1px solid var(--text)}

/* Ledger desktop */
html[data-device="desktop"] .ledger-main{max-width:none;padding:14px var(--desk-pad) 24px}
html[data-device="desktop"] .ledger-shell .split{grid-template-columns:280px 1fr}
html[data-device="desktop"] .grid2{grid-template-columns:1.2fr 1fr}
html[data-device="desktop"] .kpi-row{grid-template-columns:repeat(6,1fr)}
html[data-device="desktop"] .drawer{width:min(480px,40vw)}

/* Streak rail */
.streak-rail{display:flex;gap:4px;margin:8px 0}
.streak-rail .dot{width:10px;height:10px;border-radius:50%;border:1px solid var(--border)}
.streak-rail .dot.w{background:var(--pos);border-color:var(--pos);box-shadow:var(--glow-pos)}
.streak-rail .dot.l{background:var(--neg);border-color:var(--neg)}

/* Session ticker chips */
.session-ticker{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.session-ticker .chip{font-family:var(--mono);font-size:9px}