:root{--bg-0: oklch(.16 .008 60);--bg-1: oklch(.19 .009 60);--bg-2: oklch(.22 .01 55);--bg-3: oklch(.26 .012 55);--bg-4: oklch(.31 .014 55);--line: oklch(1 0 0 / .06);--line-strong: oklch(1 0 0 / .1);--fg-0: oklch(.98 .005 70);--fg-1: oklch(.82 .008 70);--fg-2: oklch(.62 .01 70);--fg-3: oklch(.48 .01 70);--accent: oklch(.74 .17 50);--accent-soft: oklch(.74 .17 50 / .12);--accent-border: oklch(.74 .17 50 / .35);--accent-deep: oklch(.55 .16 45);--info: oklch(.78 .09 225);--info-soft: oklch(.78 .09 225 / .12);--ok: oklch(.78 .14 155);--ok-soft: oklch(.78 .14 155 / .14);--warn: oklch(.82 .15 85);--warn-soft: oklch(.82 .15 85 / .14);--bad: oklch(.68 .2 25);--bad-soft: oklch(.68 .2 25 / .14);--font-display: "Space Grotesk", "Geist", -apple-system, sans-serif;--font-sans: "Geist", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, monospace;--r-xs: 10px;--r-sm: 16px;--r-md: 30px;--r-lg: 30px;--r-xl: 38px;--r-pill: 999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 8px 24px rgba(0, 0, 0, .35), 0 2px 6px rgba(0, 0, 0, .25);--shadow-lg: 0 24px 60px rgba(0, 0, 0, .5), 0 4px 12px rgba(0, 0, 0, .3)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg-1);color:var(--fg-0);font-family:var(--font-sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01","cv11"}#root{min-height:100vh}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}input,select,textarea{font-family:inherit;color:inherit}.app-bg{background:var(--bg-1);background-image:radial-gradient(circle at 85% -10%,oklch(.74 .17 50 / .07),transparent 45%),radial-gradient(circle at -5% 110%,oklch(.78 .09 225 / .05),transparent 50%);min-height:100vh}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-3);border-radius:99px;border:2px solid var(--bg-1)}::-webkit-scrollbar-thumb:hover{background:var(--bg-4)}.app-shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}.sidebar{background:var(--bg-0);border-right:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column;gap:8px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:10px;padding:8px 10px 20px}.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(140deg,var(--accent) 0%,var(--accent-deep) 100%);display:grid;place-items:center;color:#1a0e05;font-family:var(--font-display);font-size:20px;font-weight:400;box-shadow:inset 0 1px #ffffff4d,0 4px 12px #fd853740}.brand-name{font-family:var(--font-display);font-size:22px;font-weight:400;letter-spacing:-.01em;line-height:1}.brand-name em{font-style:italic;color:var(--accent);font-weight:400}.area-switcher{margin:0 6px 16px;padding:10px 12px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md);display:flex;align-items:center;gap:10px;cursor:pointer;transition:all .15s}.area-switcher:hover{background:var(--bg-3);border-color:var(--line-strong)}.area-switcher-icon{width:30px;height:30px;border-radius:8px;background:var(--bg-3);display:grid;place-items:center;font-family:var(--font-mono);font-size:12px;color:var(--fg-1);border:1px solid var(--line)}.area-switcher-text{flex:1;min-width:0}.area-switcher-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-3);margin-bottom:2px}.area-switcher-name{font-size:13px;font-weight:500;color:var(--fg-0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.area-switcher-chev{color:var(--fg-3);display:inline-flex}.nav-section-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--fg-3);padding:14px 12px 6px}.nav-item{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:var(--r-sm);color:var(--fg-1);font-size:13.5px;font-weight:500;cursor:pointer;transition:all .12s;text-align:left;width:100%;border:1px solid transparent}.nav-item:hover{background:var(--bg-2);color:var(--fg-0)}.nav-item.active{background:var(--bg-2);color:var(--fg-0);border-color:var(--line)}.nav-item svg{flex-shrink:0;opacity:.85}.nav-item .badge-count{margin-left:auto;background:var(--bad-soft);color:var(--bad);font-size:10.5px;font-weight:600;padding:1px 7px;border-radius:99px;font-family:var(--font-mono)}.sidebar-footer{margin-top:auto;padding:12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px}.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#486491,#503975);display:grid;place-items:center;color:#fff;font-size:12px;font-weight:600}.user-info{flex:1;min-width:0}.user-name{font-size:13px;font-weight:500}.user-role{font-size:11px;color:var(--fg-3)}.main{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;gap:16px;padding:18px 32px;border-bottom:1px solid var(--line);background:#171310cc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.breadcrumb{display:flex;align-items:center;gap:8px;color:var(--fg-2);font-size:13px}.breadcrumb .crumb-sep{color:var(--fg-3)}.breadcrumb .crumb-current{color:var(--fg-0);font-weight:500}.topbar-spacer{flex:1}.topbar-search-wrap{position:relative;min-width:320px}.topbar-search{display:flex;align-items:center;gap:8px;width:100%;padding:7px 12px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md);color:var(--fg-2);font-size:13px}.topbar-search.is-open{background:var(--bg-3);color:var(--fg-0)}.topbar-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--fg-0);font:inherit;font-size:12.5px}.topbar-search input::placeholder{color:var(--fg-2)}.search-dropdown{position:absolute;z-index:40;top:calc(100% + 8px);right:0;width:min(520px,calc(100vw - 32px));max-height:min(540px,calc(100vh - 96px));overflow:auto;padding:8px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--bg-2);box-shadow:0 24px 80px #0000006b}.search-empty{display:flex;align-items:center;justify-content:center;gap:8px;padding:22px 16px;color:var(--fg-2);font-size:12.5px}.search-error{color:var(--bad)}.search-group+.search-group{margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}.search-group-label{display:flex;align-items:center;gap:7px;padding:6px 8px;color:var(--fg-2);font-size:10.5px;font-weight:700;letter-spacing:0;text-transform:uppercase}.search-result{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;padding:10px 8px;border:0;border-radius:var(--r-xs);background:transparent;color:var(--fg-0);text-align:left;cursor:pointer}.search-result:hover,.search-result:focus-visible{outline:0;background:var(--bg-3)}.search-result-main{display:grid;gap:3px;min-width:0}.search-result-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:650}.search-result-sub,.search-result-meta{overflow:hidden;color:var(--fg-2);font-size:11.5px;text-overflow:ellipsis;white-space:nowrap}.search-result-meta{flex:0 0 auto;max-width:150px;color:var(--fg-3)}.icon-btn{width:36px;height:36px;border-radius:var(--r-sm);display:grid;place-items:center;color:var(--fg-1);border:1px solid var(--line);background:var(--bg-2);transition:all .15s;position:relative}.icon-btn:hover{background:var(--bg-3);color:var(--fg-0)}.icon-btn .dot{position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px var(--bg-2)}.content{padding:72px 80px;max-width:1600px;width:100%;margin:0 auto}.h-display{font-family:var(--font-display);font-weight:500;letter-spacing:-.03em;line-height:1.05;color:var(--fg-0)}.h-display em{font-style:italic;color:var(--accent);font-weight:500}.h1{font-size:36px}.h2{font-size:26px;font-family:var(--font-display);font-weight:400;letter-spacing:-.01em}.h3{font-size:17px;font-weight:500;letter-spacing:-.005em}.text-dim{color:var(--fg-2)}.text-mute{color:var(--fg-3)}.mono{font-family:var(--font-mono);font-feature-settings:"tnum"}.btn,.icon-btn,.nav-item,.area-switcher,.card-clickable,.pill-clickable,.kpi-clickable,.mix-row-clickable{position:relative;transition:transform .22s cubic-bezier(.2,.8,.3,1),background .18s ease,color .18s ease,border-color .18s ease,box-shadow .22s ease;transform-origin:center}.btn:after,.icon-btn:after,.nav-item:after,.area-switcher:after,.card-clickable:after,.pill-clickable:after,.kpi-clickable:after,.mix-row-clickable:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;border:1px solid rgba(255,255,255,.55);opacity:0;pointer-events:none;transition:opacity .28s ease}.btn:hover,.icon-btn:hover,.nav-item:hover,.area-switcher:hover,.card-clickable:hover,.pill-clickable:hover,.kpi-clickable:hover,.mix-row-clickable:hover{transform:scale(1.05);z-index:2}.btn:hover:after,.icon-btn:hover:after,.nav-item:hover:after,.area-switcher:hover:after,.card-clickable:hover:after,.pill-clickable:hover:after,.kpi-clickable:hover:after,.mix-row-clickable:hover:after{opacity:1}.card-clickable:hover,.kpi-clickable:hover,.mix-row-clickable:hover{transform:scale(1.03)}.btn:active,.icon-btn:active,.nav-item:active,.area-switcher:active{transform:scale(1.02)}.card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md)}.card-lg{border-radius:var(--r-lg)}.card-pad{padding:32px}.card-pad-lg{padding:44px}.card-interactive{cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;position:relative}.card-interactive:hover{transform:scale(1.02);border-color:var(--line-strong);background:var(--bg-3);box-shadow:var(--shadow-md)}.card-interactive:active{transform:scale(1.01)}.card-add{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;min-height:180px;background:transparent;border-style:dashed;border-color:var(--line-strong);color:var(--fg-2)}.card-add:hover{background:var(--bg-2);border-color:var(--accent-border);color:var(--fg-0)}.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--r-sm);font-size:13px;font-weight:500;transition:all .15s;border:1px solid transparent;white-space:nowrap}.btn-primary{background:var(--accent);color:#1a0e05;box-shadow:inset 0 1px #fff3,0 1px 2px #0000004d}.btn-primary:hover{background:#ff9a5f;background:oklch(.78 .17 50);box-shadow:inset 0 1px #fff3,0 10px 24px #fd853766}.btn-secondary{background:var(--bg-2);color:var(--fg-0);border-color:var(--line-strong)}.btn-secondary:hover{background:var(--bg-3);border-color:var(--fg-3)}.btn-ghost{background:transparent;color:var(--fg-1)}.btn-ghost:hover{background:var(--bg-2);color:var(--fg-0)}.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--r-pill);font-size:11.5px;font-weight:500;letter-spacing:.01em;border:1px solid var(--line);background:var(--bg-3);color:var(--fg-1)}.pill .dot-s{width:6px;height:6px;border-radius:50%;background:currentColor}.pill-ok{background:var(--ok-soft);color:var(--ok);border-color:transparent}.pill-warn{background:var(--warn-soft);color:var(--warn);border-color:transparent}.pill-bad{background:var(--bad-soft);color:var(--bad);border-color:transparent}.pill-info{background:var(--info-soft);color:var(--info);border-color:transparent}.pill-accent{background:var(--accent-soft);color:var(--accent);border-color:transparent}.table{width:100%;border-collapse:collapse;font-size:13px}.table thead th{text-align:left;padding:10px 14px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-3);border-bottom:1px solid var(--line);background:var(--bg-2)}.table tbody td{padding:13px 14px;border-bottom:1px solid var(--line);color:var(--fg-1);vertical-align:middle}.table tbody tr{transition:background .12s}.table tbody tr:hover{background:var(--bg-3)}.table tbody tr:last-child td{border-bottom:none}.table .cell-primary{color:var(--fg-0);font-weight:500}.table .cell-num{font-family:var(--font-mono);font-feature-settings:"tnum";text-align:right}.input,.select{width:100%;padding:10px 14px;background:var(--bg-1);border:1px solid var(--line-strong);border-radius:var(--r-sm);color:var(--fg-0);font-size:13.5px;outline:none;transition:all .15s}.input:focus,.select:focus{border-color:var(--accent-border);background:var(--bg-2);box-shadow:0 0 0 3px var(--accent-soft)}.input::placeholder{color:var(--fg-3)}.field-label{display:block;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-2);margin-bottom:6px;font-weight:500}.kpi{padding:32px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md)}.kpi-label{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-2);margin-bottom:18px;display:flex;align-items:center;gap:8px}.kpi-value{font-family:var(--font-display);font-size:30px;font-weight:400;letter-spacing:-.02em;color:var(--fg-0);line-height:1;display:flex;align-items:baseline;gap:6px}.kpi-value .unit{font-family:var(--font-sans);font-size:14px;color:var(--fg-2);font-weight:400}.kpi-delta{margin-top:12px;display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--ok);font-family:var(--font-mono)}.kpi-delta.down{color:var(--bad)}.stepper{display:flex;align-items:center;gap:12px;padding:16px 20px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md)}.step{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:var(--r-sm);color:var(--fg-3);font-size:13px}.step.active{color:var(--fg-0);background:var(--bg-3)}.step.done{color:var(--fg-1)}.step-num{width:22px;height:22px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font-family:var(--font-mono);font-size:11px}.step.active .step-num{background:var(--accent);color:#1a0e05;border-color:var(--accent)}.step.done .step-num{background:var(--ok-soft);color:var(--ok);border-color:transparent}.step-sep{flex:1;height:1px;background:var(--line)}.spec-bar-track{position:relative;height:8px;background:var(--bg-1);border-radius:99px;overflow:hidden;border:1px solid var(--line)}.spec-bar-range{position:absolute;top:0;bottom:0;background:#63d18f4d;border-radius:99px}.spec-bar-range-margin{position:absolute;top:1px;bottom:1px;background:#f0bb3b94;border-radius:99px}.spec-bar-marker{position:absolute;top:-2px;bottom:-2px;width:3px;background:var(--fg-0);border-radius:99px;box-shadow:0 0 0 2px var(--bg-2)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#040302a6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;padding:32px;z-index:100;animation:fadeIn .18s ease-out}.modal{width:100%;max-width:480px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg);padding:36px;max-height:calc(100vh - 64px);overflow-y:auto}.modal-lg{max-width:760px}.modal-xl{max-width:980px}.modal-title{font-family:var(--font-display);font-size:22px;letter-spacing:-.02em;margin:0 0 8px;color:var(--fg-0)}.modal-sub{font-size:13.5px;color:var(--fg-2);margin:0 0 24px}.auth-wrap{min-height:100vh;display:grid;place-items:center;background:var(--bg-0);background-image:radial-gradient(ellipse at 30% 0%,oklch(.74 .17 50 / .15),transparent 50%),radial-gradient(ellipse at 70% 100%,oklch(.78 .09 225 / .08),transparent 55%);padding:40px}.mix-row{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:20px;padding:20px 28px;border-bottom:1px solid var(--line);transition:background .12s}.mix-row:hover{background:var(--bg-3)}.mix-row:last-child{border-bottom:none}.mix-row-rank{width:36px;height:36px;border-radius:10px;background:var(--bg-3);border:1px solid var(--line);display:grid;place-items:center;font-family:var(--font-mono);font-size:13px;color:var(--fg-2)}.mix-row-main{min-width:0}.mix-row-name{font-size:15px;font-weight:500;color:var(--fg-0);margin-bottom:4px}.mix-row-meta{font-size:12px;color:var(--fg-2);display:flex;gap:10px;align-items:center}.mix-row-qty{font-family:var(--font-display);display:flex;align-items:baseline;gap:6px;min-width:170px;justify-content:flex-end}.mix-qty-value{font-size:38px;font-weight:400;letter-spacing:-.025em;color:var(--fg-0);font-variant-numeric:tabular-nums;line-height:1}.mix-qty-unit{font-family:var(--font-mono);font-size:14px;color:var(--fg-2);font-weight:400}.mix-row-total{background:linear-gradient(90deg,oklch(.74 .17 50 / .1),transparent 80%);border-top:1px solid var(--accent-border);border-bottom:none;padding:26px 28px}.mix-row-total .mix-row-rank{background:var(--accent);color:#1a0e05;border-color:transparent;font-weight:500;font-family:var(--font-display);font-size:16px}.mix-row-total .mix-qty-value{color:var(--accent);font-size:44px}.mix-row-total .mix-qty-unit{color:var(--accent)}.row{display:flex;gap:12px;align-items:center}.col{display:flex;flex-direction:column;gap:12px}.grid{display:grid;gap:28px}.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.gap-sm{gap:8px}.gap-md{gap:16px}.gap-lg{gap:24px}.mt-sm{margin-top:12px}.mt-md{margin-top:24px}.mt-lg{margin-top:40px}.mt-xl{margin-top:64px}.mb-sm{margin-bottom:12px}.mb-md{margin-bottom:24px}.mb-lg{margin-bottom:52px}.flex-1{flex:1}.sr{position:absolute;left:-9999px}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .25s ease-out}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin .9s linear infinite}