:root{--bg-primary: #090d16;--bg-surface: #0f172a;--bg-card: #131d33;--bg-input: #0b1120;--border-subtle: #1e293b;--border-focus: #38bdf8;--border-highlight: #334155;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #64748b;--accent-cyan: #38bdf8;--accent-emerald: #10b981;--accent-rose: #f43f5e;--accent-amber: #f59e0b;--accent-violet: #a855f7;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);background-image:radial-gradient(ellipse 80% 50% at 50% 110%,rgba(56,189,248,.08),transparent 70%),radial-gradient(ellipse 60% 40% at 15% 0%,rgba(249,115,22,.04),transparent 70%);background-attachment:fixed;color:var(--text-main);font-family:var(--font-sans);min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased}#app{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:24px 20px 48px}.soda-bubbles{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.soda-bubble{position:absolute;bottom:calc(-1 * var(--bubble-size) - 10px);left:var(--bubble-left);width:var(--bubble-size);height:var(--bubble-size);border-radius:50%;border:1px solid rgba(186,230,253,.35);background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.45) 0 14%,rgba(186,230,253,.08) 40%,transparent 72%);box-shadow:inset 0 0 3px #bae6fd33;opacity:0;animation:soda-rise var(--bubble-duration) linear var(--bubble-delay) infinite;will-change:transform,opacity}@keyframes soda-rise{0%{transform:translateZ(0);opacity:0}10%{opacity:var(--bubble-opacity)}50%{transform:translate3d(var(--bubble-drift),-55vh,0)}85%{opacity:var(--bubble-opacity)}to{transform:translate3d(calc(var(--bubble-drift) * -.5),calc(-100vh - 40px),0);opacity:0}}@media (prefers-reduced-motion: reduce){.soda-bubble{animation:none;opacity:calc(var(--bubble-opacity) * .6);bottom:auto;top:var(--bubble-rest)}}.app-header{text-align:center;margin-bottom:24px}.header-badges{display:flex;justify-content:center;gap:8px;margin-bottom:8px}.badge{font-family:var(--font-mono);font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.5px}.badge-accent{background:#38bdf826;color:var(--accent-cyan);border:1px solid rgba(56,189,248,.3)}.badge-subtle{background:var(--bg-card);color:var(--text-dim);border:1px solid var(--border-subtle)}.app-title{font-size:2.4rem;font-weight:900;letter-spacing:-.5px;background:linear-gradient(135deg,#fff 40%,#94a3b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.app-subtitle{color:var(--text-muted);font-size:.95rem;margin-top:4px}.presets-section{display:flex;flex-wrap:wrap;align-items:center;gap:12px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:10px 16px;margin-bottom:24px}.presets-label{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-dim);white-space:nowrap}.preset-select{flex:1 1 240px;min-width:0;max-width:520px;padding:8px 36px 8px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%) right 18px center / 5px 5px no-repeat,linear-gradient(135deg,var(--text-muted) 50%,transparent 50%) right 13px center / 5px 5px no-repeat,var(--bg-card);color:var(--text-main);color-scheme:dark;font-family:var(--font-mono);font-size:12px;font-weight:600;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:border-color .15s ease}.preset-select:has(option[value=""]:checked),.preset-select option[value=""]{color:var(--text-muted);font-weight:500}.preset-select:hover{border-color:var(--accent-cyan)}.preset-select:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.preset-select optgroup{color:var(--accent-cyan);background:var(--bg-surface);font-style:normal}.preset-select option{color:var(--text-main);background:var(--bg-card)}.share-group{display:flex;align-items:center;gap:10px;margin-left:auto}.share-status{font-family:var(--font-mono);font-size:11px;font-weight:600;color:#4ade80;min-width:0}.share-status:empty{display:none}.share-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-muted);font-family:var(--font-mono);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;transition:border-color .15s ease,color .15s ease}.share-btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.share-btn:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.workspace-grid{display:grid;grid-template-columns:380px 1fr;gap:24px}@media (max-width: 960px){.workspace-grid{grid-template-columns:1fr}}.card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:24px}.input-group{margin-bottom:18px}.input-group label{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-family:var(--font-mono);font-weight:700;color:var(--text-muted);margin-bottom:6px}.input-preview{font-size:11px;color:var(--accent-cyan);font-family:var(--font-mono)}.preview-err{color:var(--accent-rose)}.input-wrapper{display:flex;align-items:center;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:0 12px;transition:border-color .15s ease}.input-wrapper:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}.input-prefix{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--text-dim);margin-right:8px}.input-wrapper input{width:100%;background:transparent;border:none;outline:none;color:var(--text-main);font-family:var(--font-mono);font-size:15px;font-weight:600;padding:10px 0}.color-picker-group{margin-bottom:20px}.modulus-group{margin-bottom:20px;padding:14px;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);transition:border-color .2s ease,box-shadow .2s ease}.modulus-group:not(.modulus-off){border-color:#f59e0b8c;box-shadow:0 0 0 1px #f59e0b1f,0 0 14px #f59e0b14}.modulus-header{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:12px;font-size:11px;font-family:var(--font-mono);font-weight:700;color:var(--text-muted)}.modulus-toggle{display:inline-flex;align-items:center;gap:8px;padding:2px;border:none;border-radius:999px;background:none;cursor:pointer}.modulus-toggle:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.modulus-toggle-track{position:relative;width:34px;height:18px;border:1px solid var(--border-highlight);border-radius:999px;background:var(--bg-surface);transition:background-color .2s ease,border-color .2s ease}.modulus-toggle-thumb{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--text-muted);transition:transform .2s ease,background-color .2s ease}.modulus-toggle[aria-checked=true] .modulus-toggle-track{border-color:var(--accent-amber);background:#f59e0b40}.modulus-toggle[aria-checked=true] .modulus-toggle-thumb{transform:translate(16px);background:var(--accent-amber)}@media (prefers-reduced-motion: reduce){.modulus-toggle-track,.modulus-toggle-thumb{transition:none}}.modulus-options{display:flex;flex-wrap:wrap;gap:6px}.modulus-btn{padding:6px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-muted);font-family:var(--font-mono);font-size:12px;cursor:pointer;transition:opacity .2s ease}.modulus-btn.active{border-color:var(--accent-amber);color:var(--accent-amber);background:#f59e0b1f}.modulus-off .modulus-btn{opacity:.5}.modulus-off .modulus-btn:hover{opacity:.85}.modulus-btn:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.modulus-status{color:var(--text-dim);font-size:11px;font-family:var(--font-mono);font-weight:600}.modulus-status-active{color:var(--accent-amber)}.color-picker-header{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-family:var(--font-mono);font-weight:700;color:var(--text-muted);margin-bottom:8px}.color-label-text{color:var(--accent-cyan);font-size:11px;font-family:var(--font-mono);font-weight:600}.color-picker-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.swatches-grid{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.swatch-btn{width:28px;height:28px;border-radius:50%;border:2px solid transparent;background:transparent;padding:2px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,border-color .15s ease}.swatch-btn:hover{transform:scale(1.15)}.swatch-btn.active{border-color:#fff;box-shadow:0 0 8px #fff6}.swatch-circle{width:100%;height:100%;border-radius:50%;background:var(--swatch-color);box-shadow:inset 0 1px 2px #ffffff4d,0 2px 4px #0000004d}.custom-color-control{position:relative;display:inline-flex;align-items:center;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:4px 8px;cursor:pointer;transition:all .15s ease}.custom-color-control:hover{border-color:var(--accent-cyan);background:#1e293b}.custom-color-control input[type=color]{position:absolute;opacity:0;width:100%;height:100%;top:0;left:0;cursor:pointer}.custom-color-badge{font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--text-muted);pointer-events:none}.slider-group{margin:16px 0 24px;padding:14px;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-subtle)}.slider-label-row{display:flex;justify-content:space-between;font-size:11px;font-family:var(--font-mono);font-weight:600;color:var(--text-muted);margin-bottom:8px}.slider-val{color:var(--accent-cyan);font-weight:700}.range-slider{width:100%;accent-color:var(--accent-cyan);cursor:pointer}.slider-ticks{display:flex;justify-content:space-between;font-size:9px;font-family:var(--font-mono);color:var(--text-dim);margin-top:4px}.slider-brackets{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin-top:8px;font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--text-muted);text-align:center}.slider-bracket{position:relative;border-top:1px solid var(--border-highlight);padding-top:3px}.slider-bracket:before,.slider-bracket:after{position:absolute;top:0;height:4px;border-left:1px solid var(--border-highlight);content:""}.slider-bracket:before{left:0}.slider-bracket:after{right:0}.slider-bracket-send{grid-column:1 / span 2}.slider-bracket-receive{grid-column:4 / span 4}.result-box{background:#090e1a;border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:16px;margin-bottom:20px}.result-top{display:flex;justify-content:flex-start;margin-bottom:10px}.status-badge{display:inline-block;font-family:var(--font-mono);font-size:10px;font-weight:800;padding:3px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.status-ok{background:#10b98126;color:var(--accent-emerald);border:1px solid rgba(16,185,129,.3)}.status-warn{background:#f43f5e26;color:var(--accent-rose);border:1px solid rgba(244,63,94,.3)}.status-chaos{background:#a855f726;color:var(--accent-violet);border:1px solid rgba(168,85,247,.3)}.status-refund{background:#f59e0b26;color:var(--accent-amber);border:1px solid rgba(245,158,11,.3)}.status-slice{background:#f43f5e26;color:#fda4af;border:1px solid rgba(244,63,94,.3)}.status-err{background:#ef444433;color:#f87171;border:1px solid #ef4444}.equation-display{font-family:var(--font-mono);font-size:17px;font-weight:700;color:var(--text-main);margin-bottom:8px;word-break:break-all}.eq-term{color:#e2e8f0}.eq-op{color:var(--text-dim);padding:0 4px}.eq-result{color:var(--accent-cyan);font-size:20px;font-weight:900}.eq-unit{color:var(--text-dim);font-size:12px}.visualizer-card{min-width:0;display:flex;flex-direction:column;padding:20px;min-height:480px;background:#080c14}.projection-tabs{display:flex;gap:8px;margin-bottom:10px}.projection-tab{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-muted);font-family:var(--font-mono);cursor:pointer}.projection-tab .tab-label{display:inline-block}.projection-tab .tab-indicator{width:8px;height:8px;border-radius:999px;background:#94a3b8b3;box-shadow:0 0 0 1px #0f172acc;opacity:.2;transition:opacity .15s ease,background-color .15s ease,box-shadow .15s ease}.projection-tab.has-value .tab-indicator{opacity:1;background:var(--accent-emerald);box-shadow:0 0 0 1px #10b98166,0 0 12px #10b98166}#imaginary-tab.has-value .tab-indicator{background:var(--accent-amber);box-shadow:0 0 0 1px #f59e0b66,0 0 12px #f59e0b66}.projection-tab.active{border-color:var(--accent-cyan);color:var(--accent-cyan);background:#38bdf81a}.projection-tab:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.projection-summary{color:var(--text-muted);font-family:var(--font-mono);font-size:11px;margin-bottom:10px}.svg-stage{flex:1;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(220px,1fr) auto;gap:16px;padding:16px;align-items:center;background:repeating-linear-gradient(30deg,rgba(255,255,255,.055) 0 1px,transparent 1px 20px),repeating-linear-gradient(-30deg,rgba(255,255,255,.055) 0 1px,transparent 1px 20px),radial-gradient(circle at 50% 50%,#0d1527,#05080f);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;position:relative;min-height:560px}.beverage-svg-canvas{grid-row:2;display:block;width:100%;height:100%;min-height:0;max-height:390px;-webkit-user-select:none;user-select:none}.canvas-panel{min-width:0;max-width:100%;padding:14px 16px;border:1px solid var(--border-highlight);border-radius:var(--radius-md);background:#0f172af0;box-shadow:inset 0 1px #ffffff0f,0 8px 24px #00000038}.canvas-panel-label{color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.8px}.canvas-top-row{grid-row:1;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}.unit-price-panel{margin-left:auto;border-color:#38bdf866}.modulus-panel{border-color:#f59e0b99;background:repeating-linear-gradient(135deg,rgba(245,158,11,.08) 0 6px,transparent 6px 12px),#0f172af0}.modulus-panel .canvas-panel-label{color:var(--accent-amber)}.modulus-panel-value{margin-top:4px;color:var(--accent-amber);font-family:var(--font-mono);font-size:18px;font-weight:800}.modulus-panel-note{color:var(--text-muted);font-family:var(--font-mono);font-size:11px}.svg-stage.modulus-active{border-color:#f59e0bb3;box-shadow:inset 0 0 0 1px #f59e0b59,0 0 18px #f59e0b26}.unit-price-value{margin-top:4px;color:var(--accent-cyan);font-family:var(--font-mono);font-size:20px;font-weight:800;overflow-wrap:anywhere}.unit-price-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.unit-price-help{position:relative}.unit-price-help-button{display:block;width:20px;height:20px;border:1px solid var(--border-highlight);border-radius:50%;background:var(--bg-card);color:var(--text-muted);font-family:var(--font-mono);font-size:12px;cursor:help}.unit-price-help-button:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.unit-price-tooltip{position:absolute;z-index:2;top:100%;right:0;width:240px;max-width:calc(100vw - 120px);padding:10px 12px;border:1px solid var(--border-highlight);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-main);font-size:12px;line-height:1.5;visibility:hidden}.unit-price-help:hover .unit-price-tooltip,.unit-price-help:focus-within .unit-price-tooltip{visibility:visible}.unit-price-value sup{margin-left:2px;font-size:12px}.message-panel{grid-row:3;justify-self:start;align-self:end;width:420px;border-color:#94a3b866}.message-list{display:grid;gap:10px;max-height:240px;margin-top:10px;padding-right:6px;list-style:none;overflow-y:auto;scrollbar-color:var(--border-highlight) transparent}.message-list:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:3px}.message-item{display:flex;gap:8px;padding-left:10px;border-left:2px solid var(--message-accent, var(--text-muted));overflow-wrap:anywhere}.message-item>div{min-width:0}.message-title{color:var(--message-accent, var(--text-main));font-size:12px;font-weight:700}.message-subtitle,.message-text{color:var(--text-muted);font-size:11px;line-height:1.5}.message-subtitle{font-style:italic}.message-icon{color:var(--message-accent, var(--text-muted))}.app-footer{text-align:center;margin-top:36px;font-size:12px;color:var(--text-dim)}.app-footer a{color:var(--text-muted);text-decoration:none}.app-footer a:hover{color:var(--accent-cyan)}