:root{--bg:#f6f6f4;--panel:#fff;--ink:#1c1c1e;--muted:#77777d;--line:#e5e5e7;--accent:#14745a;--soft:#e8f3ef;--shadow:0 16px 40px #00000010}*{box-sizing:border-box}html,body,.app{height:100%;margin:0}body{font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--bg)}button,input,textarea,select{font:inherit;color:inherit}button{border:1px solid var(--line);border-radius:9px;background:var(--panel);padding:8px 11px;cursor:pointer}button:hover{background:var(--soft)}button.primary{background:var(--accent);border-color:var(--accent);color:white}.app{display:grid;grid-template-columns:58px 250px minmax(0,1fr)}.rail{display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 8px;border-right:1px solid var(--line);background:#f0f0ee}.rail span{flex:1}.rail button{width:40px;height:40px;padding:0;background:transparent;border:0;font-size:18px}.rail button.active{background:var(--panel);box-shadow:var(--shadow)}.logo{display:grid;place-items:center;width:38px;height:38px;margin-bottom:10px;border-radius:11px;background:var(--accent);color:#fff;font-size:20px;font-weight:800}.sidebar{min-width:0;padding:18px 14px;border-right:1px solid var(--line);background:var(--panel);overflow:auto}.sidebar header{display:flex;flex-direction:column;margin-bottom:20px}.sidebar header b{font-size:18px}.sidebar small,.hint,#saveState{color:var(--muted)}.row{display:flex;gap:8px}.row>*{flex:1}.sidebar input,.sidebar select,.sidebar label input{width:100%;margin:8px 0;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.wide{width:100%;margin:5px 0}.side-title{font-size:17px;font-weight:700;margin-bottom:10px}.file-list{margin-top:12px}.file{display:flex;align-items:center;gap:9px;width:100%;padding:10px 8px;border:0;background:transparent;text-align:left}.file.active{background:var(--soft)}.file .icon{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#edf0f8;color:#52607a;font-size:11px;font-weight:800}.file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hidden{display:none!important}main{min-width:0;display:flex;flex-direction:column}.toolbar{min-height:60px;display:flex;align-items:center;gap:15px;padding:9px 16px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(18px)}#title{width:180px;border:0;background:transparent;font-size:16px;font-weight:700}.tools{display:flex;gap:5px;overflow-x:auto}.tools button{padding:6px 9px}.actions{margin-left:auto;display:flex;align-items:center;gap:7px}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;background:var(--panel)}.workspace.ai-open{grid-template-columns:minmax(300px,1fr) minmax(300px,1fr) 340px}.editor-pane,.preview-pane{min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--line)}.pane-label{padding:7px 14px;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line)}#editor{flex:1;width:100%;resize:none;border:0;outline:0;padding:26px;background:var(--panel);font:15px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace}#preview{flex:1;margin:0;padding:26px;overflow:auto}#preview img{max-width:100%;border-radius:8px}#preview table{border-collapse:collapse;width:100%}#preview td,#preview th{border:1px solid var(--line);padding:8px}#preview pre{overflow:auto;padding:14px;border-radius:10px;background:#202322;color:#eee}.ai-pane{display:flex;flex-direction:column;min-width:0;background:var(--bg)}.ai-pane header{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:1px solid var(--line)}.ai-pane select{margin:10px;padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--panel)}.chat{flex:1;padding:12px;overflow:auto}.msg{margin:10px 0}.msg.user{text-align:right}.bubble{display:inline-block;max-width:90%;padding:10px 12px;border-radius:14px;background:var(--panel);text-align:left}.user .bubble{background:var(--accent);color:#fff}.sources{font-size:12px;color:var(--muted);margin-top:6px}.ask{padding:10px;border-top:1px solid var(--line)}.ask textarea{width:100%;resize:none;border:1px solid var(--line);border-radius:10px;padding:9px;background:var(--panel)}.ask button{width:100%;margin-top:6px}#toast{position:fixed;z-index:90;left:50%;bottom:22px;transform:translateX(-50%) translateY(30px);opacity:0;padding:9px 14px;border-radius:10px;background:#202322;color:white;transition:.2s}#toast.show{opacity:1;transform:translateX(-50%)}body.dark{--bg:#171817;--panel:#202120;--ink:#f1f1ef;--muted:#a5a5a0;--line:#343634;--soft:#263c35;--shadow:0 16px 40px #0007}.dark .rail{background:#191a19}@media(max-width:900px){.app{grid-template-columns:52px minmax(0,1fr)}.sidebar{position:fixed;z-index:30;left:52px;top:0;bottom:0;width:270px;box-shadow:var(--shadow)}main{grid-column:2}.workspace,.workspace.ai-open{grid-template-columns:1fr}.preview-pane{display:none}.ai-pane{position:absolute;z-index:20;inset:60px 0 0 52px}.toolbar{flex-wrap:wrap}.tools{order:3;width:100%}.actions{margin-left:auto}}
:root{--x:0}
.list-label{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:var(--muted);font-size:12px;font-weight:700}.list-label button{padding:3px 7px;font-size:11px}.pane-label{position:relative;display:flex;align-items:center;justify-content:space-between}.component-menu{position:absolute;z-index:25;right:10px;top:38px;width:160px;padding:7px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:var(--shadow)}.component-menu button{display:block;width:100%;border:0;text-align:left}.qlj-callout{padding:14px 16px;border-left:4px solid var(--accent);border-radius:8px;background:var(--soft)}.qlj-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:14px;border:1px solid var(--line);border-radius:10px}.qlj-button{display:inline-block;padding:9px 16px;border-radius:9px;background:var(--accent);color:#fff;text-decoration:none}.qlj-link-card,.qlj-video,.qlj-slides,.qlj-nav{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:10px}.qlj-link-card{display:flex;justify-content:space-between}.qlj-video video{width:100%;aspect-ratio:16/9;background:#111}.qlj-slides img{display:none;width:100%;max-height:420px;object-fit:cover}.qlj-slides img:first-child{display:block}.qlj-nav{display:flex;gap:8px;flex-wrap:wrap}.qlj-nav a{padding:6px 10px;border-radius:7px;background:var(--soft);color:var(--accent);text-decoration:none}
:root{--settings-fix:1}html,body{overflow:hidden}.app{overflow:hidden}.rail,.toolbar,.pane-label{flex:none}.sidebar{height:100vh;overflow-y:auto}main{position:relative;height:100vh;overflow:hidden}.workspace{overflow:hidden}.editor-pane,.preview-pane,.ai-pane{min-height:0;overflow:hidden}#editor,#preview{min-height:0;overflow-y:auto}.settings-page{position:absolute;z-index:40;inset:0;overflow:auto;padding:32px;background:var(--bg)}.settings-head{display:flex;align-items:center;justify-content:space-between;max-width:1100px;margin:0 auto 24px}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1100px;margin:auto}.settings-card{padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.settings-card h2{margin:0 0 5px;font-size:17px}.settings-card p{color:var(--muted)}.settings-card input,.settings-card select{width:100%;margin:6px 0 12px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.settings-card .status-line{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line)}@media(max-width:760px){.settings-page{padding:18px}.settings-grid{grid-template-columns:1fr}}
:root{--editor-ratio:50%}.rail button{position:relative;font-size:0}.rail button:before{font-size:18px}.rail [data-view="files"]:before{content:"▤"}.rail [data-view="knowledge"]:before{content:"⌘"}.rail [data-view="settings"]:before{content:"⚙"}#theme:before{content:"◐"}.account-rail{margin-top:auto!important;border-radius:50%!important;background:var(--accent)!important;color:#fff!important}.account-rail:before{content:"人"}.workspace{grid-template-columns:minmax(0,var(--editor-ratio)) 6px minmax(0,1fr)}.splitter{cursor:col-resize;background:var(--line)}.splitter:hover{background:var(--accent)}.workspace.mode-md{grid-template-columns:1fr}.workspace.mode-md .preview-pane,.workspace.mode-md .splitter{display:none}.workspace.mode-visual{grid-template-columns:1fr}.workspace.mode-visual .editor-pane,.workspace.mode-visual .splitter{display:none}.layout-switch{display:flex;gap:4px;margin-left:auto}.layout-switch button{padding:4px 7px}.cloud-meta{display:block;margin-left:8px;color:var(--muted);font-size:11px}.file .fmt{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#eef1f7;color:#52607a;font-size:10px;font-weight:800}.kb-actions{display:flex;gap:5px;margin-left:auto}.kb-actions button{padding:3px 6px}.knowledge-page{position:absolute;z-index:35;inset:0;display:flex;flex-direction:column;background:var(--bg)}.knowledge-page header{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--line)}.knowledge-page .chat{flex:1}.account-pop{position:fixed;z-index:80;left:60px;bottom:12px;width:260px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:var(--shadow)}
:root{--ai-float:1}.editor-fixed-tools{display:flex;align-items:center;gap:5px;margin-left:auto}.knowledge-page{left:0}.ai-float{position:fixed;z-index:75;right:20px;top:74px;width:min(410px,calc(100vw - 40px));height:min(680px,calc(100vh - 96px));display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:0 24px 70px #0003;overflow:hidden}.ai-float header{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--line)}.ai-float .context-chip{margin:10px 12px 0;padding:8px 10px;border-radius:9px;background:var(--soft);color:var(--muted);font-size:12px}.ai-float .chat{min-height:0}.workspace.mode-md .editor-fixed-tools,.workspace.mode-visual .editor-fixed-tools{display:flex}.toolbar .editor-fixed-tools .layout-switch{margin-left:0}@media(max-width:700px){.ai-float{right:8px;top:66px;width:calc(100vw - 16px);height:calc(100vh - 76px)}}
:root{--history-width:300px}.toolbar{position:relative}.editor-fixed-tools{position:relative}.component-menu{top:calc(100% + 6px);right:0;min-width:180px}.layout-switch{position:relative}.history-panel{position:absolute;z-index:65;right:16px;top:64px;width:min(var(--history-width),calc(100vw - 32px));max-height:70vh;overflow:auto;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);box-shadow:var(--shadow)}.history-panel h3{margin:3px 0 10px}.history-item{display:flex;align-items:center;gap:8px;width:100%;padding:9px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left}.history-item:hover{background:var(--soft)}.history-item small{display:block;color:var(--muted)}.history-item span{min-width:0;flex:1}.visual-active #preview{outline:2px solid color-mix(in srgb,var(--accent) 18%,transparent);outline-offset:-2px}
:root{--component-match:1}.qlj-button{display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;border-radius:9px;background:#1677ff;color:#fff!important;text-decoration:none;font-weight:650}.qlj-link-card{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:16px 0;padding:17px;border:1px solid #dde2e8;border-radius:12px;background:var(--panel);box-shadow:0 5px 18px #0000000c}.qlj-link-card strong,.qlj-link-card small{display:block}.qlj-link-card small{margin-top:4px;color:var(--muted);overflow-wrap:anywhere}.qlj-link-card>a{flex:none;padding:7px 12px;border-radius:8px;background:#eaf3ff;color:#1677ff;text-decoration:none}.qlj-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:16px 0;padding:16px;border-radius:11px;background:color-mix(in srgb,var(--bg) 88%,var(--panel))}.qlj-columns>div+div{border-left:1px solid #dde2e8;padding-left:18px}.qlj-nav{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0;padding:9px;border:1px solid #dde2e8;border-radius:11px;background:var(--panel);box-shadow:0 4px 16px #0000000b}.qlj-nav a{padding:6px 11px;border-radius:8px;color:#1677ff;text-decoration:none;font-weight:650}.qlj-nav a:hover{background:#eaf3ff}.qlj-callout{margin:16px 0;padding:15px 17px;border:1px solid #bdd8f5;border-left:4px solid #1677ff;border-radius:9px;background:#f2f8ff;color:#24231f}.qlj-video{margin:18px 0;overflow:hidden;border:1px solid #dde2e8;border-radius:12px;background:#111}.qlj-video video{display:block;width:100%;max-height:560px;aspect-ratio:16/9;background:#000;object-fit:contain}.qlj-video figcaption{padding:10px 14px;background:var(--panel);font-weight:650}.qlj-slides{overflow:hidden;margin:18px 0;border:1px solid #dde2e8;border-radius:12px;background:#111}.qlj-slides figcaption{padding:10px 14px;background:var(--panel);font-weight:650}@media(max-width:640px){.qlj-columns{grid-template-columns:1fr}.qlj-columns>div+div{border-top:1px solid #dde2e8;border-left:0;padding-top:14px;padding-left:0}.qlj-link-card{align-items:flex-start;flex-direction:column}}
:root{--cloud-list:1}.doc-filterbar{display:flex;gap:5px;margin:10px 0}.doc-filterbar select{min-width:0;flex:1;padding:7px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}.file-rich{align-items:flex-start}.file-rich .file-info{min-width:0;flex:1}.file-rich .file-info strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-rich .file-info small{display:block;color:var(--muted);font-size:11px}.file-rich .cloud-mark{color:#3994ff;font-style:normal}.visual-sync-note{padding:5px 12px;color:var(--muted);font-size:11px;border-bottom:1px solid var(--line)}
:root{--component-dialog:1}.component-dialog{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:20px;background:#0006}.component-dialog form{width:min(500px,100%);max-height:85vh;overflow:auto;padding:20px;border-radius:16px;background:var(--panel);box-shadow:0 25px 80px #0005}.component-dialog h3{margin:0 0 14px}.component-dialog label{display:block;margin:10px 0}.component-dialog input,.component-dialog textarea{width:100%;margin-top:5px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.component-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.highlight-editor{position:relative}.highlight-editor #editor,.highlight-editor .md-highlight{position:absolute;inset:32px 0 0;margin:0;padding:26px;overflow:auto;border:0;white-space:pre-wrap;overflow-wrap:break-word;tab-size:2;font:15px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace}.highlight-editor .md-highlight{z-index:0;pointer-events:none;background:var(--panel);color:var(--ink)}.highlight-editor #editor{z-index:1;background:transparent;color:transparent;caret-color:var(--ink);-webkit-text-fill-color:transparent}.highlight-editor #editor::selection{background:#6ca8ff55;-webkit-text-fill-color:transparent}.md-token-heading{color:#8b5cf6;font-weight:750}.md-token-code{color:#d15b36;background:color-mix(in srgb,#d15b36 9%,transparent)}.md-token-strong{color:#14745a;font-weight:750}.md-token-link{color:#1677ff;text-decoration:underline;text-decoration-color:#1677ff55}.md-token-list{color:#c47a13;font-weight:700}.md-token-quote{color:#64806f}.md-token-component{color:#a855f7;font-weight:700}.dark .md-token-heading{color:#c4a7ff}.dark .md-token-code{color:#ff9b7a}.dark .md-token-strong{color:#70d7b5}.dark .md-token-link{color:#77b7ff}.dark .md-token-list{color:#f0b35b}
:root{--file-actions:1}.file-rich{position:relative}.file-actions{display:none;position:absolute;z-index:4;right:4px;top:4px;gap:3px;padding:3px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 6px 18px #0002}.file-rich:hover .file-actions,.file-rich:focus-within .file-actions{display:flex}.file-actions button{padding:3px 5px;border:0;font-size:11px}.file-rich:hover .cloud-mark{display:none}
.html-preview{display:block;width:100%;height:100%;min-height:0;border:0;background:#fff}.preview-pane:has(.html-preview:not(.hidden)){overflow:hidden}.preview-pane:has(.html-preview:not(.hidden)) .visual-sync-note{flex:0 0 auto}

/* Responsive application shell: tablet drawer and mobile bottom navigation. */
@media (max-width:1024px){
  html,body,.app,main{height:100dvh;min-height:100dvh}
  button,.rail button,.layout-switch button,.editor-fixed-tools>button{min-height:44px;touch-action:manipulation}
  .app{grid-template-columns:54px minmax(0,1fr)}
  .rail{position:relative;z-index:55;width:54px;padding:10px 7px}
  .rail button{width:42px;height:42px}
  main{grid-column:2;min-width:0}
  .sidebar{position:fixed;z-index:50;top:0;bottom:0;left:54px;width:min(340px,calc(100vw - 54px));height:100dvh;padding:18px 14px calc(20px + env(safe-area-inset-bottom));box-shadow:16px 0 44px #0002;transform:translateX(calc(-100% - 20px));transition:transform .2s ease;overscroll-behavior:contain}
  .sidebar.mobile-open{transform:translateX(0)}
  .toolbar{min-height:58px;padding:8px 12px;gap:8px;flex-wrap:nowrap;overflow:visible}
  #title{min-width:100px;width:min(210px,28vw)}
  .toolbar>.tools{position:absolute;z-index:18;top:100%;left:0;right:0;order:initial;width:auto;padding:7px 10px;border-bottom:1px solid var(--line);background:var(--panel);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .toolbar>.tools::-webkit-scrollbar{display:none}
  .toolbar>.tools button{flex:0 0 auto;min-width:40px;min-height:38px}
  .workspace{padding-top:53px;grid-template-columns:1fr!important}
  .workspace.mode-md .editor-pane{display:flex!important}.workspace.mode-md .preview-pane{display:none!important}
  .workspace.mode-visual .editor-pane{display:none!important}.workspace.mode-visual .preview-pane{display:flex!important}
  .workspace:not(.mode-md):not(.mode-visual){grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
  .workspace:not(.mode-md):not(.mode-visual) .editor-pane,.workspace:not(.mode-md):not(.mode-visual) .preview-pane{display:flex!important}
  .workspace .splitter{display:none!important}
  .editor-pane,.preview-pane{min-height:0;border-right:0;border-bottom:1px solid var(--line)}
  #editor,#preview{padding:20px}
  .highlight-editor #editor,.highlight-editor .md-highlight{padding:20px}
  .ai-pane,.ai-float{position:fixed;z-index:85;inset:8px 8px calc(8px + env(safe-area-inset-bottom));width:auto;height:auto;max-width:none;border-radius:14px}
  .settings-page,.knowledge-page{position:fixed;z-index:70;inset:0 0 0 54px;height:100dvh;padding:20px 18px calc(24px + env(safe-area-inset-bottom))}
  .settings-grid{grid-template-columns:1fr}
  .component-menu{position:fixed;z-index:95;top:auto!important;right:12px!important;bottom:12px;width:min(320px,calc(100vw - 24px));max-height:65dvh;overflow:auto;padding:10px}
  .component-menu button{min-height:44px}
  .file-actions{display:flex;position:static;margin-left:auto;box-shadow:none;background:transparent;border:0}
  .file-rich .cloud-mark{display:none}
  .account-pop{left:62px;bottom:12px;width:min(300px,calc(100vw - 74px))}
}

/* Source syntax colors and non-destructive preview folding. */
.html-token-comment{color:#6b7280}.html-token-tag{color:#e879f9}.html-token-attr{color:#60a5fa}.html-token-string{color:#fbbf24}.html-token-doctype{color:#a78bfa}.html-token-keyword{color:#fb7185;font-weight:650}
.fold-toggle{margin-left:auto!important;width:auto!important;height:22px!important;min-height:22px!important;padding:1px 7px!important;border-radius:6px!important;font-size:9px!important}
#preview>.qlj-folded{position:relative;max-height:42px;overflow:hidden;padding-right:28px}
#preview>.qlj-folded:after{content:'展开';position:absolute;right:3px;top:8px;padding:1px 4px;border-radius:4px;background:var(--soft);color:var(--accent);font-size:9px}
#preview>.qlj-fold-hidden{display:none!important}
#preview>h1,#preview>h2,#preview>h3,#preview>h4,#preview>h5,#preview>h6{cursor:pointer}

/* Explicit two-line hierarchy: title/status/actions, then editing tools. */
.toolbar-title-line,.toolbar-tools-line{min-width:0}
@media (min-width:768px){
  .toolbar>.toolbar-title-row,.toolbar>.toolbar-action-row{display:none!important}
  .toolbar{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:center!important;
    min-height:70px!important;
    height:70px!important;
    max-height:70px!important;
    padding:4px 12px!important;
    gap:3px!important;
    overflow:visible!important;
  }
  .toolbar-title-line{
    display:flex;
    align-items:center;
    width:100%;
    height:31px;
    min-height:31px;
    gap:8px;
    overflow:hidden;
  }
  .toolbar-title-line #title{order:0;flex:0 1 520px;width:auto;min-width:180px;height:28px;font-size:15px}
  .toolbar-title-line #saveState{order:1;flex:0 0 auto;max-width:120px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .toolbar-title-line .title-primary-actions{order:2;margin-left:auto;display:flex;gap:4px;flex:0 0 auto}
  .toolbar-title-line .title-primary-actions button{height:26px!important;min-height:26px!important;padding:2px 8px!important;font-size:10px!important}
  .toolbar-tools-line{display:flex;align-items:center;width:100%;height:32px;min-height:32px;overflow:hidden}
  .toolbar-tools-line .toolbar-action-row{display:flex;align-items:center;width:100%;height:32px;overflow-x:auto;overflow-y:hidden;gap:5px;scrollbar-width:none}
  .toolbar-tools-line .toolbar-action-row::-webkit-scrollbar{display:none}
  .toolbar-tools-line .tools{display:flex!important;position:static!important;flex:0 0 auto;width:auto!important;padding:0!important;gap:3px;overflow:visible!important;border:0;background:transparent}
  .toolbar-tools-line .editor-fixed-tools{display:flex;flex:0 0 auto;width:auto;margin:0;gap:3px}
  .toolbar-tools-line .actions{display:none!important}
  .toolbar-tools-line button,.toolbar-tools-line select{height:27px;min-height:27px!important;padding:3px 7px!important;font-size:10px!important;white-space:nowrap}
  .workspace{height:calc(100% - 70px)!important}
}
@media (max-width:767px){
  .toolbar-title-line{display:flex;align-items:center;min-width:0;width:100%;gap:3px}
  .toolbar-tools-line{display:contents}
}

/* H1, H2, bold and italic are familiar icon-only formatting controls. */
.toolbar .icon-only-tool{
  width:30px!important;
  min-width:30px!important;
  padding:0!important;
  font-size:0!important;
  line-height:1!important;
}
.toolbar .icon-only-tool:before{display:block;font-size:11px!important;line-height:1!important}
.toolbar .icon-only-tool.heading-one:before{content:'H1'!important;font-weight:750}
.toolbar .icon-only-tool.heading-two:before{content:'H2'!important;font-weight:750}
.toolbar .icon-only-tool.text-bold:before{content:'B'!important;font-weight:850}
.toolbar .icon-only-tool.text-italic:before{content:'I'!important;font-style:italic;font-family:Georgia,serif}

/* Native selections remain clearly visible in both synchronized panes. */
#editor::selection,#preview ::selection{background:color-mix(in srgb,var(--accent) 32%,transparent)}

/* Phone toolbar is intentionally independent from the desktop hierarchy. */
@media (max-width:767px){
  .toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:34px 32px!important;
    align-content:center!important;
    align-items:center!important;
    width:100%!important;
    min-height:72px!important;
    height:72px!important;
    max-height:72px!important;
    padding:3px 7px!important;
    gap:2px!important;
    overflow:visible!important;
  }
  .toolbar>.toolbar-title-row,.toolbar>.toolbar-action-row{display:none!important}
  .toolbar-title-line{
    grid-row:1!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:34px!important;
    min-width:0!important;
    gap:3px!important;
    overflow:hidden!important;
  }
  .toolbar-title-line #title{
    order:0!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:64px!important;
    height:30px!important;
    padding:2px 3px!important;
    font-size:14px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .toolbar-title-line #saveState{
    order:1!important;
    flex:0 1 48px!important;
    max-width:48px!important;
    margin:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:8px!important;
    line-height:1.1!important;
  }
  .toolbar-title-line .title-primary-actions{
    order:2!important;
    display:flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    margin:0!important;
    gap:2px!important;
  }
  .toolbar-title-line .title-primary-actions button{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 29px!important;
    width:29px!important;
    min-width:29px!important;
    height:29px!important;
    min-height:29px!important;
    padding:0!important;
    border-radius:8px!important;
    font-size:0!important;
  }
  .toolbar-title-line #share:before{content:'\2197'!important;font-size:13px!important}
  .toolbar-title-line #exportBtn:before{content:'\21E9'!important;font-size:14px!important}
  .toolbar-title-line #aiToggle:before{content:'AI'!important;font-size:9px!important;font-weight:800!important}
  .toolbar-tools-line{
    grid-row:2!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    overflow:hidden!important;
  }
  .toolbar-tools-line .toolbar-action-row{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:32px!important;
    min-width:0!important;
    gap:3px!important;
    padding:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch;
  }
  .toolbar-tools-line .toolbar-action-row::-webkit-scrollbar{display:none}
  .toolbar-tools-line .tools,.toolbar-tools-line .editor-fixed-tools{
    position:static!important;
    display:flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    height:30px!important;
    margin:0!important;
    padding:0!important;
    gap:3px!important;
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
  }
  .toolbar-tools-line .actions{display:none!important}
  .toolbar-tools-line button,.toolbar-tools-line select{
    flex:0 0 auto!important;
    width:auto!important;
    height:28px!important;
    min-height:28px!important;
    padding:2px 6px!important;
    border-radius:7px!important;
    font-size:9px!important;
    white-space:nowrap!important;
  }
  .toolbar-tools-line .icon-only-tool{width:28px!important;min-width:28px!important;padding:0!important;font-size:0!important}
  .workspace{height:calc(100% - 72px)!important;padding-top:0!important}
  .workspace.show-markdown-tools{padding-top:0!important}
  .toolbar>.tools{position:static!important}
}

/* Desktop toolbar is exactly two rows; the second row scrolls instead of wrapping. */
@media (min-width:768px){
  .toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:32px 32px!important;
    min-height:70px!important;
    max-height:70px!important;
    align-content:center!important;
    overflow:visible!important;
  }
  .toolbar-title-row{
    grid-column:1!important;
    grid-row:1!important;
    width:100%;
    min-width:0;
  }
  .toolbar-action-row{
    grid-column:1!important;
    grid-row:2!important;
    display:flex!important;
    align-items:center;
    width:100%;
    min-width:0;
    height:32px;
    gap:5px;
    overflow-x:auto;
    overflow-y:hidden;
    flex-wrap:nowrap!important;
    scrollbar-width:none;
  }
  .toolbar-action-row::-webkit-scrollbar{display:none}
  .toolbar-action-row>.tools{
    position:static!important;
    order:0!important;
    display:flex!important;
    flex:0 0 auto;
    width:auto!important;
    min-width:0;
    gap:3px;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  .toolbar-action-row>.editor-fixed-tools{order:1!important;flex:0 0 auto!important;width:auto!important;margin:0!important;flex-wrap:nowrap!important}
  .toolbar-action-row>.actions{order:2!important;display:none!important}
  .toolbar-action-row button,.toolbar-action-row select{flex:0 0 auto!important}
  .workspace{height:calc(100% - 70px)!important}
}
@media (max-width:767px){
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
  .app{display:block;height:calc(100dvh - 58px - env(safe-area-inset-bottom))}
  main{height:100%;min-height:0}
  .rail{position:fixed;z-index:90;right:0;bottom:0;left:0;top:auto;width:auto;height:calc(58px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:5px 8px env(safe-area-inset-bottom);border-top:1px solid var(--line);border-right:0;background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(20px)}
  .rail .logo,.rail>span{display:none}
  .rail button,.rail .account-rail{width:100%;height:48px;min-height:48px;margin:0!important;border-radius:9px!important;background:transparent!important;color:var(--ink)!important}
  .rail button.active{background:var(--soft)!important;box-shadow:none}
  .sidebar{left:0;bottom:calc(58px + env(safe-area-inset-bottom));width:min(360px,92vw);height:auto;padding-top:calc(18px + env(safe-area-inset-top));transform:translateX(-105%)}
  .toolbar{min-height:104px;padding:8px 10px;align-content:flex-start;flex-wrap:wrap}
  #title{order:1;width:calc(100% - 196px);min-width:120px;height:40px}
  .actions{order:2;gap:4px;margin-left:auto}
  .actions #saveState{display:none}
  .actions button{min-width:42px;padding:7px 9px}
  .editor-fixed-tools{order:3;width:100%;margin:0;justify-content:space-between;overflow-x:auto}
  .layout-switch{margin:0}
  .toolbar>.tools{top:104px}
  .workspace{height:calc(100% - 104px);padding-top:53px}
  #editor,#preview{padding:16px;font-size:16px;line-height:1.7}
  .highlight-editor #editor,.highlight-editor .md-highlight{padding:16px;font-size:16px;line-height:1.7}
  .pane-label{min-height:34px;padding:7px 10px}
  .visual-sync-note{display:none}
  .settings-page,.knowledge-page{inset:0 0 calc(58px + env(safe-area-inset-bottom));height:auto;padding:16px 12px 28px}
  .settings-head{position:sticky;top:-16px;z-index:3;margin:0 -12px 14px;padding:12px;background:var(--bg)}
  .settings-card{padding:16px;border-radius:10px}
  .ai-pane,.ai-float{inset:6px 6px calc(64px + env(safe-area-inset-bottom));border-radius:12px}
  .ask textarea{font-size:16px}
  .account-pop{left:8px;right:8px;bottom:calc(64px + env(safe-area-inset-bottom));width:auto}
  #toast{bottom:calc(70px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px);white-space:normal;text-align:center}
  .qlj-columns{grid-template-columns:1fr}.qlj-columns>div+div{padding-top:14px;padding-left:0;border-top:1px solid var(--line);border-left:0}
  .qlj-link-card{align-items:stretch;flex-direction:column}
}

/* Stable compact placement for share, export and AI beside the document title. */
.title-primary-actions{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  width:auto;
  min-width:0;
  gap:4px;
}
.toolbar-title-row .title-primary-actions button{
  position:static;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  white-space:nowrap;
}
@media (min-width:768px){
  .toolbar-title-row{gap:8px}
  .toolbar-title-row #title{flex:0 1 420px}
  .toolbar-title-row .title-primary-actions button{
    display:inline-flex;
    height:25px!important;
    min-height:25px!important;
    padding:2px 8px!important;
    border-radius:7px;
    font-size:10px!important;
    line-height:1;
  }
  .toolbar-title-row .title-primary-actions #aiToggle{
    min-width:38px!important;
    background:var(--accent);
    border-color:var(--accent);
    color:#fff;
  }
  .toolbar-title-row #saveState{margin-left:auto}
}
@media (max-width:767px){
  .toolbar-title-row{gap:3px}
  .toolbar-title-row #title{flex:1 1 auto;min-width:72px}
  .title-primary-actions{gap:2px}
  .toolbar-title-row .title-primary-actions button{
    height:26px!important;
    min-height:26px!important;
    padding:2px 5px!important;
    font-size:9px!important;
  }
  .toolbar-title-row #saveState{flex:0 1 60px;max-width:60px}
}

/* Refined mobile bottom navigation and a glyph-independent account icon. */
@media (max-width:767px){
  .rail{
    height:calc(54px + env(safe-area-inset-bottom));
    padding:4px 7px env(safe-area-inset-bottom);
    border-top:1px solid color-mix(in srgb,var(--line) 78%,transparent);
    background:color-mix(in srgb,var(--panel) 94%,transparent);
    box-shadow:0 -8px 24px #0000000d;
  }
  body{padding-bottom:calc(54px + env(safe-area-inset-bottom))}
  .app{height:calc(100dvh - 54px - env(safe-area-inset-bottom))}
  .rail button,.rail .account-rail{
    display:grid;
    place-items:center;
    width:100%;
    height:44px;
    min-height:44px;
    padding:0;
    border-radius:11px!important;
    color:var(--muted)!important;
  }
  .rail button:before{font-size:15px;line-height:1}
  .rail button.active{
    background:color-mix(in srgb,var(--accent) 15%,var(--panel))!important;
    color:var(--accent)!important;
  }
  .rail .account-rail{
    background:transparent!important;
    color:var(--muted)!important;
  }
  .rail .account-rail:before{
    content:'';
    display:block;
    width:17px;
    height:17px;
    background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-5.33 0-8 2.67-8 5.25V22h16v-2.75C20 16.67 17.33 14 12 14Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-5.33 0-8 2.67-8 5.25V22h16v-2.75C20 16.67 17.33 14 12 14Z'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .workspace>.layout-switch{bottom:calc(64px + env(safe-area-inset-bottom))}
  .workspace>.layout-switch .font-size-select{display:none!important}
  .settings-page,.knowledge-page{inset:0 0 calc(54px + env(safe-area-inset-bottom))}
  .account-pop{bottom:calc(60px + env(safe-area-inset-bottom))}
  #toast{bottom:calc(64px + env(safe-area-inset-bottom))}
}

/* Primary document actions sit directly after the file name. */
.toolbar-title-row #share,
.toolbar-title-row #exportBtn,
.toolbar-title-row #aiToggle{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.toolbar-title-row #saveState{margin-left:auto}
@media (min-width:768px){
  .toolbar-title-row #share,
  .toolbar-title-row #exportBtn,
  .toolbar-title-row #aiToggle{
    height:25px;
    min-height:25px;
    padding:2px 7px;
    border-radius:7px;
    font-size:10px;
  }
  .toolbar-title-row #share:before{content:'\2197'}
  .toolbar-title-row #exportBtn:before{content:'\21E9'}
  .toolbar-title-row #aiToggle:before{content:'AI';font-size:9px;font-weight:800}
}
@media (max-width:767px){
  .toolbar-title-row{overflow:hidden}
  .toolbar-title-row #share,
  .toolbar-title-row #exportBtn,
  .toolbar-title-row #aiToggle{
    height:27px;
    min-height:27px!important;
    padding:2px 5px!important;
    font-size:9px!important;
  }
  .toolbar-title-row #saveState{max-width:72px}
}

/* Desktop two-row toolbar with compact icon-labelled actions. */
@media (min-width:768px){
  .toolbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:32px 32px;
    align-items:center;
    min-height:72px;
    padding:4px 12px;
    column-gap:10px;
    row-gap:2px;
  }
  .toolbar-title-row{
    grid-column:1/-1;
    grid-row:1;
    display:flex;
    align-items:center;
    min-width:0;
    gap:10px;
    border-bottom:1px solid color-mix(in srgb,var(--line) 65%,transparent);
  }
  .toolbar-title-row #title{
    flex:0 1 420px;
    width:auto;
    min-width:160px;
    height:30px;
    padding:2px 4px;
    font-size:15px;
  }
  .toolbar-title-row #saveState{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
  }
  .toolbar>.tools{
    grid-column:1;
    grid-row:2;
    width:auto;
    min-width:0;
    gap:3px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .toolbar>.tools::-webkit-scrollbar{display:none}
  .toolbar-action-row{
    grid-column:2;
    grid-row:2;
    display:flex;
    align-items:center;
    min-width:0;
    gap:5px;
  }
  .toolbar-action-row .editor-fixed-tools,
  .toolbar-action-row .actions{display:flex;align-items:center;width:auto;margin:0;gap:3px}
  .toolbar button,
  .toolbar select{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    width:auto;
    min-width:0;
    height:27px;
    min-height:27px;
    padding:3px 7px;
    border-radius:7px;
    font-size:10px;
    line-height:1;
    white-space:nowrap;
  }
  .toolbar .layout-switch{display:none}
  .toolbar .font-size-select{min-width:58px;padding-inline:5px}
  .toolbar button:before{font-size:11px;line-height:1;color:currentColor}
  .toolbar [data-prefix="# "]:before{content:'H1'}
  .toolbar [data-prefix="## "]:before{content:'H2'}
  .toolbar [data-wrap="**"]:before{content:'B';font-weight:800}
  .toolbar [data-wrap="*"]:before{content:'I';font-style:italic}
  .toolbar [data-prefix="- "]:before{content:'\2630'}
  .toolbar [data-prefix="- [ ] "]:before{content:'\2611'}
  .toolbar [data-wrap="`"]:before{content:'</>';font-family:monospace}
  .toolbar #insertLink:before{content:'\1F517'}
  .toolbar #insertImage:before{content:'\25A3'}
  .toolbar #componentsBtn:before{content:'\229E'}
  .toolbar #share:before{content:'\2197'}
  .toolbar #exportBtn:before{content:'\21E9'}
  .toolbar #aiToggle:before{content:'AI';font-size:9px;font-weight:800}
  .toolbar button[title*="\64A4\56DE"]:before{content:'\21B6'}
  .toolbar button[title*="\91CD\505A"]:before{content:'\21B7'}
  .toolbar button[title*="\5386\53F2"]:before{content:'\25F7'}
  .workspace{height:calc(100% - 72px)}
}

/* Keep the mobile view switch visible and remove the obsolete tools spacer. */
.workspace>.layout-switch{display:none}
@media (max-width:767px){
  .workspace{position:relative;padding-top:0!important}
  .workspace.show-markdown-tools{padding-top:37px!important}
  .workspace>.layout-switch{
    position:fixed;
    z-index:88;
    right:12px;
    bottom:calc(70px + env(safe-area-inset-bottom));
    display:flex!important;
    gap:2px;
    width:auto;
    margin:0!important;
    padding:3px;
    border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
    border-radius:11px;
    background:color-mix(in srgb,var(--panel) 92%,transparent);
    box-shadow:0 8px 24px #0004;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }
  .workspace>.layout-switch button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:44px!important;
    width:auto;
    height:30px;
    min-height:30px!important;
    padding:3px 8px!important;
    border:0;
    border-radius:8px;
    font-size:10px!important;
    line-height:1;
  }
  .pane-label{
    min-height:22px!important;
    height:22px!important;
    padding:1px 10px!important;
    font-size:10px!important;
    line-height:20px!important;
  }
  .toolbar>.tools{height:37px;top:78px}
}
@media (max-width:420px){
  .toolbar{min-height:110px}.toolbar>.tools{top:110px}.workspace{height:calc(100% - 110px)}
  #title{width:calc(100% - 166px);font-size:14px}.actions button{padding:6px 7px;font-size:12px}
  .layout-switch button{padding:5px 7px;font-size:11px}
  .doc-filterbar{flex-direction:column}.file-actions button{min-width:36px;padding:4px;font-size:10px}
}
@media (hover:none){button:hover{background:inherit}.file-rich:hover .file-actions{display:flex}}
.font-size-select{min-width:78px;min-height:38px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font-weight:650}
.layout-switch{display:none}.workspace.mode-split{grid-template-columns:minmax(0,var(--editor-ratio)) 6px minmax(0,1fr)}.workspace.mode-split .editor-pane,.workspace.mode-split .preview-pane{display:flex!important}.workspace.mode-split .splitter{display:block!important}
@media(max-width:767px){.font-size-select{min-width:62px;font-size:12px;padding:5px}.layout-switch{gap:4px}.layout-switch button{min-width:62px}}
@media(max-width:767px){.layout-switch{display:flex}.workspace.mode-split{grid-template-columns:1fr}.workspace.mode-split .splitter{display:none!important}}
.layout-switch{display:flex;gap:5px;flex:0 0 auto}.layout-switch button{min-width:70px;font-weight:650}.workspace.mode-visual .editor-pane,.workspace.mode-md .preview-pane{display:none!important}.workspace.mode-visual .preview-pane{display:flex!important}.workspace.mode-md .editor-pane{display:flex!important}.workspace.show-markdown-tools .tools{display:flex!important}
@media(max-width:1024px){.toolbar>.tools{display:none}.workspace.show-markdown-tools~*{} .layout-switch button{min-height:38px;min-width:64px}.editor-fixed-tools{gap:5px}.editor-fixed-tools>#componentsBtn{min-width:44px;font-size:0}.editor-fixed-tools>#componentsBtn:after{content:'+';font-size:22px}.component-menu{max-height:60dvh}}
@media(max-width:767px){.toolbar{min-height:82px}.toolbar>.tools{top:82px}.workspace{height:calc(100% - 82px)}.layout-switch{order:3;width:auto;margin:0}.editor-fixed-tools{order:3;width:100%;justify-content:flex-end}.editor-fixed-tools>.layout-switch{margin-right:auto}.actions{order:2}}
@media (max-width:1024px){
  .sidebar:before{content:"";position:absolute;top:50%;right:-4px;width:4px;height:72px;border-radius:0 4px 4px 0;background:var(--accent);opacity:.55}
  .sidebar{will-change:transform}
  .component-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:58dvh;overflow-y:auto;overscroll-behavior:contain}
  .component-menu .component-menu-title{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:3px 4px 8px;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line)}
  .component-menu.is-collapsed{max-height:48px;overflow:hidden}
  .component-menu.is-collapsed button:not(.component-menu-title button){display:none}
  .component-menu button{min-height:44px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:767px){
  .component-menu{left:8px!important;right:8px!important;bottom:calc(64px + env(safe-area-inset-bottom))!important;width:auto;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:14px}
  .component-menu button{padding:8px 5px;font-size:12px}
  .component-menu .component-menu-title{font-size:11px}
  .sidebar{overscroll-behavior-y:contain}
}

/* Compact two-row mobile document toolbar. */
.toolbar-title-row,.toolbar-action-row{display:contents}
@media (max-width:767px){
  .toolbar{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    flex-wrap:nowrap;
    min-height:78px;
    padding:5px 8px;
    gap:3px;
  }
  .toolbar-title-row,.toolbar-action-row{
    display:flex;
    align-items:center;
    width:100%;
    min-width:0;
    gap:4px;
  }
  .toolbar-title-row{height:32px}
  .toolbar-title-row #title{
    order:initial;
    flex:1 1 auto;
    width:auto;
    min-width:0;
    height:30px;
    padding:3px 4px;
    font-size:14px;
  }
  .toolbar-title-row #saveState{
    display:block;
    flex:0 1 auto;
    max-width:116px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:9px;
    line-height:1.2;
  }
  .toolbar-action-row{
    height:35px;
    overflow-x:auto;
    overflow-y:visible;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
  }
  .toolbar-action-row::-webkit-scrollbar{display:none}
  .toolbar-action-row .editor-fixed-tools,
  .toolbar-action-row .actions{
    order:initial;
    flex:0 0 auto;
    width:auto;
    margin:0;
    gap:3px;
    justify-content:flex-start;
    overflow:visible;
  }
  .toolbar-action-row .layout-switch{order:initial;width:auto;margin:0!important;gap:3px}
  .toolbar-action-row button,
  .toolbar-action-row select{
    flex:0 0 auto;
    width:auto;
    min-width:0!important;
    height:30px;
    min-height:30px!important;
    padding:3px 6px!important;
    border-radius:7px;
    font-size:10px!important;
    line-height:1;
    white-space:nowrap;
  }
  .toolbar-action-row .layout-switch button{min-width:42px!important}
  .toolbar-action-row .font-size-select{width:52px;min-width:52px!important}
  .toolbar-action-row .editor-fixed-tools>#componentsBtn{min-width:30px!important;font-size:10px!important}
  .toolbar-action-row .editor-fixed-tools>#componentsBtn:after{content:none}
  .toolbar>.tools{top:78px}
  .workspace{height:calc(100% - 78px)}
}
@media (max-width:420px){
  .toolbar{min-height:78px}
  .toolbar>.tools{top:78px}
  .workspace{height:calc(100% - 78px)}
}

/* Mobile editor controls: compact scrolling actions and a floating view switch. */
@media (max-width:767px){
  .toolbar-action-row{
    padding-right:0;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .toolbar-action-row .editor-fixed-tools,
  .toolbar-action-row .actions{gap:2px}
  .toolbar-action-row button,
  .toolbar-action-row select{
    height:28px;
    min-height:28px!important;
    padding:2px 5px!important;
    font-size:9px!important;
    scroll-snap-align:start;
  }
  .toolbar-action-row .font-size-select{width:48px;min-width:48px!important}
  .toolbar-action-row .layout-switch{
    position:fixed;
    z-index:68;
    right:12px;
    bottom:calc(70px + env(safe-area-inset-bottom));
    display:flex;
    gap:2px;
    width:auto;
    margin:0!important;
    padding:3px;
    border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
    border-radius:11px;
    background:color-mix(in srgb,var(--panel) 90%,transparent);
    box-shadow:0 8px 24px #0002;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }
  .toolbar-action-row .layout-switch button{
    min-width:40px!important;
    height:28px;
    min-height:28px!important;
    padding:2px 7px!important;
    border:0;
    border-radius:8px;
    font-size:10px!important;
  }
  .pane-label{
    min-height:24px;
    height:24px;
    padding:2px 10px;
    font-size:10px;
    line-height:20px;
  }
  .toolbar>.tools{
    padding:4px 7px;
    gap:3px;
    -webkit-overflow-scrolling:touch;
  }
  .toolbar>.tools button{
    min-width:32px;
    min-height:28px;
    padding:3px 6px;
    font-size:10px;
  }
}