:root { color-scheme: dark; --bg:#061914; --bg2:#0c241c; --card:#0d271e; --edge:rgba(109,178,139,.19); --mint:#4ce9a3; --lime:#b4f7c1; --text:#f2faf5; --muted:#a3b9af; --amber:#ffd28b; --cyan:#8dd3e7; --shadow:0 22px 65px rgba(0,0,0,.24); }
    *,*:before,*:after{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:radial-gradient(ellipse 65% 48% at 50% -10%,#15392c 0%,var(--bg) 80%);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input,a{font:inherit}a{color:inherit} button{cursor:pointer} .layout{width:min(1200px,calc(100% - 40px));margin:0 auto} header{border-bottom:1px solid rgba(143,210,166,.11);background:rgba(5,23,17,.68);backdrop-filter:blur(18px)} .topbar{min-height:77px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:850;font-size:20px;letter-spacing:.04em}.brand-mark{width:34px;height:34px;color:#b3f06c}.brand .energy{font-weight:450;color:#d9e9dc} .toplink{border:1px solid var(--edge);border-radius:999px;padding:10px 17px;color:#c9ecdc;font-size:12px;text-decoration:none;transition:background .2s,border-color .2s}.toplink:hover{background:#173d2c;border-color:#459d72} .herohead{padding:45px 0 25px}.eyebrow{font-size:11px;text-transform:uppercase;font-weight:750;letter-spacing:.18em;color:#6fe2a4}.herohead h1{font-size:clamp(29px,4.5vw,49px);line-height:1.1;letter-spacing:-.045em;margin:14px 0}.herohead h1 span{color:#6eeeb0}.herohead p{color:var(--muted);font-size:14px;line-height:1.65;max-width:680px;margin:0}.switch{display:flex;gap:8px;margin:26px 0 22px}.switch button{display:flex;gap:9px;align-items:center;justify-content:center;border:1px solid var(--edge);background:#092219;color:#b9d5c6;padding:12px 19px;border-radius:11px;font-weight:730;font-size:13px;transition:.2s}.switch button[aria-selected="true"]{background:#184d35;border-color:#4cce89;color:#dfffea;box-shadow:inset 0 0 0 1px rgba(71,232,154,.1)}.switch button:hover{border-color:#4aaa7a}.switch svg{width:18px;height:18px}.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;align-items:stretch;margin-bottom:25px}.sidebar,.visual,.insight{border:1px solid var(--edge);border-radius:19px;background:linear-gradient(160deg,rgba(16,47,35,.85),rgba(6,26,19,.93));box-shadow:var(--shadow)}.sidebar{padding:24px 22px}.section-tag{font-size:10px;text-transform:uppercase;letter-spacing:.17em;color:var(--mint);font-weight:800}.sidebar h2{font-size:24px;line-height:1.13;margin:11px 0 9px;letter-spacing:-.03em}.sidebar .desc{color:var(--muted);font-size:12.5px;line-height:1.6;margin:0 0 20px}.control{padding:16px 0 15px;border-top:1px solid rgba(142,205,165,.13)}.ctrl-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}.ctrl-top label{font-weight:650;font-size:12.5px;color:#d9f1e3}.ctrl-value{font-size:13px;font-weight:850;color:var(--mint);font-variant-numeric:tabular-nums;white-space:nowrap}.hint{font-size:11px;color:#879e90;margin-top:9px;line-height:1.4}.range{appearance:none;-webkit-appearance:none;width:100%;height:5px;background:linear-gradient(90deg,#2fb980 0%,#1c6749 55%,#294239 100%);border-radius:20px;outline:none;cursor:pointer}.range::-webkit-slider-thumb{appearance:none;width:17px;height:17px;border:3px solid #bbfbd7;border-radius:50%;background:#19a86c;box-shadow:0 0 0 4px rgba(34,182,111,.12)}.range::-moz-range-thumb{width:12px;height:12px;border:3px solid #bbfbd7;border-radius:50%;background:#19a86c}.range:focus-visible{outline:2px solid #b6f6ca;outline-offset:8px}.minmax{display:flex;justify-content:space-between;color:#708e7e;font-size:10px;margin-top:11px}.row2{display:grid;grid-template-columns:1fr 1fr;gap:11px}.small-input{border:1px solid rgba(120,181,145,.3);background:#071d17;color:#e1fae9;padding:12px 9px;border-radius:9px;width:100%;font-size:14px;outline:none;margin-top:7px;max-width:100%;color-scheme:dark}.small-input:focus{border-color:var(--mint)}.input-label{font-size:11px;color:#afc5b7;display:block}.disclaimer{margin:16px 0 0;font-size:10.5px;color:#8fa799;line-height:1.6}.visual{overflow:hidden;background-color:#051b15;background-image:linear-gradient(rgba(95,154,115,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(95,154,115,.035) 1px,transparent 1px),radial-gradient(ellipse 60% 60% at 50% 17%,rgba(24,89,57,.28),transparent 75%);background-size:36px 36px,36px 36px,auto;padding:25px 25px 23px;min-height:678px}.vis-head{display:flex;align-items:start;justify-content:space-between;gap:12px}.vis-head h2{font-size:19px;letter-spacing:-.025em;margin:8px 0 0}.live{display:flex;align-items:center;gap:7px;border:1px solid #2d684a;border-radius:100px;padding:7px 11px;font-size:10px;color:#99e2b6;font-weight:850;white-space:nowrap}.pulse{width:7px;height:7px;background:#4feb9f;border-radius:50%;box-shadow:0 0 0 4px rgba(64,221,146,.12);animation:pulse 2s ease-in-out infinite}.diagram-wrap{margin:21px auto 3px;max-width:790px;min-height:250px;display:flex;align-items:center}.diagram{display:block;width:100%;height:auto;overflow:visible}.diagram .path-base{stroke:#28483b;stroke-width:4;fill:none;stroke-linecap:round}.diagram .flow-green{stroke:#43d895;stroke-width:3.4;fill:none;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(36,255,148,.23))}.diagram .flow-yellow{stroke:#e6c774;stroke-width:3.4;fill:none;stroke-linecap:round}.diagram .flow-blue{stroke:#7bd2e9;stroke-width:3.4;fill:none;stroke-linecap:round}.diagram .nodebox{fill:#0b2d22;stroke:#4b9471;stroke-width:1.5}.diagram .node-accent{fill:#124631;stroke:#54d897}.diagram text{font-family:Inter,ui-sans-serif,Arial,sans-serif}.diagram .node-title{fill:#e7fff0;font-size:13px;font-weight:800}.diagram .node-sub{fill:#8aa998;font-size:10px}.diagram .node-val{fill:#6df4ae;font-size:16px;font-weight:850}.diagram .particle{filter:drop-shadow(0 0 6px currentColor)}.diagram .solar-ray{transform-origin:center;animation:sunspin 30s linear infinite}.bottom-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:7px}.metric{border:1px solid rgba(137,200,160,.13);background:rgba(14,44,32,.66);border-radius:12px;padding:14px 13px;min-width:0}.metric .lbl{font-size:10px;line-height:1.3;color:#9bb5a4;min-height:26px}.metric .num{font-size:clamp(16px,2.2vw,23px);font-weight:820;letter-spacing:-.035em;margin:7px 0 3px;white-space:nowrap;font-variant-numeric:tabular-nums}.metric .foot{font-size:10px;color:#75a889}.chartpanel{border:1px solid rgba(120,181,145,.15);border-radius:13px;background:rgba(8,29,21,.71);padding:16px 15px 11px;margin-top:14px}.chartpanel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}.chartpanel h3{font-size:12px;letter-spacing:.01em;margin:0}.chartpanel .legend{font-size:10px;color:#94bd9f}.chart-wrap{height:150px}.chart-wrap svg{width:100%;height:100%}.chart-wrap rect.bar{transition:height .38s ease,y .38s ease;filter:drop-shadow(0 0 3px rgba(96,226,149,.1))}.chart-wrap text{fill:#87a391;font-size:10px}.chart-wrap line{stroke:#274739;stroke-width:1}.insight{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:17px;padding:22px 26px;margin:0 0 23px}.insight h3{font-size:18px;margin:7px 0 7px;letter-spacing:-.02em}.insight p{margin:0;color:#a6bbaf;font-size:12.5px;line-height:1.65}.cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#a3f4bd;color:#073222;border:0;border-radius:10px;padding:14px 20px;font-size:12.5px;font-weight:850;text-decoration:none;white-space:nowrap;transition:transform .15s,background .15s}.cta:hover{background:#c8ffd7;transform:translateY(-1px)}.notice{color:#718f7c;font-size:11px;line-height:1.55;padding-bottom:30px}.notice strong{color:#a6c4b3}.hidden{display:none!important}.small-visual-note{text-align:center;font-size:11px;color:#8fac9c;margin:4px 0 0}.flag{display:inline-flex;border-radius:30px;padding:3px 8px;font-size:10px;color:#99eac0;background:#163f2c}.footnav{display:flex;align-items:center;gap:15px;justify-content:space-between;padding:18px 0 30px;border-top:1px solid var(--edge);font-size:11px;color:#779587}.footnav a{text-decoration:none;color:#ade2bf}.battery-meta{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:7px 0 2px}.chip{font-size:10px;color:#b7d8c2;border:1px solid rgba(116,173,142,.25);border-radius:999px;padding:6px 10px;background:#0a261b}.chip b{color:#64e9a7}.battery-note{margin-top:14px!important}.line-divider{height:1px;background:rgba(123,190,149,.16);margin:5px 0 0}
    @keyframes pulse {50%{opacity:.65;box-shadow:0 0 0 7px rgba(64,221,146,.04)}}
    @keyframes sunspin{to{transform:rotate(360deg)}}
    @media(max-width:900px){.workspace{grid-template-columns:1fr}.sidebar{order:2}.visual{order:1;min-height:auto}.diagram-wrap{max-width:780px}.herohead{padding-top:37px}.sidebar{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.sidebar h2,.sidebar .desc,.sidebar .section-tag,.sidebar .disclaimer{grid-column:1/-1}.sidebar .control{border-top:1px solid var(--edge)}}
    @media(max-width:610px){.layout{width:min(100% - 26px,1200px)}.topbar{min-height:65px}.brand{font-size:17px}.brand-mark{width:28px}.toplink{font-size:10px;padding:8px 10px}.herohead{padding:28px 0 20px}.herohead h1{font-size:34px}.switch{width:100%;margin:20px 0 16px}.switch button{width:50%;padding:12px 7px;font-size:12px}.visual{padding:17px 12px 20px;border-radius:15px}.vis-head{padding:0 5px}.vis-head h2{font-size:17px}.diagram-wrap{margin-top:8px;min-height:205px}.bottom-grid{gap:6px}.metric{padding:11px 8px}.metric .lbl{font-size:9px;min-height:28px}.metric .num{font-size:clamp(13px,4vw,19px)}.metric .foot{font-size:9px}.chartpanel{padding:12px 7px 8px}.chart-wrap{height:123px}.sidebar{display:block;padding:19px 18px}.insight{grid-template-columns:1fr;padding:19px}.cta{width:100%}.flag{display:none}.battery-meta{gap:6px}.chip{font-size:9px}.diagram .node-title{font-size:12px}.diagram .node-sub{font-size:9px}.footnav{flex-wrap:wrap}}
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}html{scroll-behavior:auto}}

    /* NOXA ELECTRIC / versión 2.0: amarillo solar + verde eléctrico + negro */
    :root{--bg:#040a08;--bg2:#0b1510;--card:#081911;--edge:rgba(96,220,132,.25);--mint:#37f495;--lime:#a8ff55;--amber:#ffdc42;--cyan:#65c9ff;--text:#f4fff6;--muted:#a0b8a9;--shadow:0 20px 55px rgba(0,0,0,.47)}
    body{background:radial-gradient(ellipse 58% 33% at 70% 2%,rgba(108,148,24,.12),transparent 80%),radial-gradient(ellipse 45% 35% at 6% 30%,rgba(11,126,73,.11),transparent 80%),#040a08}
    header{background:rgba(2,12,7,.93);border-bottom-color:rgba(218,240,90,.17)}
    .brand-mark{color:#ffe14c;filter:drop-shadow(0 0 10px rgba(255,225,76,.35))}
    .herohead{position:relative}
    .eyebrow,.section-tag{color:#ffe052}
    .herohead h1 span{color:#66fba5;background:linear-gradient(90deg,#ffdf55 0%,#a4fa59 43%,#27eda1 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
    .herohead p{max-width:775px}
    .switch{flex-wrap:wrap;align-items:center}
    .switch button{background:#071711;color:#ccdece;border-color:#1f5138}
    .switch button[aria-selected=true]{background:linear-gradient(140deg,#296f34,#134824);border-color:#a9e74c;color:#f7ffdf;box-shadow:inset 0 0 0 1px rgba(255,219,83,.1),0 4px 30px rgba(106,219,58,.1)}
    .switch button:hover{border-color:#dbe45b}
    .sidebar,.visual,.insight{background:linear-gradient(150deg,rgba(10,29,17,.98),rgba(2,13,10,.99));border-color:rgba(113,239,105,.22)}
    .sidebar{background:linear-gradient(165deg,#0b251a,#050f0b)}
    .sidebar h2{color:#f2ffeb}
    .control{border-color:rgba(138,206,85,.18)}
    .ctrl-value{color:#ffe359;text-shadow:0 0 20px rgba(248,231,62,.08)}
    .range{height:7px;background:linear-gradient(90deg,#ffdc4c 0%,#b8f443 22%,#2bea81 70%,#174931 100%)}
    .range::-webkit-slider-thumb{width:20px;height:20px;border:3px solid #ffec93;background:#24ed86;box-shadow:0 0 0 4px rgba(233,218,50,.13),0 0 15px rgba(53,246,124,.3)}
    .range::-moz-range-thumb{background:#21ef87;border-color:#fff29b}
    .range:focus-visible{outline-color:#ffe465}
    .small-input{background:#030d09;border-color:#365a3c}
    .small-input:focus{border-color:#f6da50;box-shadow:0 0 0 3px rgba(236,205,72,.13)}
    .visual{background-color:#030b08;background-image:linear-gradient(rgba(77,217,95,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(77,217,95,.045) 1px,transparent 1px),radial-gradient(ellipse 57% 45% at 48% 15%,rgba(148,172,36,.11),transparent 79%);border-color:rgba(125,224,87,.3);background-size:28px 28px,28px 28px,auto;position:relative}
    .visual::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,#f5d948,#2af58e,transparent);opacity:.7;pointer-events:none}
    .visual::after{content:"";position:absolute;inset:-20% auto auto -28%;width:48%;height:160%;background:linear-gradient(90deg,transparent,rgba(148,248,69,.03),transparent);transform:skewX(-14deg);animation:ambientSweep 13s linear infinite;pointer-events:none}
    .vis-head{position:relative;z-index:1}
    .live{color:#baff84;background:rgba(16,46,22,.78);border-color:#427c39}
    .pulse{background:#e5f751;box-shadow:0 0 0 4px rgba(255,224,71,.12),0 0 10px rgba(235,241,53,.65)}
    .diagram .path-base{stroke:#24362a;stroke-width:6}
    .diagram .flow-green{stroke:#24f68b;stroke-width:4.1;stroke-dasharray:9 8;filter:drop-shadow(0 0 7px rgba(49,248,125,.53));animation:flowDash 1s linear infinite}
    .diagram .flow-yellow{stroke:#ffdf49;stroke-width:4.1;stroke-dasharray:9 8;filter:drop-shadow(0 0 8px rgba(255,218,61,.46));animation:flowDash 1s linear infinite}
    .diagram .flow-blue{stroke:#52bdff;stroke-width:4.1;stroke-dasharray:9 8;filter:drop-shadow(0 0 8px rgba(58,174,255,.45));animation:flowDash 1s linear infinite reverse}
    .diagram .nodebox{fill:#081a11;stroke:#589852;stroke-width:1.5}
    .diagram .node-val{fill:#ffe65a}
    .diagram .particle{filter:drop-shadow(0 0 8px currentColor)}
    .diagram .battery-level{animation:cellFlash 2.7s ease-in-out infinite}
    .battery-progress{transform-box:fill-box;transform-origin:left center;animation:chargeReveal .72s cubic-bezier(.18,.84,.22,1) both}
    .diagram .orbit{fill:none;stroke:#a4f649;stroke-width:1.4;stroke-dasharray:6 10;opacity:.5;transform-origin:center;animation:flowDash 5s linear infinite}
    .small-visual-note{color:#839d87}
    .metric{background:linear-gradient(140deg,rgba(15,48,27,.93),rgba(4,25,12,.92));border-color:rgba(153,235,76,.24);position:relative;overflow:hidden}
    .metric:first-child::before,.metric:nth-child(2)::before,.metric:nth-child(3)::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#ffe14d,#99ef54,transparent)}
    .metric:first-child .num{color:#ffdf50}.metric:nth-child(2) .num{color:#73fb9a}.metric:nth-child(3) .num{color:#d1fd82}
    .metric .foot{color:#9bc99e}
    .chartpanel{background:#060f0b;border-color:rgba(127,234,88,.27)}
    .chartpanel-head .legend{color:#f9d75e}
    .chart-wrap text{fill:#b2c3a2}
    .chart-wrap line{stroke:#294b2a}
    .chart-wrap rect.bar{cursor:pointer;transition:filter .2s,opacity .2s;transform-origin:center bottom;animation:barGrow .65s cubic-bezier(.2,.8,.15,1) backwards;filter:drop-shadow(0 0 5px rgba(180,236,73,.18))}
    .chart-wrap rect.bar:hover,.chart-wrap rect.bar.is-picked{filter:drop-shadow(0 0 11px rgba(255,221,64,.57));stroke:#ffef8a;stroke-width:1.5}
    .chart-wrap rect.bar:focus-visible{outline:none;stroke:#fff6a0;stroke-width:3}
    .insight{border-color:rgba(177,237,79,.3)}
    .cta{background:linear-gradient(120deg,#ffe15c,#9ef55e);color:#062109;box-shadow:0 6px 30px rgba(222,229,70,.13)}
    .cta:hover{background:linear-gradient(120deg,#fff086,#c8ff87);transform:translateY(-2px)}
    .chip{background:#07170d;border-color:#38653c}
    .chip b{color:#ffe167}
    .chip#b-mode{color:#ffe67e;border-color:#6d6633}
    .chart-readout{min-height:22px;color:#a8d8b3;font-size:11px;margin-top:8px;display:flex;align-items:center;gap:8px}
    .chart-readout strong{color:#ffe566}
    .dot-yellow,.dot-green,.dot-blue{display:inline-block;width:9px;height:9px;border-radius:50%;box-shadow:0 0 8px currentColor;vertical-align:middle;margin-right:5px}
    .dot-yellow{color:#ffe051;background:currentColor}.dot-green{color:#40f19b;background:currentColor}.dot-blue{color:#6dbdff;background:currentColor}
    .energy-legend{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:center;color:#aaccad;font-size:10px;margin:1px 0 12px}
    .preset-title{display:flex;align-items:center;justify-content:space-between;color:#9abda4;font-weight:800;font-size:10px;letter-spacing:.09em;text-transform:uppercase;gap:8px;margin:2px 0 10px}
    .presets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
    .preset{border:1px solid #2f623d;border-radius:8px;background:#06180e;color:#b8dbc0;padding:8px 11px;font-size:11px;font-weight:750;min-height:36px;transition:.2s}
    .preset:hover,.preset:focus-visible{border-color:#ffe24d;color:#ffed98;background:#1b2e12}
    .preset.is-active{border-color:#e5d74b;background:#263b12;color:#ffe767;box-shadow:inset 0 0 0 1px #7c8a28}
    .motion-button{margin-left:auto;background:#16220d!important;border-color:#829343!important;color:#ffdf66!important}
    .motion-button:hover{background:#2a3512!important}
    .status-note{font-size:11px;line-height:1.55;color:#accfae;padding:10px 12px;margin:0 0 10px;background:rgba(20,60,28,.58);border-left:3px solid #f6da4d;border-radius:0 8px 8px 0;max-width:100%}
    .status-note strong{color:#f5e27f}
    .visual .chartpanel,.visual .bottom-grid,.visual .diagram-wrap,.visual .battery-meta{position:relative;z-index:1}
    .battery-time{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap;margin-top:10px;color:#abcbb2;font-size:11px}
    .battery-time b{color:#ffe056}
    .energy-motion{animation:glowBreathe 3s ease-in-out infinite}
    body.is-paused *,body.is-paused *:before,body.is-paused *:after{animation-play-state:paused!important}
    @keyframes ambientSweep{0%{transform:translateX(-60%) skewX(-14deg)}100%{transform:translateX(470%) skewX(-14deg)}}
    @keyframes flowDash{to{stroke-dashoffset:-34}}
    @keyframes barGrow{from{transform:scaleY(.11);opacity:.35}to{transform:scaleY(1);opacity:1}}
    @keyframes cellFlash{50%{filter:drop-shadow(0 0 7px rgba(255,232,90,.7))}}
    @keyframes chargeReveal{from{transform:scaleX(.02)}to{transform:scaleX(1)}}
    @keyframes glowBreathe{50%{filter:drop-shadow(0 0 5px rgba(254,221,58,.36))}}
    @media(max-width:610px){.motion-button{width:100%!important;margin-left:0}.switch{gap:8px}.presets{margin-bottom:13px}.preset{padding:7px 9px}.energy-legend{gap:6px 10px;font-size:9px}.chart-readout{font-size:10px}}
    @media(prefers-reduced-motion:reduce){.chart-wrap rect.bar{animation:none!important}.visual::after{animation:none!important}}
  
/* Integration and accessibility corrections, isolated in this document. */
body{min-width:0}.layout{width:min(1200px,calc(100% - 32px));padding-top:1px}
.model-notice{color:#c1d2c5;font-size:12px;line-height:1.6;margin:20px 0 0;letter-spacing:.04em}
.switch{margin:18px 0 10px}.motion-controls{display:flex;justify-content:flex-end;margin:0 0 18px}
.motion-button{font:inherit;font-size:12px;padding:11px 15px;border:1px solid;border-radius:8px;min-height:44px}
.input-error{color:#ffe493;border:1px solid #b9a45d;padding:12px;border-radius:8px;font-size:13px;line-height:1.5}
[aria-disabled=true]{opacity:.55;cursor:not-allowed}.grid-control label{display:flex;align-items:center;gap:12px;font-size:13px;min-height:44px}.grid-control input{width:20px;height:20px;accent-color:#37f495}
.hint,.disclaimer,.notice,.minmax,.small-visual-note{color:#afc3b5}.input-label{color:#d0dfd5}.preset{min-height:44px}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ffe465;outline-offset:4px}
.range{height:30px;background:linear-gradient(90deg,#ffdc4c,#2bea81,#174931) center/100% 7px no-repeat}
.metric .num{white-space:normal;overflow-wrap:anywhere}.chart-readout{line-height:1.6;display:block;min-height:42px}.vis-head{flex-wrap:wrap}.diagram-wrap{min-height:0;margin:22px auto}.diagram .node-title{font-size:12px}.diagram .node-val{font-size:14px}
.visual::after{display:none}.visual{min-height:0}.status-note{margin-top:15px}.live{height:29px}
@media(max-width:900px){.sidebar{order:1}.visual{order:2}.sidebar .presets,.sidebar .preset-title,.sidebar .input-error{grid-column:1/-1}}
@media(max-width:610px){.layout{width:calc(100% - 24px)}.switch{flex-wrap:nowrap}.switch button{font-size:12px}.motion-controls .motion-button{width:auto!important}.visual{padding:18px 12px}.bottom-grid{grid-template-columns:1fr}.metric{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4px 8px}.metric .lbl{font-size:12px;min-height:0}.metric .num{font-size:22px;margin:0;text-align:right}.metric .foot{grid-column:1/-1;font-size:11px}.chart-wrap{height:180px;overflow-x:auto}.chart-wrap>svg{min-width:520px}.chartpanel-head{flex-wrap:wrap;gap:8px}.battery-meta{justify-content:flex-start}.chip{font-size:11px}.energy-legend{font-size:11px}.notice,.disclaimer,.hint{font-size:12px}.chart-readout{font-size:12px}.sidebar .desc{font-size:14px}.diagram .node-title{font-size:12px}.chartpanel .legend{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.motion-button{transition:none!important}}

.workspace{align-items:start}
/* Pausing decorative motion must never hide the quantitative state of a chart. */
body.is-paused .bar,body.is-paused .battery-progress{animation:none!important;transform:none!important;opacity:1!important}

.chart-mobile-hint{display:none}@media(max-width:610px){#battery-chart{overflow:hidden;height:145px}#battery-chart svg{min-width:0}.chart-wrap{overflow-y:hidden}.chart-mobile-hint{display:block;font-size:12px;color:#afc3b5;line-height:1.5}}

/* Project-specific ranges and precise keyboard entry. */
.segment-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:12px}
.segment-presets .preset{padding:12px 4px;font-size:13px;line-height:1.4;min-height:66px}
.segment-presets small{display:block;font-size:10px;font-weight:500;margin-top:4px;letter-spacing:0}
.segment-info{grid-column:1/-1;margin-bottom:18px;padding:12px 14px;border:1px solid #36543d;border-radius:10px;background:#091a10;color:#bed1c2;font-size:12px;line-height:1.55}
.segment-info strong{color:#ffe467;font-size:13px}.segment-info p{margin:6px 0 0}#solar-segment-status:empty{display:none}#solar-segment-status{color:#ffe493}
.quantity-input{margin:0 0 7px;min-height:44px;font-variant-numeric:tabular-nums}
@media(min-width:611px){.metric .num{font-size:clamp(16px,1.8vw,22px)}}
@media(max-width:610px){.segment-presets small{font-size:10px}.ctrl-top{flex-wrap:wrap}.metric .num{overflow-wrap:normal}.metric{grid-template-columns:1fr auto}}