:root{--bg-primary:#f5f0e8;--bg-secondary:#ede7da;--bg-texture:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");--ink-primary:#2c1810;--ink-secondary:#4a3728;--ink-muted:#8b7355;--ink-faint:#b8a890;--accent:#1b3a4b;--accent-light:#2a5a6b;--ruled-line:#8b735526;--ruled-line-active:#8b735559;--gutter-bg:#ede7da80;--shadow-soft:0 2px 8px #2c181014;--shadow-medium:0 4px 16px #2c18101f;--font-handwritten:"Caveat", cursive;--font-display:"Playfair Display", serif;--font-mono:"JetBrains Mono", monospace;--line-height:2.8rem;--sidebar-width:280px;--transition-smooth:.3s cubic-bezier(.4, 0, .2, 1)}@media (prefers-color-scheme:dark){:root{--bg-primary:#1a1410;--bg-secondary:#241e18;--ink-primary:#e8dfd0;--ink-secondary:#c4b8a8;--ink-muted:#8b7d6b;--ink-faint:#5a4e42;--accent:#5ba4c0;--accent-light:#7bc0d8;--ruled-line:#8b7d6b26;--ruled-line-active:#8b7d6b4d;--gutter-bg:#241e1880;--shadow-soft:0 2px 8px #0003;--shadow-medium:0 4px 16px #0000004d}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background-color:var(--bg-primary);background-image:var(--bg-texture);color:var(--ink-primary);font-family:var(--font-handwritten);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{color:var(--ink-primary);background:#1b3a4b33}.app{flex-direction:column;height:100%;display:flex;position:relative}.app-header{border-bottom:1px solid var(--ruled-line);justify-content:center;align-items:center;padding:1rem 1.5rem;display:flex;position:relative}.menu-button{color:var(--ink-muted);cursor:pointer;transition:color var(--transition-smooth), background var(--transition-smooth);background:0 0;border:none;border-radius:4px;padding:.25rem .5rem;font-size:1.4rem;position:absolute;left:1.5rem}.menu-button:hover{color:var(--ink-primary);background:var(--gutter-bg)}.app-title{font-family:var(--font-display);color:var(--ink-secondary);letter-spacing:.02em;font-size:1.6rem;font-style:italic;font-weight:400}.save-indicator{color:var(--ink-faint);transition:color var(--transition-smooth);position:absolute;right:1.5rem}.save-indicator.saving .quill-icon{animation:.6s ease-in-out quill-dip}.app-main{flex:1;padding:.5rem 0;overflow:hidden auto}.notepad{max-width:900px;margin:0 auto;padding:0 1.5rem}.notepad-row{border-bottom:1px solid var(--ruled-line);min-height:var(--line-height);transition:border-color var(--transition-smooth);align-items:flex-start;display:flex}.notepad-row:has(.line-focused){border-bottom-color:var(--ruled-line-active)}.line{min-height:var(--line-height);flex:1;align-items:flex-start;display:flex;position:relative}.line-number{font-family:var(--font-handwritten);color:var(--ink-faint);text-align:right;-webkit-user-select:none;user-select:none;flex-shrink:0;width:2rem;padding-top:.55rem;padding-right:.75rem;font-size:.9rem}.line-input{color:var(--ink-primary);font-family:var(--font-handwritten);resize:none;background:0 0;border:none;outline:none;flex:1;padding:.4rem 0;font-size:1.35rem;line-height:1.6;overflow:hidden}.line-input::placeholder{color:var(--ink-faint);opacity:.6;font-style:italic}.line-focused .line-number{color:var(--ink-muted)}.line-focused:before{content:"";background:var(--accent);opacity:.6;border-radius:2px;width:3px;height:60%;animation:.2s ease-out ink-dash-in;position:absolute;top:50%;left:0;transform:translateY(-50%)}.gutter-result{text-align:right;width:35%;min-width:180px;min-height:var(--line-height);border-left:1px solid var(--ruled-line);flex-shrink:0;justify-content:flex-end;align-items:center;padding:.4rem .5rem .4rem 1rem;display:flex;position:relative}.gutter-has-value{cursor:default}.ballpark-text{font-family:var(--font-handwritten);color:var(--ink-muted);font-size:1.2rem;transition:opacity .2s}.precise-text{font-family:var(--font-mono);color:var(--ink-primary);opacity:0;font-size:.85rem;transition:opacity .2s,transform .2s;position:absolute;right:.5rem;transform:scale(.95)}.gutter-has-value:hover .ballpark-text{opacity:0}.gutter-has-value:hover .precise-text{opacity:1;transform:scale(1)}.gutter-error{font-family:var(--font-handwritten);color:var(--ink-faint);font-size:1rem}.gutter-loading{justify-content:flex-end}.sidebar-overlay{opacity:0;pointer-events:none;transition:opacity var(--transition-smooth);z-index:10;background:#2c18104d;position:fixed;inset:0}.sidebar-overlay-visible{opacity:1;pointer-events:auto}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);background-image:var(--bg-texture);box-shadow:var(--shadow-medium);transition:transform var(--transition-smooth);z-index:20;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;overflow:hidden;transform:translate(-100%)}.sidebar-open{transform:translate(0)}.sidebar-header{border-bottom:1px solid var(--ruled-line);justify-content:space-between;align-items:center;padding:1.25rem 1rem;display:flex}.sidebar-title{font-family:var(--font-display);color:var(--ink-secondary);font-size:1.2rem;font-style:italic;font-weight:400}.sidebar-close{color:var(--ink-muted);cursor:pointer;background:0 0;border:none;padding:.25rem;font-size:1.5rem;line-height:1}.sidebar-close:hover{color:var(--ink-primary)}.sidebar-new-sheet{border:1px dashed var(--ink-faint);width:calc(100% - 2rem);color:var(--ink-muted);font-family:var(--font-handwritten);cursor:pointer;transition:border-color var(--transition-smooth), color var(--transition-smooth);background:0 0;border-radius:6px;margin:1rem;padding:.6rem;font-size:1.1rem;display:block}.sidebar-new-sheet:hover{border-color:var(--accent);color:var(--accent)}.sidebar-list{flex:1;padding:.5rem 0;overflow-y:auto}.sidebar-item{cursor:pointer;transition:background var(--transition-smooth);align-items:center;padding:.75rem 1rem;display:flex;position:relative}.sidebar-item:hover{background:#8b735514}.sidebar-item-active{background:#1b3a4b14}.sidebar-item-active:before{content:"";background:var(--accent);width:3px;position:absolute;top:0;bottom:0;left:0}.sidebar-item-title{font-family:var(--font-handwritten);color:var(--ink-primary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:1.1rem;overflow:hidden}.sidebar-item-time{font-family:var(--font-handwritten);color:var(--ink-faint);flex-shrink:0;margin-left:.5rem;font-size:.85rem}.sidebar-item-delete{color:var(--ink-faint);cursor:pointer;opacity:0;background:0 0;border:none;margin-left:.5rem;padding:.25rem;font-size:1.2rem;transition:opacity .15s,color .15s}.sidebar-item:hover .sidebar-item-delete{opacity:1}.sidebar-item-delete:hover{color:#c0392b}.sidebar-empty{font-family:var(--font-handwritten);color:var(--ink-faint);text-align:center;padding:2rem 1rem;font-size:1rem;font-style:italic}.ink-blot{background:var(--ink-muted);border-radius:50%;width:12px;height:12px;animation:1.5s ease-in-out infinite ink-bloom;position:relative}@keyframes ink-bloom{0%{opacity:.4;border-radius:50%;transform:scale(.3)}30%{opacity:.8;border-radius:45% 55% 50% 50%;transform:scale(1)}50%{opacity:.6;border-radius:50% 45% 55% 48%;transform:scale(1.15)}70%{opacity:.8;border-radius:48% 52% 45% 55%;transform:scale(.95)}to{opacity:.4;border-radius:50%;transform:scale(.3)}}@keyframes ink-dash-in{0%{opacity:0;transform:translateY(-50%)scaleY(0)}to{opacity:.6;transform:translateY(-50%)scaleY(1)}}@keyframes quill-dip{0%{transform:rotate(0)translateY(0)}30%{transform:rotate(8deg)translateY(3px)}60%{transform:rotate(-3deg)translateY(1px)}to{transform:rotate(0)translateY(0)}}.ballpark-text{display:inline-block}.ballpark-text.revealing{animation:none}.ballpark-text.revealing span{opacity:0;animation:.1s forwards letter-reveal}@keyframes letter-reveal{0%{opacity:0;filter:blur(2px)}to{opacity:1;filter:blur()}}@keyframes page-flip-out{0%{opacity:1;transform:perspective(800px)rotateY(0)}to{opacity:0;transform:perspective(800px)rotateY(-10deg)}}@keyframes page-flip-in{0%{opacity:0;transform:perspective(800px)rotateY(10deg)}to{opacity:1;transform:perspective(800px)rotateY(0)}}.notepad-enter{animation:.3s ease-out page-flip-in}.notepad{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath d='M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z' fill='%232C1810'/%3E%3C/svg%3E") 2 18,text}.notepad-row{animation:.3s ease-out line-fade-in}@keyframes line-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}