:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:var(--lightningcss-light,#f6f5f2)var(--lightningcss-dark,#111113);--surface:var(--lightningcss-light,#fff)var(--lightningcss-dark,#1b1b1e);--surface-2:var(--lightningcss-light,#eeede9)var(--lightningcss-dark,#26262a);--text:var(--lightningcss-light,#1c1b19)var(--lightningcss-dark,#ededeb);--text-2:var(--lightningcss-light,#5c5a54)var(--lightningcss-dark,#a9a8a2);--text-3:var(--lightningcss-light,#96938a)var(--lightningcss-dark,#707069);--line:var(--lightningcss-light,#1c1b1917)var(--lightningcss-dark,#ffffff17);--line-strong:var(--lightningcss-light,#1c1b192e)var(--lightningcss-dark,#fff3);--accent:var(--lightningcss-light,#1c1b19)var(--lightningcss-dark,#ededeb);--accent-text:var(--lightningcss-light,#fff)var(--lightningcss-dark,#111113);--danger:var(--lightningcss-light,#c8372d)var(--lightningcss-dark,#f2766b);--warn:var(--lightningcss-light,#c98200)var(--lightningcss-dark,#f0b040);--ok:var(--lightningcss-light,#2b9a66)var(--lightningcss-dark,#58c592);--ring:var(--lightningcss-light,#3f74e0)var(--lightningcss-dark,#7da3f5);--shadow-sm:0 1px 2px var(--lightningcss-light,#14120c0d)var(--lightningcss-dark,#0006);--shadow-md:0 2px 4px var(--lightningcss-light,#14120c0a)var(--lightningcss-dark,#0000004d), 0 14px 28px -10px var(--lightningcss-light,#14120c29)var(--lightningcss-dark,#0009);--shadow-lg:0 4px 8px var(--lightningcss-light,#14120c0d)var(--lightningcss-dark,#0000004d), 0 32px 64px -20px var(--lightningcss-light,#14120c47)var(--lightningcss-dark,#000000bf);--r-sm:8px;--r-md:10px;--r-lg:14px;--r-xl:20px;--ease:cubic-bezier(.2, .8, .2, 1);--spring:cubic-bezier(.3, 1.35, .5, 1);--hue:var(--lightningcss-light,#8a8880)var(--lightningcss-dark,#8f8e88)}[data-color=yellow]{--hue:var(--lightningcss-light,#d4940a)var(--lightningcss-dark,#e6b23c)}[data-color=pink]{--hue:var(--lightningcss-light,#d9506f)var(--lightningcss-dark,#f07f98)}[data-color=blue]{--hue:var(--lightningcss-light,#3f74e0)var(--lightningcss-dark,#7da3f5)}[data-color=green]{--hue:var(--lightningcss-light,#2b9a66)var(--lightningcss-dark,#58c592)}[data-color=purple]{--hue:var(--lightningcss-light,#7a5be0)var(--lightningcss-dark,#a48cf5)}[data-color=gray]{--hue:var(--lightningcss-light,#8a8880)var(--lightningcss-dark,#8f8e88)}[data-color]{--card:var(--lightningcss-light,color-mix(in oklab, var(--hue) 7%, #fff))var(--lightningcss-dark,color-mix(in oklab, var(--hue) 11%, #1b1b1e));--card-line:color-mix(in oklab, var(--hue) 22%, var(--line))}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body,h1,h2,h3,html,p{margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,PingFang TC,Noto Sans TC,Microsoft JhengHei,sans-serif;font-size:15px;line-height:1.55}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}::selection{background:color-mix(in oklab,var(--hue) 30%,transparent)}:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.page-enter-active,.page-leave-active{transition:opacity .14s}.page-enter-from,.page-leave-to{opacity:0}.btn-ghost,.btn-icon,.btn-primary{border-radius:var(--r-md);white-space:nowrap;height:36px;transition:background .15s,color .15s,opacity .15s,scale .12s var(--ease),box-shadow .15s;border:0;justify-content:center;align-items:center;gap:6px;font-size:14px;font-weight:550;text-decoration:none;display:inline-flex}.btn-ghost:active,.btn-icon:active,.btn-primary:active{scale:.97}.btn-primary{background:var(--accent);color:var(--accent-text);box-shadow:var(--shadow-sm),inset 0 1px 0 #ffffff1f;padding:0 14px}.btn-primary:hover{opacity:.88}.btn-primary:disabled{background:var(--surface-2);color:var(--text-3);box-shadow:none;opacity:1;cursor:default}.btn-ghost{color:var(--text-2);background:0 0;padding:0 12px}.btn-ghost:hover{background:var(--surface-2);color:var(--text)}.btn-icon{width:36px;color:var(--text-2);background:0 0;flex-shrink:0;padding:0}.btn-icon:hover{background:var(--surface-2);color:var(--text)}.btn-ghost.danger,.btn-icon.danger{color:var(--danger)}.btn-ghost.danger:hover,.btn-icon.danger:hover{background:color-mix(in oklab,var(--danger) 12%,transparent);color:var(--danger)}kbd{font:inherit;background:color-mix(in oklab,currentColor 14%,transparent);opacity:.8;border-radius:5px;padding:1px 5px;font-size:11px;font-weight:500}.home{padding-bottom:140px}.home main,.topbar-inner{max-width:1120px;margin:0 auto;padding-inline:20px}.topbar{z-index:5;padding-top:env(safe-area-inset-top);background:color-mix(in oklab,var(--bg) 78%,transparent);-webkit-backdrop-filter:saturate(1.6)blur(14px);backdrop-filter:saturate(1.6)blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0}.topbar-inner{height:60px}.brand,.topbar-inner{align-items:center;gap:10px;display:flex}.brand{margin-right:8px}.brand h1{letter-spacing:.01em;white-space:nowrap;font-size:16px;font-weight:650}.logo{color:var(--accent);flex-shrink:0}.logo-ink{stroke:var(--accent-text)}.search{border-radius:var(--r-md);background:var(--surface-2);max-width:380px;height:36px;color:var(--text-3);border:1px solid #0000;flex:1;align-items:center;gap:8px;margin-right:auto;padding:0 12px;transition:background .15s,border-color .15s,box-shadow .15s;display:flex}.search:focus-within{background:var(--surface);border-color:var(--line-strong);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 18%,transparent)}.search input{min-width:0;color:var(--text);background:0 0;border:0;outline:0;flex:1;font-size:14px}.search input::placeholder{color:var(--text-3)}.search input::-webkit-search-cancel-button{-webkit-appearance:none}.section-head{color:var(--text-2);letter-spacing:.02em;align-items:center;gap:8px;padding:28px 2px 14px;font-size:13px;font-weight:600;display:flex}.section-count{background:var(--surface-2);font-variant-numeric:tabular-nums;border-radius:999px;min-width:20px;padding:0 6px;font-size:12px;font-weight:600;line-height:20px}.hint,.section-count{color:var(--text-3);text-align:center}.hint{padding:56px 0;font-size:14px}.hint .btn-ghost{margin-top:12px}.empty{color:var(--text-3);justify-items:center;gap:6px;padding:96px 0;font-size:14px;display:grid}.empty-art{background:var(--surface);border:1px solid var(--line);width:64px;height:64px;box-shadow:var(--shadow-md);color:var(--text-2);border-radius:18px;place-items:center;margin-bottom:10px;display:grid;rotate:-4deg}.empty-title{color:var(--text);font-size:17px;font-weight:650}.empty .btn-primary{margin-top:16px}.grid{grid-template-columns:repeat(auto-fill,minmax(224px,1fr));gap:14px;display:grid}@keyframes card-in{0%{opacity:0;translate:0 8px}}.card{border-radius:var(--r-lg);background:var(--card);border:1px solid var(--card-line);height:188px;box-shadow:var(--shadow-sm);cursor:grab;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;animation:card-in .32s var(--ease) backwards;transition:box-shadow .2s var(--ease),translate .2s var(--ease),border-color .2s;flex-direction:column;gap:6px;padding:16px 16px 12px;display:flex;position:relative;overflow:hidden}.card:hover{box-shadow:var(--shadow-md);border-color:color-mix(in oklab,var(--hue) 40%,var(--line));translate:0 -2px}.card-title{letter-spacing:-.005em;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:15px;font-weight:650;line-height:1.35;overflow:hidden}.card-body{min-height:0;color:var(--text-2);white-space:pre-wrap;overflow-wrap:anywhere;flex:1;font-size:13px;line-height:1.65;overflow:hidden;-webkit-mask-image:linear-gradient(#000 62%,#0000);mask-image:linear-gradient(#000 62%,#0000)}.card-empty{color:var(--text-3);flex:1;font-size:13px}.card-foot{color:var(--text-3);flex-shrink:0;align-items:center;gap:7px;margin-top:auto;font-size:12px;display:flex}.card-dot{background:var(--hue);border-radius:50%;flex-shrink:0;width:7px;height:7px}.card-ghost{border:1.5px dashed var(--line-strong);box-shadow:none;background:0 0;animation:none}.card-ghost>*{visibility:hidden}.card-drag{cursor:grabbing;box-shadow:var(--shadow-lg);border-color:color-mix(in oklab,var(--hue) 45%,var(--line));transition:none;animation:none;rotate:2.5deg;scale:1.04;opacity:1!important}.trash{left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:10;position:fixed;translate:-50%}.trash-btn{border:1px solid var(--line-strong);background:color-mix(in oklab,var(--surface) 82%,transparent);-webkit-backdrop-filter:saturate(1.6)blur(14px);backdrop-filter:saturate(1.6)blur(14px);min-width:48px;height:48px;color:var(--text-2);box-shadow:var(--shadow-md);transition:all .26s var(--spring);border-radius:16px;justify-content:center;align-items:center;gap:10px;padding:0 14px;display:flex;position:relative}.trash-btn:hover{color:var(--text)}.trash-label{white-space:nowrap;max-width:0;transition:max-width .26s var(--ease);font-size:14px;font-weight:600;overflow:hidden}.trash-count{background:var(--accent);min-width:20px;height:20px;color:var(--accent-text);border:2px solid var(--bg);box-sizing:content-box;font-variant-numeric:tabular-nums;border-radius:999px;padding:0 6px;font-size:11px;font-weight:700;line-height:20px;position:absolute;top:-6px;right:-6px}.trash-drop{inset:-28px -40px}.trash-drop,.trash-drop>*{pointer-events:none;position:absolute}.sheet-enter-from,.sheet-leave-to,.trash-drop>*{opacity:0}.trash.is-dragging .trash-drop{pointer-events:auto}.trash.is-dragging .trash-btn{border:1.5px dashed var(--danger);background:color-mix(in oklab,var(--danger) 10%,var(--surface));height:64px;color:var(--danger);padding:0 26px}.trash.is-dragging .trash-label{max-width:200px}.trash:has(.trash-drop>.card-ghost) .trash-btn{background:var(--danger);color:#fff;box-shadow:0 16px 36px -10px color-mix(in oklab,var(--danger) 70%,transparent);border-style:solid;scale:1.08}.sheet-backdrop{z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#00000061;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{width:min(600px,100%);max-height:78dvh;padding:0 14px calc(18px + env(safe-area-inset-bottom));border-radius:var(--r-xl) var(--r-xl) 0 0;border:1px solid var(--line);box-shadow:var(--shadow-lg);border-bottom:0;overflow-y:auto}.sheet,.sheet-head{background:var(--surface)}.sheet-head{z-index:1;align-items:center;gap:8px;padding:16px 0 12px 6px;display:flex;position:sticky;top:0}.sheet-head h2{font-size:16px;font-weight:650}.sheet-head .section-count{margin-right:auto}.sheet-head h2:only-of-type:not(:has(+.section-count)){margin-right:auto}.trash-list{margin:0;padding:0;list-style:none}.trash-list li{border-top:1px solid var(--line);align-items:center;gap:6px;padding:8px 2px 8px 8px;display:flex}.trash-list .card-dot{margin-right:6px}.trash-item-text{flex:1;gap:1px;min-width:0;display:grid}.trash-item-text>*{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.trash-item-text strong{font-size:14px;font-weight:600}.trash-item-text span{color:var(--text-3);font-size:12.5px}.sheet-enter-active,.sheet-leave-active{transition:opacity .22s}.sheet-enter-active .sheet,.sheet-leave-active .sheet{transition:translate .3s var(--ease)}.sheet-enter-from .sheet,.sheet-leave-to .sheet{translate:0 100%}.toast{left:50%;bottom:calc(92px + env(safe-area-inset-bottom));z-index:30;background:var(--accent);color:var(--accent-text);box-shadow:var(--shadow-lg);white-space:nowrap;border-radius:12px;align-items:center;gap:12px;padding:8px 8px 8px 16px;font-size:14px;display:flex;position:fixed;translate:-50%}.toast>span{padding:2px 8px 2px 0}.toast button{background:color-mix(in oklab,var(--accent-text) 16%,transparent);color:inherit;border:0;border-radius:8px;padding:4px 10px;font-size:13px;font-weight:600}.toast button:hover{background:color-mix(in oklab,var(--accent-text) 26%,transparent)}.toast-enter-active,.toast-leave-active{transition:opacity .2s,translate .25s var(--spring)}.toast-enter-from,.toast-leave-to{opacity:0;translate:-50% 10px}.editor{flex-direction:column;min-height:100dvh;padding-bottom:28px;display:flex}.editor-bar{z-index:5;padding-top:env(safe-area-inset-top);background:color-mix(in oklab,var(--bg) 78%,transparent);-webkit-backdrop-filter:saturate(1.6)blur(14px);backdrop-filter:saturate(1.6)blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0}.editor-bar-inner{align-items:center;gap:8px;max-width:800px;min-height:60px;margin:0 auto;padding:0 20px;display:flex}.save-status{color:var(--text-3);white-space:nowrap;border-radius:999px;align-items:center;gap:7px;margin-right:auto;padding:3px 10px 3px 8px;font-size:12.5px;font-weight:550;transition:background .2s,color .2s;display:inline-flex}.save-dot{background:var(--ok);border-radius:50%;width:7px;height:7px;transition:background .2s}.save-status.saving .save-dot{background:var(--text-3)}.save-status.dirty{color:var(--warn);background:color-mix(in oklab,var(--warn) 13%,transparent)}.save-status.dirty .save-dot{background:var(--warn)}.save-status.error{color:var(--danger);background:color-mix(in oklab,var(--danger) 13%,transparent)}.save-status.error .save-dot{background:var(--danger)}.swatches{align-items:center;gap:2px;margin-right:2px;display:flex}.swatch{background:0 0;border:0;border-radius:50%;width:26px;height:26px;padding:0;position:relative}.swatch:before{content:"";background:var(--hue);transition:inset .18s var(--spring);border-radius:50%;position:absolute;inset:6px}.swatch:hover:before{inset:4px}.swatch[aria-checked=true]:before{inset:5px}.swatch[aria-checked=true]{box-shadow:inset 0 0 0 1.5px var(--hue)}.editor-paper{border-radius:var(--r-xl);background:var(--card);border:1px solid var(--card-line);width:min(760px,100% - 40px);box-shadow:var(--shadow-md);flex-direction:column;flex:1;margin:24px auto 0;padding:40px 48px 48px;transition:background .3s,border-color .3s;display:flex}.editor-title{letter-spacing:-.015em;background:0 0;border:0;outline:0;width:100%;padding:0 0 14px;font-size:30px;font-weight:700;line-height:1.25}.editor-title::placeholder{color:var(--text-3)}.note-editor{flex-direction:column;flex:1;display:flex}.toolbar{top:calc(68px + env(safe-area-inset-top));z-index:2;background:color-mix(in oklab,var(--surface) 86%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:12px;align-self:flex-start;align-items:center;gap:2px;margin:0 0 20px -6px;padding:4px;display:flex;position:sticky}.tool{border-radius:var(--r-sm);width:32px;height:32px;color:var(--text-2);background:0 0;border:0;place-items:center;padding:0;transition:background .12s,color .12s;display:grid}.tool:hover{background:var(--surface-2);color:var(--text)}.tool.active{background:var(--accent);color:var(--accent-text)}.tool-sep{background:var(--line-strong);width:1px;height:18px;margin:0 4px}.editor-content{flex-direction:column;flex:1;font-size:16px;line-height:1.75;display:flex}.ProseMirror{overflow-wrap:anywhere;min-height:42dvh;caret-color:var(--hue);outline:0;flex:1}.ProseMirror>:first-child{margin-top:0}.ProseMirror p{margin:0 0 .6em}.ProseMirror h1,.ProseMirror h2,.ProseMirror h3{letter-spacing:-.01em;margin:1.3em 0 .4em;font-weight:700;line-height:1.3}.ProseMirror h1{font-size:1.5em}.ProseMirror h2{font-size:1.28em}.ProseMirror h3{font-size:1.1em}.ProseMirror strong,.login-head h1{font-weight:700}.ProseMirror ol,.ProseMirror ul{margin:0 0 .6em;padding-left:1.45em}.ProseMirror li{margin:.15em 0}.ProseMirror li::marker{color:var(--text-3);font-variant-numeric:tabular-nums}.ProseMirror li p{margin:0}.ProseMirror blockquote{border-left:3px solid var(--hue);color:var(--text-2);margin:0 0 .6em;padding:2px 0 2px 14px}.ProseMirror code{background:color-mix(in oklab,var(--text) 8%,transparent);border-radius:6px;padding:2px 6px;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.88em}.ProseMirror pre{border-radius:var(--r-md);background:color-mix(in oklab,var(--text) 7%,transparent);border:1px solid var(--line);margin:0 0 .8em;padding:14px 16px;line-height:1.6;overflow-x:auto}.ProseMirror pre code{background:0 0;padding:0}.ProseMirror hr{border:0;border-top:1px solid var(--line-strong);margin:1.4em 0}.ProseMirror a{color:var(--hue);text-underline-offset:3px}.ProseMirror ul[data-type=taskList]{padding-left:0;list-style:none}.ProseMirror ul[data-type=taskList] li{align-items:flex-start;gap:10px;margin:.25em 0;display:flex}.ProseMirror ul[data-type=taskList] li>label{-webkit-user-select:none;user-select:none;flex-shrink:0;align-items:center;height:1.75em;display:flex}.ProseMirror ul[data-type=taskList] li>div{flex:1;min-width:0;transition:color .2s}.ProseMirror ul[data-type=taskList] input[type=checkbox]{appearance:none;border:1.5px solid var(--line-strong);background:var(--surface) center/12px no-repeat;cursor:pointer;width:18px;height:18px;transition:background-color .15s,border-color .15s,scale .15s var(--spring);border-radius:6px;margin:0}.ProseMirror ul[data-type=taskList] input[type=checkbox]:hover{border-color:var(--hue)}.ProseMirror ul[data-type=taskList] input[type=checkbox]:active{scale:.88}.ProseMirror ul[data-type=taskList] input[type=checkbox]:checked{border-color:var(--hue);background-color:var(--hue);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.5 6.2 2.4 2.4 4.6-5'/%3E%3C/svg%3E")}.ProseMirror ul[data-type=taskList] li[data-checked=true]>div{color:var(--text-3);text-decoration:line-through;-webkit-text-decoration-color:color-mix(in oklab,var(--text-3) 60%,transparent);text-decoration-color:color-mix(in oklab,var(--text-3) 60%,transparent)}.ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;pointer-events:none;height:0;color:var(--text-3)}.dialog-backdrop{z-index:40;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#00000061;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.dialog{border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);width:min(400px,100%);box-shadow:var(--shadow-lg);padding:24px 24px 18px}.dialog h2{margin-bottom:6px;font-size:17px;font-weight:650}.dialog p{color:var(--text-2);margin-bottom:22px;font-size:14px}.dialog-actions{justify-content:flex-end;align-items:center;gap:6px;display:flex}.dialog-enter-active,.dialog-leave-active{transition:opacity .16s}.dialog-enter-active .dialog,.dialog-leave-active .dialog{transition:scale .22s var(--spring)}.dialog-enter-from,.dialog-leave-to{opacity:0}.dialog-enter-from .dialog,.dialog-leave-to .dialog{scale:.95}.login{place-items:center;min-height:100dvh;padding:20px;display:grid}.login-card{border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);width:min(340px,100%);box-shadow:var(--shadow-lg);justify-items:stretch;gap:14px;padding:32px 28px 28px;display:grid}.login-card .logo{margin-bottom:4px}.login-head{margin-bottom:6px}.login-head h1{letter-spacing:-.01em;font-size:20px}.login-head p{color:var(--text-3);font-size:14px}.login-input{border:1px solid var(--line-strong);border-radius:var(--r-md);background:var(--bg);outline:0;width:100%;height:42px;padding:0 14px;font-size:16px;transition:border-color .15s,box-shadow .15s}.login-input:focus{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 18%,transparent)}.login-card .btn-primary{height:42px}.login-error{color:var(--danger);font-size:13px}@media (width<=560px){.home main,.topbar-inner{padding-inline:14px}.brand h1,.btn-label,.editor-bar kbd{display:none}.brand{margin-right:0}.topbar .btn-primary{width:36px;padding:0}.grid{grid-template-columns:repeat(2,1fr);gap:10px}.card{height:168px;padding:14px 14px 10px}.section-head{padding-top:20px}.editor-bar-inner{gap:4px;padding:0 12px}.swatch{width:22px;height:22px}.swatch:before{inset:5px}.editor-paper{width:calc(100% - 20px);margin-top:12px;padding:24px 20px 32px}.editor-title{font-size:24px}}@media (prefers-reduced-motion:reduce){*,:before{transition-duration:.01ms!important;animation-duration:.01ms!important}}