:root{color-scheme:light;--blue:#205cd4;--blue-dark:#174bb2;--text:#15263c;--muted:#56647c;--line:#dce3ee;--bg:#f7f9fe;--white:#fff;--soft:#eef3ff;--font:22px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:var(--font);color:var(--text);background:var(--bg);line-height:1.55}body{overflow-x:hidden}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}input,textarea,select{background:#fff;border:2px solid #b8c5d8;padding:13px 15px;border-radius:12px;outline:none;min-width:0;width:100%}input:focus,textarea:focus,select:focus,button:focus-visible{outline:3px solid #b5cbff;outline-offset:2px}label{display:block;font-weight:650;margin:0 0 16px}label input,label textarea,label select{display:block;margin-top:7px;font-weight:400}.hidden{display:none!important}.caption,small{font-size:.72em;color:var(--muted)}.eyebrow{font-size:.66em;font-weight:800;color:#476187;letter-spacing:.09em}.error{color:#a92323;font-weight:600}.brand{display:flex;gap:13px;align-items:center;padding:22px 18px 28px}.brand b{font-size:1.38em;line-height:1.1}.brand small{display:block}.brand-icon{display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;color:#fff;background:var(--blue);font-weight:900;border-radius:17px;font-size:1.5em}.brand.big{padding:0 0 20px}.login-shell{display:grid;place-items:center;min-height:100dvh;padding:20px}.login-card{width:min(100%,520px);padding:35px;border:1px solid var(--line);border-radius:25px;background:#fff;box-shadow:0 14px 50px #24385813}.login-card h1{font-size:1.65em;margin:18px 0 0}.login-card p{color:var(--muted)}.checkline{display:flex;align-items:center;gap:13px;font-size:.86em;font-weight:500}.checkline input{width:23px;height:23px;margin:0;accent-color:var(--blue)}.btn{border:1px solid var(--line);border-radius:12px;background:white;padding:10px 16px;font-weight:700;font-size:.78em;line-height:1.5;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:normal}.btn.primary{background:var(--blue);color:white;border-color:var(--blue)}.btn.primary:hover{background:var(--blue-dark)}.btn.subtle{color:#274568;background:#fff}.btn:hover{filter:brightness(.96)}.btn.danger-solid{background:#b72a32;color:white;border-color:#b72a32}.btn.danger{color:#a52635}.btn.full{width:100%;padding:14px}.app-shell{display:grid;grid-template-columns:275px minmax(0,1fr);height:100dvh;overflow:hidden}.sidebar{height:100dvh;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--line);overflow-y:auto}.nav{display:flex;align-items:center;gap:14px;border:0;background:transparent;color:#2f425c;text-align:left;padding:14px 18px;margin:2px 10px;font-size:.83em;border-radius:12px;font-weight:650}.nav>span{font-size:1.3em}.nav:hover,.nav.active{background:var(--soft);color:#1244ad}.nav-heading{padding:18px 20px 4px;font-weight:800;color:#596780;display:flex;justify-content:space-between;font-size:.68em;letter-spacing:.06em}.nav-heading button{background:transparent;border:0;font-size:1.5em;color:var(--blue);padding:0 8px}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:10px}.sidebar-bottom .caption{padding:8px}.main-area{min-width:0;display:flex;flex-direction:column;height:100dvh}.topbar{height:86px;display:flex;align-items:center;gap:16px;padding:14px 22px;border-bottom:1px solid var(--line);background:white;flex-shrink:0}.searchbox{display:flex;gap:12px;align-items:center;flex:1;max-width:1100px;min-width:0;background:#f3f6fb;border:2px solid #e6ebf3;border-radius:14px;padding:0 14px}.searchbox span{font-size:1.5em;color:#64758d}.searchbox input{border:none;background:transparent;min-width:0;font-size:.84em;width:100%;padding:14px 0}.searchbox input:focus{outline:none}.searchbox kbd{font-size:.58em;color:#718099;white-space:nowrap}.sync-chip{display:flex;align-items:center;gap:9px;font-size:.72em;font-weight:750;white-space:nowrap;color:#26744b;background:#e8f7ee;padding:9px 12px;border-radius:30px}.sync-chip.pending{color:#815a06;background:#fff5dc}.sync-chip.offline,.sync-chip.error{color:#a42d37;background:#fff0f0}.sync-chip .dot{height:12px;width:12px;border-radius:100%;background:#289454}.sync-chip.pending .dot{background:#d18f1d}.sync-chip.offline .dot,.sync-chip.error .dot{background:#c54049}.workspace{display:grid;grid-template-columns:minmax(280px,35%) minmax(0,1fr);min-height:0;flex:1}.list-pane{border-right:1px solid var(--line);overflow-y:auto;background:#fff}.list-header{padding:25px 22px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.list-header h1{font-size:1.36em;margin:0}.list-header p{font-size:.72em;color:var(--muted);margin:0}.filter-bar{display:flex;gap:7px;padding:7px 20px 17px;border-bottom:1px solid var(--line)}.small-chip{font-size:.66em;padding:8px 13px;background:#fff;border:1px solid #dce3ee;border-radius:30px;font-weight:700}.small-chip.chosen{background:#e9f0ff;color:#174bb2;border-color:#bad0ff}.items-list{padding:12px}.item-card{display:block;width:100%;padding:18px;border:1px solid transparent;border-radius:15px;text-align:left;background:#fff;margin:4px 0 8px}.item-card:hover,.item-card.selected{border-color:#c0d3fa;background:#f1f6ff}.item-card h3{font-size:.88em;line-height:1.34;margin:0 0 6px;overflow-wrap:anywhere}.item-card p{font-size:.7em;line-height:1.45;color:#5a6980;margin:0 0 12px;word-break:break-word}.item-card .meta{font-size:.61em;color:#65748b;display:flex;justify-content:space-between;gap:10px;align-items:center}.item-card mark, .note-body mark{background:#ffdb69;color:#24200f;padding:1px 2px;border-radius:3px}.note-body mark.current{background:#ffb52e;outline:2px solid #c77f00}.detail-pane{position:relative;background:var(--bg);overflow-y:auto;padding:24px clamp(16px,3vw,44px) 90px}.detail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:0 0 28px}.toolbar-actions{display:flex;gap:7px;flex-wrap:wrap}.note-heading h2{font-size:1.65em;margin:2px 0 6px;line-height:1.25;word-break:break-word}.note-heading small{display:block;margin:0 0 20px}.note-body{white-space:pre-wrap;line-height:1.75;word-wrap:break-word;font-size:1em;min-height:110px}.note-body .emptytext{color:#667790}.note-body img,.attachment-wrap img{display:block;max-width:100%;height:auto;border-radius:14px;border:1px solid #e3e9f2;margin:14px 0}.attachment-wrap{display:grid;gap:14px;margin:18px 0}.attachment-card{border:1px solid var(--line);padding:13px;background:#fff;border-radius:14px}.attachment-card audio{width:100%}.attachment-card .caption{overflow-wrap:anywhere}.attachment-card button{margin-top:10px}.match-navigation{display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;background:#fff1cd;margin:10px 0 22px;flex-wrap:wrap;font-weight:700;font-size:.76em}.iconbtn{height:44px;min-width:44px;padding:0 10px;border:1px solid var(--line);border-radius:11px;background:white;font-size:1em}.edit-fixed{margin-top:28px}.editor-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:15px}.note-title-input{font-size:1.23em;font-weight:800}.field-label{font-size:.7em;margin:2px 0 4px}.editor-hint{font-size:.68em;color:#64758d;margin:10px 0}.detail-pane textarea#noteBody{min-height:45vh;line-height:1.65;resize:vertical;font-size:1em}.task-form{max-width:790px}.detail-pane h2{font-size:1.35em}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.empty-state{max-width:530px;margin:17vh auto 0;text-align:center}.empty-state h2{margin-bottom:4px}.empty-state p{font-size:.84em;color:var(--muted)}.empty-icon{display:inline-grid;place-items:center;width:85px;height:85px;background:#e5eeff;color:var(--blue);border-radius:24px;font-size:2em}.settings-card{margin:20px 0;padding:24px;border-radius:17px;border:1px solid var(--line);background:#fff;max-width:820px}.settings-card h3{margin:0}.settings-card p{font-size:.82em;color:var(--muted)}.settings-card label{margin-top:16px}.modal-backdrop{position:fixed;inset:0;background:#0b1a35a1;display:grid;place-items:center;padding:20px;z-index:40}.modal{padding:27px;background:white;border-radius:18px;max-width:520px;width:100%;box-shadow:0 20px 70px #0003}.modal h2{margin-top:0}.modal p{font-size:.8em}.modal-actions{display:flex;justify-content:flex-end;gap:12px}.toast{position:fixed;top:90px;right:25px;z-index:60;background:#213b60;color:white;font-weight:650;padding:14px 21px;border-radius:12px;box-shadow:0 6px 18px #20385829;font-size:.76em;max-width:430px}.mobile-only{display:none}.muted{color:var(--muted)}.empty-list{padding:28px;text-align:center;color:#62728a;font-size:.82em}.task-badge{display:inline-block;padding:3px 9px;border-radius:8px;color:#784400;background:#fff2d5;font-weight:700}.task-badge.done{background:#e2f5e8;color:#23663d}.noteinline-image{margin:15px 0}.inline-audio{width:min(100%,520px);display:block;margin:15px 0}
@media(max-width:1050px){.app-shell{grid-template-columns:220px 1fr}.workspace{grid-template-columns:40% 60%}.sidebar .brand{padding:18px 10px}.topbar{padding:12px}.detail-pane{padding:20px}.list-header{padding:20px 12px}.list-header .btn{padding:10px}}
@media(max-width:760px){:root{--font:20px}.app-shell{display:block}.sidebar{width:min(78vw,300px);position:fixed;z-index:30;left:0;top:0;transform:translateX(-103%);transition:transform .2s;box-shadow:5px 0 28px #0001}.sidebar.open{transform:translateX(0)}.main-area{height:100dvh}.topbar{height:auto;min-height:70px;padding:10px;gap:8px}.mobile-only{display:inline-flex;align-items:center;justify-content:center}.searchbox{padding:0 8px}.searchbox input{padding:10px 0;font-size:.8em}.searchbox kbd{display:none}.sync-chip{font-size:.63em;padding:7px;gap:5px}.sync-chip .dot{width:9px;height:9px}.workspace{display:block;overflow-y:auto}.list-pane,.detail-pane{min-height:calc(100dvh - 75px);height:auto}.list-pane{border:0}.detail-pane{display:none}.workspace.detail-open .list-pane{display:none}.workspace.detail-open .detail-pane{display:block}.list-header{padding:20px 16px}.toolbar-actions{gap:5px}.detail-toolbar{padding-bottom:18px}.btn{font-size:.72em;padding:9px 11px}.note-heading h2{font-size:1.42em}.form-grid{grid-template-columns:1fr}.editor-head{display:block}.editor-head .toolbar-actions{margin-top:10px}.empty-state{margin:9vh auto}.toast{right:10px;left:10px;top:75px}}
