:root{--neutral-950:#0e121b;--neutral-900:#191b24;--neutral-800:#22242f;--neutral-700:#2b303b;--neutral-600:#525866;--neutral-500:#717784;--neutral-400:#99a0ad;--neutral-300:#cacfd8;--neutral-200:#e1e5ea;--neutral-100:#f2f4f7;--neutral-50:#f5f7fa;--neutral-0:#fff;--blue-700:#2547d0;--blue-500:#335cff;--blue-50:#ebf2ff;--green-500:#21c06b;--green-100:#d0fbe8;--red-500:#fb3747;--red-100:#ffd6d9;--ff-sans:"Inter", "sans-serif";--ff-serif:"Noto Serif", "sans-serif";--ff-mono:"Source Code Pro", "sans-serif";--fs-xs:.75rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.25rem;--fs-xl:1.5rem;--fw-bold:700;--fw-semibold:600;--fw-medium:500;--fw-regular:400;--lh:1.2;--ls-5:-.5px;--ls-3:-.3px;--ls-2:-.2px;--spacing-0:0;--spacing-025:.125rem;--spacing-050:.25rem;--spacing-075:.375rem;--spacing-100:.5rem;--spacing-125:.625rem;--spacing-150:.75rem;--spacing-200:1rem;--spacing-225:1.125rem;--spacing-250:1.25rem;--spacing-300:1.5rem;--spacing-400:2rem;--spacing-500:2.5rem;--spacing-600:3rem;--spacing-800:4rem;--spacing-900:4.5rem;--spacing-1000:5rem;--radius-0:0;--radius-4:.25rem;--radius-6:.375rem;--radius-8:.5rem;--radius-10:.625rem;--radius-12:.75rem;--radius-16:1rem;--radius-20:1.25rem;--radius-24:1.5rem;--radius-full:999px;--grid-columns-mobile:8;--grid-columns-desktop:12;--grid-gap-mobile:1rem;--grid-gap:1.5rem;--grid-padding-mobile:1rem;--grid-padding-tablet:2rem;--grid-padding-desktop:2rem;--sidebar-width:17rem;--bg-page:var(--neutral-0);--bg-modal:var(--neutral-0);--bg-input:var(--neutral-50);--bg-surface:var(--neutral-100);--bg-surface-2:var(--neutral-200);--modal-surface:var(--neutral-100);--text-primary:var(--neutral-950);--text-secondary:var(--neutral-700);--text-secondary-2:var(--neutral-600);--modal-text:var(--neutral-600);--border:1px solid var(--neutral-200);--input-border:1px solid var(--neutral-300);--modal-border:1px solid var(--neutral-200);--active-surface:var(--blue-50);--navbar-shadow:0 -4px 6px 0 #f0f0f099}:root[data-colorTheme="dark"]{--bg-page:var(--neutral-950);--bg-modal:var(--neutral-700);--bg-input:var(--neutral-950);--bg-surface:var(--neutral-800);--bg-surface-2:var(--neutral-600);--modal-surface:var(--neutral-600);--text-primary:var(--neutral-100);--text-secondary:var(--neutral-300);--text-secondary-2:var(--neutral-400);--modal-text:var(--neutral-200);--border:1px solid var(--neutral-800);--input-border:1px solid var(--neutral-600);--modal-border:1px solid var(--neutral-600);--active-surface:var(--neutral-700);--navbar-shadow:0 -5px 6px 0 #00000080}html,html[data-colorTheme="dark"]{background-color:var(--bg-page);color:var(--text-primary)}html[data-fontTheme="sans-serif"]{font-family:var(--ff-sans)}html[data-fontTheme="serif"]{font-family:var(--ff-serif)}html[data-fontTheme="monospace"]{font-family:var(--ff-mono)}*,:before,:after{box-sizing:border-box;font:inherit;color:inherit;margin:0;padding:0}a{text-decoration:none}li{list-style:none}button{color:inherit;cursor:pointer;background:0 0;border:none}img,svg{display:block}input{inline-size:100%;color:inherit;background:0 0;border:none;outline:none}input:-webkit-autofill{-webkit-text-fill-color:var(--text-primary)!important;box-shadow:0 0 0 1000px var(--bg-page) inset!important;background-color:#0000!important}input:-webkit-autofill:hover{-webkit-text-fill-color:var(--text-primary)!important;box-shadow:0 0 0 1000px var(--bg-page) inset!important;background-color:#0000!important}input:-webkit-autofill:focus{-webkit-text-fill-color:var(--text-primary)!important;box-shadow:0 0 0 1000px var(--bg-page) inset!important;background-color:#0000!important}input:-webkit-autofill:active{-webkit-text-fill-color:var(--text-primary)!important;box-shadow:0 0 0 1000px var(--bg-page) inset!important;background-color:#0000!important}textarea{inline-size:100%;color:inherit;resize:none;font:inherit;background:0 0;border:none;outline:none;flex:1}hr{border:var(--border)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-preset-1{font-size:var(--fs-xl);font-weight:var(--fw-bold);line-height:var(--lh);letter-spacing:var(--ls-5)}.text-preset-2{font-size:var(--fs-lg);font-weight:var(--fw-bold);line-height:var(--lh);letter-spacing:var(--ls-5)}.text-preset-3{font-size:var(--fs-md);font-weight:var(--fw-semibold);line-height:var(--lh);letter-spacing:var(--ls-3)}.text-preset-4{font-size:var(--fs-sm);font-weight:var(--fw-medium);line-height:var(--lh);letter-spacing:var(--ls-2)}.text-preset-5{font-size:var(--fs-sm);font-weight:var(--fw-regular);line-height:var(--lh);letter-spacing:var(--ls-2)}.text-preset-6{font-size:var(--fs-xs);font-weight:var(--fw-regular);line-height:var(--lh);letter-spacing:var(--ls-2)}.active{background-color:var(--bg-surface);border-radius:var(--radius-8);position:relative}.active svg{color:var(--blue-500)}.primary-btn{background-color:var(--blue-500);color:var(--neutral-0)}.secondary-btn{background-color:var(--bg-surface);color:var(--text-secondary-2)}.primary-btn,.secondary-btn{padding:var(--spacing-150) var(--spacing-200);border-radius:var(--radius-8)}@keyframes slideIn{0%{transform:translateX(calc(100% + var(--spacing-200)));opacity:0}to{opacity:1;transform:translate(0)}}@keyframes slideOut{0%{opacity:1;transform:translate(0)}to{transform:translateX(calc(100% + var(--spacing-200)));opacity:0}}#root{max-width:90rem;margin:0 auto}.mobile-header .logo-wrapper{background-color:var(--bg-surface);padding:var(--spacing-150) var(--spacing-200)}.bottom-navbar{padding:var(--spacing-150) var(--spacing-400);background-color:var(--bg-page);border-top:var(--border);box-shadow:var(--navbar-shadow);justify-content:center;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-navbar.active{background-color:var(--active-surface)}.nav-links{padding:var(--spacing-050) var(--spacing-250);flex-direction:column;display:flex}.nav-links span{display:none}.main{grid-template-columns:var(--grid-columns-mobile) 1fr;gap:var(--grid-gap-mobile);padding:var(--grid-padding-mobile);border-radius:var(--radius-16);padding-block-end:var(--spacing-800);display:grid}.note-list{gap:var(--spacing-050);flex-direction:column;display:flex}.new-note-btn{right:var(--spacing-200);bottom:var(--spacing-900);background-color:var(--blue-500);border-radius:var(--radius-full);block-size:3rem;inline-size:3rem;color:var(--neutral-0);place-items:center;display:grid;position:fixed}.note-link{gap:var(--spacing-150);padding:var(--spacing-100);flex-direction:column;display:flex}.note-tags{gap:var(--spacing-050);display:flex}.note-tags span{padding:var(--spacing-025) var(--spacing-075);background-color:var(--bg-surface-2);border-radius:var(--radius-4)}.empty-state{background-color:var(--bg-surface);padding:var(--spacing-100);border:var(--border);border-radius:var(--radius-8)}.page-desc{color:var(--text-secondary);margin-block-end:var(--spacing-200)}.note-details{gap:var(--spacing-150);flex-direction:column;display:flex}.header-controls{color:var(--text-secondary);justify-content:space-between;align-items:start;display:flex}.header-controls svg{block-size:1.125rem;inline-size:1.125rem}.go-back-link{align-items:center;gap:var(--spacing-050);color:inherit;display:flex}.go-back-link svg{block-size:1.125rem;inline-size:1.125rem}.control-btns{align-items:start;gap:var(--spacing-200);display:flex}.save-btn{color:var(--blue-500)}textarea#title::placeholder,textarea#content::placeholder{color:var(--text-primary)}.note-props{gap:var(--spacing-050);color:var(--text-secondary);display:grid}.prop{align-items:center;gap:var(--spacing-100);display:flex}.prop svg{inline-size:var(--spacing-200);block-size:var(--spacing-200)}.prop label,.prop h2,.prop p{align-items:center;gap:var(--spacing-075);inline-size:115px;padding-block:var(--spacing-050);display:flex}.input-bar{align-items:center;gap:var(--spacing-100);padding:var(--spacing-150) var(--spacing-200);border:var(--input-border);border-radius:var(--radius-8);background-color:var(--bg-input);display:flex}.input-bar svg{color:var(--neutral-500)}.input-bar.error{border-color:var(--red-500)}.input-bar:hover,.google-btn:hover{background-color:var(--active-surface)}.input-bar:focus-within{border-color:var(--neutral-950);box-shadow:0 0 0 2px white, 0 0 0 4px var(--neutral-500)}html[data-colorTheme="dark"] .input-bar:focus-within{border-color:var(--neutral-600);box-shadow:0 0 0 2px var(--neutral-950), 0 0 0 4px var(--neutral-600)}.hint-text{align-items:center;gap:var(--spacing-100);color:var(--text-secondary-2);display:flex;margin-block-start:0!important}.hint-text.error{color:var(--red-500);line-height:1.4}.hint-text svg{block-size:1rem;inline-size:1rem}.tags-list{gap:var(--spacing-050);flex-direction:column;display:flex}.tag-link{align-items:center;gap:var(--spacing-100);padding-block:var(--spacing-150);color:var(--text-secondary);display:flex}.tag-link svg{block-size:1.25rem;inline-size:1.25rem}.tagged{color:var(--text-secondary-2)}.tagged span{color:var(--text-primary)}.settings-menu{gap:var(--spacing-100);flex-direction:column;display:flex}.settings-menu-item{align-items:center;gap:var(--spacing-100);padding:var(--spacing-100);display:flex}.settings-menu-item svg{block-size:1.25rem;inline-size:1.25rem}.settings-item{gap:var(--spacing-150);flex-direction:column;display:flex}.settings-item .page-desc{margin-block:-.25rem var(--spacing-125)}.options{gap:var(--spacing-200);margin-block:var(--spacing-100);flex-direction:column;display:flex}.options label{align-items:center;gap:var(--spacing-200);padding:var(--spacing-200);border:var(--border);border-radius:var(--radius-12);cursor:pointer;display:flex}.icon-wrapper{background-color:var(--bg-page);block-size:2.5rem;inline-size:2.5rem;padding:var(--spacing-100);border:var(--border);border-radius:var(--radius-12)}.setting-desc{color:var(--text-secondary)}.setting-content{gap:var(--spacing-075);display:grid}.options input{opacity:0;inline-size:0;position:absolute}.custom-radio{border:var(--input-border);border-radius:var(--radius-full);border-width:2px;block-size:1rem;inline-size:1rem;margin-inline-start:auto}.options label:has(input:checked){background-color:var(--bg-surface)}.options input:checked~.custom-radio{border:4px solid var(--blue-500)}.options button{align-self:flex-end}.password-form{gap:var(--spacing-300);margin-block:var(--spacing-200);display:grid}.password-form label{gap:var(--spacing-075);display:grid;position:relative}.show-password-icon{right:var(--spacing-200);top:var(--spacing-400);color:var(--neutral-500);position:absolute}.password-form button[type=submit]{padding:var(--spacing-150) var(--spacing-200);border-radius:var(--radius-8);margin-inline-start:auto}.desktop-sidenav{gap:var(--spacing-200);padding:var(--spacing-200);flex-direction:column;display:flex}.sidenavbar,.sidenavbar .top-items{gap:var(--spacing-100);display:grid}.sidenavbar .top-items a{align-items:center;gap:var(--spacing-100);padding:var(--spacing-125) var(--spacing-150);display:flex}.sidenavbar h2{padding-inline:var(--spacing-100);color:var(--neutral-500)}.sidebar-tag-list{flex-direction:column;display:flex}.save-btns{gap:var(--spacing-200);display:flex}.right-bar-menu{border-left:var(--border);gap:var(--spacing-150);flex-direction:column;grid-column:10/13;padding-inline-start:var(--spacing-200);display:flex}.right-bar-menu button{align-items:center;gap:var(--spacing-100);padding:var(--spacing-150) var(--spacing-200);border:var(--input-border);border-radius:var(--radius-8);display:flex}#root:has(.auth-wrapper){background-color:var(--bg-surface);grid-template-columns:1fr;place-items:center;min-block-size:100vh;display:grid}.auth-wrapper{justify-content:center;align-items:center;gap:var(--spacing-200);inline-size:min(33.75rem,100% - 2rem);padding-block:var(--spacing-600);background-color:var(--bg-page);border-radius:var(--radius-16);padding:var(--spacing-600) var(--spacing-200);flex-direction:column;margin:0 auto;display:flex}.auth-wrapper p,.auth-wrapper h1{text-align:center}.auth-wrapper a:hover{color:var(--blue-500)}.auth-wrapper p{color:var(--text-secondary);margin-block-start:var(--spacing-100)}.auth-form{gap:var(--spacing-200);inline-size:100%;display:grid}.auth-form label{gap:var(--spacing-075);flex-direction:column;display:flex;position:relative}.forgot{right:0;top:var(--spacing-050);color:var(--text-secondary-2);text-decoration:underline;position:absolute}.google-login{inline-size:calc(100% - var(--spacing-400));padding-block:var(--spacing-300) var(--spacing-200);gap:var(--spacing-200);border-top:var(--border);border-bottom:var(--border);flex-direction:column;display:flex}.google-btn{justify-content:center;align-items:center;gap:var(--spacing-200);inline-size:100%;padding-block:var(--spacing-125);border:var(--border);border-radius:var(--radius-12);display:flex}.signup-link{color:var(--text-primary);text-decoration:underline}#root:has(.overlay){z-index:0}.overlay{z-index:1;padding:var(--spacing-200);background-color:#0e121b80;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{opacity:1;background-color:var(--bg-modal);border:var(--modal-border);border-radius:var(--radius-12);max-inline-size:440px}.modal .top{gap:var(--spacing-200);padding:var(--spacing-250);border-bottom:var(--input-border);display:flex}.modal .icon-wrapper{background-color:var(--modal-surface)}.modal .content{gap:var(--spacing-075);flex-direction:column;display:flex}.modal .bottom{justify-content:end;gap:var(--spacing-200);padding:var(--spacing-200);display:flex}.modal .secondary-btn{background-color:var(--modal-surface);color:var(--modal-text)}.modal .delete.primary-btn{background-color:var(--red-500)}.toast{bottom:var(--spacing-900);right:var(--spacing-200);align-items:center;gap:var(--spacing-100);padding:var(--spacing-100);background-color:var(--bg-surface);border:var(--border);border-radius:var(--radius-8);box-shadow:0 1rem 2rem -.75rem var(--neutral-950);animation:.3s forwards slideIn;display:flex;position:fixed}.toast.hiding{animation:.3s forwards slideOut}html .toast{box-shadow:0 1rem 2rem -.75rem #0e121b1a}.toast a{text-decoration:underline}@media (min-width:35rem){.nav-links{gap:var(--spacing-025);align-items:center;margin-inline:auto}.nav-links span{display:block}}@media (min-width:64rem){#root{grid-template-columns:var(--sidebar-width) auto;min-block-size:100vh;display:grid}.sidenavbar .active:after,.settings-menu .active:after{content:"";right:var(--spacing-150);inline-size:var(--spacing-075);block-size:var(--spacing-125);background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20fill='none'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='%23fff'%20fill-rule='evenodd'%20d='M9.47%207.47a.75.75%200%200%201%201.06%200l4%204a.75.75%200%200%201%200%201.06l-4%204a.75.75%200%201%201-1.06-1.06L12.94%2012%209.47%208.53a.75.75%200%200%201%200-1.06Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e") 50% no-repeat;position:absolute}.tags-list hr{display:none}.tag-link{padding:var(--spacing-125) var(--spacing-150)}.main{grid-template-columns:repeat(var(--grid-columns-desktop), 1fr);grid-template-rows:var(--spacing-1000) 1fr;gap:var(--spacing-250) var(--grid-gap);padding:0 var(--spacing-400);border-left:var(--border);border-radius:var(--radius-0);display:grid}.desktop-header{align-items:center;gap:var(--spacing-200);padding:var(--spacing-300) var(--spacing-400);border-bottom:var(--border);grid-column:1/-1;margin-inline:-2rem;display:flex}.desktop-header .input-bar{inline-size:18.75rem;margin-inline-start:auto}.desktop-header .setting-icon{padding:var(--spacing-100)}.note-list,.settings-menu{border-right:var(--border);grid-column:span 3;padding-inline-end:var(--spacing-200)}.new-note-btn{border-radius:var(--radius-8);inline-size:100%;margin-block-end:var(--spacing-200);display:block;position:static}.note-details{gap:var(--spacing-200);grid-column:span 6;padding:0}.note-props{gap:var(--spacing-100)}.settings-item{grid-column:span 5}.options{margin:0}}