:root{--background: #09090b;--card: #111113;--card-hover: #18181b;--popover: #111113;--muted: #27272a;--muted-fg: #a1a1aa;--border: #27272a;--border-hover: #3f3f46;--input: #27272a;--ring: #3b82f6;--fg: #fafafa;--fg-muted: #a1a1aa;--fg-dimmed: #52525b;--primary: #3b82f6;--primary-fg: #ffffff;--primary-hover: #2563eb;--accent: #3b82f6;--accent-soft: rgba(59, 130, 246, .08);--gain: #22c55e;--gain-soft: rgba(34, 197, 94, .08);--loss: #ef4444;--loss-soft: rgba(239, 68, 68, .08);--flat: #71717a;--font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;--radius: 8px;--radius-lg: 12px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{min-height:100%;background:var(--background);color:var(--fg);font-family:var(--font-sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant-numeric:tabular-nums}#root{min-height:100vh}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}.app-shell{min-height:100vh;display:flex;flex-direction:column;padding:16px;gap:16px}.app-main{display:flex;flex-direction:column;gap:16px;flex:1}.app-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.header-left{display:flex;align-items:center;gap:10px}.header-icon{width:32px;height:32px;border-radius:var(--radius);flex-shrink:0}.header-title{font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--fg);line-height:1.2}.header-subtitle{font-size:12px;color:var(--fg-dimmed);font-weight:400}.header-actions{display:flex;align-items:center;gap:8px}.copy-status{font-size:12px;color:var(--gain);font-weight:500}.btn{height:32px;padding:0 12px;border-radius:var(--radius);font-size:13px;font-weight:500;font-family:var(--font-sans);border:1px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}.btn-outline{background:transparent;color:var(--fg-muted);border-color:var(--border)}.btn-outline:hover{background:var(--card-hover);color:var(--fg);border-color:var(--border-hover)}.btn-primary{background:var(--primary);color:var(--primary-fg);border-color:var(--primary)}.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.sidebar{display:flex;flex-direction:column;gap:16px}.input-panel{border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--card)}.input-panel-scroll{padding:16px;display:flex;flex-direction:column;gap:16px}.panel-section{display:flex;flex-direction:column;gap:12px}.panel-section+.panel-section{padding-top:16px;border-top:1px solid var(--border)}.section-title{font-size:12px;font-weight:500;color:var(--fg-muted);letter-spacing:0;text-transform:none}.section-header-row{display:flex;align-items:center;justify-content:space-between}.field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.field-label{font-size:13px;color:var(--fg-muted);font-weight:500}.input-wrap{position:relative}.input{width:100%;height:36px;border-radius:var(--radius);border:1px solid var(--border);background:var(--background);color:var(--fg);padding:0 10px;font-size:13px;font-weight:500;font-family:var(--font-sans);outline:none;transition:border-color .15s,box-shadow .15s}.input:focus{border-color:var(--ring);box-shadow:0 0 0 2px #3b82f626}.input.input-invalid{border-color:var(--loss)!important;box-shadow:0 0 0 2px var(--loss-soft)}.input-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:12px;color:var(--fg-dimmed);pointer-events:none;font-weight:500}.input-wrap .input{padding-right:28px}.field-static{max-width:80px;flex:0 0 80px}.static-value{height:36px;border-radius:var(--radius);border:1px solid var(--border);background:var(--background);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:500;color:var(--fg-muted)}.static-value.muted{color:var(--fg-dimmed);font-size:12px}.field-error{font-size:12px;color:var(--loss);font-weight:500}.field-row{display:grid;grid-template-columns:1fr 80px;gap:8px;align-items:end}.field-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.spread-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:end}.slider-row{display:grid;grid-template-columns:1fr 84px;gap:8px;align-items:center}.input-wrap-sm{max-width:84px}.range-slider{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;background:var(--muted);outline:none;cursor:pointer}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--primary);border:2px solid var(--card);cursor:pointer;transition:transform .15s}.range-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.range-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--primary);border:2px solid var(--card);cursor:pointer}.checkbox-label{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--fg-muted);cursor:pointer;white-space:nowrap;padding-bottom:4px;align-self:end}.checkbox-label input[type=checkbox]{width:16px;height:16px;border-radius:4px;accent-color:var(--primary);cursor:pointer}.results-summary{border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--card);padding:16px;display:flex;flex-direction:column;gap:12px}.metric-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.metric-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.metric-card{border-radius:var(--radius);border:1px solid var(--border);background:var(--background);padding:8px 10px;transition:border-color .15s}.metric-card:hover{border-color:var(--border-hover)}.metric-label{font-size:11px;color:var(--fg-dimmed);font-weight:500;margin-bottom:2px}.metric-value{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--fg);transition:color .2s}.metric-value.tone-gain{color:var(--gain)}.metric-value.tone-loss{color:var(--loss)}.metric-value.tone-flat{color:var(--flat)}.metric-card.tone-gain{border-color:#22c55e26}.metric-card.tone-loss{border-color:#ef444426}.scenario-section{border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--card);padding:16px;display:flex;flex-direction:column;gap:12px;min-height:0;overflow:hidden}.scenario-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}.mode-toggle{display:inline-flex;border-radius:var(--radius);border:1px solid var(--border);background:var(--background);padding:2px;gap:2px}.mode-btn{height:28px;padding:0 12px;border-radius:6px;border:none;font-size:12px;font-weight:500;font-family:var(--font-sans);color:var(--fg-dimmed);background:transparent;cursor:pointer;transition:background .15s,color .15s}.mode-btn:hover{color:var(--fg-muted)}.mode-btn.active{background:var(--muted);color:var(--fg)}.table-wrap{flex:1;min-height:0;overflow:auto;border-radius:var(--radius);border:1px solid var(--border)}.scenario-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px}.scenario-table thead{position:sticky;top:0;z-index:10;background:var(--card)}.scenario-table th{height:36px;padding:0 12px;font-size:12px;font-weight:500;color:var(--fg-dimmed);border-bottom:1px solid var(--border);text-transform:none;letter-spacing:0}.scenario-table td{height:36px;padding:0 12px;font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--fg);border-top:1px solid var(--border);transition:background .1s}.scenario-table tbody tr:hover td{background:var(--accent-soft)}.col-change{text-align:left;width:80px}.col-price,.col-value,.col-pl{text-align:right}.col-roi{text-align:right;width:90px}td.tone-gain{color:var(--gain)}td.tone-loss{color:var(--loss)}td.tone-flat{color:var(--flat)}.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}@media(min-width:1024px){.app-shell{height:100vh;max-height:100vh;overflow:hidden;padding:20px;gap:16px}.app-main{flex-direction:row;min-height:0;flex:1;overflow:hidden}.sidebar{width:400px;flex-shrink:0;min-height:0;overflow:hidden}.input-panel{flex:1;min-height:0;overflow:hidden}.input-panel-scroll{height:100%;overflow-y:auto}.scenario-section{flex:1;min-width:0}.header-title{font-size:18px}}@media(max-width:1023px){.app-shell{padding:12px;gap:12px;overflow-y:auto;min-height:100vh;height:auto}.app-main{flex-direction:column;gap:12px}.sidebar{gap:12px}.table-wrap{max-height:50vh}}@media(max-width:480px){.app-shell{padding:8px;gap:10px}.app-header{gap:8px}.header-icon{width:28px;height:28px}.header-title{font-size:15px}.input-panel-scroll{padding:12px;gap:12px}.results-summary,.scenario-section{padding:12px}.scenario-header{flex-direction:column;align-items:stretch}.mode-toggle{width:100%}.mode-btn{flex:1;text-align:center}.metric-grid-3{grid-template-columns:1fr 1fr}.col-value{display:none}}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:.3}