@charset "UTF-8";
:root{--navy:#202c32;--navy-light:#2c3b42;--mint:#c4e2d3;--green:#356654;--ink:#24353b;--muted:#7b8585;--paper:#fffcf6;--cream:#f5f3ee;--line:#e4e5df;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--serif:Georgia,"Times New Roman",serif;--sidebar-width:230px;--list-width:270px}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--ink);background:var(--cream)}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button,input,select,textarea{color:inherit}button{border:0;background:none}button:disabled{cursor:default;opacity:.42}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #559980;outline-offset:3px}[hidden]{display:none!important}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}.icon{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:7px;color:#6d797c;transition:background .14s,color .14s}.icon-button:hover{background:#e9ebe5;color:var(--ink)}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 17px;border-radius:7px;font-size:13px;font-weight:600;letter-spacing:.01em;transition:background .15s}.button-primary{background:var(--green);color:#fff}.button-primary:hover{background:#294f41}.button-secondary{background:#eff0eb;color:#4a5556}.button-small{padding:8px 14px;min-height:40px;background:#e5efe8;color:var(--green)}.text-button{font-size:12px;font-weight:500;min-height:44px;padding:8px 0;color:var(--green)}.text-button:hover{text-decoration:underline}.muted{color:var(--muted)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.auth-screen{height:100%;overflow-y:auto;background:radial-gradient(ellipse at 18% 70%,#e5ece0 0,transparent 42%),#f7f5ef;display:flex;flex-direction:column;padding:38px max(5vw,28px) 26px}.auth-brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:24px;letter-spacing:-.7px}.brand-mark{font-size:29px;font-weight:bold;background:var(--navy);color:#f7f5ef;display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:9px;line-height:1;letter-spacing:-3px;padding-right:3px;padding-bottom:5px}.brand-mark span{color:var(--mint)}.auth-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:80px;max-width:1100px;width:100%;margin:auto;align-items:center;padding:42px 0 28px}.eyebrow{font-size:10px;letter-spacing:1.9px;display:flex;align-items:center;gap:11px;color:#78867c;font-weight:600}.tiny-line{width:23px;height:1px;background:#7d9b88}.auth-intro h1{font:normal clamp(42px,4.5vw,62px)/1.12 var(--serif);letter-spacing:-2.6px;margin:24px 0 20px}.auth-intro h1 em{color:#537968;font-weight:normal}.auth-intro>p{font-size:14px;line-height:1.85;color:#77817e;margin:0 0 32px}.notebook-preview{width:310px;position:relative;margin:35px 0 0 22px;transform:rotate(-5deg)}.preview-paper{height:192px;background:#fffcf5;box-shadow:0 8px 25px #35433212;border:1px solid #e3e4d9;border-radius:2px;padding:24px;position:relative}.preview-paper:before{content:"";position:absolute;inset:8px -6px -6px 8px;border:1px solid #e3e4d9;z-index:-1;background:#f7f4e9}.preview-tab{display:inline-block;position:relative;margin-left:16px;padding:7px 17px 8px;background:#d1e1d2;font-size:8px;letter-spacing:1.4px;border-radius:5px 5px 0 0;color:#5d7668}.preview-date{font-size:9px;color:#8d958a;letter-spacing:.5px}.preview-paper h2{font:normal 22px var(--serif);margin:9px 0 18px;color:#42564b}.preview-lines span{display:block;height:17px;border-bottom:1px solid #e6e8de}.preview-paper>svg{position:absolute;width:210px;height:66px;top:106px;left:35px;stroke:#637b66;fill:none;stroke-width:1.4;stroke-linecap:round}.preview-dot{position:absolute;width:30px;height:30px;background:#d8e6b9;border-radius:50%;top:-8px;right:20px;opacity:.85}.auth-card{width:100%;max-width:410px;justify-self:end;background:#fffcf7;border:1px solid #e3e5dc;border-radius:13px;padding:38px 35px 26px;box-shadow:0 12px 45px #27322d06}.card-kicker{font-size:9px;font-weight:600;letter-spacing:1.8px;color:#8b958c;margin-bottom:17px}.auth-card h2{font:normal 33px/1.2 var(--serif);letter-spacing:-.9px;margin:0 0 11px}.auth-hint{color:#869089;font-size:12px;line-height:1.7;margin:0 0 30px}.auth-card label{display:block;font-size:11px;font-weight:600;color:#58675f;margin:18px 0 8px}.auth-card input{width:100%;height:47px;padding:10px 13px;border:1px solid #dfe3db;border-radius:6px;background:#fffefa;font-size:13px;box-shadow:0 1px 2px #1c302004}.auth-card input::placeholder{color:#a5ada5}.auth-submit{margin-top:25px;width:100%;justify-content:space-between;padding-left:17px;padding-right:17px;height:46px}.auth-submit>span{font-size:20px;font-weight:400}.auth-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}.auth-assurance{display:flex;align-items:center;justify-content:center;gap:8px;border-top:1px solid #e9ebe3;margin-top:18px;padding-top:22px;color:#919b92;font-size:10px}.auth-assurance .icon{width:13px;height:13px}.auth-footer{display:flex;justify-content:space-between;color:#99a195;gap:20px;font-size:10px}.auth-footer>span:last-child{font-size:8px;letter-spacing:1.6px}.form-error{font-size:12px;line-height:1.55;color:#a8473d;background:#f9eae5;padding:10px 12px;border-radius:5px}
.app{height:100vh;height:100dvh;display:grid;grid-template-columns:var(--sidebar-width) var(--list-width) minmax(0,1fr);overflow:hidden}.sidebar{display:flex;flex-direction:column;min-height:0;background:var(--navy);color:#c5cecf;padding:0 17px;z-index:30}.sidebar-brand{height:97px;display:flex;align-items:center;justify-content:space-between;padding:0 11px}.wordmark{font:bold 35px var(--serif);letter-spacing:-1.8px;color:#f5f6f0}.wordmark>span{color:var(--mint)}.sidebar-close{display:none}.workspace-label{display:flex;align-items:center;gap:10px;padding:0 10px 28px}.workspace-avatar{height:31px;width:31px;border:1px solid #50645f;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#c4e2d3;background:#33423e;font:17px var(--serif)}.workspace-label strong{display:block;font-size:11px;font-weight:550;color:#e1e8e4}.workspace-label div>span{font-size:9px;color:#81928f;display:block;margin-top:3px}.nav-button{display:flex;align-items:center;gap:12px;min-height:44px;width:100%;padding:10px 12px;border-radius:6px;text-align:left;color:#abb8b7;font-size:12px;transition:background .15s}.nav-button:hover{background:#2b3b41;color:#f0f5f0}.nav-button.active{background:#354941;color:#d6eadc}.nav-button .icon{width:18px;height:18px}.nav-count{margin-left:auto;font-size:10px;color:#9ab3a6}.folder-section-label{display:flex;justify-content:space-between;align-items:center;margin:22px 0 2px;padding-left:12px;font-size:9px;letter-spacing:1.5px;color:#7e918f;font-weight:600}.sidebar .icon-button{color:#91a29c}.sidebar .icon-button:hover{background:#31413f;color:#dce8df}.folder-tree{overflow:auto;min-height:50px;flex:1;padding-bottom:20px}.folder-row,.folder-item{position:relative;display:flex;align-items:center;gap:10px;min-height:44px;width:100%;padding:10px 12px;text-align:left;color:#afbeb8;border-radius:6px;font-size:12px}.folder-row .icon,.folder-item .icon{width:17px;height:17px;color:#839c8e}.folder-row.active,.folder-item.active{background:#354941;color:#d6eadc}.folder-row:hover,.folder-item:hover{background:#2e403c}.folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.folder-count{font-size:10px;color:#8fa197;margin-left:auto}.folder-children{margin-left:12px;border-left:1px solid #3b4b45;padding-left:6px}.folder-tree ul{padding:0;list-style:none;margin:0}.folder-tree .empty-message{padding:12px;font-size:11px;color:#81988b;line-height:1.7}.sidebar-bottom{margin-top:auto}.sidebar-bottom>.nav-button{margin-bottom:14px}.library-actions{display:flex;border-top:1px solid #38453f;padding-top:10px;gap:10px}.library-actions button{display:flex;gap:7px;align-items:center;justify-content:center;font-size:10px;color:#93a59b;min-height:44px;flex:1;border-radius:5px}.library-actions button:hover{color:#d6e6db;background:#2e3d39}.library-actions .icon{width:14px;height:14px}.account{border-top:1px solid #38453f;margin-top:8px;display:flex;align-items:center;gap:8px;min-height:75px;padding:8px 0}.account-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#34463e;color:#acc5b6;flex-shrink:0}.account-avatar .icon{width:13px;height:13px}.account-copy{min-width:0;flex:1}.account-copy>span{font-size:7px;letter-spacing:1.25px;color:#879b8f;display:block}.account-copy strong{display:block;font-size:10px;font-weight:400;color:#b2c3b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}.account .icon-button{min-width:32px}.account .icon-button .icon{width:15px;height:15px}
.note-list-panel{display:flex;flex-direction:column;min-height:0;background:#f8f9f5;border-right:1px solid var(--line);padding:0 20px;z-index:20}.list-heading{min-height:106px;padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:4px}.section-eyebrow{font-size:8px;letter-spacing:1.6px;font-weight:600;color:#98a298}.list-heading h1{font-size:22px;line-height:1.25;font-weight:550;letter-spacing:-.7px;margin:7px 0 0;max-width:185px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-heading .icon-button{min-width:30px;margin-right:-9px}.new-note-button{background:#e2ece2;color:#446b52;justify-content:flex-start;font-size:11px;font-weight:600;border:1px solid #d8e4d7;min-height:43px;padding:10px 12px;border-radius:6px}.new-note-button:hover{background:#d8e6d8}.new-note-button .icon{width:15px;height:15px}.shortcut{margin-left:auto;font-size:13px;color:#98ac99;font-weight:400}.search-field{position:relative;margin-top:15px;display:flex;align-items:center}.search-field .icon{position:absolute;left:10px;top:14px;width:15px;height:15px;color:#98a196}.search-field input{width:100%;height:44px;background:#f0f2ed;border:1px solid #e8ebe3;border-radius:6px;font-size:10px;padding:10px 10px 10px 32px;color:#52634f}.search-field input::placeholder{color:#9ca697}.notes-list-label{display:flex;justify-content:space-between;margin:26px 2px 10px;color:#98a193;font-size:8px;letter-spacing:1.2px}.note-list{overflow-y:auto;flex:1;min-height:0;margin:0 -9px;padding:0 9px 20px;scrollbar-width:thin;scrollbar-color:#d1d9cd transparent}.note-card,.note-item{display:block;text-align:left;width:100%;padding:16px 13px 15px;margin-bottom:7px;border-radius:7px;border:1px solid transparent;cursor:pointer;background:none;min-height:98px}.note-card:hover,.note-item:hover{background:#eef2e9}.note-card.active,.note-item.active{background:#e9efe4;border-color:#dce4d6}.note-card-title,.note-title,.note-card h3,.note-item h3{display:block;font-size:12px;line-height:1.5;font-weight:600;margin:0 0 6px;color:#485a45;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.note-preview{font-size:10px;color:#8c9884;line-height:1.75;margin:0 0 10px;max-height:35px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.note-meta{font-size:8px;color:#9aa78e;display:flex;justify-content:space-between;gap:8px}.note-meta .icon{width:11px;height:11px}.note-list .empty-message,.note-list .empty-list{padding:25px 12px;font-size:12px;color:#929c8b;line-height:1.75;text-align:center}.list-footer{display:flex;align-items:center;gap:6px;min-height:49px;border-top:1px solid #e6e9e1;font-size:9px;color:#a0aa94}.status-dot{width:4px;height:4px;border-radius:50%;background:#a3b895}
.main-workspace{display:flex;flex-direction:column;min-width:0;min-height:0;background:#f5f3ee}.workspace-topbar{height:64px;min-height:64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e5df;padding:0 27px;gap:15px;background:#faf9f5}.navigation-controls{display:flex;align-items:center;gap:12px;min-width:0}.navigation-controls .icon-button{margin-left:-9px;color:#a0a69c}.navigation-controls .icon{width:17px;height:17px}.topbar-divider{width:1px;height:14px;background:#dfe3d7}.workspace-location{font-size:10px;color:#929c87;white-space:nowrap}.save-status{font-size:9px;color:#919d83;white-space:nowrap}.save-status.saving{color:#a48a50}.save-status.error{color:#b36a57}.save-status:before{content:"";display:inline-block;width:4px;height:4px;margin-right:6px;vertical-align:middle;border-radius:50%;background:currentColor}.mobile-notes-toggle{display:none}.editor-empty{display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:35px}.empty-illustration{width:91px;height:103px;margin-bottom:35px;transform:rotate(-5deg)}.empty-illustration svg{width:100%;height:100%;stroke:#b6c4ad;fill:#fffcf5;stroke-width:1}.empty-illustration .empty-pen{fill:#c9d8bb;stroke:#9cad8b;stroke-width:1.2}.editor-empty h2{font:normal 28px var(--serif);letter-spacing:-.75px;margin:12px 0;color:#647558}.editor-empty p{font-size:12px;line-height:1.9;color:#a0aa93}.editor{display:flex;flex-direction:column;min-height:0;flex:1}.editor-heading{display:flex;align-items:center;justify-content:space-between;padding:25px 38px 21px;min-height:135px;gap:16px}.note-details{min-width:0;flex:1}.folder-select-wrap{display:flex;align-items:center;gap:6px;margin-bottom:13px;color:#98a087}.folder-select-wrap>.icon{width:12px;height:12px}.folder-select-wrap select{border:0;background:transparent;max-width:240px;font-size:9px;color:#919a82;cursor:pointer;outline-offset:1px;padding:0 18px 0 0}.note-title-input{display:block;width:100%;font:normal 33px/1.25 var(--serif);letter-spacing:-1.1px;border:0;background:transparent;padding:0;color:#3a4c39;text-overflow:ellipsis;border-radius:0}.note-title-input:focus{outline:none}.note-title-input::placeholder{color:#b9bfaa}.note-actions{display:flex;gap:0;align-self:flex-end;margin-right:-10px;margin-bottom:-4px}.note-actions .icon-button{min-width:36px;color:#a6ac99}.note-actions .icon{width:16px;height:16px}.editor-controls{display:flex;align-items:center;justify-content:space-between;margin:0 38px 18px;gap:10px}.mode-switch{display:flex;padding:3px;border:1px solid #e2e5da;border-radius:7px;background:#eceee5;gap:3px}.mode-button{min-height:34px;display:flex;align-items:center;justify-content:center;gap:7px;padding:7px 13px;border-radius:5px;font-size:10px;font-weight:500;color:#919d83}.mode-button .icon{width:13px;height:13px}.mode-button.active,.mode-button[aria-selected=true]{background:#fffcf6;color:#4b6543;box-shadow:0 1px 3px #5363400d}.editor-hint{font:italic 12px var(--serif);color:#9fa98e}.draw-toolbar{display:flex;align-items:center;gap:8px;min-height:57px;padding:5px 34px;border-top:1px solid #e3e6d9;border-bottom:1px solid #e3e6d9;background:#fafaf4;flex-shrink:0}.tool-group{display:flex;gap:2px}.draw-toolbar .icon-button{min-width:35px;min-height:44px;color:#8d9b7e}.draw-toolbar .icon{width:16px;height:16px}.tool-button.active,.tool-button[aria-pressed=true]{color:#49683c;background:#e9eedf}.toolbar-divider{height:21px;width:1px;background:#e0e4d5;margin:0 4px}.color-control{display:flex;align-items:center;justify-content:center;width:36px;height:44px}.color-control input{width:24px;height:24px;padding:0;border:0;border-radius:50%;overflow:hidden;cursor:pointer;background:none}.color-control input::-webkit-color-swatch-wrapper{padding:3px}.color-control input::-webkit-color-swatch{border:0;border-radius:50%}.color-control input::-moz-color-swatch{border:0;border-radius:50%}.width-control{display:flex;align-items:center;gap:8px;min-height:44px}.stroke-preview{width:16px;height:3px;border-radius:5px;background:#7b8e6a}.width-control input{width:65px;accent-color:#7e9a66;height:18px;cursor:pointer}.toolbar-spacer{flex:1}.paper-select{border:1px solid #e0e6d5;background:#f6f8ef;border-radius:5px;font-size:9px;padding:8px 3px 8px 8px;height:35px;color:#8f9c7d;max-width:106px}.clear-button{color:#a1aa91;font-size:9px;white-space:nowrap;margin-left:6px}.write-panel,.type-panel{overflow:auto;flex:1;min-height:0;padding:28px 38px 35px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cdd5bd transparent}.paper-sheet{width:100%;max-width:1050px;aspect-ratio:5/7;margin:0 auto;background-color:#fffdf8;box-shadow:0 2px 7px #63724b0c;border:1px solid #e7e8dc;border-radius:2px;overflow:hidden;position:relative;background-size:100% 32px;background-position:0 31px}.paper-sheet.paper-ruled,.paper-sheet[data-paper=ruled]{background-image:linear-gradient(to bottom,transparent calc(100% - 1px),#e8eddf 1px)}.paper-sheet.paper-grid,.paper-sheet[data-paper=grid]{background-image:linear-gradient(#e9ecdf 1px,transparent 1px),linear-gradient(90deg,#e9ecdf 1px,transparent 1px);background-size:24px 24px;background-position:0 0}.paper-sheet.paper-plain,.paper-sheet[data-paper=plain]{background-image:none}#stage{display:block;width:100%;height:auto;touch-action:pan-x pan-y pinch-zoom;user-select:none;-webkit-user-select:none;cursor:crosshair}.typed-paper{background:#fffdf8;border:1px solid #e7e8dc;box-shadow:0 2px 7px #63724b0c;min-height:100%;max-width:1050px;margin:auto;border-radius:2px;display:flex}#noteText{width:100%;min-height:650px;height:100%;flex:1;resize:vertical;display:block;border:0;outline:0;background:transparent;padding:37px 42px;font:16px/1.95 var(--serif);color:#4b5744;border-radius:2px;tab-size:4}#noteText::placeholder{color:#b2b9a4;font-style:italic}#noteText:focus-visible{outline:none}.editor-footer{min-height:33px;border-top:1px solid #e2e6d7;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 38px;background:#f8f8f0;color:#a0ab8e;font-size:8px}.footer-caption{font-size:7px;letter-spacing:1px}.panel-backdrop{display:none}
.modal{border:1px solid #dde4d6;border-radius:11px;width:min(440px,calc(100vw - 36px));padding:30px;background:#fffcf5;color:#405237;box-shadow:0 20px 75px #15211930;max-height:85vh;overflow:auto}.modal::backdrop{background:#14212366;backdrop-filter:blur(3px)}.modal-close{position:absolute;top:6px;right:6px}.modal h2{font:normal 27px var(--serif);letter-spacing:-.7px;margin:0 25px 16px 0}.modal-body{font-size:12px;line-height:1.8;color:#7e8d71}.modal-body p{margin:0 0 12px}.modal-body code{display:block;word-break:break-word;padding:14px;background:#eef2e7;border:1px dashed #cbd7bd;color:#547143;border-radius:5px;font-size:13px;user-select:all}.modal input{width:100%;border:1px solid #d8e1cc;border-radius:5px;padding:12px;min-height:44px;background:#fffef8;margin-top:10px}.modal select{width:100%;min-height:44px;padding:10px;border:1px solid #d8e1cc;border-radius:5px;margin:10px 0;background:#fffef8}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);z-index:100;background:#2b3c32;color:#edf4e5;border-radius:8px;padding:13px 22px;font-size:12px;box-shadow:0 6px 22px #1e291f25;max-width:calc(100vw - 35px);text-align:center}.toast.error{background:#8a4e40}button.danger,.button.danger{color:#fff;background:#a76450}.modal-body .export-options{display:flex;flex-direction:column;gap:10px}.modal-body .export-options button{border:1px solid #dce4d3;min-height:44px;padding:10px;border-radius:5px;text-align:left;background:#f4f7ed;color:#526a42}
@media(min-width:1181px){.app.sidebar-hidden{grid-template-columns:0 var(--list-width) minmax(0,1fr)}.app.sidebar-hidden .sidebar{visibility:hidden;overflow:hidden;padding:0}.app.sidebar-hidden .sidebar>*{min-width:196px}}
@media(max-width:1180px){:root{--sidebar-width:215px;--list-width:235px}.editor-heading{padding:25px 26px 21px}.editor-controls{margin-left:26px;margin-right:26px}.draw-toolbar{padding-left:22px;padding-right:22px;gap:5px}.write-panel,.type-panel{padding:25px 26px}.editor-footer{padding-left:26px;padding-right:26px}.editor-hint{display:none}.note-list-panel{padding-left:16px;padding-right:16px}.width-control input{width:45px}.draw-toolbar .toolbar-divider{margin:0 2px}.clear-button{margin-left:2px}}
@media(max-width:1050px){.app{grid-template-columns:var(--list-width) minmax(0,1fr)}.sidebar{position:fixed;top:0;bottom:0;left:0;width:245px;transform:translateX(-100%);transition:transform .2s ease;box-shadow:10px 0 30px #14212322}.app.sidebar-open .sidebar,.sidebar.open{transform:translateX(0)}.sidebar-close{display:inline-flex}.app.sidebar-open .panel-backdrop{display:block}.panel-backdrop{position:fixed;inset:0;background:#14212350;z-index:25;backdrop-filter:blur(2px);width:100%;height:100%}.auth-layout{gap:40px}.auth-intro h1{font-size:46px}.auth-card{padding:30px 28px 22px}.auth-intro .eyebrow{font-size:8px;letter-spacing:1.4px}.notebook-preview{width:280px}.draw-toolbar .icon-button{min-width:32px}.toolbar-divider{margin:0}.paper-select{font-size:8px;max-width:90px}.clear-button{font-size:8px}}
@media(max-width:760px){.auth-screen{padding:23px 24px}.auth-brand{font-size:22px}.auth-layout{grid-template-columns:1fr;max-width:430px;padding:32px 0;gap:25px}.auth-intro .eyebrow{display:none}.auth-intro h1{font-size:36px;letter-spacing:-1.3px;margin:0 0 12px}.auth-intro h1 br{display:none}.auth-intro>p{font-size:12px;margin-bottom:0}.auth-intro>p br{display:none}.notebook-preview{display:none}.auth-card{justify-self:stretch;max-width:none;padding:28px 26px 20px}.auth-card h2{font-size:29px}.auth-footer{font-size:8px;gap:15px}.auth-footer>span:last-child{font-size:6px}.app{display:flex}.main-workspace{width:100%}.note-list-panel{position:fixed;left:0;top:0;bottom:0;width:280px;transform:translateX(-100%);transition:transform .2s ease;z-index:24;box-shadow:10px 0 30px #14212322}.app.notes-open .note-list-panel,.note-list-panel.open{transform:translateX(0)}.app.notes-open .panel-backdrop{display:block;z-index:23}.app.sidebar-open .panel-backdrop{z-index:25}.mobile-notes-toggle{display:inline-flex}.workspace-topbar{height:56px;min-height:56px;padding:0 18px}.navigation-controls{gap:8px}.navigation-controls .icon-button{margin-left:-5px}.topbar-divider{margin:0 3px}.save-status{font-size:8px}.workspace-location{font-size:9px}.editor-heading{padding:20px 20px 16px;min-height:111px}.note-title-input{font-size:29px;letter-spacing:-.8px}.folder-select-wrap{margin-bottom:10px}.note-actions{margin-right:-8px}.note-actions .icon-button{min-width:32px}.editor-controls{margin:0 20px 15px}.mode-button{min-height:39px;padding:8px 14px;font-size:11px}.draw-toolbar{padding:5px 12px;gap:4px;flex-wrap:wrap;min-height:55px}.draw-toolbar .icon-button{min-width:36px}.width-control input{width:48px}.width-control{gap:5px}.stroke-preview{display:none}.toolbar-divider{height:18px}.color-control{width:29px}.paper-select{font-size:9px;max-width:100px}.clear-button{font-size:9px;padding:8px 4px}.write-panel,.type-panel{padding:18px 15px 25px}.paper-sheet{background-size:100% 26px;background-position:0 25px}.paper-sheet.paper-grid,.paper-sheet[data-paper=grid]{background-size:20px 20px}.editor-footer{padding:5px 17px;font-size:8px}.footer-caption{display:none}#noteText{padding:25px 25px;min-height:600px;font-size:17px;line-height:1.9}.editor-empty{padding:25px}.editor-empty h2{font-size:27px}.auth-card input{font-size:16px}.modal input,.modal select{font-size:16px}}
@media(max-width:400px){.workspace-location{display:none}.topbar-divider{display:none}.draw-toolbar{column-gap:2px}.draw-toolbar .icon-button{min-width:31px}.draw-toolbar .toolbar-divider{margin:0}.width-control input{width:35px}.paper-select{max-width:89px}.clear-button{font-size:8px;padding-left:0}.note-title-input{font-size:27px}.editor-heading{padding-left:17px;padding-right:17px}.mode-button{padding-left:13px;padding-right:13px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
@media print{body,html{overflow:visible;height:auto;background:white}.sidebar,.note-list-panel,.workspace-topbar,.editor-controls,.draw-toolbar,.editor-footer,.note-actions,.toast,.auth-screen{display:none!important}.app,.main-workspace,.editor{display:block!important;height:auto!important}.editor-heading{padding:0 0 20px}.folder-select-wrap{display:none}.write-panel,.type-panel{overflow:visible;padding:0}.paper-sheet,.typed-paper{box-shadow:none;border:0}.note-title-input{font-size:26px}#noteText{min-height:0;resize:none}}

.modal-body{white-space:pre-line}.save-status[data-state=pending]{color:#a48a50}.save-status[data-state=error]{color:#b36a57}.save-status[data-state=saved]{color:#839775}.folder-icon{font-size:20px;line-height:1;width:17px;color:#839c8e}

/* Keep controls comfortable for a finger or Apple Pencil. */
.mode-button,.new-note-button{min-height:44px}.draw-toolbar{flex-wrap:wrap}.draw-toolbar .icon-button,.note-actions .icon-button,.list-heading .icon-button,.account .icon-button{min-width:44px;min-height:44px}.paper-select{min-height:44px}.color-control{min-width:44px}.mode-button{font-size:11px}.note-card-title,.note-title,.note-card h3,.note-item h3{font-size:13px}.note-preview{font-size:11px}.note-meta{font-size:9px}.nav-button,.folder-row,.folder-item{font-size:13px}

/* Writing controls stay explicit and reachable on small touch screens. */
.app button,.app input,.app select,.app label,.auth-screen button,.auth-screen input,.modal button,.modal input,.modal select{touch-action:manipulation}
.workspace-status-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0;margin-left:auto}
.workspace-status-actions .save-status{min-width:0;min-height:44px;overflow:hidden;text-overflow:ellipsis;max-width:230px;text-align:right}
.focus-mode-button{flex-shrink:0;min-height:44px;padding:9px 13px;border:1px solid #d8e3d1;background:#e8efe1;color:#4b6742;font-size:11px;white-space:nowrap}
.focus-mode-button:hover{background:#dce9d4}
.focus-mode-button[aria-pressed=true]{background:#356654;color:white;border-color:#356654}
.paper-colour-tools{display:flex;align-items:center;gap:5px;flex-shrink:0}
.paper-colour-label{display:flex;align-items:center;gap:7px;min-height:44px;white-space:nowrap;color:#718163;font-size:11px;cursor:pointer}
.paper-colour-label input{width:44px;height:44px;padding:9px;border:1px solid #dde5d3;border-radius:6px;cursor:pointer;background:#f6f8ef}
.paper-colour-label input::-webkit-color-swatch-wrapper{padding:0}
.paper-colour-label input::-webkit-color-swatch{border:1px solid #b8c4ac;border-radius:3px}
.paper-colour-label input::-moz-color-swatch{border:1px solid #b8c4ac;border-radius:3px}
.reset-paper-colour{min-height:44px;padding:8px;color:#718163;font-size:11px;white-space:nowrap}
.typed-paper{background:var(--note-paper-color,#fffdf8)}
#noteText{color:var(--note-text-color,#4b5744);caret-color:var(--note-text-color,#4b5744)}
#noteText::placeholder{color:var(--note-text-color,#4b5744);opacity:.5}
.app.focus-mode{grid-template-columns:minmax(0,1fr)}
.app.focus-mode .sidebar,.app.focus-mode .note-list-panel,.app.focus-mode .panel-backdrop,.app.focus-mode .navigation-controls .icon-button,.app.focus-mode .topbar-divider,.app.focus-mode .editor-heading,.app.focus-mode .editor-footer,.app.focus-mode .editor-hint{display:none}
.app.focus-mode .main-workspace{width:100%;min-width:0}
.app.focus-mode .workspace-topbar{height:52px;min-height:52px;padding:0 14px;gap:10px}
.app.focus-mode .navigation-controls{gap:0}
.app.focus-mode .workspace-location{display:block}
.app.focus-mode .editor-controls{margin:4px 12px;min-height:50px}
.app.focus-mode .draw-toolbar{padding:4px 12px;min-height:54px}
.app.focus-mode .write-panel,.app.focus-mode .type-panel{padding:8px}
.app.focus-mode .paper-sheet,.app.focus-mode .typed-paper{max-width:none}
.app.focus-mode .paper-sheet{border-radius:0}
.app.focus-mode #noteText{min-height:calc(100dvh - 128px)}
@media(max-width:760px){
  .workspace-status-actions{gap:6px}
  .workspace-topbar{padding:0 12px;gap:8px}
  .workspace-status-actions .save-status{max-width:160px;font-size:9px}
  .focus-mode-button{padding:8px 10px;font-size:11px}
  .navigation-controls{gap:3px;flex-shrink:0}
  .workspace-topbar .workspace-location,.workspace-topbar .topbar-divider{display:none}
  .paper-colour-tools{gap:3px}
  .paper-colour-label,.reset-paper-colour{font-size:11px}
  .app.focus-mode .workspace-location{font-size:11px}
  .app.focus-mode .workspace-status-actions .save-status{max-width:190px}
}
@media(any-pointer:coarse),(max-width:760px){
  .auth-screen input,.app input:not([type=range]):not([type=color]):not(#noteTitle),.app select,.modal input,.modal select{font-size:16px}
  .app .paper-select{max-width:158px;width:auto;min-width:142px}
  .app .folder-select-wrap select{max-width:min(65vw,300px)}
  .draw-toolbar{row-gap:4px}
}
/* Paper colour is shared by handwriting and typed notes. */
.editor-controls{flex-wrap:wrap;align-items:center;column-gap:12px;row-gap:4px}
.editor-controls .paper-colour-tools{margin-left:auto}
.editor-controls .paper-colour-label{font-size:11px}
.editor-controls .reset-paper-colour{padding-left:5px;padding-right:5px}
.app.focus-mode .editor-controls{justify-content:space-between}
@media(max-width:520px){
  .editor-controls{margin-left:15px;margin-right:15px;margin-bottom:10px;column-gap:8px;row-gap:2px}
  .editor-controls .mode-button{padding-left:10px;padding-right:10px}
  .editor-controls .paper-colour-tools{gap:2px}
  .editor-controls .paper-colour-label{gap:4px;font-size:10px}
  .editor-controls .reset-paper-colour{font-size:10px;padding-left:4px;padding-right:4px}
}