@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;650;700&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--canvas);font-synthesis:none;--canvas:#03313a;--surface:#073a45;--text:#e7f4f3;--muted:#a4bec2;--border:#28535d;--accent:#d3e8e8;--highlight:#8fffe0;--soft:#0d4651;--focus:#8fffe0;--control-border:#72979d;--danger:#ffb4ad;--error-surface:#4c2730;--error-text:#ffd5ce;font-family:DM Sans,system-ui,sans-serif;font-weight:400}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.note-body:focus-visible{outline:3px solid var(--focus);outline-offset:3px}a{color:var(--accent)}button{background:0 0;border:0}input,select{border:1px solid var(--control-border);background:var(--surface);max-width:100%;min-height:46px;color:var(--text);border-radius:8px;padding:10px 12px}input[type=checkbox]{accent-color:var(--highlight);width:20px;height:20px;min-height:20px}h1,h2,p{margin-top:0}h1{letter-spacing:-1px;margin-bottom:10px;font-size:29px;font-weight:600;line-height:1.2}h2{font-size:21px;font-weight:500}small{color:var(--muted);font-size:12px}.app-shell{min-height:100dvh}.sidebar{display:none}.mobile-header{justify-content:space-between;align-items:center;height:76px;padding:12px 22px;display:flex}.brand{letter-spacing:-1.8px;color:var(--text);font-size:31px;font-weight:700;text-decoration:none}.brand span{color:var(--highlight)}.demo-banner{background:var(--surface);color:var(--muted);padding:10px 20px;font-size:12px;line-height:1.6}.demo-banner span{display:block}.main-content{max-width:880px;margin:0 auto;padding:30px 20px 140px}.page-heading{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:1.3px;color:var(--muted);margin-bottom:13px;font-size:11px;font-weight:500}.subtitle{color:var(--muted);margin-bottom:28px;font-size:14px;line-height:1.5}.page-menu{position:relative}.page-menu summary{cursor:pointer;justify-content:center;align-items:center;width:44px;height:44px;list-style:none;display:flex}.page-menu summary::-webkit-details-marker{display:none}.popover{z-index:5;background:var(--surface);border:1px solid var(--border);border-radius:12px;min-width:190px;padding:8px;position:absolute;top:45px;right:0;box-shadow:0 8px 30px #001a2040}.popover button{text-align:left;border-radius:6px;align-items:center;gap:10px;width:100%;padding:12px;font-size:14px;display:flex}.popover button:hover{background:var(--soft)}.tabs{border-bottom:1px solid var(--border);gap:24px;margin-bottom:24px;display:flex}.tabs button{min-height:49px;color:var(--muted);border-bottom:2px solid #0000;padding:0 3px 15px;font-size:15px}.tabs button[aria-pressed=true]{color:var(--text);border-color:var(--highlight);font-weight:600}.section-label{color:var(--muted);align-items:center;gap:10px;margin:24px 0 7px;font-size:12px;display:flex}.section-label span{background:var(--soft);border-radius:5px;padding:2px 7px;font-size:11px}.task-row{border-bottom:1px solid var(--border);align-items:center;gap:12px;min-height:85px;display:flex}.task-check{border:1.5px solid var(--control-border);border-radius:7px;flex-shrink:0;place-items:center;width:24px;height:24px;display:grid;position:relative}.task-check:before{content:"";position:absolute;inset:-10px}.task-check.checked{background:var(--highlight);border-color:var(--highlight);color:var(--canvas)}.task-content{text-align:left;flex:1;min-width:0;padding:15px 0;line-height:1.5}.task-content>span{overflow-wrap:anywhere;font-size:15px;display:block}.task-content small{flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:5px;font-size:11px;display:flex}.task-content small>span{align-items:center;gap:4px;display:inline-flex}.overdue{color:var(--danger)}.icon-button{border-radius:8px;justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.icon-button:hover{background:var(--soft)}.pin-button{color:var(--muted)}.pin-button.pinned{color:var(--highlight);background:var(--soft)}.add-actions{flex-wrap:wrap;gap:6px 20px;margin-top:16px;display:flex}.inline-add{min-height:48px;color:var(--accent);align-items:center;gap:8px;padding:8px 0;font-size:14px;display:inline-flex}.notes-list{margin-top:30px}.note-row{text-align:left;border-bottom:1px solid var(--border);align-items:center;gap:14px;width:100%;min-height:83px;padding:16px 0;display:flex}.note-row>svg:first-child{color:var(--accent)}.note-row>svg:last-child{color:var(--muted)}.note-row>span{overflow-wrap:anywhere;flex:1;font-size:15px}.note-row small{margin-top:5px;display:block}.bottom-nav{z-index:10;background:var(--surface);border-top:1px solid var(--border);padding:10px 24px calc(10px + env(safe-area-inset-bottom));justify-content:space-around;align-items:center;gap:20px;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav>button{min-width:72px;min-height:52px;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex}.bottom-nav span{font-size:10px}.bottom-nav button[aria-current=page]{color:var(--accent)}.bottom-nav .add-button{background:var(--soft);width:52px;min-width:52px;height:52px;color:var(--highlight);border:1px solid var(--control-border);border-radius:18px}.category-row{text-align:left;border-bottom:1px solid var(--border);align-items:center;gap:14px;width:100%;padding:20px 0;display:flex}.folder-icon{background:var(--soft);color:var(--accent);border-radius:12px;place-items:center;width:44px;height:44px;display:grid}.category-row>span:nth-child(2){flex:1}.category-row small{margin-top:5px;display:block}.back-button{min-height:44px;color:var(--accent);align-items:center;gap:8px;padding:0;font-size:13px;display:flex}.empty-state{text-align:center;color:var(--muted);padding:44px 12px 28px}.empty-state>svg{color:var(--accent);margin-bottom:18px}.empty-state h2{color:var(--text);font-size:19px}.empty-state p{max-width:310px;margin:0 auto;font-size:14px;line-height:1.7}.notice,.quiet{color:var(--muted);font-size:13px;line-height:1.5}.notice{padding:12px 0}.error{background:var(--error-surface);color:var(--error-text);border-radius:8px;padding:14px;font-size:14px;line-height:1.6}.error button{min-height:44px;text-decoration:underline;display:block}.skip-link{z-index:99;background:var(--surface);padding:12px;position:fixed;top:-80px;left:10px}.skip-link:focus{top:10px}.edit-dialog{border:1px solid var(--border);width:min(100% - 24px,560px);max-height:calc(100dvh - 24px);color:var(--text);background:var(--surface);border-radius:18px;padding:0;overflow:auto}.edit-dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#011a20b3}.edit-dialog form{margin:0}.dialog-header{z-index:3;background:var(--surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;display:flex;position:sticky;top:0}.dialog-header>span{color:var(--muted);font-size:14px}.primary-button{background:var(--soft);color:var(--text);border:1px solid var(--control-border);border-radius:9px;min-height:44px;padding:11px 18px;font-size:14px}.draft-fields{border:0;min-width:0;margin:0;padding:24px 20px}.draft-fields input:not([type=checkbox]),.draft-fields select{width:100%;margin:8px 0 20px}.field-label{color:var(--muted);font-size:12px}.draft-fields .title-input{border:0;border-bottom:1px solid var(--border);box-shadow:none;border-radius:0;padding:12px 0;font-size:21px}.date-fields{color:var(--muted);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;font-size:12px;display:grid}.date-fields input{min-width:0;font-size:14px}.check-field{align-items:center;gap:10px;min-height:44px;font-size:14px;display:flex}.dialog-footer{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.dialog-footer>span{color:var(--muted);font-size:11px}.dialog-footer>div{align-items:center;gap:8px;display:flex}.dialog-footer .danger{color:var(--danger)}.text-button{min-height:44px;color:var(--accent);align-items:center;gap:7px;font-size:13px;display:inline-flex}.edit-dialog .error{margin:12px 20px 0}.editor-toolbar{border-block:1px solid var(--border);background:var(--surface);flex-wrap:wrap;gap:3px;padding:8px 0;display:flex}.editor-toolbar button{border-radius:6px;place-items:center;width:44px;height:44px;display:grid}.editor-toolbar button[aria-pressed=true]{background:var(--soft);color:var(--accent)}.note-body{overflow-wrap:anywhere;min-height:240px;padding:20px 2px;font-size:16px;line-height:1.8}.note-body p{margin:0 0 12px}.note-body h2{margin-top:18px;font-size:22px}.note-body ul,.note-body ol{padding-left:24px}.note-body ul[data-type=taskList]{padding:0;list-style:none}.note-body ul[data-type=taskList]>li{align-items:flex-start;gap:10px;display:flex}.note-body ul[data-type=taskList]>li>label{align-items:center;min-height:44px;display:flex}.note-body ul[data-type=taskList]>li>div{flex:1;min-width:0;padding-top:8px}.note-body input[type=checkbox]{margin:0}.note-body blockquote{border-left:3px solid var(--border);color:var(--muted);margin-left:0;padding-left:18px}.note-body pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--soft);border-radius:8px;padding:10px}.note-body a{text-decoration:underline}.editor.is-saving{pointer-events:none;opacity:.7}.category-dialog{padding:24px}.category-dialog label{font-size:14px;display:block}.category-dialog input{width:100%;margin:10px 0;display:block}.category-actions{justify-content:flex-end;gap:20px;margin-top:20px;display:flex}.login-page{max-width:430px;margin:0 auto;padding:80px 24px}.login-page .brand{margin-bottom:48px;display:block}.login-page p{color:var(--muted);line-height:1.6}.login-page form{margin:30px 0}.login-page label{margin-bottom:20px;font-size:14px;display:block}.login-page input{width:100%;margin-top:8px;display:block}.login-page .primary-button{width:100%}@media (width<=599px){.note-dialog{border:0;border-radius:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0}.note-dialog .dialog-header{padding-top:calc(12px + env(safe-area-inset-top))}.note-dialog .note-body{min-height:260px}.note-dialog .dialog-footer{padding-bottom:calc(16px + env(safe-area-inset-bottom))}}@media (width>=800px){.app-shell{display:flex}.sidebar{border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;width:238px;height:100dvh;min-height:100dvh;padding:40px 22px 24px;display:flex;position:sticky;top:0}.sidebar>.brand{padding-left:14px}.sidebar-caption{color:var(--muted);margin:10px 0 48px 14px;font-size:11px}.nav-item{text-align:left;width:100%;color:var(--muted);border-radius:10px;align-items:center;gap:13px;margin-bottom:6px;padding:15px;font-size:14px;display:flex}.nav-item.active{background:var(--soft);color:var(--accent);font-weight:500}.sidebar-bottom{overflow-wrap:anywhere;align-items:center;gap:10px;margin-top:auto;padding-top:36px;font-size:12px;display:flex}.sidebar-bottom small{max-width:135px;margin-top:5px;font-size:10px;display:block}.avatar{background:var(--soft);width:34px;height:34px;color:var(--accent);border-radius:50%;place-items:center;display:grid}.workspace{flex:1;min-width:0}.mobile-header,.bottom-nav{display:none}.demo-banner{text-align:center;padding:10px 30px}.demo-banner span{margin-left:10px;display:inline}.main-content{padding:68px 48px 80px}h1{font-size:36px}.subtitle{margin-bottom:34px}.task-row{min-height:86px}.task-content>span{font-size:16px}.task-content small{font-size:12px}.tabs{margin-top:4px}.note-body{min-height:300px}}.category-tools{flex-wrap:wrap;gap:16px;margin-top:8px;display:flex}.category-tools button:last-child{color:var(--muted)}.category-row>span:nth-child(2),.page-heading>div{overflow-wrap:anywhere;min-width:0}.folder-icon,.category-row>svg{flex-shrink:0}.task-content small>span:first-child{overflow-wrap:anywhere;max-width:100%;display:block}@media (prefers-reduced-motion:no-preference){button{transition:background-color .15s,color .15s}}.nav-item.active>svg,.bottom-nav button[aria-current=page]>svg{color:var(--highlight)}
