:root{--ink: #16122B;--ink-2: #565272;--ink-3: #9A96B4;--line: rgba(22, 18, 43, .08);--accent: #7C5CFC;--accent-2: #4DA3FF;--pink: #FF6B81;--teal: #00C9B7;--amber: #FFB020;--glass: rgba(255, 255, 255, .62);--glass-strong: rgba(255, 255, 255, .78);--r-lg: 28px;--r-md: 20px;--r-sm: 14px;--shadow: 0 1px 1px rgba(22, 18, 43, .03), 0 12px 32px -8px rgba(94, 70, 210, .14);--shadow-hover: 0 2px 4px rgba(22, 18, 43, .04), 0 18px 44px -8px rgba(94, 70, 210, .22)}*{box-sizing:border-box;margin:0}body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:#f4f2fc;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(620px 620px at 8% -5%,rgba(124,92,252,.22),transparent 65%),radial-gradient(560px 560px at 95% 12%,rgba(77,163,255,.2),transparent 65%),radial-gradient(640px 640px at 80% 95%,rgba(255,107,129,.14),transparent 65%),radial-gradient(540px 540px at 12% 88%,rgba(0,201,183,.13),transparent 65%)}h1,h2,.logo-name{font-family:Sora,Inter,sans-serif}button{font:inherit;cursor:pointer}.app{display:flex;min-height:100vh;gap:8px;padding:16px}.sidebar{width:250px;flex-shrink:0;background:var(--glass);backdrop-filter:blur(28px) saturate(1.4);-webkit-backdrop-filter:blur(28px) saturate(1.4);border:1px solid rgba(255,255,255,.7);border-radius:var(--r-lg);box-shadow:var(--shadow);display:flex;flex-direction:column;padding:24px 16px;position:sticky;top:16px;height:calc(100vh - 32px)}.logo{display:flex;align-items:center;gap:12px;padding:0 8px 28px}.logo-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#7c5cfc,#4da3ff 60%,#6be0d4);display:grid;place-items:center;color:#fff;font-family:Sora,sans-serif;font-weight:800;font-size:20px;box-shadow:0 8px 20px -4px #7c5cfc80}.logo-name{font-weight:700;font-size:15px}.logo-sub{font-size:11.5px;color:var(--ink-3);margin-top:2px}.nav{display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:999px;background:none;border:none;color:var(--ink-2);font-size:14.5px;font-weight:600;transition:all .18s ease}.nav-item:hover{background:#ffffffb3;color:var(--ink)}.nav-item.active{background:linear-gradient(135deg,#7c5cfc,#4da3ff);color:#fff;box-shadow:0 8px 20px -4px #7c5cfc73}.sidebar-footer{margin-top:auto}.demo-note{font-size:12px;line-height:1.55;color:var(--ink-2);background:#ffffff8c;border:1px solid rgba(255,255,255,.8);border-radius:var(--r-md);padding:14px 16px}.demo-note strong{display:block;color:var(--ink);margin-bottom:4px}.main{flex:1;min-width:0}.page{max-width:1040px;margin:0 auto;padding:28px 28px 72px}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:28px;flex-wrap:wrap}.page-header h1{font-size:32px;font-weight:800;letter-spacing:-.03em;background:linear-gradient(100deg,var(--ink) 30%,var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.page-sub{color:var(--ink-2);margin-top:8px;font-size:14.5px}.badge-mock,.badge-sim{font-family:Inter,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:linear-gradient(135deg,#ffb0202e,#ff6b812e);color:#a66300;border:1px solid rgba(255,176,32,.35);border-radius:999px;padding:5px 12px;vertical-align:middle;margin-left:10px;-webkit-text-fill-color:#A66300}.period{background:var(--glass-strong);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.8);border-radius:999px;padding:11px 20px;font-size:13.5px;font-weight:600;color:var(--ink-2);box-shadow:var(--shadow)}.card{background:var(--glass-strong);backdrop-filter:blur(24px) saturate(1.3);-webkit-backdrop-filter:blur(24px) saturate(1.3);border:1px solid rgba(255,255,255,.8);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:26px;margin-bottom:18px}.card h2{font-size:15px;font-weight:700;margin-bottom:18px;letter-spacing:-.01em}.step-label{display:flex;align-items:center;gap:12px;font-size:14.5px;font-weight:700;margin-bottom:18px}.step-num{width:26px;height:26px;border-radius:9px;flex-shrink:0;background:linear-gradient(135deg,#7c5cfc,#4da3ff);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:800;box-shadow:0 4px 12px -2px #7c5cfc66}.mode-toggle{display:flex;gap:4px;padding:5px;background:#ffffff80;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.8);border-radius:999px;box-shadow:var(--shadow)}.mode-toggle button{border:none;background:none;border-radius:999px;padding:9px 18px;font-size:13.5px;font-weight:600;color:var(--ink-2);transition:all .18s ease}.mode-toggle button.on{background:linear-gradient(135deg,#7c5cfc,#4da3ff);color:#fff;box-shadow:0 6px 16px -3px #7c5cfc73}.chip-row{display:flex;flex-wrap:wrap;gap:10px}.chip{display:flex;align-items:center;gap:10px;background:#ffffff8c;border:1.5px solid transparent;border-radius:999px;padding:10px 18px 10px 14px;text-align:left;box-shadow:0 1px 3px #16122b0d;transition:all .18s ease}.chip:hover{transform:translateY(-1px);box-shadow:var(--shadow)}.chip-on{border-color:var(--accent);background:linear-gradient(135deg,#7c5cfc1f,#4da3ff1f);box-shadow:0 6px 18px -4px #7c5cfc4d}.chip strong{display:block;font-size:13.5px}.chip em{display:block;font-style:normal;font-size:12px;color:var(--ink-3)}.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;display:inline-block}.usecase-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}.usecase{background:#ffffff8c;border:1.5px solid transparent;border-radius:var(--r-md);padding:18px;text-align:left;transition:all .2s ease}.usecase:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}.usecase-on{border-color:var(--accent);background:linear-gradient(150deg,#7c5cfc1f,#4da3ff1a);box-shadow:0 10px 26px -6px #7c5cfc52}.usecase-icon{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font-size:22px;margin-bottom:14px;box-shadow:0 8px 18px -4px #16122b40}.usecase-title{font-weight:700;font-size:14px;margin-bottom:5px}.usecase-desc{font-size:12.5px;color:var(--ink-2);line-height:1.5}.levers{display:grid;grid-template-columns:1fr 1fr;gap:24px}.lever-name{font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:10px}.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.seg button{border:1.5px solid transparent;border-radius:var(--r-sm);background:#ffffff8c;padding:13px 10px;text-align:center;transition:all .18s ease}.seg button:hover{transform:translateY(-1px);box-shadow:var(--shadow)}.seg button.on{border-color:var(--accent);background:linear-gradient(150deg,#7c5cfc21,#4da3ff1c);box-shadow:0 8px 20px -5px #7c5cfc4d}.seg strong{display:block;font-size:13.5px}.seg span{display:block;font-size:11px;color:var(--ink-3);margin-top:4px;line-height:1.35}.pro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.field{display:flex;flex-direction:column;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-2)}.field-wide{grid-column:span 3}.field select,.field input[type=number],.field input[type=text]{font:inherit;font-weight:500;color:var(--ink);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:11px 14px;background:#fff9;outline:none;transition:border-color .15s,box-shadow .15s}.field select:focus,.field input:focus{border-color:var(--accent);box-shadow:0 0 0 4px #7c5cfc24}.field input[type=range]{accent-color:var(--accent)}.generate-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--glass-strong);-webkit-backdrop-filter:blur(24px) saturate(1.3);backdrop-filter:blur(24px) saturate(1.3);border:1px solid rgba(255,255,255,.8);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:18px 26px;margin-bottom:18px;flex-wrap:wrap}.estimate{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}.estimate-cost{font-family:Sora,sans-serif;font-size:22px;font-weight:700;background:linear-gradient(120deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.estimate-note{font-size:13px;color:var(--ink-2)}.btn-primary{background:linear-gradient(135deg,#7c5cfc,#4da3ff);color:#fff;border:none;border-radius:999px;padding:15px 32px;font-size:15px;font-weight:700;box-shadow:0 10px 26px -6px #7c5cfc8c;transition:all .18s ease}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 32px -6px #7c5cfca6}.btn-primary:disabled{background:#16122b1f;color:var(--ink-3);box-shadow:none;cursor:not-allowed}.progress{height:8px;border-radius:999px;background:#fff9;overflow:hidden;margin-bottom:18px}.progress-fill{height:100%;background:linear-gradient(90deg,#7c5cfc,#4da3ff,#6be0d4);border-radius:999px;transition:width .12s linear}.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.result{border:1px solid rgba(255,255,255,.8);border-radius:var(--r-md);overflow:hidden;background:#ffffff8c;box-shadow:var(--shadow);transition:all .2s ease}.result:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}.result-img{display:block;width:100%;height:auto}.result figcaption{padding:13px 16px;font-size:12.5px;display:flex;flex-direction:column;gap:4px}.result figcaption span{display:flex;align-items:center;gap:6px;color:var(--ink-2)}.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.kpi{background:var(--glass-strong);-webkit-backdrop-filter:blur(24px) saturate(1.3);backdrop-filter:blur(24px) saturate(1.3);border:1px solid rgba(255,255,255,.8);border-radius:var(--r-md);box-shadow:var(--shadow);padding:20px 22px;transition:all .2s ease}.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}.kpi-label{font-size:12px;font-weight:600;color:var(--ink-3);margin-bottom:9px}.kpi-value{font-family:Sora,sans-serif;font-size:25px;font-weight:700;letter-spacing:-.02em}.kpi-delta{font-size:12px;font-weight:600;margin-top:7px}.kpi-delta.up{color:#00a896}.kpi-delta.down{color:var(--pink)}.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dash-grid .card{margin-bottom:0}.span-2{grid-column:span 2}.trend{width:100%;height:auto}.trend-label{font-size:11px;fill:var(--ink-3);font-family:Inter,sans-serif}.bars{display:flex;flex-direction:column;gap:15px}.bar-label{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}.bar-label strong{font-variant-numeric:tabular-nums}.bar-track{height:9px;border-radius:999px;background:#16122b0f;overflow:hidden;flex:1}.bar-fill{height:100%;border-radius:999px}.donut-wrap{display:flex;align-items:center;gap:26px;flex-wrap:wrap}.donut{width:152px;height:152px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;box-shadow:0 10px 26px -8px #7c5cfc59}.donut-hole{width:98px;height:98px;border-radius:50%;background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-content:center;text-align:center;gap:2px}.donut-hole strong{font-family:Sora,sans-serif;font-size:16px}.donut-hole span{font-size:11px;color:var(--ink-3)}.legend{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;font-size:13px}.legend li{display:flex;align-items:center;gap:8px}.legend strong{margin-left:auto;padding-left:16px}.task-list{display:flex;flex-direction:column;gap:15px}.task-row{display:grid;grid-template-columns:150px 1fr 44px;align-items:center;gap:12px;font-size:13px}.task-row strong{text-align:right;font-variant-numeric:tabular-nums}@media (max-width: 980px){.kpi-row{grid-template-columns:repeat(2,1fr)}.dash-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}.levers{grid-template-columns:1fr}.pro-grid{grid-template-columns:1fr 1fr}.field-wide{grid-column:span 2}}@media (max-width: 760px){.app{flex-direction:column;padding:10px}.sidebar{width:100%;height:auto;position:static;flex-direction:row;align-items:center;padding:12px 16px}.logo{padding:0 16px 0 0}.nav{flex-direction:row}.sidebar-footer{display:none}.page{padding:22px 12px 56px}}
