/* theme-tokens */:root{--b1:#202121;--b2:#f5f3ee;--b3:#b7a17b;--b4:#b4b5b0;--b5:#181919;--b6:#eeebe4;--b7:#75736d;--b8:#e4e1d9;--b9:#20212108;--b10:#ffffff;--b11:#383630;--b12:#c4c0b6;--b13:#fdfcf9;--b14:#8c7958;--b15:#eeebe5;--b16:#666056;--b17:#65583f;--b18:#dedbd3;--b19:#8c7958;--b20:#b7a17b26;--b21:#f0eee8;--b22:#665436;--b23:#e6dfd1;--b24:#20212112;--b25:#716d64;--b26:#e7e3da;--b27:#e5decf;--b28:#433a29;--b29:#7c766b;--b30:#ded9ce;--b31:#9e8760;--b32:#8c7958;--b33:#ded9ce;--b34:#f7f5ef;--b35:#716858;--b36:#fdfcf9ed;--b37:#f3f0e9;--b38:#e8e4db;--b39:#827b6d;--b40:#81755f;--b41:#ebe6dc;--b42:#ded6c8;--b43:#c2ad88;--b44:#cbc7bd;--b45:#cbb997;--b46:#c3b28e;--b47:#eae3d6;--b48:#76613d;--b49:#f0e9dd;--b50:#e8e7e1;--b51:#6e6c64;--b52:#ddd6c7;--b53:#ad9c7c;--b54:#faf8f2;--b55:#4f493f;--b56:#f4f1e9;--b57:#f8f6f0;--b58:#797264;--b59:#4f4d47;--b60:#393731;--b61:#f7f4ed;--b62:#766b57;--b63:#f2efe8;--b64:#76664b;--b65:#9e8760;--b66:#b7a17b33;--b67:#5a5346;--b68:#7a705e;--b69:#f1eee6;--b70:#75674f;--b71:#20212130;--b72:#20212166;--b73:#20212126;--b74:#ffffff}[data-theme=dark]{color-scheme:dark;--b1:#202121;--b2:#f5f3ee;--b3:#b7a17b;--b4:#b4b5b0;--b5:#454848;--b6:#22201b;--b7:#cecdca;--b8:#3b372c;--b9:#14151508;--b10:#ffffff;--b11:#68655b;--b12:#aba699;--b13:#2b2922;--b14:#d6cfc2;--b15:#22201b;--b16:#d0cdc8;--b17:#d3cbbd;--b18:#635c4a;--b19:#6a5c43;--b20:#1a160e26;--b21:#23221c;--b22:#d7cdbb;--b23:#1b1915;--b24:#14151512;--b25:#cfcdc9;--b26:#1e1c17;--b27:#1a1915;--b28:#dad3c7;--b29:#cfcdc9;--b30:#766a4f;--b31:#5a4d37;--b32:#544935;--b33:#685d46;--b34:#27251f;--b35:#d2cec6;--b36:#2b2922ed;--b37:#24221d;--b38:#3d382d;--b39:#d0cdc8;--b40:#d3cec5;--b41:#1f1d18;--b42:#6c5d41;--b43:#c7b79a;--b44:#a8a293;--b45:#72603d;--b46:#71603c;--b47:#1d1b17;--b48:#dbd0bd;--b49:#211e1a;--b50:#201f19;--b51:#cecdca;--b52:#6c5e42;--b53:#c9bfac;--b54:#282620;--b55:#d0ccc6;--b56:#25231d;--b57:#27251f;--b58:#d0cdc8;--b59:#cccbc7;--b60:#d3d2ce;--b61:#26241e;--b62:#d3cec5;--b63:#24221c;--b64:#d6cfc2;--b65:#6c5c42;--b66:#68573933;--b67:#cecac3;--b68:#d2cec6;--b69:#23211c;--b70:#d5cec3;--b71:#14151530;--b72:#4d4f4f66;--b73:#14151526;--b74:#282828}
:root {
    --brand-carbon: var(--b1);
    --brand-porcelain: var(--b2);
    --brand-champagne: var(--b3);
    --brand-stone: var(--b4);
    --green: var(--brand-carbon);
    --green-dark: var(--b5);
    --green-light: var(--b6);
    --ink: var(--brand-carbon);
    --muted: var(--b7);
    --line: var(--b8);
    --paper: var(--brand-porcelain);
    --shadow: 0 12px 40px var(--b9);
    --primary-bg: var(--brand-carbon);
    --primary-ink: var(--b10);
    --primary-hover: var(--b11);
    --banner-bg: var(--brand-carbon);
    --banner-line: var(--brand-carbon);
    --toast-bg: var(--brand-carbon);
}
body { background: var(--paper); }
.brand { letter-spacing: normal; }
.brand .brand-logo { display: block; width: 180px; height: auto; max-width: 100%; border-radius: 0; }
.login-story .brand .brand-logo { width: 220px; }
.sidebar .brand { margin: 0 6px 28px; }
/* The wordmark of logo-primary.svg is ink-coloured and vanishes on the dark sidebar, so dark mode shows the reverse logo (owner, 30 Oct 2026). */
.brand .brand-logo-dark { display: none; }
[data-theme="dark"] .brand .brand-logo { display: none; }
[data-theme="dark"] .brand .brand-logo-dark { display: block; }
.login-story { background: var(--brand-carbon); color: var(--brand-porcelain); }
.story-copy { margin-top: 54px; }
.story-copy .eyebrow, .story-copy h1 span, .login-top span { color: var(--brand-champagne); }
.story-copy h1 { margin: 22px 0; }
.story-copy p, .story-footer { color: var(--b12); }
.brand-architecture { width: 100%; max-width: 560px; margin: 30px auto; overflow: hidden; border-radius: 4px; }
.brand-architecture img { display: block; width: 100%; height: auto; aspect-ratio: 1.75; object-fit: cover; }
.login-main, .main-area { background: var(--b13); }
.login-mark { line-height: 1; margin-bottom: 22px; }
.login-mark img { display: block; }
.login-top, .login-bottom, .login-reassurance, .login-reassurance small, .field-hint { color: var(--muted); }
.login-reassurance>span { color: var(--b14); }
.login-divider { background: var(--line); }
.btn:hover { background: var(--b15); }
.btn.primary, .auth-tabs button.active { background: var(--primary-bg); border-color: var(--primary-bg); color: var(--primary-ink); }
.btn.primary:hover { background: var(--primary-hover); }
.auth-tabs button { background: var(--b6); color: var(--b16); }
.auth-message { color: var(--b17); }
input, select, textarea { border-color: var(--b18); }
input:focus, textarea:focus, select:focus { border-color: var(--b19); box-shadow: 0 0 0 3px var(--b20); }
button:focus-visible, a:focus-visible, [contenteditable]:focus-visible { outline-color: var(--b19); }
.sidebar { background: var(--b21); }
.avatar { color: var(--b22); background: var(--b23); }
.new-note { box-shadow: 0 4px 10px var(--b24); }
.nav-item, .icon-btn, .tree-toggle, .book-order button, .profile-gear { color: var(--b25); }
.nav-item:hover, .icon-btn:hover { background: var(--b26); color: var(--brand-carbon); }
.nav-item.active, .task-tabs button.active { background: var(--b27); color: var(--b28); }
.nav-section, .nav-count, .profile-button small, .storage-label, .workspace-status { color: var(--b29); }
.storage-track { background: var(--b30); }
.storage-track span { background: var(--b31); }
.workspace-status i { background: var(--b32); }
.tag-chip { border-color: var(--b33); background: var(--b34); color: var(--b35); }
.tag-chip.active { background: var(--b27); color: var(--b28); }
.topbar { background: var(--b36); }
.breadcrumb, .breadcrumb strong, .today-date, .home-greeting p, .home-greeting .eyebrow { color: var(--muted); }
.search-wrap, .language-picker select { background: var(--b37); border-color: var(--b38); }
.search-wrap input::placeholder, .search-wrap, .view-header p { color: var(--b39); }
kbd, .search-wrap kbd { color: var(--b40); background: var(--b41); border-color: var(--b42); }
.welcome-banner { background: var(--banner-bg); border-color: var(--banner-line); color: var(--brand-porcelain); }
.welcome-banner .mini-label { color: var(--b43); }
.welcome-banner p { color: var(--b44); }
.welcome-banner button { background: var(--brand-champagne); border-color: var(--brand-champagne); color: var(--brand-carbon); }
.welcome-banner button:hover { background: var(--b45); }
.banner-drawing { background: url('./brand/pattern-dark.svg?v=1') center / 210px 175px; opacity: .9; border-radius: 12px; }
.banner-drawing .brand-banner-mark { width: 100px; height: auto; display: block; margin: 18px auto; }
.quick-card, .note-card, .task-panel, .collaboration-card, .capture-card { border-color: var(--line); }
.quick-card:hover, .note-card:hover { border-color: var(--b46); }
.quick-icon { background: var(--b47); color: var(--b48); }
.quick-card:nth-child(2) .quick-icon { background: var(--b49); color: var(--b14); }
.quick-card:nth-child(3) .quick-icon { background: var(--b50); color: var(--b51); }
.section-heading h2 .icon, .section-heading button, .home-bottom { color: var(--b40); }
.empty-state { border-color: var(--b52); }
.empty-state>.icon { color: var(--b53); }
.task-panel { background: var(--b54); }
.task-panel>p { color: var(--muted); }
.section-heading, .section-heading a, .quick-card strong, .note-card h3, .task-row strong, .empty-state h3 { color: var(--b55); }
.quick-card small, .note-card p, .note-card time, .task-row small, .task-tabs button, .empty-state { color: var(--muted); }
.task-add, .service-status { background: var(--b56); border-color: var(--line); }
.editor-toolbar, .note-tags-editor input, .editor-meta select, .file-row { background: var(--b57); }
.editor-toolbar .icon-btn, .editor-meta, .editor-meta select, .editor-footer, .editor-top .save-status { color: var(--b58); }
.editor-top .save-status.error { color: var(--danger); }
.toolbar-divider, .note-tags-editor { border-color: var(--line); }
.toolbar-divider { background: var(--line); }
.note-body { color: var(--b59); }
.note-body h2 { color: var(--b60); }
.note-body blockquote { border-color: var(--brand-champagne); background: var(--b61); color: var(--b62); }
.note-body pre { background: var(--b63); }
.note-body td, .note-body th, .ProseMirror td, .ProseMirror th { border-color: var(--b33); }
.collaboration-presence, .book-order button, .notebook-title small { color: var(--b64); }
.ProseMirror-selectednode .attachment-embed { outline-color: var(--b65); }
.ProseMirror .selectedCell:after { background: var(--b66); }
.attachment-embed { border-color: var(--line); background: var(--b34); color: var(--b67); }
.embed-header { border-color: var(--line); }
.embed-header small, .image-controls, .image-resize, .pdf-page { color: var(--b68); }
.data-table th { background: var(--b69); color: var(--b70); }
.data-table td { border-color: var(--line); }
.stat-card span, dialog p, .revision-row small, .manage-row small, .pagination { color: var(--muted); }
dialog { border-color: var(--line); box-shadow: 0 30px 90px var(--b71); }
dialog::backdrop { background: var(--b72); }
#toast { background: var(--toast-bg); box-shadow: 0 8px 30px var(--b73); }
@media (max-width: 950px) {
    .story-copy { margin-top: 40px; }
    .brand-architecture { margin-top: 24px; }
}
@media (max-width: 700px) {
    .login-story { background: var(--brand-carbon); }
    .login-story .brand .brand-logo { width: 170px; height: auto; }
    .story-copy { margin-top: 28px; }
    .story-copy h1 { margin: 12px 0; }
    .brand-architecture { display: none; }
    .login-mark img { width: 40px; height: auto; }
    .banner-drawing { background-size: 140px; }
    .banner-drawing .brand-banner-mark { width: 80px; margin: 24px auto; }
    .welcome-banner h2 { text-wrap: balance; }
    .workspace.menu-open .sidebar-overlay { background: var(--b72); }
}
@media print {
    body, .main-area { background: var(--b74); }
}

/* theme-tokens:skip */
/* Noir Flow dark theme: carbon surfaces, porcelain ink, champagne accents (kv-flow RULES 26). The generated
   token blocks above derive every other colour; these override the brand tokens. Hand-written: deploy/theme-tokens.py
   leaves everything between the skip/end markers alone. */
[data-theme=dark]{--ink:#ebe8e1;--muted:#a19d94;--line:#2e2f32;--paper:#121314;--green:#d9c7a1;--green-dark:#b7a17b;--green-light:#2a2721;--shadow:0 12px 40px #00000059;--primary-bg:var(--brand-champagne);--primary-ink:#1b1a17;--primary-hover:#cbb997;--banner-bg:#1f2022;--banner-line:#323338;--toast-bg:#2b2c2f}
.theme-toggle{border:0;background:transparent;width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);cursor:pointer;padding:0}
.theme-toggle:hover{background:var(--green-light);color:var(--ink)}
.theme-toggle .icon{width:17px;height:17px}
/* Phones: 16 px inputs so iOS does not zoom the page on focus (kv-flow RULES 28). */
@media (max-width:700px){input:not([type=checkbox]):not([type=radio]),select,textarea,.search-wrap input{font-size:16px}}
/* theme-tokens:end */