*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#0b0e14;--bg2:#111620;--card:#151a25;--card-border:#1e2636;--card-hover:#1a2030;
  --text:#f1f5f9;--muted:#94a3b8;--dim:#64748b;
  --solar:#f59e0b;--solar-dim:rgba(245,158,11,.12);
  --batt:#34d399;--batt-dim:rgba(52,211,153,.10);
  --grid:#60a5fa;--grid-dim:rgba(96,165,250,.10);
  --ev:#a78bfa;--ev-dim:rgba(167,139,250,.10);
  --ai:#c084fc;--ai-dim:rgba(192,132,252,.08);
  --ok:#4ade80;--warn:#fbbf24;--bad:#f87171;
  --radius:14px;--radius-sm:10px;
  --font:'Outfit',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
html{background:var(--bg);color:var(--text);}
body{font-family:var(--font);background:var(--bg);min-height:100vh;}

/* HEADER */
.hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 24px;background:var(--bg2);border-bottom:1px solid var(--card-border);
  position:sticky;top:0;z-index:100;
}
.hdr-brand{display:flex;align-items:center;gap:10px;}
.hdr-brand svg{width:28px;height:28px;}
.hdr-brand h1{font-size:17px;font-weight:800;letter-spacing:-.3px;}
.hdr-sub{font-size:10px;color:var(--muted);letter-spacing:.3px;font-weight:500}
.hdr-right{display:flex;align-items:center;gap:14px;}
.hdr-clock{font-family:var(--mono);font-size:15px;font-weight:600;}
.hdr-meta{font-family:var(--mono);font-size:11px;color:var(--muted);}
.hdr-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);animation:pulse 2s ease infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* HEADER — användarinfo + knappar (auth) */
.hdr-user{display:flex;align-items:center;gap:8px;padding-left:14px;border-left:1px solid var(--card-border);margin-left:6px;}
.hdr-username{font-family:var(--mono);font-size:12px;color:var(--text);font-weight:600;letter-spacing:.2px;display:flex;align-items:center;gap:6px;}
.hdr-role{font-size:9px;font-weight:700;letter-spacing:.5px;padding:2px 6px;border-radius:5px;background:rgba(245,158,11,.15);color:var(--solar);border:1px solid rgba(245,158,11,.35);}
.hdr-role-r{background:rgba(148,163,184,.10);color:var(--muted);border-color:var(--card-border);}
.hdr-btn{
  font-family:var(--font);font-size:12px;font-weight:600;text-decoration:none;color:var(--text);
  padding:6px 11px;border-radius:8px;border:1px solid var(--card-border);background:var(--card);
  transition:background .12s,border-color .12s,color .12s;
}
.hdr-btn:hover{background:var(--card-hover);border-color:var(--ev);color:var(--text);}
.hdr-btn-out{color:var(--muted);}
.hdr-btn-out:hover{color:var(--bad);border-color:rgba(248,113,113,.4);background:rgba(248,113,113,.08);}

/* HEADER — mobilanpassning. På smal skärm (telefoner i porträtt) flyttas
   höger-blocket ner under brand och knappar tillåts wrappa över flera rader.
   Gemensamt för alla sidor som använder .hdr (status, stats, economy, info, admin). */
@media (max-width:700px){
  .hdr{
    flex-wrap:wrap;
    gap:8px 10px;
    padding:10px 14px;
  }
  .hdr-brand h1{font-size:15px}
  .hdr-brand svg{width:24px;height:24px}
  .hdr-sub{font-size:9px}
  .hdr-right{
    width:100%;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
  }
  .hdr-user{
    flex-wrap:wrap;
    padding-left:0;
    border-left:none;
    margin-left:0;
    justify-content:flex-end;
    gap:6px;
  }
  .hdr-btn{font-size:11px;padding:5px 9px;border-radius:6px}
  .hdr-username{font-size:11px}
  .hdr-clock{font-size:13px}
  .hdr-meta{font-size:10px}
}

/* Reader-läge: tonar ner admin-knappar (servern blockar ändå, detta är kosmetiskt) */
body[data-role="reader"] .admin-only{opacity:.5;pointer-events:none;filter:grayscale(.4);}
body[data-role="reader"] .admin-only::after{content:" 🔒";font-size:.85em;}

