:root{--ink:#112a3a;--blue:#009fe3;--action:#006ca8;--mist:#f1f5f7;--slate:#526575;--line:#ccd8df}*{box-sizing:border-box}body{margin:0;background:var(--mist);color:var(--ink);font-family:Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.app{max-width:520px;margin:0 auto;min-height:100svh;background:#fff}header{background:var(--ink);padding:calc(22px + env(safe-area-inset-top)) 26px 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:4px solid var(--blue);min-height:116px}header img{width:174px;height:82px;object-fit:contain} .badge{font:11px 'Courier New',monospace;color:#fff;border:1px solid #506777;border-radius:5px;padding:8px 9px;letter-spacing:1px}main{padding:30px 24px calc(22px + env(safe-area-inset-bottom))}.eyebrow{font:11px 'Courier New',monospace;letter-spacing:1.6px;color:var(--slate)}h1{font-size:36px;line-height:1.1;letter-spacing:-1.4px;margin:12px 0 10px}.intro{color:var(--slate);font-size:16px;margin:0 0 27px}.tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--mist);border-radius:12px;padding:5px;gap:5px;margin-bottom:28px}.tabs button{border:0;background:transparent;border-radius:8px;padding:15px 4px;font-weight:bold;font-size:16px;color:var(--slate)}.tabs button[aria-selected=true]{background:var(--ink);color:#fff;box-shadow:0 2px 5px #112a3a18}.tabs span{margin:0 6px;color:var(--blue)}.field-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:15px}.field-head label{font-weight:bold}.field-head>span{color:var(--slate);font-size:12px}.voltages{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:26px}.voltages button{min-height:76px;border:1px solid var(--line);border-radius:10px;background:white;color:var(--ink);font-size:21px;font-weight:bold}.voltages small{display:block;margin-top:5px;font-size:12px;font-weight:normal}.voltages button[aria-pressed=true]{border:2px solid var(--action);background:#e9f6fd;color:var(--action)}.clear{background:none;border:0;color:var(--action);font-size:13px;min-height:32px;padding:4px 0 4px 14px}.input-wrap{border:1px solid var(--line);background:var(--mist);border-radius:12px;display:flex;align-items:center;padding:17px 20px;gap:10px}.input-wrap:focus-within{border-color:var(--action);box-shadow:0 0 0 3px #009fe31c}input{width:100%;min-width:0;outline:none;border:0;background:transparent;color:var(--ink);font-size:34px;font-weight:bold;font-variant-numeric:tabular-nums;padding:0}input::placeholder{color:#96a8b4}.input-wrap>span{font-size:18px;color:var(--slate)}.error{min-height:20px;color:#ad3147;font-size:13px;margin:8px 0 12px}.result{padding:23px 22px;background:var(--ink);color:white;border-radius:14px;position:relative;overflow:hidden;border-top:4px solid var(--blue)}.result-top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#bdd0db;font:10px 'Courier New',monospace;letter-spacing:1px}.phase{letter-spacing:0;white-space:nowrap;color:#85d4f6}.result-number{display:flex;align-items:baseline;gap:10px;margin:18px 0 14px;flex-wrap:wrap}.result-number output{font-size:46px;line-height:1.05;letter-spacing:-1.5px;font-weight:bold;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;max-width:100%}.result-number>span{font-size:22px;color:#85d4f6}.result p{font-size:13px;color:#bdd0db;margin:0;line-height:1.5;overflow-wrap:anywhere}.formula{padding:20px 0 23px;border-bottom:1px solid var(--line)}.formula>span{font:10px 'Courier New',monospace;letter-spacing:1px;color:var(--slate)}.formula p{font:14px 'Courier New',monospace;margin:9px 0 0}details{padding:18px 0;font-size:13px;color:var(--slate)}summary{cursor:pointer;min-height:24px;color:var(--action)}details p{line-height:1.7;margin-bottom:0}footer{font-size:11px;color:var(--slate);text-align:center;margin-top:8px}@media(min-width:600px){.app{margin:28px auto;border-radius:20px;overflow:hidden;min-height:0;box-shadow:0 12px 60px #112a3a12}main{padding:34px}header{padding:20px 34px}}@media(max-width:360px){main{padding-left:18px;padding-right:18px}h1{font-size:32px}.result-number output{font-size:39px}}

[hidden]{display:none!important}.tabs{grid-template-columns:1fr 1fr 1fr}.tabs button{font-size:13px}.tabs span{margin:0 2px}.voltages{grid-template-columns:repeat(3,1fr)}#postcode-form>label{font-size:15px;font-weight:bold}.postcode-input{display:flex;gap:8px;margin-top:12px}.postcode-input input{font-size:21px;border:1px solid var(--line);border-radius:10px;padding:16px 12px;text-transform:uppercase;background:var(--mist)}.postcode-input button{flex-shrink:0;background:var(--action);border:0;border-radius:10px;color:white;font-weight:bold;padding:0 14px}.postcode-input button:disabled{opacity:.6}.postcode-input input:focus{outline:2px solid var(--action)}.lookup-status,.lookup-note{font-size:13px;line-height:1.6;color:var(--slate)}.lookup-status{min-height:42px;margin:14px 0}.lookup-note{margin:22px 0}#dno-name{font-size:28px;letter-spacing:-.5px;line-height:1.15;margin:18px 0 14px}#dno-postcode{margin-top:12px;color:#85d4f6}a{color:var(--action)}
/* Compact brand header and proper tool tabs. */
header{min-height:0;height:calc(64px + env(safe-area-inset-top));padding:calc(10px + env(safe-area-inset-top)) 20px 10px;border-bottom:0;gap:18px}header img{width:88px;height:38px;object-fit:contain}header>span{color:#c2d1d9;font-size:12px}.tabs{position:sticky;top:0;z-index:5;margin:0;padding:0 8px;gap:0;display:grid;grid-template-columns:repeat(4,1fr);background:white;border-radius:0;border-bottom:1px solid var(--line)}.tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:70px;padding:11px 3px 9px;border-radius:0;border-bottom:3px solid transparent;font-size:11px;color:var(--slate);font-weight:bold;white-space:nowrap}.tabs button[aria-selected=true]{background:#eff8fd;box-shadow:none;border-bottom-color:var(--blue);color:var(--action)}.tabs svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tabs span{color:inherit;margin:0}main{padding-top:21px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:22px}.page-heading h1{font-size:25px;letter-spacing:-.7px;margin:0}.page-heading>span{font-size:11px;color:var(--slate);white-space:nowrap}.voltages{gap:8px;margin-bottom:20px}.voltages button{min-height:63px;font-size:19px}.input-wrap{padding:15px 18px}.result{padding:20px}.result-number{margin-top:16px}.formula{padding:17px 0}.grid-live-card{padding:20px;background:var(--ink);color:white;border-radius:12px;border-top:3px solid var(--blue)}.grid-label{display:flex;align-items:center;justify-content:space-between;font:10px 'Courier New',monospace;letter-spacing:1px;color:#bfd4e0}.grid-label button{border:0;background:#294250;color:white;border-radius:6px;font-size:23px;width:34px;height:32px;line-height:1}.grid-reading{display:flex;align-items:baseline;gap:10px;margin:9px 0}.grid-reading output{font-size:43px;font-weight:bold;letter-spacing:-1px;font-variant-numeric:tabular-nums}.grid-reading>span{font-size:20px;color:#85d4f6}#grid-freshness{font-size:12px;line-height:1.6;margin:0;color:#bfd4e0}.chart-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:26px 0 13px}.chart-heading h2{font-size:17px;margin:0}.chart-heading>span{font-size:10px;color:var(--slate)}.range-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.range-tabs button{border:1px solid var(--line);border-radius:6px;min-height:35px;background:white;color:var(--slate);font-size:12px;padding:7px 5px}.range-tabs button[aria-pressed=true]{border-color:var(--action);color:white;background:var(--action)}.chart-status{font-size:11px;line-height:1.6;color:var(--slate);min-height:18px;margin:11px 0}.demand-chart{width:100%;min-height:190px}.demand-chart svg{width:100%;height:auto;display:block;touch-action:pan-y}.chart-inspector label{font-size:11px;line-height:1.6;color:var(--slate);display:block;text-align:center;min-height:18px}.chart-inspector input{width:100%;height:28px;accent-color:var(--action);margin:4px 0 0}.chart-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:13px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:8px}.chart-stats>div{text-align:center}.chart-stats span{display:block;font-size:10px;color:var(--slate);margin-bottom:5px}.chart-stats strong{font-size:15px;font-variant-numeric:tabular-nums}.mix-layout{display:flex;align-items:center;gap:22px}.generation-pie{width:134px;height:134px;border-radius:50%;flex-shrink:0;background:var(--mist)}.mix-legend{list-style:none;margin:0;padding:0;flex:1;min-width:0}.mix-legend li{font-size:11px;display:flex;align-items:center;gap:6px;margin:9px 0;line-height:1.4}.mix-legend .swatch{width:8px;height:8px;border-radius:2px;flex-shrink:0}.mix-legend .mix-value{margin-left:auto;text-align:right;white-space:nowrap}.mix-legend small{display:block;color:var(--slate);font-size:9px}.grid-sources{margin-top:20px;border-top:1px solid var(--line)}#grid-error{color:#ad3147}@media(min-width:600px){header{padding-left:25px;padding-right:25px}main{padding-top:24px}}@media(max-width:360px){.tabs button{font-size:10px}.mix-layout{gap:14px}.generation-pie{width:110px;height:110px}}
/* EV Connection Planner palette and card styling. */
:root{--ink:#18354e;--blue:#009fe3;--action:#287ba7;--mist:#f5f7f9;--slate:#667e92;--line:#dfe7ed;--navy:#235e85}body{background:var(--mist);font-family:"Segoe UI",Arial,sans-serif}.app{background:var(--mist)}header{background:linear-gradient(108deg,#358dc2,#76b8df);box-shadow:0 2px 7px #17384c12}header img{filter:brightness(0) invert(1)}header>span{color:white;font-weight:600}main{padding:22px 18px calc(18px + env(safe-area-inset-bottom))}.tabs{background:#fff}.tabs button[aria-selected=true]{background:#f0f8fc;color:var(--navy)}.page-heading{margin:0 3px 18px}.page-heading h1{color:var(--navy);font-weight:600;font-size:24px}.page-heading>span{color:var(--slate)}#converter,#dno-panel,#grid-panel{padding:20px;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 2px 6px #18354e03}.result,.grid-live-card{background:linear-gradient(110deg,#fff 45%,#eef7fc);color:var(--navy);border:1px solid #c9dce8;border-radius:10px}.result-top,.grid-label{color:#5a7c91}.phase{color:var(--action)}.result-number>span,.grid-reading>span{color:var(--slate)}.result p,#grid-freshness{color:var(--slate)}.result-number output,.grid-reading output{font-weight:500;color:var(--navy)}.grid-label button{background:#e6f2f9;color:var(--navy)}#dno-postcode{color:var(--action)}.input-wrap{background:#f8fafb;border-radius:7px}.input-wrap input{font-weight:500}.voltages button{background:#fff;border-radius:7px;color:var(--navy);font-weight:600}.voltages button[aria-pressed=true]{background:#eaf4fa;border-color:var(--action);color:var(--navy)}.power-unit-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--slate);margin:0 0 21px;padding-bottom:17px;border-bottom:1px solid var(--line)}.unit-toggle{display:flex;padding:3px;border:1px solid var(--line);border-radius:6px;gap:3px}.unit-toggle button{min-width:56px;min-height:34px;border:0;background:none;color:var(--slate);border-radius:4px;font-size:13px;font-weight:600}.unit-toggle button[aria-pressed=true]{background:#eaf4fa;color:var(--navy)}.range-tabs button[aria-pressed=true]{background:#eaf4fa;color:var(--navy);border-color:#a8cada}.chart-heading h2{font-weight:600;color:var(--navy)}.chart-stats strong{color:var(--navy);font-weight:500}footer{margin-top:10px}@media(min-width:600px){main{padding:25px}.app{max-width:560px}}@media(max-width:380px){#converter,#dno-panel,#grid-panel{padding:16px}main{padding-left:12px;padding-right:12px}.mix-layout{gap:12px}.generation-pie{width:112px;height:112px}.chart-heading{flex-wrap:wrap}}

.range-tabs [data-range="20y"]{grid-column:1/-1}
.grid-live-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grid-live-row .grid-live-card{padding:14px 12px}.grid-live-row .grid-label{font-size:9px;letter-spacing:.3px;line-height:1.5;min-height:32px;gap:3px}.grid-live-row .grid-label button{width:26px;height:28px;flex-shrink:0;font-size:20px}.grid-live-row .grid-reading{gap:5px;flex-wrap:wrap;margin:9px 0}.grid-live-row .grid-reading output{font-size:30px;letter-spacing:-.8px}.grid-live-row .grid-reading>span{font-size:14px}.frequency-card #frequency-freshness,.grid-live-row #grid-freshness{font-size:10px;line-height:1.5}.frequency-panel{padding-bottom:19px;border-bottom:1px solid var(--line)}.frequency-panel .chart-heading{margin:22px 0 10px}.frequency-status{font-size:11px;line-height:1.5;margin:0 0 10px;color:var(--slate)}.frequency-status.normal{color:#2b6e6b}.frequency-status.wide{color:#835600}.frequency-status.outside{color:#ad3147}.frequency-status.stale{color:var(--slate)}.frequency-chart{min-height:165px}.frequency-chart svg{display:block;width:100%;height:auto}.frequency-bands{display:flex;flex-wrap:wrap;gap:8px 15px;margin-top:10px;font-size:10px;color:var(--slate)}.frequency-bands>span{display:flex;align-items:center;gap:5px}.frequency-bands i{display:inline-block;width:9px;height:9px;border-radius:2px;border:1px solid #cad8d3;flex-shrink:0}.normal-band{background:#e7f3ee}.wide-band{background:#fff3df}.frequency-bands strong{font-weight:500;color:var(--ink)}.frequency-caption{font-size:10px;color:var(--slate);line-height:1.6;margin:11px 0 0}@media(max-width:380px){.grid-live-row .grid-reading output{font-size:26px}.grid-live-row .grid-live-card{padding:12px 10px}.grid-live-row .grid-reading>span{font-size:12px}}
.frequency-section{margin-top:24px;padding-top:2px;border-top:1px solid var(--line)}.frequency-section .chart-heading{margin:20px 0 15px}.frequency-section .frequency-card{margin-bottom:16px}.frequency-section .frequency-card #frequency-freshness{font-size:12px;line-height:1.6;color:var(--slate);margin:0}.frequency-ranges{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 13px}.frequency-ranges button{min-height:35px;padding:7px 4px;border:1px solid var(--line);border-radius:6px;background:white;color:var(--slate);font-size:11px}.frequency-ranges button[aria-pressed=true]{background:#eaf4fa;color:var(--navy);border-color:#a8cada}.frequency-caption{margin-bottom:0}
.tabs{grid-template-columns:repeat(5,minmax(0,1fr));padding:0 4px}.tabs button{font-size:10px}.tabs svg{width:20px;height:20px}#wind-panel{padding:18px;background:white;border:1px solid var(--line);border-radius:12px}.wind-summary{display:flex;align-items:center;justify-content:space-between;padding:15px;background:linear-gradient(110deg,#fff 45%,#eef7fc);border:1px solid #c9dce8;border-radius:10px}.wind-summary span{display:block;font:9px 'Courier New',monospace;letter-spacing:.7px;color:var(--slate)}.wind-summary strong{display:block;font-size:29px;line-height:1.3;font-weight:500;color:var(--navy);margin-top:6px}.wind-summary button{border:0;background:#e6f2f9;color:var(--navy);border-radius:6px;font-size:23px;width:34px;height:34px}.wind-notice{font-size:11px;color:var(--slate);line-height:1.7;margin:14px 0 8px}.wind-search{font:14px "Segoe UI",Arial,sans-serif;border:1px solid var(--line);border-radius:7px;background:#f8fafb;padding:12px;width:100%;margin:5px 0 10px;outline:none}.wind-search:focus{outline:2px solid var(--action)}.wind-map-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;color:var(--slate);margin:0 0 8px}.wind-map-tools>div{display:flex;gap:4px}.wind-map-tools button{background:white;border:1px solid var(--line);border-radius:5px;color:var(--navy);min-width:32px;min-height:32px;font-size:14px}.wind-map{height:500px;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#edf5fa;touch-action:none}.wind-map svg{width:100%;height:100%;display:block;user-select:none}.wind-map [data-farm-id]{cursor:pointer}.wind-map [data-farm-id]:focus{outline:none;stroke:#112a3a;stroke-width:5}.wind-key{display:flex;flex-direction:column;gap:8px;font-size:10px;color:var(--slate);margin:13px 0 16px}.wind-key span{display:flex;align-items:center;gap:6px}.wind-key i{width:9px;height:9px;border-radius:50%;display:block;flex-shrink:0}.wind-reported{background:#009fe36b;border:1px solid var(--blue)}.wind-unavailable{border:1px solid #95a9b6}.wind-detail{padding:15px;background:#f4f8fb;border:1px solid var(--line);border-radius:8px;margin-bottom:15px}.wind-detail h2{font-size:17px;color:var(--navy);margin:0 0 8px}.wind-detail>strong{font-size:23px;color:var(--action);font-weight:500}.wind-detail p{font-size:11px;line-height:1.7;color:var(--slate);margin:8px 0 0}.wind-results>p{font-size:10px;color:var(--slate)}.wind-results button{display:block;min-height:40px;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:white;color:var(--navy);font-size:12px;padding:10px 0}#wind-panel details{line-height:1.6}@media(max-width:360px){.tabs button{font-size:9px}#wind-panel{padding:14px}.wind-map{height:440px}}
