@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=JetBrains+Mono:wght@400;500&display=swap');
:root{color-scheme:dark;--bg:#000;--surface:#0a0a0b;--panel:#0d0d0f;--raised:#141416;--line:#ffffff12;--border:#ffffff20;--text:#e8e8ea;--muted:#737378;--soft:#aaaab0;--hover:#ffffff08;--button:#f0f0f0;--button-text:#161618;--code:#101012;--green:#afc7b3}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font:13px 'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif}button,input,select,textarea{font:inherit}button,a,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:none;border:0}button:disabled{opacity:.3;cursor:default}button:hover:not(:disabled){background:var(--hover)}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:1px solid var(--soft);outline-offset:3px}a{color:inherit;text-decoration:none}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}header{height:76px;padding:0 28px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:linear-gradient(105deg,var(--bg),var(--surface));z-index:5;position:relative}.wordmark{font-size:32px;letter-spacing:-2px;font-weight:650;line-height:1}.header-divider{width:1px;height:23px;background:var(--border)}.project-switch{display:flex;gap:22px;align-items:center;padding:8px 0;font-size:13px}.chevron{color:var(--muted)}.pill{color:var(--muted);font-size:10px;border:1px solid var(--line);border-radius:20px;padding:5px 9px}.header-right{margin-left:auto;display:flex;align-items:center;gap:17px}.local-indicator{font-size:11px;color:var(--soft);display:flex;align-items:center;gap:8px}.local-indicator i{width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 12px #afc7b32b}.icon-btn{width:32px;height:32px;border-radius:7px;font-size:19px;display:inline-grid;place-items:center;color:var(--soft)}.account-btn{padding:9px 13px;border:1px solid var(--border);border-radius:8px;font-size:11px;background:linear-gradient(110deg,#ffffff0c,#ffffff03)}.account-btn span{margin-left:15px;color:var(--muted)}.app{display:flex;height:calc(100dvh - 76px)}.activity{width:64px;flex-shrink:0;border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column;padding:20px 0;gap:15px}.activity button{width:38px;height:38px;display:grid;place-items:center;border-radius:9px;color:var(--muted);position:relative}.activity button.active{color:var(--text);background:var(--raised)}.activity button.active:before{content:'';position:absolute;left:-13px;top:11px;height:16px;width:2px;background:var(--text);border-radius:2px}.nav-bottom{margin-top:auto;display:flex;flex-direction:column;gap:13px}aside{width:235px;min-width:195px;position:relative;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--surface)}.side-heading{height:60px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;font-size:9px;font-weight:600;letter-spacing:1.6px;color:var(--muted)}#fileActions{display:flex;gap:5px}.mini-btn{font-size:17px;color:var(--muted);width:24px;height:24px;border-radius:4px}#sideBody{flex:1;overflow:auto;padding:0 10px}.folder-label{font-size:11px;display:flex;gap:9px;padding:12px 10px;color:var(--soft)}.file-row{display:flex;align-items:center;width:100%;gap:10px;text-align:left;padding:10px 10px 10px 23px;border-radius:6px;color:var(--soft);font-size:12px}.file-row.active{background:#ffffff09;color:var(--text)}.file-glyph{font:10px 'JetBrains Mono',monospace;color:var(--muted);width:19px;text-align:center}.file-row .file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.file-row .file-menu{opacity:0;font-size:14px}.file-row:hover .file-menu{opacity:1}.side-footer{padding:22px 20px;color:var(--muted);font-size:9px;line-height:1.9;border-top:1px solid var(--line);white-space:nowrap}.small-brand{font-size:10px;margin-bottom:5px}.small-brand strong{font-size:18px;font-weight:600;letter-spacing:-1px;margin-left:4px;color:var(--soft)}main{min-width:0;display:flex;flex:1;flex-direction:column;background:var(--code)}.workspace-toolbar{height:62px;padding:0 23px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface)}.crumb{display:flex;gap:12px;font-size:11px;color:var(--soft)}.crumb span:nth-child(2){color:var(--muted)}.muted{color:var(--muted)}.run-controls{display:flex;gap:9px;align-items:center}select{background:var(--surface);color:var(--soft);border:1px solid var(--line);padding:7px 10px;border-radius:6px;font-size:11px;max-width:125px}.run-btn{display:flex;align-items:center;gap:9px;background:var(--button);color:var(--button-text);font-size:11px;font-weight:600;border-radius:6px;padding:8px 11px;min-width:103px;justify-content:center}.run-btn:hover:not(:disabled){background:#d4d4d4}.run-btn>span{font-size:17px;line-height:15px}kbd{font:10px 'DM Sans',sans-serif;color:#777;margin-left:10px}#tabs{display:flex;height:42px;min-height:42px;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow-x:auto}.tab{display:flex;gap:9px;align-items:center;border-right:1px solid var(--line);font-size:11px;padding:0 17px;min-width:140px;position:relative;color:var(--muted);white-space:nowrap}.tab[aria-selected=true]{background:var(--code);color:var(--text)}.tab[aria-selected=true]:before{content:'';height:1px;background:var(--soft);position:absolute;top:0;left:0;right:0}.tab-close{margin-left:auto;color:var(--muted);padding:3px}.tab .file-glyph{font-size:9px}.editor-area{flex:1;position:relative;min-height:120px;padding-top:22px}#editor{position:absolute;inset:22px 0 0}#fallbackEditor{display:none;position:absolute;inset:22px 0 0;width:100%;height:calc(100% - 22px);background:var(--code);color:var(--text);padding:0 25px 30px 65px;border:0;resize:none;outline:0;font:13px/25px 'JetBrains Mono',monospace;tab-size:4}body.fallback #fallbackEditor{display:block}.editor-watermark{position:absolute;right:40px;bottom:35px;font-weight:600;font-size:90px;letter-spacing:-8px;color:#ffffff02;pointer-events:none}.editor-note{position:absolute;bottom:18px;right:26px;color:var(--muted);font-size:9px;letter-spacing:.4px;pointer-events:none;opacity:.55}.resize-handle{height:5px;min-height:5px;cursor:row-resize;background:var(--surface);border-top:1px solid var(--line)}.resize-handle:hover{background:var(--border)}.bottom-panel{height:235px;min-height:100px;max-height:65vh;display:flex;flex-direction:column;background:var(--surface)}.bottom-tabs{height:46px;min-height:46px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 19px;gap:10px}.bottom-tabs>div{display:flex;gap:24px;height:100%;align-items:center}.bottom-tabs button[data-bottom]{height:100%;position:relative;padding:0;color:var(--muted);font-size:11px}.bottom-tabs button.active{color:var(--text)}.bottom-tabs button.active:after{content:'';height:1px;position:absolute;bottom:-1px;left:0;right:0;background:var(--soft)}#problemCount{font-size:9px;border:1px solid var(--border);border-radius:4px;padding:1px 4px;margin-left:5px}.lock-mark{font-size:9px;margin-left:4px}.bottom-tools{gap:9px!important}#runtimeStatus{font-size:9px;color:var(--muted)}.bottom-view{flex:1;min-height:0;overflow:auto;padding:15px 24px}.bottom-view[hidden]{display:none}.output-intro{display:flex;gap:18px;align-items:center;height:100%;min-height:110px;color:var(--muted)}.output-symbol{font-size:27px;align-self:center;padding:10px;border:1px solid var(--line);border-radius:12px}.output-intro strong{font-size:13px;font-weight:450;color:var(--soft)}.output-intro p{font-size:11px;margin:7px 0}.shortcut{margin-left:auto;font:10px 'JetBrains Mono',monospace;color:var(--muted)}pre{font:11px/1.9 'JetBrains Mono',monospace;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:var(--soft)}.out-error{color:#e7a7a7}.out-info{color:var(--muted)}.out-success{color:var(--green)}.input-label{display:block;font-size:11px;color:var(--soft);margin-bottom:12px}.input-label span{margin-left:12px;color:var(--muted);font-size:10px}#stdin{background:transparent;color:var(--text);border:0;outline:0;width:100%;height:110px;resize:none;font:12px/1.8 'JetBrains Mono',monospace}#terminalForm{display:flex;gap:10px;align-items:center;font:11px/1.9 'JetBrains Mono',monospace;margin-top:8px}#prompt{color:var(--green)}#terminalInput{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--text);font:inherit}.empty-note{font-size:11px;color:var(--muted);line-height:1.9}.statusbar{height:29px;min-height:29px;border-top:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:9px;color:var(--muted)}.statusbar>div{display:flex;align-items:center;gap:15px}.branch-symbol{font-size:11px;margin-right:-8px}.status-sep{opacity:.4}.copyright{margin-left:10px}#syncStatus{font-size:9px}dialog{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:16px;padding:35px;width:min(480px,92vw);max-height:85vh;box-shadow:0 40px 150px #0008;overflow:auto}dialog::backdrop{background:#000a;backdrop-filter:blur(12px)}.modal-close{position:absolute;right:14px;top:12px}h1,h2,h3,p{margin-top:0}h2{font-size:26px;letter-spacing:-1px;font-weight:550}h3{font-size:13px;font-weight:500;margin-bottom:12px}.modal-sub{font-size:12px;color:var(--muted);line-height:1.8;margin:12px 0 25px}label.field{display:block;font-size:11px;color:var(--soft);margin:17px 0}label.field input,.field-input{width:100%;border:1px solid var(--border);background:var(--surface);border-radius:7px;color:var(--text);padding:12px;margin-top:8px;outline:0}label.field input:focus{border-color:var(--muted)}.primary{padding:12px 16px;background:var(--button);color:var(--button-text);border-radius:7px;font-size:12px;width:100%}.primary:hover:not(:disabled){background:#ccc}.secondary{padding:10px;border:1px solid var(--border);border-radius:6px;font-size:11px}.text-btn{font-size:11px;color:var(--soft);text-decoration:underline;text-underline-offset:4px;padding:8px 0}.auth-switch{display:flex;justify-content:space-between;margin-top:15px}.feedback{font-size:11px;line-height:1.8;color:var(--soft);margin-top:15px}.modal-wordmark{font-size:36px;font-weight:600;letter-spacing:-2px;margin-bottom:5px}.modal-footer{font-size:9px;color:var(--muted);margin-top:30px;text-align:center}.project-card{border:1px solid var(--line);border-radius:8px;margin:8px 0;padding:12px;text-align:left;display:block;width:100%}.project-card.selected{border-color:var(--muted)}.project-card strong{font-size:12px;font-weight:500;display:block}.project-card small{font-size:9px;color:var(--muted);margin-top:6px;display:block}.side-section{padding:12px 10px}.side-section h3{font-size:11px;color:var(--soft);margin-bottom:15px}.side-section p{font-size:10px;color:var(--muted);line-height:1.8}.side-section .secondary{width:100%;margin-bottom:10px}.runtime-card{padding:12px;border:1px solid var(--line);border-radius:8px;margin:9px 0;font-size:11px}.runtime-card>span{float:right;font-size:8px;color:var(--muted);padding-top:2px}.runtime-card p{margin:7px 0 0;font-size:9px;line-height:1.7}.search-box{width:100%;border:1px solid var(--border);background:var(--raised);color:var(--text);padding:10px;border-radius:6px;font-size:11px}.search-result{width:100%;text-align:left;padding:10px;font-size:10px;color:var(--soft);line-height:1.8;border-bottom:1px solid var(--line)}.setting-row{display:flex;align-items:center;justify-content:space-between;margin:17px 0;font-size:11px}.setting-row input{max-width:60px;background:var(--raised);border:1px solid var(--line);color:var(--text);padding:5px;border-radius:4px}.command{display:flex;width:100%;text-align:left;padding:13px 9px;justify-content:space-between;border-bottom:1px solid var(--line);font-size:12px}.command span{color:var(--muted);font-size:10px}#toast{position:fixed;bottom:45px;left:50%;transform:translate(-50%,20px);background:var(--raised);border:1px solid var(--border);color:var(--text);padding:12px 20px;border-radius:9px;opacity:0;pointer-events:none;transition:all .2s;z-index:100;max-width:90vw;font-size:12px}#toast.visible{opacity:1;transform:translate(-50%,0)}.problem-row{display:block;text-align:left;width:100%;font:11px/1.8 'JetBrains Mono',monospace;color:#e7a7a7}.warning{border:1px solid var(--border);border-radius:7px;padding:12px;font-size:11px;color:var(--soft);line-height:1.8;margin:12px 0}.light{display:none}:root[data-theme=light]{color-scheme:light;--bg:#fff;--surface:#fafafa;--panel:#fff;--raised:#f0f0f1;--line:#0000000d;--border:#00000020;--text:#18181b;--muted:#929297;--soft:#606068;--hover:#00000006;--button:#18181b;--button-text:#fff;--code:#fff;--green:#52765c}:root[data-theme=light] .file-row.active{background:#00000008}:root[data-theme=light] .out-error{color:#a63434}:root[data-theme=light] .editor-watermark{color:#00000003}@media(prefers-reduced-motion:no-preference){.app{animation:appear .5s ease-out}@keyframes appear{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}button{transition:background .15s,color .15s}}@media(min-width:1600px){aside{width:265px}.editor-area{padding-top:32px}#editor{top:32px}.bottom-panel{height:280px}}@media(max-width:1000px){header{padding:0 18px;gap:15px}.pill{display:none}aside{width:200px}.activity{width:52px}.activity button.active:before{left:-7px}.header-right{gap:8px}.copyright,.shortcut{display:none}.bottom-tabs>div{gap:16px}#runtimeStatus{display:none}}@media(max-width:720px){header{height:62px;padding:0 16px}.wordmark{font-size:28px}.app{height:calc(100dvh - 62px)}.local-indicator,.header-divider,.header-right #commandsBtn{display:none}.project-switch{font-size:11px;gap:8px}.header-right{gap:2px}.account-btn{font-size:10px;padding:8px}.account-btn span{display:none}.activity{width:45px;gap:10px;padding-top:15px}.activity button{width:32px;height:32px}.activity button.active:before{left:-6px}aside{display:none;position:absolute;left:45px;top:62px;bottom:0;z-index:15;width:240px;box-shadow:30px 0 80px #0009}body.sidebar-open aside{display:flex}.workspace-toolbar{height:52px;padding:0 12px}.crumb{font-size:10px;gap:6px}.crumb .muted,.crumb span:nth-child(2){display:none}.run-controls{gap:3px}.run-btn{min-width:68px;padding:8px}kbd{display:none}select{font-size:10px;max-width:110px;padding:6px}.tab{min-width:118px;padding:0 12px}.bottom-tabs{padding:0 12px}.bottom-tabs>div{gap:13px}.bottom-tabs button[data-bottom]{font-size:10px}.bottom-view{padding:12px 15px}.output-intro{gap:12px}.output-intro p{font-size:10px}.output-symbol{font-size:21px}.statusbar{padding:0 10px;font-size:8px}.statusbar>div{gap:8px}#syncStatus,.statusbar .status-sep{display:none}.bottom-panel{height:230px}.editor-note{display:none}}
.output-intro[hidden]{display:none}
#webPreviewPanel{position:absolute;inset:0;background:var(--surface);display:flex;flex-direction:column;z-index:4}.web-preview-heading{height:40px;min-height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-size:10px;color:var(--muted);border-bottom:1px solid var(--border)}#webPreviewPanel iframe{width:100%;flex:1;border:0;background:#fff}

/* Touch-first narrow workspace and a real output splitter. */
.resize-handle{height:12px;min-height:12px;position:relative;touch-action:none;user-select:none;z-index:3}.resize-handle:after{content:'';position:absolute;width:42px;height:3px;border-radius:4px;background:var(--muted);top:4px;left:50%;transform:translateX(-50%)}.resize-handle:focus-visible{outline:1px solid var(--soft);outline-offset:-2px}.bottom-panel{flex-shrink:0}.editor-area{min-height:135px}
@media(max-width:720px){header{gap:8px;padding:0 10px}.project-switch{min-width:0;max-width:30vw;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.project-switch span:first-child{overflow:hidden;text-overflow:ellipsis}.header-right{min-width:0}.account-btn{max-width:26vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activity{width:42px}.activity button{width:38px;height:42px}aside{left:42px;top:62px;width:min(280px,calc(100vw - 42px));bottom:env(safe-area-inset-bottom);box-shadow:15px 0 50px #0008}.workspace-toolbar{padding:0 8px;gap:4px}.crumb{min-width:0;overflow:hidden;white-space:nowrap}.crumb #crumbFile{overflow:hidden;text-overflow:ellipsis}.run-controls{flex:none}.run-btn{min-width:54px}.bottom-panel{height:32dvh;max-height:75dvh;min-height:100px}.bottom-tabs{padding:0 8px;overflow-x:auto;flex-shrink:0}.bottom-tabs>div{gap:12px;white-space:nowrap}.bottom-tabs button[data-bottom]{font-size:11px}.bottom-tools{flex:none}.statusbar .copyright,.statusbar #languageStatus,.statusbar #cursor{display:none}.editor-area{padding-top:6px}#editor,#fallbackEditor{top:6px}.editor-watermark{display:none}.resize-handle{height:24px;min-height:24px}.resize-handle:after{top:10px;width:55px;height:4px}.bottom-view{overscroll-behavior:contain}.bottom-panel{padding-bottom:env(safe-area-inset-bottom)}}
@media(max-width:390px){header{height:56px}.app{height:calc(100dvh - 56px)}aside{top:56px}.wordmark{font-size:24px}.project-switch{max-width:23vw}select{max-width:83px}.bottom-tabs>div{gap:10px}.bottom-tabs button[data-bottom]{font-size:10px}.bottom-tools #clearBtn{display:none}}
