:root{font-family:Arial,Tahoma,sans-serif;color:#30343a;background:#fafafa;--explorer:240px;--tabs:220px;--accent:#287b62}*{box-sizing:border-box}body{margin:0}button,select,a{font:inherit}button,select{border:1px solid #d5d9db;border-radius:4px;background:#fff;color:inherit;padding:7px 10px}button,summary{cursor:pointer}button:hover{background:#edf2ef}button:disabled,select:disabled{opacity:.65;cursor:not-allowed}button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid #287b62;outline-offset:2px}.topbar{height:52px;display:flex;align-items:center;gap:12px;background:#343839;color:#fff;padding:0 18px}.brand,.wordmark{font-size:24px;font-weight:800;letter-spacing:-1px}.brand span,.wordmark span{font-size:12px;letter-spacing:2px;margin-left:10px;font-weight:500}.badge{font:10px monospace;letter-spacing:.7px;border:1px solid #b9c4bf;padding:4px 7px;border-radius:3px;white-space:nowrap}.topbar .badge{color:#bacdc4;border-color:#596860}.account{margin-left:auto;font-size:12px;color:#d5dbd8}.topbar button{font-size:11px;background:transparent;color:#fff;border-color:#656b68}.menu{display:flex;align-items:center;gap:6px;background:#f1f2f0;border-bottom:1px solid #dadeda;padding:8px 16px;flex-wrap:wrap;font-size:12px}.menu label{display:flex;align-items:center;gap:8px;margin-right:10px}details{position:relative}summary{padding:8px;list-style:none}.dropdown{position:absolute;z-index:20;top:32px;left:0;width:250px;padding:5px;background:#fff;border:1px solid #ddd;box-shadow:0 8px 25px #0002}.dropdown button{display:block;width:100%;text-align:left;border:0}kbd{font:10px monospace;border:1px solid #ccd2ce;border-radius:3px;padding:2px 4px;color:#68736d;white-space:nowrap}.dropdown kbd{float:right}.projectbar{display:flex;align-items:center;gap:10px;padding:9px 18px;border-bottom:1px solid #dfe2e0;font-size:12px;background:#fff}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}.mode-label{margin-left:auto}.projectbar .muted{font-size:11px}.ide{display:grid;grid-template-columns:var(--explorer) 5px var(--tabs) 5px minmax(0,1fr);height:calc(100dvh - 178px);min-height:180px}aside{background:#f3f4f2;overflow:auto;min-width:0}.panel-heading{font-size:10px;letter-spacing:1.3px;color:#778078;padding:14px 12px;display:flex;align-items:center;justify-content:space-between;height:42px}.panel-heading button{font-size:16px;border:0;background:transparent;padding:1px 5px}.breadcrumb{padding:0 10px 10px;font:11px monospace;overflow-wrap:anywhere;color:#747c75}#entries button{width:100%;border:0;border-radius:0;background:transparent;text-align:left;padding:8px 12px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#entries button:hover{background:#e6ebe6}.folder-icon{color:#777;margin-right:8px}.file-icon{color:#748778;margin-right:8px}.splitter{background:#e0e4df;cursor:col-resize;touch-action:none}.splitter:hover,.splitter:focus{background:#6d9981}.tab{display:flex;border-bottom:1px solid #e0e5df;align-items:center;padding-right:5px;gap:3px}.tab.active{background:#e0e8e2;box-shadow:inset 3px 0 var(--accent)}.tab [role=tab]{flex:1;min-width:0;text-align:left;border:0;background:transparent;padding:10px 8px 10px 12px;border-radius:0;font:12px monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tab.active [role=tab]{font-weight:bold}.tab .close{border:0;background:transparent;padding:5px;font-size:11px;opacity:.65}.dirty{color:#b04f36;font-weight:bold;margin-right:4px}.editor-panel{position:relative;min-width:0;background:#fff;overflow:hidden;display:flex;flex-direction:column}.editor-heading{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px 14px;background:#fff;border-bottom:1px solid #e8ebe7;font:11px monospace;min-height:37px;overflow:hidden}#file-path{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#buffer-state{white-space:nowrap;font-size:10px}#editor{flex:1;min-height:0}#empty{position:absolute;inset:80px 16px 16px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#868e86;text-align:center;background:#fff}#empty[hidden]{display:none}.empty-mark{font:68px monospace;color:#bdcbbf;font-weight:300}#empty h1{font-size:20px;font-weight:500;color:#5a685c}#empty p{font-size:13px;line-height:1.9}.keyhint{font-size:11px;margin-top:24px}footer{display:flex;align-items:center;gap:16px;height:28px;background:#eef2ed;border-top:1px solid #dbe2da;padding:0 12px;font:10px monospace}#message{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#message.error{color:#a5362e}.mobile-nav{display:none}.muted{color:#7c847d}.focus #explorer,.focus #split-explorer{display:none}.ide.focus{grid-template-columns:var(--tabs) 5px minmax(0,1fr)}dialog{border:1px solid #d5ddd4;border-radius:10px;max-width:460px;padding:26px;box-shadow:0 20px 80px #0003}dialog::backdrop{background:#20282066}dialog h2{font-size:20px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.danger{background:#a83e33;color:#fff}.login{max-width:900px;margin:0 auto;padding:64px 32px}.login .wordmark{border-bottom:1px solid #d6ddd5;padding-bottom:24px}.eyebrow{font:11px monospace;letter-spacing:2px;margin-top:80px;color:#647965}.login h1{font-size:clamp(32px,5vw,54px);font-weight:500;line-height:1.2;letter-spacing:-2px}.login p{line-height:1.8;color:#737e74;font-size:14px}.primary{display:inline-flex;gap:40px;padding:15px 22px;background:#2a634a;color:#fff;text-decoration:none;border-radius:5px;margin:20px 0}.login .muted{font-size:11px}.dragging{opacity:.4}
@media(max-width:1000px){.projectbar>.muted{display:none}.account{max-width:200px;overflow:hidden;text-overflow:ellipsis}.topbar .badge{display:none}}
@media(max-width:760px){.topbar{height:auto;min-height:48px;padding:8px 10px;gap:8px;flex-wrap:wrap}.brand{font-size:20px}.brand span{font-size:10px}.account{font-size:10px;max-width:130px}.topbar button{font-size:10px;padding:5px}.menu{padding:6px;gap:3px}.menu kbd{display:none}.menu label{width:100%}.menu label select{flex:1}.menu button{font-size:11px;padding:6px}.projectbar{flex-wrap:wrap;padding:7px 10px;gap:7px}.mode-label{font-size:10px}.mode-label select{max-width:105px;padding:4px}.mobile-nav{display:flex;gap:6px;padding:5px 8px;border-bottom:1px solid #ddd;background:#f8f9f6}.mobile-nav button{font-size:11px}.ide,.ide.focus{display:block;height:calc(100dvh - 250px);position:relative}.editor-panel{height:100%}.ide aside{display:none;position:absolute;top:0;bottom:0;width:min(85vw,320px);z-index:15;box-shadow:10px 0 30px #0002}.ide.explorer-open #explorer,.ide.tabs-open #open-files{display:block}.splitter{display:none}#buffer-state{display:none}footer{font-size:9px;height:30px;gap:7px}footer>span:last-child{display:none}#empty{inset:42px 12px 12px}.login{padding:32px 24px}.eyebrow{margin-top:60px}}
/* M4 compact shell: independent panels and explicit mutation controls. */
body:has(#ide){height:100dvh;display:flex;flex-direction:column;overflow:hidden}.topbar{height:43px;min-height:43px}.brand{font-size:21px}.menu{padding:2px 12px;min-height:35px;flex-wrap:nowrap}.menu summary{padding:7px 12px}.menu .project-picker{margin-left:auto;margin-right:0}.menu select{padding:4px 8px;max-width:280px}.toolbar{display:flex;align-items:center;gap:5px;padding:5px 12px;background:#f8faf8;border-bottom:1px solid #dce2dc;min-height:40px;flex-wrap:wrap}.toolbar button{font-size:11px;padding:5px 9px}.toolbar-divider{height:20px;border-left:1px solid #d9dfda;margin:0 3px}.projectbar{min-height:34px;padding:5px 12px}.projectbar .mode-label{display:flex;align-items:center;gap:5px}.mode-label select{padding:3px 5px;font-size:11px}.ide{flex:1;min-height:0;height:auto}.ide>*{min-width:0}.editor-heading{min-height:32px;padding:7px 12px}footer{min-height:26px;height:26px}.hide-explorer #explorer,.hide-explorer #split-explorer,.hide-tabs #open-files,.hide-tabs #split-tabs,.focus #open-files,.focus #split-tabs{display:none}.entry-row{display:flex;align-items:center}.entry-row>[role=listitem]{flex:1;min-width:0}#entries .entry-more{width:26px;min-width:26px;padding:5px 2px;text-align:center;opacity:.4}#entries .entry-more:hover{opacity:1}.entry-row:hover{background:#e6ebe6}.context-menu{position:fixed;width:210px;z-index:60;background:#fff;border:1px solid #cdd6ce;box-shadow:0 8px 25px #0003;padding:4px;border-radius:5px}.context-menu button{display:block;text-align:left;width:100%;border:0}.context-menu[hidden]{display:none}.wide-dialog{width:min(1000px,94vw);max-width:1000px;max-height:88dvh;overflow:auto}.wide-dialog h2{font-size:18px}.wide-dialog pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.5 monospace;max-height:42dvh;overflow:auto;padding:12px;background:#f5f7f4;border:1px solid #dbe2db}.version-row{display:flex;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid #e5e9e4;font-size:12px}.version-row span{flex:1}.version-row button{padding:5px 9px;font-size:11px}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.compare-grid>div{min-width:0}.compare-grid h3{font-size:13px}.badge.live{background:#ab3329;color:white;border-color:#ab3329}.dialog-actions{flex-wrap:wrap}dialog{max-height:90dvh;overflow:auto}dl{font-size:13px;line-height:1.5}dt{font-weight:bold}dd{margin-bottom:10px}.dropdown{top:29px;width:260px}.dropdown button{font-size:12px}.dropdown button[aria-pressed=true]::after{content:' ✓';color:#287b62}button:disabled{opacity:.4}#retry{color:#a5362e;border-color:#a5362e}.editor-heading .dirty{color:#a44a22}
@media(max-width:1000px){.toolbar{gap:3px}.toolbar button{padding:5px 7px}.projectbar .muted{display:none}.menu .project-picker{max-width:45%}.menu .project-picker select{min-width:0;max-width:100%}}
@media(max-width:760px){.topbar{min-height:42px;height:auto}.menu{flex-wrap:nowrap;padding:2px 5px;gap:0}.menu label.project-picker{width:auto;font-size:0;max-width:38%;margin-left:auto}.menu .project-picker select{font-size:11px}.menu summary{padding:7px 8px}.menu #help{font-size:10px;padding:5px}.toolbar{padding:4px 6px;min-height:34px;gap:3px}.toolbar button{font-size:10px;padding:5px}.toolbar-divider{display:none}.toolbar button[data-action=toggle-explorer],.toolbar button[data-action=toggle-tabs]{display:none}.ide,.ide.focus{height:auto;min-height:0;display:block!important}.ide aside{width:min(86vw,320px)}.ide.explorer-open #explorer,.ide.tabs-open #open-files{display:block!important}.editor-panel{height:100%}.projectbar{flex-wrap:nowrap}.projectbar #project-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:30%}.projectbar .badge{font-size:8px;letter-spacing:0;padding:4px}.mode-label{font-size:0}.mode-label select{font-size:10px!important;max-width:95px}.mobile-nav{min-height:34px}.editor-heading{padding:6px 8px}.editor-heading #buffer-state{display:inline;font-size:9px}.compare-grid{grid-template-columns:1fr}.entry-more{opacity:1!important}.dropdown{width:230px}dialog{padding:18px}.version-row{flex-wrap:wrap}.version-row span{flex-basis:100%}#help-dialog{max-width:94vw}#empty h1{font-size:17px}#empty .keyhint{font-size:9px}}
#explorer{grid-column:1;grid-row:1}#split-explorer{grid-column:2;grid-row:1}#open-files{grid-column:3;grid-row:1}#split-tabs{grid-column:4;grid-row:1}.editor-panel{grid-column:5;grid-row:1}
.history-compare{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:12px}.history-compare label{display:flex;gap:6px;align-items:center}.history-compare select{max-width:220px;font-size:11px}

.hide-toolbars #action-toolbar,.hide-toolbars #secondary-status{display:none}#new-files-input{width:100%;font:14px/1.5 monospace;resize:vertical}#new-files-dialog{width:min(560px,94vw);max-width:560px}#new-files-results{overflow-wrap:anywhere;font-size:13px}#new-files-results li{margin:8px 0}textarea:focus-visible{outline:2px solid #287b62}footer #retry{font-size:10px;padding:2px 5px}#live-warning[hidden]{display:none}

footer:has(#message.error){height:auto;min-height:26px;flex-wrap:wrap}#message.error{white-space:normal;overflow-wrap:anywhere;overflow:visible}

/* M5: one shared sidebar; View menu stays outside hidden bars. */
.sidebar-switch{display:flex;gap:4px;padding:7px 8px;border-bottom:1px solid #d9dfda}.sidebar-switch button{flex:1;font-size:11px;padding:5px}.sidebar-switch [aria-selected=true]{background:#dfeae3;font-weight:bold}.sidebar-switch [role=tab]:focus-visible{outline:2px solid var(--accent)}
#explorer-content[hidden],#search-content[hidden]{display:none}#search-form{padding:10px;display:grid;gap:8px;font-size:12px}#search-form>label{font-weight:bold}#search-form input:not([type=checkbox]){width:100%;min-width:0;padding:6px;border:1px solid #bbc6bf;border-radius:3px;font:12px monospace}#search-form fieldset{min-width:0;margin:0;padding:8px;border:1px solid #cdd6ce}#search-presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}#search-presets label,.search-options label{display:flex;align-items:center;gap:3px}#search-form small{display:block;color:#68756b;margin-top:5px}#search-directory{font:11px monospace;overflow-wrap:anywhere;margin:0}.search-options{display:grid;gap:5px}#search-status{font-size:11px;line-height:1.5;padding:0 10px;overflow-wrap:anywhere}.search-file{border-top:1px solid #dbe1dc}.search-file summary{font:11px/1.5 monospace;overflow-wrap:anywhere;background:#e8eee9;padding:7px}.search-match{display:block;border:0;border-radius:0;width:100%;text-align:left;background:transparent;font:11px/1.6 monospace;padding:5px 8px;white-space:pre-wrap;overflow-wrap:anywhere}.search-line{color:#697b6c}.search-match mark{background:#ffe3a0;color:#382c12}.dropdown{max-height:75dvh;overflow:auto}
