@import url('/fonts/press-start.css');
:root{--bg:#18191c;--panel:#212226;--raised:#292a30;--ink:#ececf0;--muted:#a2a3ac;--line:#35363d;--accent:#baa0ea;--accent-ink:#19171e;--accent-soft:#baa0ea24;--accent-border:#baa0ea65;--field:#292a30;--subtle:#9899a3;--shadow:#0007;color-scheme:dark}
:root[data-theme="light"]{--bg:#f6f5f2;--panel:#ffffff;--raised:#eeedf0;--ink:#292a30;--muted:#71727d;--line:#e1e0e5;--field:#eeedf0;--subtle:#767681;--shadow:#2b23381c;color-scheme:light}
:root body,:root main,:root header{background:var(--bg);color:var(--ink)}
:root .sidebar{background:var(--panel);border-color:var(--line);box-shadow:0 -5px 25px var(--shadow)}
:root .brand,:root .note-card h3,:root .task-title,:root #viewer-title,:root .section-title h2{color:var(--ink)}
:root .space,:root .search,:root .task,:root .description-content textarea,:root #edit-title,:root label>input,:root label>select,:root textarea,:root .task select{background:var(--field);color:var(--ink);border-color:var(--line)}
:root .search input{color:var(--ink)}
:root .search input::placeholder,:root textarea::placeholder,:root input::placeholder{color:var(--subtle)}
:root .search>span,:root .breadcrumb,:root .eyebrow,:root #save-status,:root .nav-label,:root .note-top small,:root .chip,:root .folder-chip,:root .description-badge,:root .task-meta,:root #viewer-meta,:root .empty,:root label,:root .note-properties>small,:root .column-head,:root .folder-tabs button,:root .dialog-heading,:root .export,:root .sidebar-bottom>small,:root .space small,:root footer{color:var(--muted)}
:root .breadcrumb b,:root .quick-heading label{color:var(--ink)}
:root .primary{background:var(--accent);color:var(--accent-ink);border:0;box-shadow:none}
:root .primary:hover{background:var(--accent);color:var(--accent-ink);filter:brightness(1.06)}
:root .primary:active{background:var(--accent);color:var(--accent-ink);filter:brightness(.94)}
:root nav button{color:var(--muted)}
:root nav button.active,:root .folder-tabs .selected-folder{background:var(--accent-soft);color:var(--accent)}
:root nav em,:root #new-folder,:root .section-title button,:root .task-link,:root #preview a,:root #viewer-description a,:root #backlinks button,:root .entry-label{color:var(--accent)}
:root .brand-icon,:root .avatar,:root .space .avatar{background:var(--accent-soft);color:var(--accent);border-color:transparent}
:root .notes-grid,:root .quick-note,:root .column{background:var(--panel);border-color:var(--line)}
:root .note-card{background:transparent;border-color:var(--line)}
:root .note-card:hover{background:var(--raised);border-color:var(--line)}
:root .quick-note textarea{background:transparent}
:root .task:hover{border-color:var(--accent-border)}
:root .priority{background:var(--accent-soft);color:var(--accent)}
:root .priority.high{background:#b57d2320;color:#d2a456}
:root[data-theme="light"] .priority.high{color:#875c18}
:root .column:nth-child(3) i{background:var(--accent)}
:root dialog,:root #entry-viewer,:root #folder-editor{background:var(--panel);color:var(--ink);border-color:var(--line);box-shadow:0 20px 70px var(--shadow)}
:root .dialog-heading,:root .dialog-footer{background:var(--panel);border-color:var(--line)}
:root #entry-viewer .dialog-heading{background:transparent}
:root .dialog-heading button{color:var(--muted)}
:root #viewer-description{color:var(--ink);border-color:var(--line)}
:root .viewer-actions,:root footer,:root .quick-bottom,:root .column-head{border-color:var(--line)}
:root .description-panel{background:transparent;border-color:var(--line)}
:root .description-panel summary,:root .editor-tabs button{color:var(--muted)}
:root .editor-tabs .selected{color:var(--accent);border-color:var(--accent)}
:root #toast{background:var(--panel);color:var(--ink);border-color:var(--accent-border)}
:root .danger{color:#e49a9e}
:root[data-theme="light"] .danger{color:#ad404e}
:root button:focus-visible,:root a:focus-visible,:root input:focus-visible,:root textarea:focus-visible,:root select:focus-visible{outline-color:var(--accent)}
.appearance-button{display:grid;place-items:center;min-width:40px;min-height:40px;border-radius:12px;color:var(--muted)}
.appearance-button:hover{background:var(--raised);color:var(--accent)}
.appearance-button svg{width:21px;height:21px}
:root #appearance-dialog{width:min(440px,calc(100% - 28px));height:fit-content;max-height:85dvh;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;padding:23px;border:1px solid var(--line);border-radius:22px;overflow-y:auto}
:root #appearance-dialog .dialog-heading{position:static;padding:0;margin-bottom:22px;min-height:40px;font-size:16px;font-weight:600;letter-spacing:0;color:var(--ink)}
#appearance-dialog .dialog-heading button{min-width:40px;min-height:40px}
#appearance-dialog fieldset{margin:0 0 25px;padding:0;border:0}
#appearance-dialog legend{font-size:13px;font-weight:500;margin-bottom:13px;color:var(--muted)}
.theme-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.theme-choices button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 5px;font-size:12px;border:1px solid var(--line);border-radius:12px;color:var(--ink);min-height:108px}
.theme-choices .chosen{border-color:var(--accent);background:var(--accent-soft)}
.theme-mini{display:block;width:57px;height:41px;border-radius:7px;border:1px solid #8885;position:relative;overflow:hidden}
.theme-mini::before{content:'';position:absolute;inset:8px 8px auto;height:5px;border-radius:2px;background:#a5a1ad88;box-shadow:0 10px 0 #a5a1ad66,0 20px 0 #a5a1ad44}
.mini-light{background:#faf9f7}.mini-dark{background:#24242a}.mini-system{background:linear-gradient(90deg,#faf9f7 50%,#24242a 50%)}
#accent-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
#accent-choices button{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:79px;padding:11px 4px;border:1px solid var(--line);border-radius:12px;font-size:12px;color:var(--ink)}
#accent-choices button.chosen{border-color:var(--accent);background:var(--accent-soft)}
.color-swatch{width:25px;height:25px;border-radius:50%;background:var(--swatch-dark);position:relative}
:root[data-theme="light"] .color-swatch{background:var(--swatch)}
.chosen .color-swatch::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#18151f;font-size:16px;font-weight:650}
:root[data-theme="light"] .chosen .color-swatch::after{color:#fff}
.appearance-hint{font-size:12px;line-height:1.6;color:var(--muted);margin:0}
@media(max-width:700px){.header-right{gap:3px}:root #appearance-dialog{padding:20px}.breadcrumb{font-size:10px}.breadcrumb span{padding-inline:5px}#save-status{font-size:9px;max-width:100px}.appearance-button{min-width:38px;min-height:40px}.header-right .avatar{width:28px;min-height:28px;height:28px}.theme-choices button{font-size:12px}#appearance-dialog .dialog-heading{top:auto}}
@media(max-width:370px){#save-status{max-width:76px;font-size:8px}.breadcrumb{font-size:9px}.header-right{gap:0}.appearance-button{min-width:34px}}

.design-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.design-choices button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:10px 5px;border:1px solid var(--line);border-radius:12px;color:var(--ink);font-size:11px;min-height:100px}
.design-choices button.chosen{background:var(--accent-soft);border-color:var(--accent)}
.design-preview{display:flex;width:75px;height:49px;flex-direction:column;gap:5px;padding:8px;border:1px solid #8885;overflow:hidden}
.design-preview i{display:block;height:4px;background:currentColor;opacity:.35;width:80%;flex-shrink:0}
.design-preview i:last-child{width:55%}
.preview-classic{background:#eeeef0;color:#72717b;border-radius:8px;justify-content:center}
.preview-retro{background:#10201b;color:#b2d5ae;font:10px monospace;box-shadow:2px 2px 0 #526c57}
.preview-medieval{background:#33291e;color:#d9ba7c;font:20px/15px Georgia,serif;align-items:center;border:2px solid #a3864c;box-shadow:inset 0 0 0 2px #1b1814}
.preview-medieval i{height:3px}
:root[data-design="retro"]{--bg:#141b19;--panel:#1b2520;--raised:#26332b;--field:#131e18;--ink:#e0e6d8;--muted:#a0b19f;--line:#425548;--subtle:#8b9b88;--mono:'Courier New',monospace}
:root[data-design="retro"][data-theme="light"]{--bg:#e8e6da;--panel:#f4f1e4;--raised:#dfdece;--field:#e9e6d7;--ink:#29392d;--muted:#5a6b58;--line:#a3ad98;--subtle:#697760}
:root[data-design="retro"] body{font-family:'Courier New',monospace}
:root[data-design="retro"] button,:root[data-design="retro"] input,:root[data-design="retro"] textarea,:root[data-design="retro"] select{font-family:inherit}
:root[data-design="retro"] .brand{font-family:'Courier New',monospace;letter-spacing:-2px}
:root[data-design="retro"] .brand-icon{border-radius:0;border:1px solid var(--accent);background:transparent}
:root[data-design="retro"] .brand-dot{display:block;font-size:8px;color:var(--accent)}
:root[data-design="retro"] .breadcrumb::before{display:inline;content:'~/ ';color:var(--accent)}
:root[data-design="retro"] .eyebrow{font-size:11px!important}
:root[data-design="retro"] .section-title h2::before{display:inline;content:'> ';color:var(--accent)}
:root[data-design="retro"] .notes-grid,:root[data-design="retro"] .quick-note,:root[data-design="retro"] .column,:root[data-design="retro"] .task,:root[data-design="retro"] .search,:root[data-design="retro"] .sidebar,:root[data-design="retro"] .space{border-radius:0;border:1px solid var(--line)}
:root[data-design="retro"] .notes-grid,:root[data-design="retro"] .column{box-shadow:3px 3px 0 var(--line)}
:root[data-design="retro"] .note-card{border-radius:0}
:root[data-design="retro"] button,:root[data-design="retro"] .primary,:root[data-design="retro"] input,:root[data-design="retro"] textarea,:root[data-design="retro"] select,:root[data-design="retro"] .avatar{border-radius:0}
:root[data-design="retro"] .primary{border:1px solid var(--accent);box-shadow:3px 3px 0 var(--line);font-weight:700}
:root[data-design="retro"] .primary:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--line)}
:root[data-design="retro"] nav button.active,:root[data-design="retro"] .folder-tabs .selected-folder{border:1px solid var(--accent);border-radius:0}
:root[data-design="retro"] dialog,:root[data-design="retro"] #entry-viewer,:root[data-design="retro"] #appearance-dialog,:root[data-design="retro"] #folder-editor{border:2px solid var(--line);border-radius:0;box-shadow:6px 6px 0 #0005}
:root[data-design="retro"] .dialog-heading{border-bottom:1px solid var(--line);padding-bottom:10px;letter-spacing:1px}
:root[data-design="retro"] .description-panel,:root[data-design="retro"] #edit-title{border-radius:0}
:root[data-design="retro"] .note-card h3{font-weight:500;font-size:15px}
:root[data-design="retro"] .theme-choices button,:root[data-design="retro"] #accent-choices button,:root[data-design="retro"] .design-choices button{border-radius:0}
:root[data-design="retro"] .theme-mini,:root[data-design="retro"] .theme-mini::before{border-radius:0}
:root[data-design="retro"] .color-swatch{border-radius:0;width:23px;height:23px}
:root[data-design="retro"] .column-head i{border-radius:0}
:root[data-design="retro"] .primary svg{stroke-width:2}

/* Pixel-art journal: wood, parchment and metal; text remains legible. */
:root[data-design="medieval"]{--bg:#1e1b17;--panel:#2c261e;--raised:#393023;--field:#211e18;--ink:#f0e2c3;--muted:#c0ac88;--line:#67543a;--subtle:#aa9574;--shadow:#100d0abd}
:root[data-design="medieval"][data-theme="light"]{--bg:#e4d5b4;--panel:#f3e6c8;--raised:#dfcca2;--field:#eadbb9;--ink:#3e3021;--muted:#776044;--line:#b59b69;--subtle:#816b4c;--shadow:#47301533}
:root[data-design="medieval"] body{font-family:'Courier New',monospace;background-image:linear-gradient(90deg,transparent 95%,#95815b07 95%),linear-gradient(0deg,transparent 95%,#95815b07 95%);background-size:8px 8px}
:root[data-design="medieval"] button,:root[data-design="medieval"] textarea,:root[data-design="medieval"] input,:root[data-design="medieval"] select{font-family:inherit}
:root[data-design="medieval"] .brand{font-family:Georgia,serif;letter-spacing:1px;color:var(--ink)}
:root[data-design="medieval"] .brand-icon{font-size:0;border-radius:0;background:transparent;position:relative;width:32px;height:32px;color:var(--accent)}
:root[data-design="medieval"] .brand-icon::before{content:'';position:absolute;width:4px;height:4px;top:4px;left:0;background:currentColor;box-shadow:8px 0 currentColor,16px 0 currentColor,24px 0 currentColor,0 4px currentColor,4px 4px currentColor,8px 4px currentColor,16px 4px currentColor,20px 4px currentColor,24px 4px currentColor,0 8px currentColor,4px 8px currentColor,8px 8px currentColor,12px 8px currentColor,16px 8px currentColor,20px 8px currentColor,24px 8px currentColor,4px 12px currentColor,8px 12px currentColor,12px 12px currentColor,16px 12px currentColor,20px 12px currentColor,4px 16px currentColor,8px 16px currentColor,16px 16px currentColor,20px 16px currentColor,4px 20px currentColor,8px 20px currentColor,16px 20px currentColor,20px 20px currentColor,4px 24px currentColor,8px 24px currentColor,16px 24px currentColor,20px 24px currentColor}
:root[data-design="medieval"] header{border-bottom:2px solid var(--line);background:var(--panel)}
:root[data-design="medieval"] .sidebar{border:2px solid var(--line);border-radius:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,#9d815511 32px)}
:root[data-design="medieval"] .notes-grid,:root[data-design="medieval"] .column,:root[data-design="medieval"] .quick-note{border:2px solid var(--line);border-radius:3px;box-shadow:inset 0 0 0 2px var(--bg),3px 3px 0 var(--shadow);background-image:radial-gradient(#a58a5911 1px,transparent 1px);background-size:5px 5px}
:root[data-design="medieval"] .note-card{border-radius:0;padding:19px 18px;border-bottom:1px dashed var(--line)}
:root[data-design="medieval"] .note-card:last-child{border-bottom:0}
:root[data-design="medieval"] .note-card h3{color:var(--ink);font-size:16px;font-weight:600}
:root[data-design="medieval"] .section-title h2{font-family:Georgia,serif;font-size:20px;letter-spacing:.3px}
:root[data-design="medieval"] .section-title h2::before{display:inline;content:'◆ ';font-size:10px;color:var(--accent);vertical-align:middle}
:root[data-design="medieval"] .search,:root[data-design="medieval"] .task,:root[data-design="medieval"] .description-panel,:root[data-design="medieval"] #edit-title{border:2px solid var(--line);border-radius:2px;box-shadow:inset 2px 2px 0 var(--shadow)}
:root[data-design="medieval"] .primary{border-radius:2px;border:2px solid var(--accent);box-shadow:inset 2px 2px 0 #fff4,inset -2px -2px 0 #0004,3px 3px 0 var(--shadow);font-weight:700}
:root[data-design="medieval"] .primary:active{transform:translate(2px,2px);box-shadow:inset 2px 2px 0 #0003,1px 1px 0 var(--shadow)}
:root[data-design="medieval"] button,:root[data-design="medieval"] input,:root[data-design="medieval"] textarea,:root[data-design="medieval"] select,:root[data-design="medieval"] .avatar{border-radius:2px}
:root[data-design="medieval"] nav button.active,:root[data-design="medieval"] .folder-tabs .selected-folder{border:1px solid var(--accent-border);box-shadow:inset 0 -2px 0 var(--accent-border);border-radius:2px}
:root[data-design="medieval"] .column-head i{border-radius:0;transform:rotate(45deg)}
:root[data-design="medieval"] dialog,:root[data-design="medieval"] #entry-viewer,:root[data-design="medieval"] #folder-editor,:root[data-design="medieval"] #appearance-dialog{border:3px solid var(--line);border-radius:3px;box-shadow:inset 0 0 0 2px var(--bg),6px 6px 0 var(--shadow)}
:root[data-design="medieval"] .dialog-heading{border-bottom:1px dashed var(--line);padding-bottom:10px}
:root[data-design="medieval"] #viewer-title{font-family:Georgia,serif;font-size:24px}
:root[data-design="medieval"] .color-swatch,:root[data-design="medieval"] .theme-mini{border-radius:2px}
:root[data-design="medieval"] .design-choices button,:root[data-design="medieval"] .theme-choices button,:root[data-design="medieval"] #accent-choices button{border-radius:2px}
@media(max-width:700px){:root[data-design="retro"] .sidebar,:root[data-design="medieval"] .sidebar{border-bottom:0}:root[data-design="medieval"] .note-card{padding:17px 15px}.design-choices button{font-size:10px}.design-preview{width:65px}:root #appearance-dialog{max-height:90dvh}:root[data-design="retro"] #appearance-dialog,:root[data-design="medieval"] #appearance-dialog{max-height:90dvh}}

:root[data-design="medieval"] .section-title h2,:root[data-design="medieval"] .column-head,:root[data-design="medieval"] .dialog-heading,:root[data-design="medieval"] .brand{font-family:'Press Start 2P','Courier New',monospace}
:root[data-design="medieval"] .section-title h2{font-size:12px;line-height:1.9;letter-spacing:0}
:root[data-design="medieval"] .column-head{font-size:10px;line-height:1.9}
:root[data-design="medieval"] .dialog-heading{font-size:10px;line-height:1.9;letter-spacing:0}
:root[data-design="medieval"] .brand{font-size:19px;letter-spacing:-1px}
:root[data-design="medieval"] .primary svg,:root[data-design="medieval"] nav svg{shape-rendering:crispEdges;stroke-width:2}
:root[data-design="medieval"] .appearance-hint{font-size:11px}
:root[data-design="medieval"] .note-card h3{font-family:'Press Start 2P','Courier New',monospace;font-size:11px;line-height:2.1;font-weight:400}
:root[data-design="medieval"] nav button>span svg{display:none}
:root[data-design="medieval"] nav button>span{width:24px;height:24px;background-size:24px 24px;background-repeat:no-repeat;image-rendering:pixelated}
:root[data-design="medieval"] nav button[data-view="notes"]>span{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' shape-rendering='crispEdges'%3E%3Cpath fill='%23736143' d='M4 3h15v2h2v16H6v-2H4z'/%3E%3Cpath fill='%23dfc697' d='M3 3h15v2h2v14H7v-2H5V5H3z'/%3E%3Cpath fill='%23f4e4bf' d='M5 3h11v12H7V5H5z'/%3E%3Cpath fill='%23736143' d='M8 7h6v1H8zm0 3h7v1H8zm0 3h5v1H8z'/%3E%3C/svg%3E")}
:root[data-design="medieval"] nav button[data-view="tasks"]>span{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' shape-rendering='crispEdges'%3E%3Cpath fill='%23736143' d='M4 3h16v12h-2v3h-3v3H9v-3H6v-3H4z'/%3E%3Cpath fill='%23bd9d65' d='M6 5h12v9h-2v3h-3v2h-2v-2H8v-3H6z'/%3E%3Cpath fill='%234d6658' d='M8 7h8v6h-2v3h-4v-3H8z'/%3E%3Cpath fill='%23eadab3' d='M11 8h2v3h2v2h-2v3h-2v-3H9v-2h2z'/%3E%3C/svg%3E")}
:root[data-design="retro"] .design-preview,:root[data-design="medieval"] .design-preview{font-family:'Courier New',monospace;font-size:10px}
:root[data-design="medieval"] .preview-medieval{font-size:20px}
@media(max-width:700px){:root[data-design="medieval"] .note-card h3{font-size:11px;line-height:2.1}}

/* Small themed objects live around the content, never behind the writing. */
.theme-flavor{display:none;margin-top:7px;pointer-events:none;user-select:none}
.retro-flavor,.medieval-flavor{display:none;align-items:center;gap:8px;min-height:28px}
.theme-flavor img{display:block;width:28px;height:28px;image-rendering:pixelated;flex-shrink:0}
:root[data-design="retro"] .theme-flavor,:root[data-design="medieval"] .theme-flavor{display:block}
:root[data-design="retro"] .retro-flavor{display:flex}
.retro-flavor>span{font:10px/1.4 'Courier New',monospace;color:var(--muted);letter-spacing:1px}
.retro-flavor i{font-style:normal;color:#c9827a;font-size:9px;margin-left:8px}
:root[data-design="retro"] .content{counter-reset:tape-track}
:root[data-design="retro"] .note-card{counter-increment:tape-track;padding-left:43px}
:root[data-design="retro"] .note-card::before{content:counter(tape-track,decimal-leading-zero);position:absolute;left:14px;top:20px;font-size:10px;color:var(--muted);opacity:.7}
:root[data-design="retro"] .section-title h2::after{content:'  ▌▌▌ ▌▌ ▌';font-size:9px;letter-spacing:1px;color:var(--accent);opacity:.5}
:root[data-design="retro"] .quick-bottom .primary svg{display:none}
:root[data-design="retro"] .quick-bottom .primary::after{content:'';display:block;width:26px;height:26px;background:url('/sprites/floppy.svg') center/contain no-repeat;image-rendering:pixelated}
:root[data-design="retro"] .search{box-shadow:inset 2px 2px 0 #0002}
:root[data-design="retro"] .brand-icon{font-size:0;background:url('/sprites/cassette.svg') center/30px no-repeat;border:0;image-rendering:pixelated}
:root[data-design="retro"] .dialog-heading::before{content:'■';font-size:9px;color:#c9827a;margin-right:8px}
:root[data-design="retro"] .task{border-left:3px solid var(--accent-border)}
:root[data-design="retro"] .preview-retro{background-image:url('/sprites/cassette.svg');background-repeat:no-repeat;background-position:right 3px bottom 2px;background-size:24px}

:root[data-design="medieval"]{--bg:#1b2326;--panel:#293132;--raised:#35403d;--field:#20292c;--ink:#f1e5cd;--muted:#b6baa7;--line:#677663;--subtle:#9ea992;--shadow:#0d151b99;--quest-blue:#84b9ce;--quest-rose:#cd9292;--quest-green:#a4c88d;--quest-gold:#dbc083}
:root[data-design="medieval"][data-theme="light"]{--bg:#e8dfc5;--panel:#f5ebd1;--raised:#e3d5af;--field:#ebe1c5;--ink:#35443d;--muted:#65715d;--line:#a79c77;--subtle:#798168;--shadow:#37422e33;--quest-blue:#416f87;--quest-rose:#9a5967;--quest-green:#567c48;--quest-gold:#937235}
:root[data-design="medieval"] .medieval-flavor{display:flex;gap:7px;color:var(--quest-gold);font-size:10px}
.medieval-flavor .flavor-gem{width:20px;height:20px;margin-left:3px}
:root[data-design="medieval"] .brand-icon{background:url('/sprites/shield.svg') center/32px no-repeat;image-rendering:pixelated}
:root[data-design="medieval"] .brand-icon::before{display:none}
:root[data-design="medieval"] .notes-grid{border-color:var(--line);box-shadow:inset 0 0 0 2px var(--bg),4px 4px 0 var(--shadow)}
:root[data-design="medieval"] .note-card{border-bottom-style:solid;border-bottom-color:var(--line);border-left:3px solid var(--quest-blue)}
:root[data-design="medieval"] .note-card:nth-child(3n+2){border-left-color:var(--quest-green)}
:root[data-design="medieval"] .note-card:nth-child(3n){border-left-color:var(--quest-rose)}
:root[data-design="medieval"] .section-title h2{display:flex;align-items:center;gap:8px}
:root[data-design="medieval"] .section-title h2::before{content:'';display:inline-block;width:24px;height:28px;background:url('/sprites/scroll.svg') center/contain no-repeat;image-rendering:pixelated;flex-shrink:0}
:root[data-design="medieval"] body[data-view="tasks"] .section-title h2::before{background-image:url('/sprites/sword.svg')}
:root[data-design="medieval"] .column-head{color:var(--quest-blue)}
:root[data-design="medieval"] .column:nth-child(2) .column-head{color:var(--quest-gold)}
:root[data-design="medieval"] .column:nth-child(3) .column-head{color:var(--quest-green)}
:root[data-design="medieval"] .column-head i{background:var(--quest-blue)}
:root[data-design="medieval"] .column:nth-child(2) .column-head i{background:var(--quest-gold)}
:root[data-design="medieval"] .column:nth-child(3) .column-head i{background:var(--quest-green)}
:root[data-design="medieval"] .empty::before{content:'';display:block;width:32px;height:32px;margin:0 auto 10px;background:url('/sprites/campfire.svg') center/contain no-repeat;image-rendering:pixelated}
:root[data-design="medieval"] .folder-chip{color:var(--quest-green)}
:root[data-design="medieval"] .description-badge{color:var(--quest-blue)}
:root[data-design="medieval"] .quick-note{border-color:var(--quest-gold);box-shadow:inset 2px 2px 0 #ffffff0c,inset -2px -2px 0 #0002,3px 3px 0 var(--shadow)}
:root[data-design="medieval"] .quick-bottom .primary svg{display:none}
:root[data-design="medieval"] .quick-bottom .primary::after{content:'';display:block;width:28px;height:28px;background:url('/sprites/scroll.svg') center/contain no-repeat;image-rendering:pixelated}
:root[data-design="medieval"] .avatar{background:transparent;color:transparent;border:0;font-size:0;background:url('/sprites/potion.svg') center/28px no-repeat;image-rendering:pixelated}
:root[data-design="medieval"] .description-panel summary::before{content:'';width:20px;height:20px;background:url('/sprites/scroll.svg') center/contain no-repeat;image-rendering:pixelated;flex-shrink:0}
:root[data-design="medieval"] .preview-medieval{font-size:0;background-image:url('/sprites/shield.svg');background-size:29px;background-repeat:no-repeat;background-position:center}
:root[data-design="medieval"] .preview-medieval i{display:none}
:root[data-design="medieval"] .theme-mini,:root[data-design="medieval"] .color-swatch{clip-path:polygon(3px 0,calc(100% - 3px) 0,calc(100% - 3px) 3px,100% 3px,100% calc(100% - 3px),calc(100% - 3px) calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,3px calc(100% - 3px),0 calc(100% - 3px),0 3px,3px 3px)}
@media(max-width:700px){.theme-flavor{margin-top:5px}.theme-flavor img{width:25px;height:25px}.retro-flavor>span{font-size:9px}.retro-flavor i{font-size:8px;margin-left:4px}:root[data-design="retro"] .page-title .eyebrow,:root[data-design="medieval"] .page-title .eyebrow{font-size:9px!important}:root[data-design="retro"] .note-card{padding-left:39px}:root[data-design="retro"] .note-card::before{left:12px;top:19px}.medieval-flavor .flavor-gem{width:18px;height:18px;margin-left:0}:root[data-design="medieval"] .medieval-flavor{font-size:9px;gap:5px}}
@media(prefers-reduced-motion:reduce){:root[data-design] .primary:active{transform:none}}

:root #account-dialog{width:min(420px,calc(100% - 28px));height:fit-content;max-height:80dvh;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;padding:22px;border-radius:16px}.account-actions{display:grid;gap:10px}.account-actions button{min-height:48px;padding:12px;text-align:left;background:var(--field);border:1px solid var(--line);border-radius:10px}#account-dialog .dialog-heading{position:static;padding:0;min-height:40px}

/* Search owns the field surface; the nested input must not inherit form spacing. */
:root .search>input{flex:1;min-width:0;width:0;height:100%;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;line-height:normal;appearance:none;-webkit-appearance:none}
:root .search>span{display:flex;align-items:center;justify-content:center;flex:0 0 20px;height:20px;line-height:1}

/* Phone task board: native horizontal paging keeps vertical scrolling available. */
.task-status-tabs{display:none}
#viewer-status{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 14px}
#viewer-status button,.task-status-tabs button{min-height:44px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--field);color:var(--muted);font-size:12px;line-height:1.4}
#viewer-status button[aria-pressed="true"],.task-status-tabs button[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent-border);color:var(--accent)}
@media(max-width:700px){
 .task-status-tabs{display:flex;gap:6px;margin:0 0 12px}
 .task-status-tabs button{flex:1;min-width:0;padding:9px 5px;font-size:11px}
 .task-status-tabs small{display:block;font-size:10px;margin-top:3px;opacity:.7}
 .board{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;align-items:flex-start;overscroll-behavior-x:contain;padding:0 0 8px;position:relative}
 .board::-webkit-scrollbar{display:none}
 .board>.column{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box}
 #viewer-status button{flex:1;min-width:0;padding:10px 5px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.board{scroll-behavior:auto}}

.viewer-actions{gap:10px}
:root #viewer-delete{min-height:48px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;color:var(--muted);flex-shrink:0}
:root #viewer-delete:hover{color:var(--ink);background:var(--field)}
@media(max-width:700px){.viewer-actions .primary{flex:1;width:auto;min-width:0;padding-inline:12px}}

/* Personal and shared content use the same compact, touch-first controls. */
.scope-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px;flex-wrap:wrap}
.scope-filters{display:flex;gap:4px;background:var(--field);border-radius:12px;padding:4px}
.scope-filters button{min-height:40px;padding:8px 15px;border-radius:9px;color:var(--muted);font-size:12px}
.scope-filters button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent-border)}
#manage-spaces,#refresh-spaces{min-height:44px;color:var(--accent);padding:8px;font-size:12px}
.space-context{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.space-context label{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}
:root .space-context select{width:auto;max-width:240px;min-height:42px;margin:0;padding:8px 10px;border:1px solid var(--line);background:var(--field);color:var(--ink);font-size:12px}
.shared-badge{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.6;border-radius:6px;padding:2px 7px;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-border)}
.task>.shared-badge{margin:8px 0 0}
.viewer-access{display:grid;gap:5px;font-size:12px;line-height:1.6;padding:12px 0;color:var(--muted);overflow-wrap:anywhere}
.viewer-access strong{color:var(--accent);font-weight:500}
:root #spaces-dialog{width:min(540px,calc(100% - 24px));max-height:85dvh;overflow:auto;padding:22px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:18px}
#spaces-dialog .dialog-heading{position:static;background:none;margin-bottom:15px;align-items:center}
#close-spaces{min-width:44px;min-height:44px}
.space-inline-form{display:flex;gap:8px;margin:0 0 14px;align-items:center}
:root .space-inline-form input,:root #invite-link{min-width:0;width:100%;min-height:46px;border:1px solid var(--line);background:var(--field);color:var(--ink);padding:10px;border-radius:10px;font-size:14px}
.space-inline-form input{flex:1}
.space-inline-form button{min-height:46px;padding:10px 12px;font-size:12px;flex-shrink:0;border:1px solid var(--line);border-radius:10px}
.space-card{border:1px solid var(--line);padding:14px;border-radius:12px;margin:15px 0;background:var(--field)}
.space-card-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;overflow-wrap:anywhere}.space-card-heading small{white-space:nowrap;color:var(--muted);font-size:10px}
.space-members{display:grid;gap:8px;margin:14px 0}.space-members>div{display:flex;gap:8px;align-items:center;min-height:40px}.space-members>div>span{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}.space-members small{font-size:10px;color:var(--muted)}
:root .space-members select{max-width:150px;min-height:42px;background:var(--panel);color:var(--ink);border:1px solid var(--line);font-size:11px;padding:6px}
.space-members button{min-width:36px;min-height:42px;font-size:20px}.space-buttons{display:flex;gap:8px;flex-wrap:wrap}.space-buttons button,#copy-invite{min-height:44px;padding:8px;color:var(--accent);font-size:12px}
.space-hint{font-size:12px;color:var(--muted);line-height:1.7}#invite-result{margin-bottom:18px}#spaces-error{font-size:12px;color:var(--ink);padding:12px;background:var(--field);border:1px solid var(--accent-border)}
:root button:disabled,:root select:disabled{opacity:.45;cursor:default}
@media(max-width:700px){.scope-toolbar{gap:6px;margin-bottom:12px}.scope-filters button{padding:8px 12px;font-size:12px}#manage-spaces{font-size:11px;padding:8px 0}.space-context{gap:8px}.space-context label{width:100%;justify-content:space-between}.space-context select{max-width:100%}.space-context label select{max-width:70%}:root #spaces-dialog{padding:16px}.space-members>div{flex-wrap:wrap}.space-members>div>span{flex-basis:40%}.entry-space-field{display:block;font-size:12px}}