/* LAYOUT */
.wrap{max-width:1800px;margin:0 auto;padding:16px 24px;}
.g{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;align-items:stretch;}
.s3{grid-column:span 3}.s4{grid-column:span 4}.s6{grid-column:span 6}.s8{grid-column:span 8}.s12{grid-column:span 12}
@media(max-width:1100px){.s3{grid-column:span 6}.s8{grid-column:span 12}}
@media(max-width:700px){.s3,.s4,.s6,.s8{grid-column:span 12}}

/* CARDS */
.c{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:18px;position:relative;overflow:hidden;}
.card-col{display:flex;flex-direction:column}
.card-body{flex:1}
.card-bottom{margin-top:auto;padding-top:8px}
.batt-status{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--text)}
.c-accent{position:absolute;top:0;left:0;right:0;height:2px;}
.c-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:8px;flex-wrap:wrap;}
.c-title{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);}

/* BADGES */
.b{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;font-family:var(--mono);background:var(--bg2);border:1px solid var(--card-border);color:var(--muted);}
.b.ok{border-color:rgba(74,222,128,.25);color:var(--ok);background:rgba(74,222,128,.06)}
.b.warn{border-color:rgba(251,191,36,.25);color:var(--warn);background:rgba(251,191,36,.06)}
.b.bad{border-color:rgba(248,113,113,.25);color:var(--bad);background:rgba(248,113,113,.06)}

/* TYPOGRAPHY */
.mono{font-family:var(--mono)}.sub{font-size:11.5px;color:var(--muted);font-family:var(--mono);margin-top:2px;line-height:1.5;}
.vxl{font-family:var(--mono);font-size:32px;font-weight:700;line-height:1.1;letter-spacing:-.5px;}
.vlg{font-family:var(--mono);font-size:24px;font-weight:700;line-height:1.2;}
.vmd{font-family:var(--mono);font-size:17px;font-weight:600;}

/* GAUGE (circular SVG) */
.gauge{position:relative;display:inline-flex;align-items:center;justify-content:center;}
.gauge svg{transform:rotate(-90deg)}
.g-track{fill:none;stroke:var(--bg2);stroke-width:5.5;stroke-linecap:round}
.g-fill{fill:none;stroke-width:5.5;stroke-linecap:round;transition:stroke-dashoffset .7s ease,stroke .4s ease}
.g-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.g-pct{font-family:var(--mono);font-weight:700;line-height:1}
.g-lbl{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:1px}
.g-bolt{opacity:0;transition:opacity .3s;font-size:12px;margin-top:1px}.g-bolt.on{opacity:1}

/* BARS */
.bar{height:6px;background:var(--bg2);border-radius:99px;overflow:hidden}
.bar-f{height:100%;border-radius:99px;transition:width .4s ease,background .3s;min-width:1px}

/* PHASES */
.phases{display:flex;gap:8px;margin-top:10px}
.ph{flex:1;background:var(--bg2);border-radius:var(--radius-sm);padding:8px 10px}
.ph-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.ph-name{font-size:11px;font-weight:800;color:var(--muted)}
.ph-pct{font-family:var(--mono);font-size:11px;font-weight:700}
.ph-val{font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:4px}

/* FORCE CONTROLS */
.force{display:flex;align-items:center;gap:8px;padding:6px 0;border-radius:var(--radius-sm);border:1px solid transparent;transition:all .2s}
.force.on{border-color:rgba(251,191,36,.3);background:rgba(251,191,36,.05)}
.force label{font-size:11px;font-weight:700;cursor:pointer;user-select:none;color:var(--muted)}
.force.on>label{color:var(--warn)}
.force select,.force input[type=number]{padding:4px 8px;border-radius:6px;border:1px solid var(--card-border);font-size:11px;font-family:var(--mono);background:var(--bg);color:var(--text)}
.force select:disabled,.force input:disabled{opacity:.3}

/* TOGGLE SWITCH */
.sw{position:relative;display:inline-block;width:36px;height:19px;flex-shrink:0}
.sw input{opacity:0;width:0;height:0}
.sw .tr{position:absolute;cursor:pointer;inset:0;background:var(--dim);border-radius:19px;transition:.2s}
.sw .tr::before{content:'';position:absolute;height:13px;width:13px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s}
.sw input:checked+.tr{background:var(--warn)}
.sw input:checked+.tr::before{transform:translateX(17px)}

