/* V2.0: production layout, styled from the supplied design reference. */
:root{--bg:#fff;--editor-bg:#fff;--surface:#f4f9f7;--raised:#fff;--text:#203332;--muted:#526b65;--border:#dce9e5;--accent:#087c69;--tint:#d9faee;--hover:#e6f5ef;--selected:#ffdc54;--selected-ink:#453810;--button-ink:#fff;--shadow:0 8px 26px #183d3015}
html[data-theme=dark]{--bg:#171e23;--editor-bg:#171e23;--surface:#202c2c;--raised:#252e31;--text:#ecf5f2;--muted:#a9bfba;--border:#354a46;--accent:#7fe2c5;--tint:#1d433a;--hover:#284438;--selected:#f6d15b;--button-ink:#13352c;--shadow:0 8px 26px #0003}
button{border-radius:9px}button:active:not(:disabled){filter:brightness(.97)}
.header{padding:17px 26px;background:var(--tint);min-height:72px}
.brand>.brand-logo{width:126px}.brand>.brand-description{border:0;border-radius:6px;background:var(--selected);color:var(--selected-ink);padding:4px 9px;font-size:12px}
.header-actions #export-all{background:var(--raised);box-shadow:0 2px 3px #183d3010;border-color:transparent;border-radius:9px}
.themes{background:var(--raised);border-color:transparent;border-radius:9px}.themes button[aria-pressed=true]{background:var(--selected);color:var(--selected-ink)}
.workspace-nav{display:flex;align-items:center;gap:7px;padding:10px 24px;border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0}
.workspace-nav a,.compact-workspace-nav a{display:inline-flex;align-items:center;padding:9px 13px;min-height:42px;border-radius:9px;color:var(--text);font-size:14px;font-weight:600;white-space:nowrap}
.workspace-nav a:hover,.compact-workspace-nav a:hover{background:var(--hover);text-decoration:none}.workspace-nav a[aria-current=page],.compact-workspace-nav a[aria-current=page]{background:var(--accent);color:var(--button-ink)}
.version-label{margin-left:auto;font-size:12px;color:var(--muted)}.compact-workspace-nav{display:none}
.workspace-controls{background:var(--surface);border-bottom:1px solid var(--border)}.workspace-controls>.toolbar{padding:8px 18px;min-height:50px}
.toolbar button[aria-pressed=true]{background:var(--tint);border-color:transparent}.toolbar button,.toolbar #menu-toggle{border-radius:9px}
.editor-panel,#editor{background:var(--editor-bg)}.editor-panel #editor{background:var(--editor-bg);padding:24px 32px;line-height:1.8}
.bottom-tab-row{padding:3px 12px;background:var(--surface);border-top:1px solid var(--border)}
.bottom-tab-row .tab{margin:4px 5px 4px 0;border:1px solid var(--border);border-radius:9px;background:var(--bg);padding-right:5px}
.bottom-tab-row .tab.active{background:var(--selected);border-color:var(--selected);color:var(--selected-ink)}.tab.active .tab-close{color:var(--selected-ink)}
.bottom-tab-row .tab-name{border-radius:8px;min-height:36px;font-weight:500}.bottom-tab-row .tab.active .tab-name{font-weight:650}
.bottom-tab-row .new-tab{background:var(--tint);color:var(--accent);border-radius:9px;min-width:40px;min-height:38px}
.statusbar{background:var(--surface)}.primary{color:var(--button-ink);border-radius:10px;box-shadow:0 3px 0 color-mix(in srgb,var(--accent) 75%,#000)}
.dropdown,.support-panel,.header-tools-panel,.font-panel{border-radius:12px}.help-topics button[aria-pressed=true]{background:var(--selected);color:var(--selected-ink);border-radius:9px}
.help-note,.donation-card{border-radius:14px}.donation-card{background:var(--surface);padding:40px 24px;margin-top:22px}.help-primary{background:var(--tint);border:0;border-radius:9px}
body.release-view{display:flex;height:auto;min-height:100dvh;overflow:auto;flex-direction:column}
body.sticky-view{display:flex;height:100vh;height:100dvh;min-height:0;overflow:hidden;flex-direction:column}
.sticky-save{color:var(--muted);font-size:13px}
#kadalaz-sticky{min-height:0;flex:1;background:var(--bg)}#kadalaz-sticky .main{margin:0 auto;flex:1}
#kadalaz-sticky{--yellow:#fff2a4;--blue:#d4edff;--pink:#ffdce7;--green:#dbf6d9}
#kadalaz-sticky[data-theme=dark]{--yellow:#55492b;--blue:#294556;--pink:#513340;--green:#294b35}
#kadalaz-sticky .toolbar{padding:0;border:0;align-self:stretch}
#kadalaz-sticky .primary{color:var(--button-ink)}
#kadalaz-sticky .touch-order{display:none;gap:2px;margin-left:auto}
#kadalaz-sticky input:not([type=checkbox]),#kadalaz-sticky textarea{font-size:16px}
#kadalaz-sticky .note .task input{min-height:18px;padding:0}
#kadalaz-releases{min-height:0;flex:1}
@media(max-width:1100px){.workspace-controls>.toolbar{padding:7px 14px}}
@media(max-width:800px){
 .header{padding:10px 12px;min-height:60px}.brand>.brand-logo{width:110px}.brand>.brand-description{font-size:11px;padding:3px 7px}
 .workspace-nav{padding:6px 10px;gap:3px}.workspace-nav a{padding:8px 10px;font-size:13px;min-height:40px}.version-label{font-size:11px}
 .workspace-controls>.toolbar{padding:5px 8px;min-height:54px}.bottom-tab-row{padding:2px 7px}.bottom-tab-row .tab-name{max-width:140px}
 .sticky-save{display:none}#kadalaz-sticky .touch-order{display:inline-flex}#kadalaz-sticky .touch-order button{min-height:40px;min-width:40px;padding:4px 8px;border:1px solid color-mix(in srgb,var(--paper-text) 20%,transparent)}
 #kadalaz-sticky .note-head .edit{min-height:40px}#kadalaz-sticky .note-head .handle{min-height:40px;min-width:32px}
 #kadalaz-sticky .note select,#kadalaz-sticky .note-date,#kadalaz-sticky .views button{min-height:44px}
 #kadalaz-sticky .note-foot{flex-wrap:wrap}#kadalaz-sticky dialog{padding:20px;max-height:calc(100dvh - 24px)}
}
@media(max-width:400px){.brand>.brand-logo{width:96px}.brand>.brand-description{font-size:10px}.workspace-nav a{padding:8px;font-size:12px}.version-label{display:none}#kadalaz-sticky .main{padding:20px 12px}#kadalaz-sticky .note-head{gap:4px}#kadalaz-sticky .note-signals{gap:4px}}
@media(pointer:coarse){#kadalaz-sticky .touch-order{display:inline-flex}#kadalaz-sticky .touch-order button{min-height:40px;min-width:40px}}
.landscape-notepad .workspace-nav{display:none}.landscape-notepad .compact-workspace-nav{display:flex;flex-direction:column;border-bottom:1px solid var(--border);padding-bottom:8px;gap:3px}
.landscape-notepad .brand,.landscape-notepad .header-actions,.landscape-notepad .workspace-controls>.toolbar{background:var(--tint)}
.landscape-notepad .brand>.brand-logo{width:88px}.landscape-notepad .bottom-tab-row{padding:0 6px;border-top:0}
.landscape-notepad .bottom-tab-row .tab{margin:3px 3px 3px 0}.landscape-notepad .bottom-tab-row .tab-name{min-height:34px}
.landscape-notepad .workspace-controls>.toolbar{min-height:0;padding:2px 0}
@media(prefers-reduced-motion:reduce){button,a{transition:none}}
/* V2.1 approved workspace palette and fine corners, shared across production pages. */
:root{--bg:#f0f2f6;--editor-bg:#fff;--surface:#e5e9ef;--raised:#fff;--text:#202630;--muted:#606875;--border:#dce1e8;--accent:#3155ed;--tint:#e5ebff;--hover:#e9edf5;--selected:#e5ebff;--selected-ink:#2447bf;--button-ink:#fff;--shadow:0 8px 26px #20263015}
html[data-theme=dark]{--bg:#12151b;--editor-bg:#20252e;--surface:#282f3a;--raised:#20252e;--text:#eff1f5;--muted:#adb5c3;--border:#373f4b;--accent:#a8b8ff;--tint:#293559;--hover:#282f3a;--selected:#293559;--selected-ink:#c5d0ff;--button-ink:#15224b}
button,.themes,.themes button,.primary,.header-actions #export-all,.workspace-nav a,.compact-workspace-nav a,.toolbar button,.toolbar #menu-toggle,.bottom-tab-row .tab,.bottom-tab-row .tab-name,.bottom-tab-row .new-tab,.dropdown,.support-panel,.header-tools-panel,.font-panel,.help-note,.help-primary,.donation-card,.help-topics button[aria-pressed=true],dialog,select,input,textarea{border-radius:2px}
.header{background:var(--bg);padding:20px 26px;min-height:72px;border-bottom:0}
.brand>.brand-description{color:var(--muted);background:transparent;border:0;border-radius:0;padding:0;font-size:12px;font-weight:400}
.header-actions #export-all{box-shadow:none;background:transparent;border:1px solid var(--border);color:var(--muted)}
.themes{background:transparent;border-color:var(--border)}.themes button[aria-pressed=true]{background:var(--raised);color:var(--text)}
.release-link,.help-link{color:var(--muted);font-size:13px;padding:8px 7px;white-space:nowrap;border-radius:2px}.release-link:hover,.release-link[aria-current=page]{color:var(--accent);background:var(--hover);text-decoration:none}
.workspace-nav{padding:0 16px;gap:4px;background:var(--bg)}
.workspace-nav a{background:transparent;font-weight:500;min-height:45px;padding:10px 12px;border-bottom:2px solid transparent;border-radius:2px 2px 0 0;color:var(--muted)}
.workspace-nav a[aria-current=page]{background:transparent;color:var(--text);border-bottom-color:var(--accent)}
.compact-workspace-nav a[aria-current=page]{background:var(--tint);color:var(--selected-ink)}
.workspace-controls{background:var(--bg)}.toolbar button[aria-pressed=true]{background:var(--tint);color:var(--selected-ink)}
.editor-panel #editor{line-height:1.8;background:var(--editor-bg)}
.bottom-tab-row{background:var(--bg)}.bottom-tab-row .tab{background:var(--bg);border-color:transparent;border-bottom:2px solid transparent}.bottom-tab-row .tab.active{background:var(--selected);border-color:transparent;border-bottom-color:var(--accent);color:var(--selected-ink)}
.bottom-tab-row .tab.active .tab-name{font-weight:500}.bottom-tab-row .new-tab{background:transparent;color:var(--accent)}.statusbar{background:var(--bg)}.primary{box-shadow:none}
body.help-view,body.release-view,body.sticky-view{background:var(--bg)}
.help-page,.donation-card{background:var(--bg)}.help-topics button[aria-pressed=true]{background:var(--tint);color:var(--selected-ink)}.help-note{background:var(--raised)}
#kadalaz-releases{--rn-bg:var(--bg);--rn-surface:var(--raised);--rn-text:var(--text);--rn-muted:var(--muted);--rn-border:var(--border);--rn-accent:var(--accent)}
#kadalaz-releases .release-badge,#kadalaz-releases .release-entry,#kadalaz-releases .release-version{border-radius:2px}
#kadalaz-releases .current{background:var(--tint);color:var(--selected-ink)}
#kadalaz-releases .release-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px}.release-future{margin-top:30px;border-top:1px solid var(--border);padding-top:24px}
.help-topic-label{display:block;color:var(--muted);font-size:12px;padding:10px 12px 4px}
@media(max-width:800px){.header{padding:10px 12px;min-height:60px}.workspace-nav{padding:0 4px;gap:4px}.workspace-nav a{padding:9px 8px}.brand>.brand-description{font-size:11px;padding:0}}
@media(max-width:650px){#kadalaz-releases .release-grid{grid-template-columns:1fr}}
.landscape-notepad .brand,.landscape-notepad .header-actions,.landscape-notepad .workspace-controls>.toolbar{background:var(--bg)}

#kadalaz-releases{--kr-bg:var(--bg);--kr-fg:var(--text);--kr-muted:var(--muted);--kr-surface:var(--raised);--kr-mint:var(--tint);--kr-teal:var(--accent);--kr-line:var(--border);--kr-yellow:var(--selected)}
#kadalaz-releases .release-status,#kadalaz-releases .release-storage,.support-options,.support-options a,.help-link[aria-current=page],.help-page kbd{border-radius:2px}
.help-content h3{margin-top:24px}.help-content>.help-eyebrow+h2{margin-top:0}
@media(pointer:coarse){.release-link{display:inline-flex;align-items:center;min-height:44px}}

/* Shared priority notification. Keep it red independently of card preferences. */
.sticky-priority-notification{display:inline-block;flex:none;width:7px;height:7px;margin-left:7px;border-radius:50%;background:#ff0000;animation:kadalaz-notification-blink 1s step-end infinite}
.sticky-priority-notification[hidden]{display:none!important}
.priority-site-dot{display:none}
.landscape-notepad .priority-site-dot{display:inline-block;position:absolute;right:2px;top:3px;margin:0}
.landscape-notepad #header-tools-toggle{position:relative}
@keyframes kadalaz-notification-blink{0%,100%{opacity:1}50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.sticky-priority-notification{animation:none;opacity:1}}

/* V2.2: workspace navigation shares the desktop header when it fits. */
.header.has-workspace-nav{gap:16px}
.header.has-workspace-nav>.brand,.header.has-workspace-nav>.header-actions{flex:none}
.header>.workspace-nav{flex:1;min-width:240px;justify-content:center;padding:0;gap:4px;border-bottom:0;background:transparent}
.header>.workspace-nav .version-label{margin-left:8px;font-size:11px}
.header>.workspace-nav a{padding:10px 12px}

/* Compact shared header actions; occasional commands stay in Site options. */
.header-tools-wrap{display:inline-flex;align-items:center;position:relative;flex:none}
.header-tools-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:100;display:flex;flex-direction:column;align-items:stretch;gap:8px;width:220px;max-height:calc(100dvh - 90px);overflow:auto;padding:12px;background:var(--raised);border:1px solid var(--border);box-shadow:var(--shadow)}
.header-tools-panel[hidden]{display:none}
.header-tools-panel #export-all,.header-tools-panel>a{min-height:40px;padding:8px 10px;text-align:left;justify-content:flex-start}
#header-tools-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;min-height:34px;padding:4px;font-size:22px}
.header-actions{gap:8px}
@media(min-width:801px){
 .header-actions>.themes button{width:32px;min-height:30px;padding:4px}
 .header-actions>.themes button span{display:none}
 .header-actions>.themes svg{width:15px;height:15px}
 .header-actions #save-status>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .header-actions #save-status::after{content:attr(data-short);font-size:12px}
 .header-actions #save-status.error::after{content:'Save failed'}
 .header-actions .support-toggle{width:34px;min-height:34px;padding:5px}
}

/* V2.2: separate the shared menu from workspace controls. */
.header{border-bottom:1px solid var(--border)}

.header-tools-panel .menu-version{font-size:12px;color:var(--muted);padding:4px 10px 8px;border-bottom:1px solid var(--border)}

/* Keep Site options above the Notepad workspace and visible at every width. */
body>.header{position:relative;z-index:40}
#header-tools-toggle{flex:none;color:var(--text)}
#header-tools-toggle .ui-icon{display:block;width:20px;height:20px}

/* Compact shared navigation: keep the wordmark and controls comfortably spaced. */
body>.header{padding-top:8px;padding-bottom:8px;min-height:56px}
.header>.workspace-nav a{padding-top:7px;padding-bottom:7px}
body>.workspace-nav{padding-top:2px;padding-bottom:2px}
@media(pointer:coarse){body>.header{min-height:60px} .header>.workspace-nav a{min-height:44px}}