/* Beta: rounded grouped surfaces, floating controls and a mobile tab bar. */
html[data-design=beta] body{background:var(--bg)}
html[data-design=beta] .workspace{height:100dvh;padding:16px;gap:16px;grid-template-columns:260px minmax(0,1fr)}
html[data-design=beta] .sidebar{background:color-mix(in srgb,var(--panel) 88%,transparent);border:1px solid var(--line);border-radius:28px;box-shadow:0 8px 30px color-mix(in srgb,var(--fg) 5%,transparent);overflow:hidden}
html[data-design=beta] .sidebar-head{padding:26px 23px;height:86px}
html[data-design=beta] .brand{font-size:23px;letter-spacing:-1px;font-weight:650}
html[data-design=beta] .brand-mark{border-radius:11px;box-shadow:0 4px 14px color-mix(in srgb,var(--purple) 20%,transparent)}
html[data-design=beta] .view-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:0 14px 17px;padding:4px;background:color-mix(in srgb,var(--fg) 6%,var(--panel));border-radius:15px}
html[data-design=beta] .view-tab{min-height:55px;border-radius:11px;gap:5px;font-size:11px;transition:background .18s,transform .18s}
html[data-design=beta] .view-tab.selected{background:var(--card);color:var(--purple);box-shadow:0 2px 7px color-mix(in srgb,var(--fg) 9%,transparent)}
html[data-design=beta] .tree-actions{padding:0 19px 14px;gap:8px}
html[data-design=beta] .icon-button{border-radius:12px;min-width:34px;min-height:34px}
html[data-design=beta] .note-search{border:0;background:color-mix(in srgb,var(--fg) 6%,var(--panel));border-radius:12px;padding:12px 14px;margin-bottom:16px}
html[data-design=beta] .tree{padding:0 12px}
html[data-design=beta] .tree-row{border-radius:13px;min-height:43px;margin:3px 0;padding-top:11px;padding-bottom:11px;font-size:13px}
html[data-design=beta] .sidebar-footer{margin:12px;padding:13px 10px;border:0;border-radius:17px;background:var(--card)}
html[data-design=beta] .document{border:1px solid var(--line);border-radius:28px;background:var(--card);box-shadow:0 10px 40px color-mix(in srgb,var(--fg) 4%,transparent);overflow:hidden}
html[data-design=beta] .document-head{height:74px;padding:18px 28px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--card) 85%,var(--panel))}
html[data-design=beta] .breadcrumbs{color:var(--muted);font-size:12px}
html[data-design=beta] .document-actions{gap:12px}
html[data-design=beta] .editor-wrap{padding:32px clamp(24px,5vw,76px) 24px}
html[data-design=beta] .note-title{font-size:34px;font-weight:700;letter-spacing:-1.2px;padding-bottom:24px}
html[data-design=beta] .markdown-tools{padding:6px;gap:3px;background:var(--panel);border-radius:13px;margin-bottom:16px}
html[data-design=beta] .markdown-tools button{border:0;border-radius:9px;padding:8px 10px;color:var(--muted)}
html[data-design=beta] .empty-symbol{color:var(--purple);opacity:.2}
html[data-design=beta] .empty-create,html[data-design=beta] .agenda-add{border:0;border-radius:18px;background:var(--active);color:var(--purple);padding:13px 22px}
html[data-design=beta] .agenda-wrap,html[data-design=beta] .files-wrap{padding:24px 28px}
html[data-design=beta] .agenda-rows{padding:0}
html[data-design=beta] .agenda-row{background:var(--panel);border:0;border-radius:16px;margin-bottom:9px;padding:13px 12px}
html[data-design=beta] .agenda-row input{color:var(--fg)}
html[data-design=beta] .todo-check{accent-color:var(--purple)}
html[data-design=beta] .files-toolbar{border:0;background:var(--panel);border-radius:17px;padding:13px 15px;margin-bottom:18px}
html[data-design=beta] .files-row{background:var(--panel);border:0;border-radius:16px;padding:11px 14px;margin:7px 0}
html[data-design=beta] .files-name{font-size:13px;color:var(--fg)}
html[data-design=beta] dialog{border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 100px #0003;padding:26px;max-width:calc(100vw - 24px)}
html[data-design=beta] dialog::backdrop{background:#0004;backdrop-filter:blur(12px)}
html[data-design=beta] dialog h2{font-size:25px;letter-spacing:-.7px}
html[data-design=beta] dialog select,html[data-design=beta] dialog input:not([type=checkbox]):not([type=range]){border:0;border-radius:13px;padding:13px;background:var(--panel)}
html[data-design=beta] .dialog-actions button{border:0;border-radius:13px;padding:11px 18px}
html[data-design=beta] .setting-check input{accent-color:var(--purple)}
html[data-design=beta] .file-viewer{padding:0}
html[data-design=beta] .tag{border-radius:20px;padding:6px 12px}
html[data-design=beta] .toast{border-radius:17px;box-shadow:0 8px 40px #0002}
html[data-design=beta] button:active{transform:scale(.97)}
@media(max-width:600px){
 html[data-design=beta] .workspace,html[data-design=beta] .workspace:not([data-view=notes]){padding:0;gap:0;grid-template-columns:minmax(0,1fr);height:100dvh}
 html[data-design=beta] .document{border:0;border-radius:0;padding-bottom:calc(82px + env(safe-area-inset-bottom));background:var(--bg)}
 html[data-design=beta] .document-head{padding:14px 18px;padding-top:calc(14px + env(safe-area-inset-top));height:auto;min-height:67px;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(20px)}
 html[data-design=beta] .sidebar{border-radius:0 28px 28px 0;border:0;width:min(320px,86vw);bottom:calc(82px + env(safe-area-inset-bottom));height:auto;padding-bottom:0}
 html[data-design=beta] .view-tabs{position:fixed;z-index:15;left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));margin:0;padding:6px;gap:6px;border:1px solid var(--line);border-radius:25px;background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:blur(24px);box-shadow:0 6px 30px #0002;transform:none}
 html[data-design=beta] .sidebar{transform:none;left:calc(-1 * min(320px,86vw));transition:left .2s;overflow:visible}
 html[data-design=beta] .sidebar>*:not(.view-tabs){visibility:hidden}
 html[data-design=beta] .sidebar .view-tabs{visibility:visible}
 html[data-design=beta] body.sidebar-open .sidebar{left:0}
 html[data-design=beta] body.sidebar-open .sidebar>*{visibility:visible}
 html[data-design=beta] .view-tab{min-height:52px;border-radius:19px;font-size:10px;gap:4px}
 html[data-design=beta] .view-tab.selected{background:var(--active);box-shadow:none}
 html[data-design=beta] .sidebar-overlay{bottom:calc(82px + env(safe-area-inset-bottom))}
 html[data-design=beta] .editor-wrap{padding:23px 22px 18px}
 html[data-design=beta] .note-title{font-size:31px;padding-bottom:18px}
 html[data-design=beta] .markdown-tools{flex-wrap:wrap}
 html[data-design=beta] .markdown-tools button{padding:8px}
 html[data-design=beta] .agenda-wrap,html[data-design=beta] .files-wrap{padding:20px 16px;overflow:auto}
 html[data-design=beta] dialog{border-radius:25px;padding:24px;max-height:86dvh}
 html[data-design=beta] #settings-dialog{width:calc(100vw - 24px)}
 html[data-design=beta] .file-viewer{padding:0}
 html[data-design=beta] #agenda-calendar{margin-left:0;margin-right:0;background:var(--card)}
}
html[data-design=beta].focus-mode .workspace{padding:0}
html[data-design=beta].focus-mode .document{border:0;border-radius:0;padding-bottom:0;background:var(--bg)}
html[data-design=beta].focus-mode .editor-wrap{padding:clamp(28px,7vh,80px) 24px 20px}
@media(prefers-reduced-motion:reduce){html[data-design=beta] *{transition:none!important}html[data-design=beta] button:active{transform:none}}