:root{
  --navy:#0a4770; --navy2:#08395d; --blue:#067cc5; --blue2:#1397da;
  --teal:#0c6d7b; --cyan:#eaf7fc; --bg:#eef3f6; --card:#fff; --ink:#17324a;
  --muted:#66788a; --line:#cfdae3; --soft:#f6fafc; --green:#159452; --green2:#0d7b43;
  --amber:#e7a000; --orange:#ef6c00; --red:#d9342b; --shadow:0 2px 10px rgba(31,67,91,.10);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Inter,Arial,sans-serif;line-height:1.18}
body{font-size:11px}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Header */
.topbar{height:62px;display:flex;justify-content:space-between;align-items:center;padding:7px 16px;background:linear-gradient(120deg,var(--navy2),var(--navy));color:#fff;box-shadow:0 2px 8px rgba(0,40,70,.22)}
.brand-row{display:flex;align-items:center;gap:10px;min-width:0}.brand-icon{width:39px;height:39px;color:#fff;flex:0 0 auto}.eyebrow{font-size:7.5px;letter-spacing:.16em;font-weight:800;color:#bfe9f7}.topbar h1{font-size:20px;line-height:1;margin:1px 0 2px;letter-spacing:-.01em}.topbar p{font-size:9.5px;margin:0;color:#d9edf6;white-space:nowrap}.badge{font-size:9px;font-weight:800;padding:5px 10px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(255,255,255,.05);white-space:nowrap}

/* Overall three-column desktop */
.layout{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(350px,.82fr);gap:7px;padding:7px 8px 5px;max-width:1920px;margin:0 auto;align-items:start}
.inputs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;min-width:0;align-items:start}.input-column{display:flex;flex-direction:column;gap:7px;min-width:0}.results{display:grid;gap:5px;min-width:0;align-self:start}
.panel{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:7px 8px;box-shadow:var(--shadow);min-width:0}.panel-title{display:flex;align-items:center;gap:5px;margin-bottom:5px}.panel-title>span{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#cceffc;color:var(--navy);font-weight:900;font-size:11px;flex:0 0 auto}.section-icon{width:20px;height:20px;color:var(--navy);flex:0 0 auto}.panel-title h2{font-size:13px;margin:0;color:#102f4a;line-height:1}

/* Fields */
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:5px 9px}.field.full,.full{grid-column:1/-1}.field{min-width:0}.field label,.mini label{display:flex;align-items:center;gap:4px;font-weight:700;color:#183954}.field label{font-size:9.8px;margin:0 0 2px}.label-icon{width:13px;height:13px;color:#0b6193;flex:0 0 auto}.unit{font-size:8.4px;color:#7a8998;font-weight:500;margin-left:1px}.field small,.hint{display:block;color:#748393;font-size:7.8px;line-height:1.12;margin-top:2px}.hint{margin:0 0 4px}.range-row{display:grid;grid-template-columns:minmax(0,1fr) 54px;gap:5px;align-items:center;min-height:23px}input[type=range]{width:100%;height:14px;accent-color:var(--blue)}input[type=number],select{width:100%;min-height:25px;padding:3px 6px;border:1px solid #c7d5df;border-radius:6px;background:#fff;color:#1b3448;font:inherit;font-size:10px}input[type=number]:focus,select:focus{outline:2px solid rgba(6,124,197,.14);border-color:#2b96ca}.compact-working .range-row{grid-template-columns:minmax(0,1fr) 54px}

/* Group cards */
.group-list{display:grid;gap:4px;margin:4px 0}.group-card{border:1px solid #cfdae3;background:#f8fbfd;border-radius:7px;padding:5px}.group-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px}.group-head strong{display:flex;align-items:center;gap:4px;font-size:9px;color:#173a54}.group-head .group-icon{width:13px;height:13px;color:#0875ad}.remove{border:0;background:transparent;color:var(--red);font-size:8px;font-weight:800;cursor:pointer}.group-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.group-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.mini{min-width:0}.mini label{font-size:7.6px;color:#62798b;line-height:1.04;margin-bottom:1px}.mini .mini-icon{width:11px;height:11px;color:#0b6d9f}.mini .range-row{grid-template-columns:minmax(0,1fr) 44px;gap:3px}.mini input[type=number]{font-size:9px;min-height:21px;padding:2px 4px}.secondary{display:inline-flex;align-items:center;gap:3px;border:1px solid #b8cbd8;border-radius:6px;background:#fff;color:#164b6d;font-size:8.2px;font-weight:800;padding:3px 6px;cursor:pointer}.button-icon{width:10px;height:10px}.secondary:hover{background:#edf8fd}.note{font-size:8px;padding:5px 6px;border-radius:6px;background:#eaf6f8;color:#2d5f68}.hidden{display:none!important}

/* Status */
.status-card{min-height:65px;display:grid;grid-template-columns:34px 1fr;gap:8px;align-items:center;border-radius:10px;padding:7px 10px;color:#fff;box-shadow:var(--shadow)}.status-card.feasible{background:linear-gradient(120deg,#168b50,#0f7d48)}.status-card.zero{background:linear-gradient(120deg,#c07a00,#a86600)}.status-card.not-feasible{background:linear-gradient(120deg,#d13b30,#a71e18)}.status-card.invalid{background:linear-gradient(120deg,#596473,#343e4c)}.status-icon-wrap{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center}.status-icon{width:22px;height:22px}.status-kicker{font-size:7.8px;letter-spacing:.10em;font-weight:900;opacity:.88}.status-title{font-size:20px;font-weight:950;line-height:1;margin:1px 0 2px}.status-reason{font-size:8.7px;line-height:1.12;color:rgba(255,255,255,.95)}

/* KPI */
.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.metric{display:grid;grid-template-columns:24px 1fr;gap:5px;align-items:center;background:#fff;border:1px solid #cfdae3;border-radius:8px;padding:4px 5px;min-height:47px;box-shadow:0 1px 5px rgba(30,65,90,.07);min-width:0}.metric-wide{grid-column:span 1}.metric-icon{width:22px;height:22px;color:#0785c9}.metric>div{min-width:0}.metric span{display:block;color:#597086;font-size:7.6px;font-weight:700;line-height:1.06;margin-bottom:1px}.metric strong{font-size:14px;line-height:1;color:#132f48;font-weight:900;margin-right:2px}.metric em{font-size:7.8px;color:#667c8f;font-style:normal}.metric-layers{background:#eefaf6;border-color:#8dcdb3}.metric-layers .metric-icon,.metric-layers strong{color:#13965a}.metric-layers strong{font-size:17px}

/* Result panels */
.result-panel{padding:6px 7px}.result-panel h3{display:flex;align-items:center;gap:5px;margin:0 0 4px;font-size:11.5px;color:#15344e}.result-panel h3 small{font-size:7.5px;color:#718294;font-weight:600}.title-icon{width:17px;height:17px;color:#0a78ae}.warning-icon{color:var(--red)}.resource-chain{display:grid;gap:3px}.resource-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:5px;align-items:center;min-height:25px;padding:3px 6px;border:1px solid #dbe3e9;border-radius:6px;background:#f7fafc}.resource-name{font-size:8.7px;font-weight:800;color:#183952;display:flex;align-items:center;gap:4px}.resource-icon{width:13px;height:13px;color:#0b76ad}.resource-value{font-size:9.3px;font-weight:900}.pill{font-size:6.8px;font-weight:900;padding:2px 5px;border-radius:999px;background:#e5f4eb;color:#187047}.resource-row.critical{border:1.5px solid #ef7a27;background:#fff6ee;box-shadow:inset 3px 0 0 #ef6c00}.resource-row.critical .resource-name,.resource-row.critical .resource-value{color:#ac4a00}.pill.critical{background:#ef6c00;color:#fff}
.optimisation{display:grid;gap:3px}.opt-card{border:1px solid #d6e1e8;border-radius:7px;background:#f8fbfd;padding:4px 6px}.opt-card strong{display:flex;align-items:center;gap:4px;font-size:8.6px;color:#173b54;margin-bottom:1px}.opt-card p{font-size:7.6px;line-height:1.12;margin:0;color:#657a8d}.opt-card.opt-critical{border-color:#df8079;background:#fff3f1}.message{position:relative;margin-top:3px;padding:4px 5px 4px 22px;border-radius:6px;font-size:7.7px;line-height:1.14}.message::before{position:absolute;left:6px;top:4px;font-weight:900}.message.warn{background:#fff7df;color:#765210;border-left:3px solid var(--amber)}.message.warn::before{content:"!"}.message.info{background:#eef7fa;color:#365f6d;border-left:3px solid #3d92ad}.message.info::before{content:"i"}.message.error{background:#fff0ee;color:#9a261e;border-left:4px solid var(--red)}.message.error::before{content:"!"}

/* Visual-priority system */
.field,.mini,.panel,.metric,.group-card{transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.attention-controlling{border-color:#ef6c00!important;box-shadow:0 0 0 2px rgba(239,108,0,.12)!important;background:#fff9f3!important}.panel.attention-controlling>.panel-title h2::after{content:"CONTROLLING";margin-left:6px;padding:1px 5px;border-radius:999px;background:#ef6c00;color:#fff;font-size:6.3px;letter-spacing:.04em}.group-card.attention-controlling .group-head strong::after{content:" BOTTLENECK";color:#b24b00;font-size:6.4px;font-weight:900}.metric.attention-controlling{border-color:#ef6c00!important;background:#fff8ef!important}.metric.attention-controlling strong{color:#a74a00}.attention-warn{border-color:#e2a20c!important;box-shadow:0 0 0 2px rgba(226,162,12,.12)!important;background:#fffaf0!important}.field.attention-warn>label::after,.mini.attention-warn>label::after{content:" ATTENTION";color:#8b5b00;font-size:6.2px;font-weight:900}.panel.attention-warn>.panel-title h2::after{content:"ATTENTION";margin-left:6px;padding:1px 5px;border-radius:999px;background:#d28e00;color:#fff;font-size:6.3px}.metric.attention-warn{border-color:#e2a20c!important;background:#fff9e8!important}.metric.attention-warn strong{color:#8b5b00}.attention-limit{border:1.5px solid #e2a20c!important;border-radius:7px;padding:2px;background:#fffdf5!important}.field.attention-limit>label::after,.mini.attention-limit>label::after{content:" AT LIMIT";margin-left:3px;padding:1px 3px;border-radius:999px;background:#ffebaf;color:#775100;font-size:6px;font-weight:900}.rule-active{color:#795100!important;background:#fff0c4;border-left:3px solid #d79a08;border-radius:3px;padding:2px 4px!important;font-weight:800}.attention-bad{border-color:#d9342b!important;box-shadow:0 0 0 2px rgba(217,52,43,.15)!important;background:#fff3f1!important}.field.attention-bad>label::after,.mini.attention-bad>label::after{content:" CRITICAL";margin-left:3px;padding:1px 3px;border-radius:999px;background:#d9342b;color:#fff;font-size:6px;font-weight:900}.panel.attention-bad>.panel-title h2::after{content:"CRITICAL";margin-left:6px;padding:1px 5px;border-radius:999px;background:#d9342b;color:#fff;font-size:6.3px}.metric.attention-bad{border:2px solid #d9342b!important;background:#fff0ee!important}.metric.attention-bad strong{color:#ae2019}.group-card.attention-bad{border:2px solid #d9342b!important;background:#fff3f1!important}.group-card.attention-bad .group-head strong::after{content:" CRITICAL";color:#b42318;font-size:6.4px;font-weight:900}.opt-card.opt-critical{border:1.5px solid #d9342b;background:#fff4f2}.message.error.attention-message{font-weight:800}

/* Footer */
footer{height:26px;padding:4px 12px;max-width:1920px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f8fbfc;border-top:1px solid #d2dee6;font-size:7.5px;color:#62788b}.footer-safe{display:flex;align-items:center;gap:5px;color:#315b72}.footer-icon{width:14px;height:14px;color:#0b6d9f}.priority-legend{white-space:nowrap}.priority-legend b:first-child{color:#c62921}.priority-legend b:nth-of-type(2){color:#a56f00}.priority-legend b:nth-of-type(3){color:#d65b00}.priority-legend .green-key{color:#15864d}

/* One-screen desktop: default group set visible at 100% zoom. */
@media (min-width:1200px) and (min-height:700px){
  html,body{height:100%;overflow:hidden}
  .layout{height:calc(100vh - 88px);overflow:hidden}
  .inputs,.input-column,.results{max-height:100%;overflow:hidden}
  .group-list{max-height:114px;overflow-y:auto;scrollbar-width:thin}
  #messages{max-height:122px;overflow-y:auto;scrollbar-width:thin}
  .optimisation{max-height:88px;overflow-y:auto;scrollbar-width:thin}
}

@media (max-width:1199px){.layout{grid-template-columns:1fr}.results{position:static}.inputs{grid-template-columns:1fr 1fr}footer{height:auto;flex-wrap:wrap}}
@media (max-width:760px){.topbar{height:auto;padding:8px 10px;align-items:flex-start}.brand-icon{width:30px;height:30px}.topbar h1{font-size:17px}.topbar p{white-space:normal}.layout{padding:6px}.inputs{grid-template-columns:1fr}.grid.two,.group-grid,.group-grid.three,.metric-grid{grid-template-columns:1fr}.metric-wide{grid-column:auto}.priority-legend{white-space:normal}}

/* v1.9 balanced desktop utilisation */
footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
.footer-center{justify-self:center;font-size:9px;font-weight:900;letter-spacing:.035em;color:#244d67;white-space:nowrap}
.priority-legend{justify-self:end}

@media (min-width:1200px) and (min-height:700px){
  .layout{grid-template-columns:minmax(0,2.25fr) minmax(355px,.84fr)}
  .inputs{height:100%;align-items:stretch}
  .input-column{height:100%;display:grid;gap:7px}
  .input-left{grid-template-rows:minmax(0,1.58fr) minmax(0,.82fr)}
  .input-middle{grid-template-rows:minmax(0,1.28fr) minmax(0,.88fr) minmax(0,.66fr)}
  .input-column>.panel{height:100%;display:flex;flex-direction:column;min-height:0}
  .input-column>.panel>.grid{flex:1;align-content:space-between}
  .input-column>.panel>.group-list{flex:1;align-content:start}
  .results{height:100%;grid-template-rows:auto auto minmax(0,1.04fr) minmax(0,.82fr) minmax(0,1fr);align-content:stretch}
  .results>.panel{min-height:0;overflow:hidden}
  .results .resource-chain,.results .optimisation,#messages{align-content:start}
}

@media (min-width:1200px) and (min-height:820px){
  body{font-size:11.8px}
  .topbar{height:66px;padding:8px 17px}
  .brand-icon{width:41px;height:41px}.topbar h1{font-size:21px}.topbar p{font-size:10px}.badge{font-size:9.5px}
  .layout{height:calc(100vh - 98px);gap:8px;padding:8px 9px 6px}
  .inputs,.input-column{gap:8px}.panel{padding:8px 9px;border-radius:10px}.panel-title{margin-bottom:6px}.panel-title h2{font-size:13.8px}
  .grid.two{gap:7px 10px}.field label{font-size:10.3px}.field small,.hint{font-size:8.2px}.range-row{min-height:25px}
  input[type=number],select{min-height:27px;font-size:10.5px}.group-card{padding:6px}.group-head strong{font-size:9.5px}.mini label{font-size:8px}.mini input[type=number]{min-height:22px;font-size:9.4px}
  .status-card{min-height:72px;padding:8px 11px}.status-title{font-size:22px}.status-reason{font-size:9.2px}
  .metric{min-height:52px;padding:5px 6px}.metric span{font-size:8px}.metric strong{font-size:15px}.metric-layers strong{font-size:18px}
  .result-panel{padding:7px 8px}.result-panel h3{font-size:12px}.resource-row{min-height:28px}.resource-name{font-size:9.2px}.resource-value{font-size:9.8px}.opt-card strong{font-size:9px}.opt-card p,.message{font-size:8px}
  footer{height:32px;padding:5px 13px;font-size:8px}.footer-center{font-size:9.5px}
}

@media (max-width:1199px){footer{display:flex}.footer-center{order:3;width:100%;text-align:center}.priority-legend{justify-self:auto}}

@media (min-width:1200px) and (min-height:700px){
  .input-column>.panel>.group-list{display:flex;flex-direction:column;justify-content:stretch;min-height:0}
  .input-column>.panel>.group-list>.group-card{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0}
  .resource-chain{height:100%;grid-auto-rows:minmax(25px,1fr)}
  .optimisation{height:100%;grid-auto-rows:minmax(34px,1fr)}
  #messages{height:100%;display:flex;flex-direction:column;justify-content:space-evenly}
  #messages .message{margin-top:2px}
}
