:root{--ink:#161616;--muted:#696969;--line:#dfdfdf;--paper:#f3f1ed;--card:#fff;--green:#ff4f2f;--green2:#ff775e;--lime:#dfff00;--blue:#286cff;--amber:#ffb000;--red:#ff4f2f;--nav:#101010;--shadow:0 12px 32px rgba(0,0,0,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 Inter,Segoe UI,Arial,sans-serif}.demo-strip{position:fixed;z-index:20;top:0;left:0;right:0;height:28px;background:#d8f06d;color:#203624;text-align:center;font-size:11px;font-weight:800;letter-spacing:1.2px;padding:6px}.sidebar{position:fixed;top:28px;bottom:0;left:0;width:236px;background:var(--nav);color:#e9f5f0;padding:24px 16px;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;padding:0 8px 25px;line-height:1.15}.brand-mark{height:38px;width:38px;border:1px solid #72b79d;border-radius:11px;display:grid;place-items:center;font-size:11px;font-weight:900;color:var(--lime)}nav{display:flex;flex-direction:column;gap:4px}.nav-item{border:0;background:transparent;color:#a8c1b8;text-align:left;padding:10px 12px;border-radius:8px;cursor:pointer;font-weight:600}.nav-item:hover,.nav-item.active{background:#1c473d;color:white}.nav-item span{display:inline-block;width:25px;color:#7db69f}.side-foot{margin-top:auto;border-top:1px solid #295147;padding:16px 9px 0;color:#9db7ae;font-size:12px}.side-foot small{color:#658b7e}.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:#72d69e;margin-right:6px;box-shadow:0 0 0 4px #235a46}main{margin-left:236px;padding-top:28px;min-height:100vh}header{height:88px;background:rgba(255,255,255,.9);border-bottom:1px solid var(--line);padding:18px 30px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:28px;z-index:10;backdrop-filter:blur(8px)}h1{font-size:25px;margin:1px 0}.eyebrow{font-size:10px;letter-spacing:1.8px;color:var(--green);font-weight:800}.header-actions{display:flex;gap:9px}.ghost,.primary,.icon-btn,.chip{border:1px solid var(--line);background:white;border-radius:8px;padding:9px 13px;color:var(--ink);font-weight:700;cursor:pointer}.primary{background:var(--green);border-color:var(--green);color:white}.icon-btn{font-size:17px;padding:7px 12px}.content{padding:28px 30px 50px;max-width:1550px;margin:auto}.hero{background:linear-gradient(120deg,#143f35,#1f7159);color:white;padding:27px 30px;border-radius:16px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:350px;height:350px;border:1px solid #ffffff20;border-radius:50%;right:-70px}.hero h2{font-size:25px;margin:0 0 5px}.hero p{margin:0;color:#c7ded6}.hero .badge{background:#d8f06d;color:#274331}.badge{font-size:9px;letter-spacing:.8px;padding:4px 7px;border-radius:5px;background:#e9f1ed;color:#49675e;font-weight:900;display:inline-block}.badge.sim{background:#e5e1f8;color:#5d4b9a}.badge.model{background:#fff0d3;color:#90651c}.badge.good{background:#dff4e8;color:#26754e}.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:18px 0}.kpi,.card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.kpi{padding:15px}.kpi-top{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.kpi-value{font-size:25px;font-weight:750;margin:8px 0 2px}.delta{font-size:11px;color:var(--green)}.delta.bad{color:var(--red)}.grid-2{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{padding:18px;margin-bottom:16px}.card-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:15px}.card h3{font-size:15px;margin:0}.subtle{color:var(--muted);font-size:12px}.insight{display:grid;grid-template-columns:30px 1fr auto;gap:10px;padding:12px 0;border-top:1px solid #edf2f0}.insight:first-of-type{border-top:0}.insight-icon{width:26px;height:26px;border-radius:7px;background:#e1f2e9;color:var(--green);display:grid;place-items:center}.confidence{font-size:10px;color:var(--muted);white-space:nowrap}.chart{height:245px;width:100%;position:relative}.chart svg{width:100%;height:100%;overflow:visible}.axis{stroke:#d7e2de;stroke-width:1}.chart-label{fill:#78908a;font-size:10px}.legend{display:flex;gap:15px;font-size:11px;color:var(--muted);margin-top:8px}.legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px}.controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.control{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.5px}.control select,.control input,.prompt{border:1px solid var(--line);background:white;color:var(--ink);border-radius:7px;padding:9px;min-width:145px;font:inherit;text-transform:none}.twin{background:#e8f0ec;border-radius:12px;position:relative;height:430px;overflow:hidden;background-image:linear-gradient(#bcd1c822 1px,transparent 1px),linear-gradient(90deg,#bcd1c822 1px,transparent 1px);background-size:28px 28px}.zone{position:absolute;border:2px solid #ffffffcc;border-radius:9px;display:flex;align-items:end;padding:7px;color:white;font-size:9px;font-weight:800;cursor:pointer;transition:.2s;box-shadow:0 4px 9px #46665b33}.zone:hover,.zone.selected{transform:scale(1.05);z-index:3;box-shadow:0 0 0 3px #d9ef75}.timeline{width:100%;accent-color:var(--green)}.scenario-layout{display:grid;grid-template-columns:340px 1fr;gap:18px}.slider-row{margin:13px 0}.slider-row label{display:flex;justify-content:space-between;font-size:12px;font-weight:700}.slider-row input{width:100%;accent-color:var(--green)}.presets{display:flex;gap:7px;flex-wrap:wrap}.chip{padding:6px 9px;font-size:11px}.chip.active{background:#dff1e8;border-color:#75b99e;color:#176b4f}.compare{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.metric{padding:12px;border:1px solid var(--line);border-radius:9px}.metric b{font-size:18px;display:block}.metric .arrow{color:var(--green)}.prompt-wrap{display:flex;gap:8px}.prompt{flex:1;padding:13px}.answer{background:#f4f8f6;border-left:3px solid var(--green);padding:16px;margin-top:12px;border-radius:0 8px 8px 0}.flow{display:flex;align-items:center;justify-content:space-between;gap:7px;margin:25px 0}.flow-node{padding:13px;border:1px solid var(--line);border-radius:9px;text-align:center;background:white;flex:1}.flow-arrow{color:var(--green);font-size:20px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.5px}th,td{padding:10px;border-bottom:1px solid #e7eeeb}.quality-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:5px}.modal{position:fixed;inset:0;background:#0b2822aa;z-index:40;display:grid;place-items:center;padding:30px}.hidden{display:none!important}.modal-box{background:white;border-radius:15px;padding:28px;max-width:700px;width:100%;max-height:85vh;overflow:auto;position:relative}.modal-close{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:24px;cursor:pointer}.why{color:var(--green);font-size:11px;font-weight:800;cursor:pointer;background:none;border:0;padding:0}#toast{position:fixed;right:25px;bottom:25px;background:#163d34;color:white;padding:12px 18px;border-radius:9px;opacity:0;transform:translateY(10px);transition:.25s;z-index:50}.score-ring{width:115px;height:115px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--green) 0 78%,#e5ede9 78%);position:relative}.score-ring:after{content:"";position:absolute;inset:10px;background:white;border-radius:50%}.score-ring b{z-index:1;font-size:28px}.empty{padding:60px;text-align:center;color:var(--muted)}
@media(max-width:1000px){.kpis{grid-template-columns:repeat(3,1fr)}.grid-2,.scenario-layout{grid-template-columns:1fr}.sidebar{width:70px}.brand div,.nav-item:not(.active){font-size:0}.nav-item span{font-size:14px}.side-foot{display:none}main{margin-left:70px}}@media(max-width:700px){body{padding-bottom:68px}.demo-strip{font-size:8px}.sidebar{top:auto;bottom:0;right:0;width:auto;height:68px;padding:7px 8px;z-index:30;display:block}.sidebar .brand,.side-foot{display:none}.sidebar nav{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}.sidebar .nav-item{font-size:0!important;padding:6px;text-align:center}.sidebar .nav-item span{display:block;width:auto;font-size:18px}.sidebar .nav-item:nth-child(n+6){display:none}main{margin-left:0}header{top:28px;height:72px;padding:10px 14px}h1{font-size:19px}.eyebrow{font-size:8px}.content{padding:14px 10px 85px}.kpis,.grid-3,.compare{grid-template-columns:1fr 1fr}.hero{display:block;padding:22px}.hero h2{font-size:21px}.header-actions .icon-btn{display:none}.twin{height:62vh}.card{padding:14px}.flow{overflow-x:auto;justify-content:flex-start}.flow-node{min-width:125px}.controls{display:grid;grid-template-columns:1fr 1fr}.control select,.control input{min-width:0;width:100%}}@media(max-width:420px){.kpis,.grid-3,.compare,.controls{grid-template-columns:1fr}.kpi-value{font-size:22px}}

/* Datacadabra-inspired contrast and playful geometric styling */
.brand-mark{height:42px;width:42px;border:0;border-radius:50%;background:var(--green);font-size:23px;color:#fff}.brand small{color:#999}.hero{background:#161616;border-radius:3px}.hero:before{content:'DATA → DAADKRACHT';position:absolute;right:24px;bottom:12px;color:#ffffff14;font-size:44px;font-weight:900}.card,.kpi{border-radius:3px}.primary{border-radius:999px}.nav-item:hover,.nav-item.active{background:#292929}.nav-item.active span{color:var(--lime)}.badge{border-radius:999px}.twin{background-color:#e8e4dc;background-image:linear-gradient(33deg,transparent 48%,#fff 49%,#fff 52%,transparent 53%),linear-gradient(118deg,transparent 45%,#d5dad5 46%,#d5dad5 49%,transparent 50%),linear-gradient(#c7d8e555 1px,transparent 1px),linear-gradient(90deg,#c7d8e555 1px,transparent 1px);background-size:240px 180px,290px 220px,28px 28px,28px 28px}.zone{border-radius:50%;width:48px!important;height:48px!important;align-items:center;justify-content:center;text-align:center;padding:5px;font-size:8px}.zone:after{content:'';position:absolute;inset:-7px;border:1px solid currentColor;border-radius:50%;opacity:.45}