/* AI */
.ai-sum{font-size:18px;font-weight:800;line-height:1.4;margin-bottom:10px}
.ai-reason{background:var(--ai-dim);border:1px solid rgba(192,132,252,.12);border-radius:var(--radius-sm);padding:12px 14px;font-size:13px;line-height:1.6;color:#d8b4fe}
.ai-stats{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px}
.ai-st{display:flex;flex-direction:column;gap:1px}
.ai-st-l{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.ai-st-v{font-family:var(--mono);font-size:14px;font-weight:600}

/* BUTTONS */
.btn{padding:7px 16px;border-radius:6px;border:1px solid var(--card-border);font-size:12px;font-weight:600;font-family:var(--mono);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:5px;letter-spacing:.2px}
.btn-ai{background:rgba(192,132,252,.15);color:#e2cbff;border-color:rgba(192,132,252,.3)}.btn-ai:hover{background:rgba(192,132,252,.25);border-color:rgba(192,132,252,.45)}
.btn-ghost{background:rgba(255,255,255,.07);color:#94a3b8;border-color:rgba(255,255,255,.1)}.btn-ghost:hover{background:rgba(255,255,255,.08);color:var(--text);border-color:rgba(255,255,255,.18)}
.btn-snow-on{background:rgba(147,197,253,.2)!important;color:#93c5fd!important;border-color:rgba(147,197,253,.4)!important}.btn-snow-on:hover{background:rgba(147,197,253,.3)!important}
.btn-force-batt{display:block;width:100%;margin-top:10px;padding:10px 14px;border-radius:8px;border:1px solid rgba(74,222,128,.25);background:rgba(74,222,128,.08);color:#86efac;font-size:13px;font-weight:700;font-family:var(--mono);cursor:pointer;transition:all .15s;text-align:center;letter-spacing:.3px}
.btn-force-batt:hover{background:rgba(74,222,128,.18);border-color:rgba(74,222,128,.4)}
.btn-force-batt.active{background:rgba(74,222,128,.25);color:#fff;border-color:rgba(74,222,128,.6);box-shadow:0 0 12px rgba(74,222,128,.15)}
.btn-kia-big{display:block;width:100%;margin-top:10px;padding:10px 14px;border-radius:8px;border:1px solid rgba(167,139,250,.35);background:rgba(167,139,250,.14);color:#f0e8ff;font-size:13px;font-weight:700;font-family:var(--mono);cursor:pointer;transition:all .15s;text-align:center;letter-spacing:.3px}
.btn-kia-big:hover{background:rgba(167,139,250,.25);border-color:rgba(167,139,250,.5)}

/* CHARTS */
.cv{width:100%;border-radius:var(--radius-sm);background:var(--bg2);max-height:220px}
.ch-legend{display:flex;gap:12px;margin-bottom:4px}
.lg-dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.lg-item{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--muted);font-weight:600}
.ch-range{display:flex;justify-content:space-between;margin-top:3px}

/* SOLAR COMPACT */
.solar-row{display:flex;gap:14px;align-items:stretch}
.solar-left{flex:0 0 280px;display:flex;flex-direction:column;gap:8px}
.solar-chart{flex:1;min-width:0}
.solar-chart .cv{height:240px}
.pvs-compact{display:flex;flex-direction:column;gap:5px;margin-top:6px}
.pv-box{background:var(--bg2);border:1px solid var(--card-border);border-radius:8px;padding:8px 12px}
.pv-box-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.pv-box-n{font-size:12px;font-weight:800;color:var(--text)}
.pv-box-v{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--solar)}
.pv-box-d{font-family:var(--mono);font-size:11px;color:#a8b5c4;margin-top:3px}
@media(max-width:700px){.solar-row{flex-direction:column}.solar-left{flex:none}}
.pvstat-tabs{display:flex;gap:4px;flex-wrap:wrap}
.pvstat-tab{padding:6px 14px;border-radius:6px;border:1px solid var(--card-border);background:var(--bg2);color:#94a3b8;font-size:12px;font-weight:600;font-family:var(--mono);cursor:pointer;transition:all .15s}
.pvstat-tab:hover{background:rgba(245,158,11,.1);color:var(--solar);border-color:rgba(245,158,11,.3)}
.pvstat-tab.active{background:var(--solar);color:#0f172a;border-color:var(--solar)}
.pvstat-tab-day{padding:0!important;display:inline-flex;align-items:stretch;cursor:default;overflow:hidden}
.pvstat-tab-day:hover{background:var(--bg2);color:#94a3b8;border-color:var(--card-border)}
.pvstat-tab-day.active:hover{background:var(--solar);color:#0f172a;border-color:var(--solar)}
.pvstat-day-arrow{padding:6px 9px;cursor:pointer;font-weight:700;font-size:15px;line-height:1;user-select:none;display:flex;align-items:center;border-radius:5px;transition:background .15s}
.pvstat-day-arrow:hover{background:rgba(0,0,0,.18)}
.pvstat-day-arrow.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}
.pvstat-day-label{padding:6px 4px;min-width:78px;text-align:center;font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center}

/* SoC-tab — egen accent (violett / batteri) */
.pvstat-tab-soc:hover{background:rgba(167,139,250,.12);color:var(--ev);border-color:rgba(167,139,250,.4)}
.pvstat-tab-soc.active{background:var(--ev);color:#0f172a;border-color:var(--ev)}

/* SoC-chart-wrapper */
.es-soc-wrap{margin-top:18px}
.es-soc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.es-soc-stat{background:var(--bg2);border:1px solid var(--card-border);border-radius:10px;padding:12px 14px}
.es-soc-stat-l{font-size:11px;color:#94a3b8;text-transform:uppercase;letter-spacing:.4px;font-weight:600;margin-bottom:4px}
.es-soc-stat-v{font-family:var(--mono);font-size:22px;font-weight:600;color:#f8fafc;letter-spacing:-.02em}
.es-soc-stat-u{font-size:13px;color:#94a3b8;margin-left:3px;font-weight:400}
@media (max-width:640px){.es-soc-stats{grid-template-columns:repeat(2,1fr)}}
/* === Energistatistik (es-*) === */
.es-top{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch;margin-top:18px;margin-bottom:22px}
.es-hero-col{display:flex;flex-direction:column;gap:16px}
.es-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0}
.es-hero-lbl{font-size:11px;font-weight:500;color:#94a3b8;margin-bottom:6px}
.es-hero-val{font-family:var(--mono);font-size:44px;font-weight:600;color:#f8fafc;letter-spacing:-.025em;line-height:1}
.es-hero-u{font-size:18px;color:#94a3b8;margin-left:8px;font-weight:400}
.es-hero-sub{font-size:12px;color:#94a3b8;margin-top:8px;display:flex;align-items:center;gap:8px}
.es-dot-mini{width:6px;height:6px;border-radius:50%;background:var(--solar);display:inline-block}
.es-donut{position:relative;width:110px;height:110px;flex-shrink:0}
.es-donut-text{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.es-donut-num{font-family:var(--mono);font-size:24px;font-weight:600;color:var(--solar);letter-spacing:-.02em;line-height:1}
.es-donut-sub{font-size:11px;color:#94a3b8;margin-top:4px}
.es-bars{margin:0;display:flex;flex-direction:column;gap:14px}
.es-bar-row{}
.es-bar-head{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:#94a3b8;font-weight:500;margin-bottom:6px}
.es-bar-val{font-family:var(--mono);font-weight:600;font-size:13px}
.es-bar-track{height:6px;background:rgba(148,163,184,.08);border-radius:3px;overflow:hidden;display:flex}
.es-bar-fill{height:100%}
.es-metrics{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;margin:0}
.es-m{background:rgba(148,163,184,.04);border-radius:8px;padding:14px 18px;display:flex;flex-direction:column;justify-content:center}
.es-m-l{font-size:11px;color:#94a3b8;font-weight:500;margin-bottom:8px}
.es-m-v{font-family:var(--mono);font-size:22px;font-weight:600;color:#f1f5f9;letter-spacing:-.01em}
.es-m-u{font-size:12px;color:#64748b;margin-left:3px;font-weight:400}
.es-m-v.gr{color:#4ade80}
.es-m-v.bl{color:#60a5fa}
.es-m-v.pu{color:#c4b5fd}
.es-m-sub{font-family:var(--mono);font-size:12px;font-weight:500;color:#94a3b8;margin-top:4px;letter-spacing:-.01em}
.es-m-sub.gr{color:#4ade80}
.es-m-sub.bl{color:#60a5fa}
.es-cs{margin-bottom:22px}
.es-charts-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.es-charts-row .es-cs{margin-bottom:0}
@media(max-width:1100px){.es-charts-row{grid-template-columns:1fr}}
.es-csh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}
.es-cst{font-size:12px;font-weight:500;color:#94a3b8}
.es-lg{display:flex;gap:14px;font-size:11px;color:#94a3b8}
.es-lg-i{display:flex;align-items:center;gap:6px}
.es-lg-d{width:9px;height:9px;border-radius:2px}
.es-cc{background:rgba(148,163,184,.03);border-radius:10px;padding:14px;position:relative}
.es-cc canvas{width:100%;height:240px;display:block}
.es-cc svg.es-hm{width:100%;height:240px;display:block}
.es-hm-legend{display:flex;align-items:center;gap:5px}
.es-hm-legend-lbl{font-size:11px;color:#94a3b8}
.es-hm-sw{width:18px;height:10px;border-radius:2px;display:inline-block}
.es-strs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.es-s-c{background:rgba(148,163,184,.04);border-radius:8px;padding:12px 16px}
.es-s-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.es-s-n{display:flex;align-items:center;gap:8px;font-size:12px;color:#94a3b8;font-weight:500}
.es-s-d{width:8px;height:8px;border-radius:50%}
.es-s-v{font-family:var(--mono);font-size:14px;font-weight:600}
.es-s-b{height:4px;background:rgba(148,163,184,.08);border-radius:2px;overflow:hidden;margin-bottom:8px}
.es-s-bf{height:100%;border-radius:2px}
.es-s-f{display:flex;justify-content:space-between;font-size:11px;color:#64748b}
.es-foot{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:0.5px solid rgba(148,163,184,.08);font-size:11px;color:#64748b}
.es-foot .es-r{margin-left:auto;color:#94a3b8}

/* Topp-rekord på Total-vyn (Toppdag/Toppvecka/Toppmånad).
   Tre kort i en rad. Wrappar till en kolumn på smal skärm. */
.es-tops{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 22px}
.es-top-c{
  background:rgba(245,158,11,.05);
  border:1px solid rgba(245,158,11,.18);
  border-radius:10px;padding:14px 16px;
}
.es-top-l{
  font-size:11px;color:#94a3b8;font-weight:600;
  text-transform:uppercase;letter-spacing:.5px;
  display:flex;align-items:center;gap:6px;
}
.es-top-l-ico{color:#f59e0b}
.es-top-v{
  font-family:var(--mono);font-size:24px;font-weight:700;
  color:#f59e0b;letter-spacing:-.01em;margin:6px 0 4px;line-height:1.1;
}
.es-top-u{font-size:13px;color:#94a3b8;font-weight:500;margin-left:3px}
.es-top-d{font-size:12px;color:#cbd5e1;font-family:var(--mono)}
@media(max-width:1100px){
  .es-top{grid-template-columns:1fr;gap:18px}
  .es-hero-val{font-size:40px}
}
@media(max-width:700px){
  .es-tops{grid-template-columns:1fr;gap:8px;margin-bottom:16px}
  .es-top-v{font-size:20px}
}
@media(max-width:600px){
  .es-hero{flex-direction:column;align-items:flex-start}
  .es-donut{align-self:center}
  .es-metrics{grid-template-rows:auto auto}
  .es-m{padding:11px 13px}
  .es-m-v{font-size:18px}
  .es-cc canvas{height:170px}
}
.pvstat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.pvstat-card{background:var(--bg);border:1px solid var(--card-border);border-radius:10px;padding:12px 14px}
.pvstat-card .lbl{font-size:11px;color:#7c8a9d;font-weight:600;margin-bottom:4px}
.pvstat-card .val{font-size:22px;font-weight:800;font-family:var(--mono)}
.pvstat-card .unit{font-size:12px;color:#64748b;font-weight:400;margin-left:2px}
.pvstat-card .sub{font-size:11px;color:#475569;margin-top:3px}
.pvstat-string{background:var(--bg);border:1px solid var(--card-border);border-radius:10px;padding:14px;margin-top:10px}
.pvstat-string-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.pvstat-string-name{font-size:13px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:6px}
.pvstat-string-name .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.pvstat-string-val{font-size:18px;font-weight:800;font-family:var(--mono)}
.pvstat-bar{height:8px;border-radius:4px;background:var(--bg2);overflow:hidden;margin-bottom:6px}
.pvstat-bar-f{height:100%;border-radius:4px;transition:width .5s}
.pvstat-balance{background:var(--bg);border:1px solid var(--card-border);border-radius:10px;padding:12px 14px;margin-top:10px}
.pvstat-balance-bar{display:flex;height:8px;border-radius:4px;overflow:hidden;margin-top:8px}
.pvstat-chart-wrap{margin-top:14px;background:var(--bg);border:1px solid var(--card-border);border-radius:10px;padding:14px}
.pvstat-chart-wrap canvas{width:100%;height:140px}
.pvstat-nodata{text-align:center;padding:40px 20px;color:#64748b;font-size:14px}
@media(max-width:500px){.pvstat-grid{grid-template-columns:1fr 1fr}}

/* DETAILS */
/* PRICE CARD */
.price-stats{display:flex;gap:12px;margin-top:4px}
.price-stat{display:flex;flex-direction:column;gap:1px}
.price-stat-l{font-size:9px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.4px}
.price-stat-v{font-family:var(--mono);font-size:14px;font-weight:700}
.flag-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.flag-item{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--muted);padding:5px 8px;background:var(--bg2);border-radius:6px}
.flag-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.flag-item.active{color:var(--text)}
.flag-item.active .flag-dot{box-shadow:0 0 6px currentColor}
details summary{cursor:pointer;font-size:11px;font-weight:700;color:var(--muted);padding:8px 0;list-style:none;display:flex;align-items:center;gap:5px}
details summary::before{content:'▸';transition:transform .2s}
details[open] summary::before{transform:rotate(90deg)}
details pre{background:var(--bg2);color:var(--dim);padding:12px;border-radius:var(--radius-sm);overflow:auto;font-size:10px;font-family:var(--mono);line-height:1.4;max-height:60vh;border:1px solid var(--card-border)}

/* TERMINAL MODAL */
.term-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:6px;margin-bottom:12px}
.term-btn{background:var(--bg2);border:1px solid var(--card-border);border-radius:8px;padding:8px 10px;cursor:pointer;text-align:left;transition:all .15s}
.term-btn:hover{border-color:var(--grid);background:#1a2030}
.term-btn.arg{border-left:3px solid var(--warn)}
.term-btn.safe{border-left:3px solid var(--ok)}
.term-btn.info{border-left:3px solid var(--grid)}
.term-btn.danger{border-left:3px solid var(--bad)}
.term-name{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--text)}
.term-desc{font-size:10px;color:var(--dim);margin-top:2px;line-height:1.3}
.term-bar{display:flex;gap:6px;margin-bottom:10px}
.term-bar input{flex:1;background:var(--bg);border:1px solid var(--card-border);border-radius:8px;padding:8px 12px;color:var(--text);font-family:var(--mono);font-size:13px;outline:none}
.term-bar input:focus{border-color:var(--grid)}
.term-bar input::placeholder{color:var(--dim)}
.term-run{background:var(--ok);color:#0b0e14;border:none;border-radius:8px;padding:8px 16px;font-family:var(--font);font-weight:700;font-size:13px;cursor:pointer}
.term-run:hover{opacity:.85}.term-run:disabled{opacity:.3}
.term-out{background:var(--bg);border:1px solid var(--card-border);border-radius:10px;overflow:hidden}
.term-out-head{background:var(--bg2);padding:6px 12px;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--card-border)}
.term-out-dot{width:8px;height:8px;border-radius:50%}
.term-out-title{font-size:11px;color:var(--dim);margin-left:4px}
.term-out-clear{margin-left:auto;background:none;border:1px solid var(--card-border);border-radius:4px;color:var(--dim);font-size:10px;padding:2px 8px;cursor:pointer;font-family:var(--font)}
.term-out-clear:hover{color:var(--text)}
.term-out-body{padding:12px;min-height:120px;max-height:400px;overflow-y:auto;font-family:var(--mono);font-size:12px;line-height:1.6;color:#c9d1d9}
.t-entry{margin-bottom:10px}.t-prompt{color:var(--ok)}.t-cmd{color:var(--grid)}.t-ms{color:var(--dim);font-size:11px;float:right}.t-output{white-space:pre-wrap;word-break:break-word;margin-top:2px}.t-err{color:var(--bad)}.t-spin{color:var(--warn);animation:pulse 1s infinite}
.t-welcome{color:var(--dim);font-style:italic;font-size:12px}
.term-arg-overlay{display:none;position:fixed;inset:0;z-index:1010;align-items:center;justify-content:center;background:rgba(0,0,0,.5)}.term-arg-overlay.open{display:flex}
.term-arg-box{background:var(--card);border:1px solid var(--card-border);border-radius:12px;padding:20px;min-width:280px}
.term-arg-box h4{font-family:var(--mono);font-size:14px;margin-bottom:4px;color:var(--text)}
.term-arg-box p{color:var(--dim);font-size:12px;margin-bottom:10px}
.term-arg-box input{width:100%;background:var(--bg);border:1px solid var(--card-border);border-radius:6px;padding:8px 10px;color:var(--text);font-family:var(--mono);font-size:13px;outline:none;margin-bottom:10px}
.term-arg-box input:focus{border-color:var(--grid)}
.term-arg-btns{display:flex;gap:6px;justify-content:flex-end}
.term-arg-btns button{padding:6px 14px;border-radius:6px;font-family:var(--font);font-weight:600;font-size:12px;cursor:pointer}
.targ-cancel{background:var(--bg2);border:1px solid var(--card-border);color:var(--text)}
.targ-ok{background:var(--ok);border:1px solid var(--ok);color:#0b0e14}

/* MODAL */
.modal{display:none;position:fixed;inset:0;z-index:999;align-items:center;justify-content:center}.modal.open{display:flex}
.modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(4px)}
.modal-box{position:relative;max-width:920px;width:94vw;max-height:86vh;overflow:auto;background:#f8f9fa;border:1px solid #e2e4e8;border-radius:var(--radius);padding:28px;color:#1a1d23}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.modal-head h2{font-size:17px;font-weight:800;color:#1a1d23}
.modal-x{background:none;border:none;color:#6b7280;font-size:22px;cursor:pointer;padding:6px 10px;border-radius:6px;transition:all .15s}.modal-x:hover{color:#1a1d23;background:#e5e7eb}
.prompt-text{white-space:pre-wrap;font-family:var(--font);font-size:13.5px;line-height:1.9;background:#fff;border:1px solid #e2e4e8;border-radius:var(--radius-sm);padding:22px 26px;max-height:62vh;overflow:auto;color:#374151;word-break:break-word}

/* SCROLLBAR */
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--dim);border-radius:99px}

/* ANIM */
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.c{animation:fadeUp .35s ease both}
.c:nth-child(2){animation-delay:.03s}.c:nth-child(3){animation-delay:.06s}
.c:nth-child(4){animation-delay:.09s}.c:nth-child(5){animation-delay:.12s}

/* SYSTEM SECTION (collapsed) */
.sys-section{padding:0;border-color:var(--card-border)}
.sys-section .c-accent{display:none}
.sys-summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;list-style:none;font-size:12px;transition:background .15s}
.sys-summary:hover{background:var(--card-hover,var(--bg2))}
.sys-summary::-webkit-details-marker{display:none}
.sys-summary::before{content:'▸';color:var(--muted);font-size:10px;margin-right:4px;transition:transform .2s}
details[open]>.sys-summary::before{transform:rotate(90deg)}
.sys-body{padding:4px 14px 14px;border-top:1px solid var(--card-border)}
.sys-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:600px){.sys-grid{grid-template-columns:1fr}}
.sys-col{}
.sys-label{font-size:10px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
.sys-force-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:4px}
.sys-force-box{background:var(--bg2);border:1px solid var(--card-border);border-radius:8px;padding:10px 12px}
@media(max-width:600px){.sys-force-row{grid-template-columns:1fr}}
