@import url('/fonts.css?v=20261102-ui2');
:root{--bg:#fff;--surface:#fff;--text:#202124;--muted:#70757a;--line:#e0e0e0;--hover:#f1f3f4;--active:#feefc3;--shadow:0 2px 8px #20212424;--sidebar:280px;color-scheme:light;font:14px Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}[data-theme=dark]{--bg:#202124;--surface:#202124;--text:#e8eaed;--muted:#9aa0a6;--line:#5f6368;--hover:#35363a;--active:#41331c;color-scheme:dark}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea,[contenteditable]{-webkit-tap-highlight-color:transparent}button{background:none;border:0;border-radius:50%;padding:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:36px;min-height:36px}button:hover{background:var(--hover)}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible{outline:2px solid #4285f4;outline-offset:2px}svg.icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}a{color:inherit;text-decoration:none}header{height:64px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:8px 22px 8px 14px;gap:16px;position:fixed;inset:0 0 auto;z-index:20;background:var(--bg)}header>button{color:var(--muted)}.brand{display:flex;align-items:center;gap:10px;width:180px;flex-shrink:0;font-size:22px;letter-spacing:-.5px;color:var(--muted)}.brand img{width:37px;height:40px}.brand b{font-weight:400;color:var(--text)}.searchbox{max-width:720px;flex:1;display:flex;align-items:center;border-radius:8px;background:var(--hover);height:48px;padding:0 16px;gap:20px}.searchbox:focus-within{background:var(--surface);box-shadow:var(--shadow)}#search-icon{display:flex;color:var(--muted)}.searchbox input{min-width:0;width:100%;border:0;outline:0;background:transparent;font-size:16px}.header-actions{display:flex;gap:8px;margin-left:auto;color:var(--muted)}.avatar{background:#426a60!important;color:#fff;font-weight:600;width:34px;height:34px;min-width:34px;margin-left:12px}.avatar:hover{outline:4px solid var(--hover)}aside{position:fixed;left:0;top:64px;bottom:0;width:var(--sidebar);padding-top:8px;display:flex;flex-direction:column;transition:width .15s;z-index:15;background:var(--bg)}nav{overflow-y:auto;flex:1}nav button{width:100%;border-radius:0 28px 28px 0;justify-content:flex-start;padding:12px 24px;gap:32px;height:48px;font-weight:500;letter-spacing:.2px;white-space:nowrap}nav button.active{background:var(--active)}nav button svg{color:var(--muted)}nav button span{overflow:hidden;text-overflow:ellipsis}.workspace-link{font-size:11px;color:var(--muted);padding:20px 24px;white-space:nowrap;overflow:hidden}body.collapsed{--sidebar:80px}.collapsed nav button{width:56px;margin:0 12px;padding:14px 17px;border-radius:50%}.collapsed nav button span,.collapsed .workspace-link{display:none}#main{margin-left:var(--sidebar);padding:96px 32px 30px;transition:margin-left .15s}#status{font-size:12px;text-align:center;color:var(--muted);margin-bottom:12px}#status:empty{display:none}.composer{width:min(600px,100%);display:flex;align-items:center;margin:0 auto 32px;padding:0 10px 0 16px;border:1px solid var(--line);border-radius:8px;box-shadow:0 1px 2px #0003,0 2px 6px #0002;min-height:48px;background:var(--surface)}#new-note{flex:1;justify-content:flex-start;font-size:16px;color:var(--text);font-weight:500;letter-spacing:.2px;border-radius:4px;padding:10px 0}.composer>button:not(:first-child){color:var(--muted);margin-left:6px}.page-heading{display:flex;align-items:baseline;gap:12px;margin:0 0 20px}.page-heading:has(h1:empty){display:none}.page-heading h1{font-size:18px;font-weight:400;margin:0}.page-heading span{font-size:12px;color:var(--muted)}.section-heading{font-size:11px;font-weight:600;letter-spacing:1px;color:var(--muted);margin:24px 12px 12px}.grid{columns:240px;column-gap:16px}.grid.list{columns:auto;max-width:640px;margin:0 auto}.note{break-inside:avoid;border:1px solid var(--line);border-radius:8px;margin:0 0 16px;position:relative;overflow:visible;min-height:110px;transition:box-shadow .12s;cursor:default;background-color:var(--surface)}.note:hover,.note:focus-within{box-shadow:var(--shadow)}.note.selected{outline:2px solid var(--text);outline-offset:-2px}.note-content{padding:12px 16px 4px;word-break:break-word;cursor:pointer;min-height:75px}.note-title{font-size:16px;font-weight:500;line-height:1.5;margin-bottom:10px;letter-spacing:.1px}.note-body{line-height:1.5;font-size:14px;letter-spacing:.2px;max-height:420px;overflow:hidden;white-space:pre-wrap}.note-body p{margin:0 0 7px}.note-body h1{font-size:22px;margin:5px 0}.note-body h2{font-size:18px;margin:5px 0}.note-toolbar{display:flex;justify-content:space-around;padding:4px 6px;opacity:0;transition:opacity .12s}.note:hover .note-toolbar,.note:focus-within .note-toolbar{opacity:1}.note-toolbar button{padding:6px;min-width:30px;min-height:30px}.note-toolbar svg,.note-toolbar .material-icon{width:18px;height:18px;font-size:18px}.select-note{position:absolute;top:-12px;left:-12px;padding:3px;min-height:25px;min-width:25px;background:var(--bg);opacity:0;z-index:2}.note:hover .select-note,.note:focus-within .select-note,.selected .select-note{opacity:1}.pin-indicator{position:absolute;right:6px;top:4px;opacity:0;padding:7px;min-width:34px;min-height:34px}.pin-indicator.is-pinned,.note:hover .pin-indicator,.note:focus-within .pin-indicator{opacity:1}.note-title{padding-right:24px}.chip{display:inline-flex;gap:5px;align-items:center;font-size:11px;background:#0000000d;border-radius:14px;padding:5px 9px;margin:5px 3px 0 0;max-width:100%}.chips{padding:3px 16px 8px}.check-row{display:flex;align-items:flex-start;gap:8px;padding:4px 0;line-height:1.5}.check-row input[type=checkbox]{margin-top:3px;accent-color:var(--muted);width:15px;height:15px}.check-row.done span{text-decoration:line-through;color:var(--muted)}.check-row.indented{padding-left:24px}.note-images{display:flex;flex-wrap:wrap;overflow:hidden;border-radius:8px 8px 0 0}.note-images img{width:100%;max-height:220px;object-fit:cover}.note-images img+img{width:50%}.note audio{width:100%;padding:5px}.drawing-preview{width:100%;height:150px;border-bottom:1px solid var(--line)}#empty{text-align:center;color:var(--muted);padding:70px 10px;font-size:19px}#empty svg,#empty>.material-icon{width:120px;height:120px;font-size:120px;stroke-width:.8;opacity:.25;margin-bottom:20px}.app-footer{color:var(--muted);opacity:.65;font-size:11px;text-align:center;margin-top:60px}dialog{border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);padding:0;box-shadow:0 8px 30px #0004;max-height:85vh;max-width:94vw}dialog::backdrop{background:#0007}#editor{width:600px}#editor form{padding:16px 18px 8px}.editor-top{display:flex;align-items:center;gap:12px}#note-title{border:0;outline:0;background:transparent;font-size:20px;width:100%;padding:2px 0 16px;min-width:0;font-weight:500}#note-body{outline:0;min-height:130px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;padding:8px 0 20px;max-height:48vh;overflow-y:auto}#note-body:empty:before{content:attr(data-placeholder);color:var(--muted)}#note-body p{margin:0 0 6px}#formatbar{display:flex;border-bottom:1px solid var(--line);gap:4px;flex-wrap:wrap}#formatbar button{border-radius:4px;min-width:28px;min-height:30px;padding:4px 8px;font-size:12px}.editor-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:5px;gap:4px}#editor-tools{display:flex;gap:2px;flex-wrap:wrap}#editor-tools button{padding:8px;min-width:32px}#editor-tools svg,#editor-tools .material-icon{width:20px;height:20px;font-size:20px}.text-button{border-radius:4px;padding:8px 17px;font-weight:500}#save-status{font-size:11px;color:var(--muted);padding:8px 0;min-height:28px}.check-edit{display:flex;align-items:center;gap:3px;padding:4px 0}.check-edit input[type=text]{width:100%;min-width:0;border:0;outline:0;background:transparent;padding:6px}.check-edit .done{text-decoration:line-through}.check-edit button{padding:4px;min-width:25px;min-height:25px}.check-edit svg{width:15px;height:15px}.modal-inner{padding:24px;width:440px;max-width:90vw}.modal-inner h2{margin:0 0 20px;font-size:20px;font-weight:500}.modal-inner label{display:block;margin:14px 0 8px}.field{background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:10px;width:100%;margin:5px 0}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.primary{background:#fbbc04;color:#252114;border-radius:6px;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;font-weight:600}.primary:hover{background:#f4b400}.danger{background:#b3261e!important;color:#fff}.swatches{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}.swatch{width:34px;height:34px;border:1px solid #9995;min-width:34px}.swatch[aria-pressed=true]{outline:2px solid #4285f4}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:16px 0}.settings-row select{padding:7px;border:1px solid var(--line);border-radius:5px;background:var(--bg)}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#303134;color:#fff;padding:14px 24px;border-radius:5px;z-index:100;display:none;max-width:90vw;box-shadow:var(--shadow);font-size:13px}#bulk{position:sticky;top:75px;z-index:10;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 16px;margin-bottom:20px;box-shadow:var(--shadow)}[hidden]{display:none!important}#filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 auto 25px;max-width:780px}#filters select{padding:9px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.dots{background-image:radial-gradient(#80808030 1px,transparent 1px);background-size:12px 12px}.grid-pattern{background-image:linear-gradient(#80808015 1px,transparent 1px),linear-gradient(90deg,#80808015 1px,transparent 1px);background-size:20px 20px}.waves{background-image:repeating-linear-gradient(135deg,transparent,transparent 20px,#80808010 20px,#80808010 40px)}#draw-canvas{width:100%;aspect-ratio:10/7;border:1px solid var(--line);touch-action:none;background:#fff;border-radius:6px}.draw-tools{display:flex;gap:3px;flex-wrap:wrap;align-items:center;margin-bottom:10px}.draw-tools select{padding:7px}.draw-tools input[type=color]{width:35px}.wide-modal{width:850px;max-width:92vw}.history-item{border-top:1px solid var(--line);padding:15px 0}.history-item pre{white-space:pre-wrap;max-height:180px;overflow:auto;font-family:inherit;font-size:13px}.welcome{max-width:620px;margin:12vh auto;text-align:center;padding:20px}.welcome-logo{font-size:40px;display:grid;place-items:center;background:#fbbc04;color:#fff;width:76px;height:76px;border-radius:22px;margin:0 auto 30px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--muted);font-weight:600}.welcome h1{font-size:48px;letter-spacing:-2px;font-weight:500;line-height:1.15;margin:24px 0}.welcome p{font-size:17px;color:var(--muted);line-height:1.7;margin-bottom:28px}.welcome small{display:block;color:var(--muted);margin:24px;font-size:11px}.welcome .primary{gap:35px;padding:15px 24px}.muted{color:var(--muted);font-size:12px;line-height:1.6}.label-row{display:flex;gap:6px;align-items:center}.label-row input{flex:1;min-width:0}.attachment-edit{position:relative;margin:10px 0}.attachment-edit img{width:100%;max-height:280px;object-fit:contain}.attachment-edit>button{position:absolute;right:5px;top:5px;background:var(--bg)}.attachment-edit audio{width:100%}progress{width:100%;height:6px}#editor-chips{margin:4px 0}.conflict{border:1px solid #b85b14;padding:12px;border-radius:6px;margin:8px 0}.conflict button{border-radius:4px;text-decoration:underline}.empty-icon{display:block}.shortcuts{display:grid;grid-template-columns:1fr auto;gap:15px}.shortcuts kbd{background:var(--hover);padding:3px 7px;border:1px solid var(--line);border-radius:4px}
@media(max-width:1100px){:root{--sidebar:220px}.brand{width:150px;font-size:20px}.header-actions{gap:0}#main{padding-left:24px;padding-right:24px}}@media(max-width:760px){:root{--sidebar:0px}header{padding:8px;gap:8px}.brand{width:auto}.brand span{display:none}.brand img{width:31px}.searchbox{min-width:80px}.searchbox input{font-size:14px}.header-actions #refresh,.header-actions #launcher{display:none}.header-actions .avatar{margin-left:0}aside{width:260px;transform:translateX(-100%);box-shadow:var(--shadow)}body.mobile-open aside{transform:translateX(0)}body.collapsed{--sidebar:0px}.collapsed nav button{width:100%;border-radius:0 28px 28px 0;margin:0;padding:14px 24px}.collapsed nav button span{display:inline}#main{margin-left:0;padding:83px 12px 20px}.composer{margin-bottom:26px}.grid{columns:180px;column-gap:10px}.note{margin-bottom:10px}.note-content{padding:13px 12px 4px}.note-toolbar{opacity:1;gap:0}.note-toolbar button{min-width:25px;padding:5px}.select-note{left:-4px;top:-8px}.page-heading{padding-left:4px}.welcome h1{font-size:37px}#bulk{flex-wrap:wrap;top:69px}#editor-tools{gap:0}.editor-bottom{align-items:flex-end}#editor form{padding:14px}.modal-inner{padding:20px}#formatbar button{padding:4px 7px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Shared icon sizing and touch/focus states. */
header .header-actions>button{width:40px;height:40px}header #menu{width:48px;height:48px}header .avatar{width:32px!important;height:32px!important;min-width:32px;min-height:32px;margin:4px 0 4px 16px}.composer>button:not(:first-child){width:40px;height:46px;padding:10px 8px;margin-left:8px}.composer #new-note:hover{background:transparent}.chip .material-icon{font-size:14px;width:14px;height:14px}.pin-indicator .material-icon{font-size:20px;width:20px;height:20px}.select-note{color:var(--text)}.selected .select-note{background:var(--bg)}.note-toolbar button:hover{background:#80808026}.section-heading{margin-left:16px}.workspace-link{font-size:11px;opacity:.7}.searchbox #clear-search{padding:8px}#empty{padding-top:100px;font-size:22px}
@media(hover:none){.note-toolbar{opacity:1}}
@media(max-width:760px){header .header-actions>button{width:36px;height:36px;padding:6px}header #menu{width:40px;height:40px}.header-actions{gap:0}.searchbox{gap:8px;padding:0 10px}.searchbox #clear-search{min-width:28px;padding:3px}.composer>button:not(:first-child){margin-left:2px;width:36px;padding:8px}.brand{flex-shrink:0}.header-actions .avatar{margin-left:4px}#empty{font-size:18px;padding-top:70px}}