*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #12131e;--surface: #1a1b2e;--surface2: #222338;--border: rgba(255,255,255,.07);--text: #d8dae0;--text-dim: #6b6d80;--accent: #e94560;--green: #4ecca3;--yellow: #f0c040;--red: #e94560;--blue: #7eb8f7;--font-mono: "JetBrains Mono", "Fira Code", "SF Mono", "Cascadia Code", monospace;--row-height: 32px;--row-padding-x: 24px;--col-widths: minmax(200px, 1fr) minmax(120px, max-content) minmax(0, 1fr)}html,body{height:100%;display:flex;flex-direction:column;background:var(--bg);color:var(--text);font-family:var(--font-mono);font-size:14px;overflow:hidden}#topbar{display:flex;align-items:center;justify-content:space-between;padding:0 48px;height:96px;background:var(--surface);flex-shrink:0}.logo{font-size:26px;font-weight:200;color:#fff;letter-spacing:6px;text-transform:uppercase;font-family:Inter,SF Pro Display,Segoe UI,system-ui,sans-serif}.topbar-actions{display:flex;align-items:center;gap:8px}#model-select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-size:12px;font-family:var(--font-mono);cursor:pointer;outline:none}#model-select:focus{border-color:var(--accent)}#proofread-btn{background:transparent;border:1px solid rgba(255,255,255,.15);color:var(--text-dim);font-family:var(--font-mono);font-size:12px;font-weight:500;padding:5px 14px;border-radius:6px;cursor:pointer;transition:all .15s}#proofread-btn:hover:not(:disabled){background:#ffffff0f;border-color:#ffffff4d;color:var(--text)}#proofread-btn:disabled{opacity:.25;cursor:default}#compile-btn{position:fixed;bottom:32px;left:50%;transform:translate(-50%) scale(.9);background:var(--accent);color:#fff;border:none;font-family:var(--font-mono);font-size:15px;font-weight:700;letter-spacing:.5px;padding:12px 40px;border-radius:10px;cursor:pointer;opacity:0;pointer-events:none;transition:none;z-index:100;box-shadow:0 4px 24px #e945604d}#compile-btn.dirty{opacity:1;pointer-events:auto;transform:translate(-50%) scale(1);animation:compilePulse 2.5s ease-in-out infinite;transition:opacity .2s,transform .2s,box-shadow .2s,background .2s}#compile-btn:hover:not(.working){box-shadow:0 6px 32px #e9456080;transform:translate(-50%) scale(1.03)}#compile-btn:active:not(.working){transform:translate(-50%) scale(.97)}#compile-btn.working{background:var(--surface2);color:var(--text);cursor:default;box-shadow:0 4px 20px #0006;animation:none}#compile-btn.status-error{background:#e9456026;color:var(--red);box-shadow:0 4px 20px #e9456033;animation:none}@keyframes compilePulse{0%,to{box-shadow:0 4px 24px #e945604d}50%{box-shadow:0 4px 32px #e9456080}}.key-group{display:flex;align-items:center;gap:4px;margin-left:4px}#api-key-input{background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:var(--font-mono);font-size:11px;padding:5px 10px;width:160px;outline:none;transition:border-color .15s}#api-key-input:focus{border-color:var(--accent)}#api-key-input::placeholder{color:var(--text-dim);opacity:.5}#api-key-status{font-size:12px;width:14px;text-align:center}.banner{display:flex;align-items:center;justify-content:space-between;padding:8px 20px;font-size:13px;gap:16px;flex-shrink:0}.banner.hidden{display:none}.banner--warn{background:#f0c04014;border-bottom:1px solid rgba(240,192,64,.2);color:var(--yellow)}.banner--error{background:#e9456014;border-bottom:1px solid rgba(233,69,96,.2);color:var(--red)}.banner-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}.banner-actions button{background:none;border:1px solid currentColor;color:inherit;border-radius:5px;padding:3px 10px;font-family:var(--font-mono);font-size:12px;cursor:pointer;transition:background .1s}.banner-actions button:hover{background:#ffffff14}.btn-dismiss{border:none!important;font-size:18px;line-height:1;padding:2px 6px!important;opacity:.6}.btn-dismiss:hover{opacity:1}#tab-bar{display:flex;align-items:stretch;background:var(--surface);padding:0 12px;height:34px;flex-shrink:0;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border)}#tab-bar::-webkit-scrollbar{display:none}.tab{display:flex;align-items:center;gap:5px;padding:0 10px 0 14px;cursor:pointer;font-size:12px;color:var(--text-dim);-webkit-user-select:none;user-select:none;flex-shrink:0;max-width:190px;border-bottom:2px solid transparent;transition:color .1s,border-color .15s;position:relative}.tab:hover{color:var(--text)}.tab--active{color:var(--text);border-bottom-color:var(--accent)}.tab-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.tab-dirty{color:var(--accent);font-size:7px;flex-shrink:0;line-height:1}.tab-close{background:none;border:none;color:var(--text-dim);cursor:pointer;padding:1px 3px;border-radius:3px;font-size:14px;line-height:1;flex-shrink:0;opacity:0;transition:opacity .1s}.tab:hover .tab-close,.tab--active .tab-close{opacity:.6}.tab-close:hover{opacity:1;background:#ffffff14;color:var(--text)}#new-tab-btn{background:none;border:none;color:var(--text-dim);cursor:pointer;padding:2px 8px;font-size:18px;line-height:1;border-radius:4px;flex-shrink:0;opacity:.5;transition:opacity .1s}#new-tab-btn:hover{opacity:1;color:var(--text)}#editor{display:grid;grid-template-columns:var(--col-widths);grid-template-rows:auto 1fr;flex:1;min-height:0;overflow:hidden}#editor.python-hidden{--col-widths: minmax(200px, 1fr) minmax(120px, max-content)}#editor.python-hidden .cell-python,#editor.python-hidden .col-python-header{display:none}.editor-header{display:contents}.col-header{padding:5px 16px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-dim);background:var(--surface2);border-bottom:1px solid var(--border);border-right:1px solid var(--border);display:flex;align-items:center;gap:12px}.col-header:last-child{border-right:none}.ctl{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-dim);transition:color .1s}.ctl:hover{color:var(--text)}.ctl input[type=checkbox]{accent-color:#5a6a8a;width:12px;height:12px;cursor:pointer}#editor-rows{grid-column:1 / -1;min-height:0;overflow-y:auto;padding-bottom:40vh;display:grid;grid-template-columns:subgrid;grid-auto-rows:auto;align-content:start}.calc-row{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;border-bottom:1px solid rgba(255,255,255,.03);min-height:var(--row-height)}.cell-input{padding:0 var(--row-padding-x);line-height:var(--row-height);color:var(--text);font-family:var(--font-mono);font-size:14px;white-space:pre-wrap;word-break:break-word;overflow:hidden;border-right:1px solid var(--border);outline:none;caret-color:var(--accent);cursor:text}.cell-input.nowrap{white-space:pre;word-break:normal;overflow-x:auto}.cell-python{background:#0000002e;border-right:1px solid var(--border);overflow:hidden;position:relative}.py-line{height:var(--row-height);line-height:var(--row-height);padding:0 var(--row-padding-x);white-space:pre;overflow:hidden;text-overflow:ellipsis;font-size:13px}.cell-python.wrap .py-line{white-space:pre-wrap;word-break:break-all;height:auto;min-height:var(--row-height)}.cell-python.wrap.compress .py-line{padding-left:calc(var(--row-padding-x) + 2em);text-indent:-2em}.py-sep{color:#2e2e42}.tok-keyword{color:#7eb8f7}.tok-builtin{color:#c678dd}.tok-string{color:#98c379}.tok-number{color:#d19a66}.tok-comment{color:#4a5568;font-style:italic}.tok-lineref{display:none}#editor-rows.debug .tok-lineref{display:inline;color:#2d3748;font-style:italic}.tok-ident{color:var(--text)}.tok-op,.tok-punct{color:#abb2bf}.cell-result{display:flex;flex-direction:column;min-height:var(--row-height);color:var(--green);font-weight:400;overflow:hidden}.cell-result.error{padding:8px var(--row-padding-x) 0;color:var(--red);font-weight:400;font-size:12px;opacity:.7}.cell-result.streaming{opacity:.45}.cell-result.streaming.error{color:var(--text-dim)}.cell-result--heading{padding:8px var(--row-padding-x) 0;justify-content:flex-start}.result-heading{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-heading.h1{font-size:13px;font-weight:700;color:var(--text);text-transform:uppercase;letter-spacing:1px}.result-heading.h2{font-size:11px;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.8px}.result-heading.h3{font-size:12px;font-weight:400;color:var(--text-dim)}.result-item{display:flex;align-items:center;justify-content:flex-end;padding:0 var(--row-padding-x);min-height:var(--row-height);gap:6px;position:relative;cursor:pointer;transition:background .1s}.result-item:hover{background:#ffffff05}.result-label{color:var(--blue);font-weight:400;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:25ch}.result-num{display:flex}.result-int{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;white-space:pre;flex-shrink:0;min-width:8ch}.result-frac{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:left;white-space:pre;flex-shrink:0;min-width:var(--frac-width, 0px)}.result-unit{color:#acacc8;white-space:nowrap;min-width:var(--unit-width, 0px);flex-shrink:0;margin-left:4px}.result-debug{display:none;position:absolute;left:0;right:0;bottom:0;padding:1px var(--row-padding-x);font-size:10px;color:var(--text-dim);opacity:.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.result-item.debug{padding-bottom:14px}.result-item.debug .result-debug{display:block}.result-item.copied{animation:copyFlash .4s ease-out}@keyframes copyFlash{0%{background:#4ecca333}to{background:transparent}}.col-hint{font-size:10px;font-weight:400;text-transform:none;letter-spacing:0;color:var(--text-dim);opacity:.4;transition:opacity .15s}#result-header{cursor:pointer}#result-header:hover .col-hint{opacity:1}#result-header.copied{animation:copyFlash .4s ease-out}.col-restore-btn{display:none;margin-left:auto;font:inherit;font-size:10px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-dim);background:transparent;border:1px solid var(--border);border-radius:3px;padding:2px 8px;cursor:pointer;transition:color .15s,border-color .15s}.col-restore-btn:hover{color:var(--text);border-color:var(--text-dim)}#editor.python-hidden .col-restore-btn{display:inline-block}#editor-rows:has(.calc-row:only-child) .calc-row:only-child{min-height:120px}#editor-rows:has(.calc-row:only-child) .cell-input:empty:after,#editor-rows:has(.calc-row:only-child) .cell-input:has(br:only-child):after{content:"Type your notes and numbers here…\a®xamples:\a  5 apples\a  3 bananas\a  total fruit";white-space:pre-wrap;color:var(--text-dim);opacity:.35;font-size:13px;pointer-events:none;padding-top:12px;display:block}#editor-rows:has(.calc-row:only-child) .cell-result:not(:has(*)):after{content:"Computed resultsªppear here";white-space:pre-wrap;color:var(--text-dim);opacity:.25;font-size:12px;pointer-events:none;padding:12px var(--row-padding-x) 0;display:block}#editor-rows:has(.calc-row:only-child) .cell-python:not(:has(.py-line:not(:empty))):after{content:"Auto-generated¬ode";white-space:pre-wrap;color:var(--text-dim);opacity:.2;font-size:12px;pointer-events:none;padding:0 var(--row-padding-x);padding-top:12px;display:block;position:absolute;top:0}#editor-rows::-webkit-scrollbar{width:6px}#editor-rows::-webkit-scrollbar-track{background:transparent}#editor-rows::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:3px}#editor-rows::-webkit-scrollbar-thumb:hover{background:#ffffff29}
