@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Ubuntu+Mono&display=swap";@layer base,components,utilities;@layer base{@font-face{font-family:Inter;src:url(/assets/Inter-VariableFont_opsz_wght-c8O0ljhh.ttf) format("truetype");font-display:swap}@font-face{font-family:Noto-serif;src:url(/assets/NotoSerif-VariableFont_wdth_wght-DpsgPFyS.ttf) format("truetype");font-display:swap}@font-face{font-family:Source-code-pro;src:url(/assets/SourceCodePro-VariableFont_wght-Nw7RJEUj.ttf) format("truetype");font-display:swap}:root{--colors-neutral-950: hsl(222, 32%, 8%);--colors-neutral-900: hsl(230, 19%, 12%);--colors-neutral-800: hsl(231, 16%, 16%);--colors-neutral-700: hsl(221, 16%, 20%);--colors-neutral-600: hsl(222, 11%, 36%);--colors-neutral-500: hsl(221, 8%, 48%);--colors-neutral-400: hsl(220, 11%, 64%);--colors-neutral-300: hsl(219, 15%, 82%);--colors-neutral-200: hsl(216, 19%, 90%);--colors-neutral-100: hsl(216, 26%, 96%);--colors-neutral-50: hsl(216, 33%, 97%);--colors-neutral-0: hsl(0, 0%, 100%);--primary-bg: var(--colors-neutral-0);--primary-foreground: var(--colors-neutral-800);--colors-blue-700: hsl(228, 70%, 48%);--colors-blue-500: hsl(228, 100%, 60%);--colors-blue-50: hsl(222, 100%, 96%);--colors-green500: hsl(148, 71%, 44%);--colors-green-100: hsl(154, 84%, 90%);--colors-red-500: hsl(355, 96%, 60%);--colors-red-100: hsl(356, 100%, 92%);--ff-sans: "Inter", system-ui, sans-serif;--ff-serif: "Noto-serif", system-ui, serif;--ff-mono: "Source-code-pro", monospace;--fs-24: 1.5rem;--fs-20: 1.25rem;--fs-16: 1rem;--fs-14: .875rem;--fs-12: .75rem;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--lh-120: 120%;--ls-05: -.0313rem;--ls-03: -.0187rem;--ls-02: -.0125rem;--space-0: 0rem;--space-025: .125rem;--space-050: .25rem;--space-075: .375rem;--space-100: .5rem;--space-150: .75rem;--space-200: 1rem;--space-250: 1.25rem;--space-300: 1.5rem;--space-400: 2rem;--space-500: 2.5rem;--space-600: 3rem;--space-800: 4rem;--space-1000: 5rem;--radius-0: 0rem;--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: 62.4375rem;--border-color: var(--colors-neutral-200);--shadow-1: 0 1px 2px 1 #0a0d1403;--small-shadow: 0 .25rem .375rem 0 #f0f0f060;--large-shadow: 0 .5rem .75rem 0 #f0f0f060}*,*:before,*:after{box-sizing:border-box}*{margin:0}html{font-size:1rem;font-family:var(--ff-sans),system-ui,sans-serif}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;font-size:.9375rem;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;justify-content:center;color:var(--primary-foreground);background-color:var(--primary-bg)}#root{display:flex;flex-direction:column;min-height:100vh}html,body,#root{height:100vh;margin:0;padding:0;box-sizing:border-box}#content{display:flex;flex-direction:row;height:95%;flex:1}footer{flex-shrink:0}*/ img,picture,video,canvas,svg{display:block;max-width:100%}svg{color:var(--colors-neutral-700)}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}@media (prefers-color-scheme: dark){:root{--border-color: var(--colors-neutral-700);--primary-bg: var(--colors-neutral-950);--primary-foreground: var(--colors-neutral-100)}body{background-color:var(--primary-bg);color:var(--primary-foreground)}svg{color:var(--colors-neutral-200)}}}@layer components{ul{list-style-type:none;padding:0;margin:0}aside{border-right:1px solid var(--border-color);flex:0 1 280px}a{text-decoration:none;color:inherit}a svg{margin-right:var(--space-100)}footer{display:flex;justify-content:center;align-items:center;gap:var(--space-100);width:100%}}@layer components{#add-new-form{padding:var(--space-200)}.form-row{display:flex;justify-content:space-between;margin:var(--space-200) 0}@media (max-width: 768px){.properties{max-width:70%}}.properties{display:flex;justify-content:space-between}.properties-labels,.properties-inputs{display:flex;flex-direction:column;justify-content:center;gap:var(--space-100)}.properties-inputs{flex:1}.properties-inputs input{align-self:flex-end;width:90%}.properties-labels span label{margin-left:var(--space-100)}input,button,textarea,select{font:inherit;background:transparent;color:var(--primary-foreground);border:none;width:100%}::placeholder{color:var(--primary-foreground)}.textarea{border-top:1px solid var(--border-color);margin-top:var(--space-150);padding-top:var(--space-150)}textarea{resize:none;border-color:transparent}.submit-buttons{padding:var(--space-200) 0;display:flex;flex-direction:row;gap:var(--space-150);border-top:1px solid var(--border-color);margin:0 var(--space-200)}.submit-buttons button{width:auto!important;padding:var(--space-150) var(--space-200)!important}@media (max-width: 768px){#add-new-form{padding:0}}}@layer components{.left-menu{padding:var(--space-150) var(--space-200)}.left-menu h4{color:var(--colors-neutral-500)}.left-menu .logo-wrapper{margin:var(--space-200)}.logo-wrapper .logo-wrapper-link{padding:0;margin:0}.left-menu .left-menu-content nav:first-of-type{border-bottom:1px solid var(--border-color)}ul li{margin-top:var(--space-050)}.left-menu ul li a{border-radius:var(--radius-8)}.left-menu ul li:hover a:after{content:">";float:right;margin-top:var(--space-050)}.left-menu ul li:active a:after{content:">";float:right;margin-top:var(--space-050)}.left-menu ul li svg{font-size:1.2rem}.left-menu ul li a:hover{background-color:var(--colors-neutral-100)}.left-menu ul li a:hover svg{color:var(--colors-blue-500)}.left-menu a{padding:var(--space-150);display:inline-block;width:100%}.left-menu .tags-wrapper h4{margin:var(--space-100)}.notes-list-wrapper{height:88vh;flex:0 1 290px}.inner-sidebar{padding:var(--space-200);border-right:1px solid var(--border-color);flex-shrink:0;height:100%;overflow-y:auto}.inner-sidebar button,.mobile-add-note-button button{width:100%;padding:var(--space-150);border:none;border-radius:var(--radius-8);background-color:var(--colors-blue-500);color:#fff;justify-content:center;gap:0!important;font-family:var(--ff-sans)!important;margin-bottom:var(--space-200)!important}.inner-sidebar button svg,.mobile-add-note-button button svg{color:#fff}.inner-sidebar ul{margin-left:var(--space-100)}.inner-sidebar ul li{border-bottom:1px solid var(--border-color)}.inner-sidebar .note-item{padding:var(--space-100)}.item-details{display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-150);font-size:var(--font-size-100);color:var(--colors-neutral-600);padding-left:var(--space-100)}.item-tags{padding:var(--space-150);padding-left:0}.item-tag{background-color:var(--colors-neutral-700);padding:var(--space-025) var(--space-075);margin:var(--space-050);border-radius:var(--radius-4);color:#fff}main .main-wrapper .tags-wrapper ul .tag-item{border-bottom:1px solid var(--border-color);padding:var(--space-150) 0}main .main-wrapper .tags-wrapper ul .tag-item svg{font-size:1.2rem}@media (prefers-color-scheme: dark){.left-menu ul li a:hover{background-color:var(--colors-neutral-800)}}@media (max-width: 768px){.inner-sidebar{border:none;padding:var(--space-200) 0}}}@layer components{header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--space-300) var(--space-400);border-bottom:1px solid var(--border-color)}.header-right{display:flex;flex-direction:row;align-items:center;gap:var(--space-200)}.search{position:relative}.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);pointer-events:none}.search-input{padding:var(--space-150) var(--space-200);padding-left:var(--space-400);width:320px;border:1px solid var(--border-color);border-radius:var(--radius-8);background:transparent;color:var(--colors-neutral-500);box-shadow:var(--shadow-1);transition:all .3s ease}.search-input::placeholder{color:var(--colors-neutral-500)}.search-input:focus{background:var(--colors-neutral-200);color:var(--colors-neutral-500);outline:none}.settings-button{background-color:transparent;border:none;margin-left:var(--space-300)}.settings-button svg{font-size:var(--fs-24)}}@media (max-width: 768px){header{background-color:var(--colors-neutral-100);border:none}@media (prefers-color-scheme: dark){header{background-color:var(--colors-neutral-800)}}}@layer components{main{display:flex;flex-direction:column;width:88%}.main-content-wrapper{display:flex;flex-direction:row;flex:1}.search-bar-desc{margin:var(--space-200) 0;color:var(--colors-neutral-300)}.note-details{padding:var(--space-250) var(--space-300);flex:1}.note-content{min-height:100%;border-bottom:1px solid var(--border-color);flex:0 1 588px}.quick-info{display:flex;flex-direction:column;gap:var(--space-100);padding:var(--space-250) var(--space-300);padding-left:0;border-bottom:1px solid var(--border-color)}.info-line{max-width:50%;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.quick-info svg{margin-right:var(--space-075)}.note-body ul li:before{content:"-";margin-right:var(--space-025)}.note-body ol{padding-left:var(--space-200);margin-top:var(--space-200)}.note-body p{margin:var(--space-200) auto}}@media (max-width: 768px){.mobile-add-note-button{position:relative}.mobile-add-note-button button{position:fixed;width:48px;height:48px;bottom:5rem;right:var(--space-400);border-radius:50%;display:block!important;padding:initial!important;font-size:2rem}}@media (max-width: 768px){main{width:auto}.main-wrapper{border-top-left-radius:var(--radius-20);border-top-right-radius:var(--radius-20);padding:var(--space-250) var(--space-200)}.main-wrapper .search-area{margin:var(--space-200) auto}.main-wrapper .search-area .search input{width:100%}}@media (max-width: 425px){.main-wrapper{padding:var(--space-200)}.note-details{padding:0}}@media (prefers-color-scheme: dark){main{background-color:var(--colors-neutral-950)}.main-wrapper{background-color:var(--colors-neutral-950)}}@layer components{.mobile-nav{width:100%;max-height:fit-content;padding:var(--space-100) 0;border-top:1px solid var(--border-color);box-shadow:0 -4px 6px #f0f0f060;background-color:#fff}.mobile-nav ul{justify-content:space-around}.mobile-nav ul li a{display:flex;flex-direction:column;gap:0!important;justify-content:center!important;color:var(--colors-neutral-600)!important}.mobile-nav ul li a svg{font-size:1.5rem}.mobile-nav-line{border:0;height:auto;width:1px;background-color:var(--colors-neutral-200)}nav.mobile-nav ul li a{width:5.8125rem;display:flex;justify-content:center;align-items:center}nav.mobile-nav .active,nav.mobile-nav ul li a:hover{background-color:var(--colors-blue-50)!important;border-radius:var(--radius-4)!important}nav.mobile-nav .active svg,nav.mobile-nav ul li:hover svg{color:var(--colors-blue-500)}@media (max-width: 768px){footer{flex-direction:column;position:fixed;bottom:0}.mobile-nav ul{display:flex}}@media (max-width: 425px){nav.mobile-nav ul li a{width:auto;padding:var(--space-075) var(--space-200)}nav.mobile-nav ul li a svg{margin:auto}}@media (max-width: 375px){nav.mobile-nav ul li a{padding:var(--space-075) var(--space-150)}}@media (prefers-color-scheme: dark){.mobile-nav{background-color:var(--colors-neutral-950);box-shadow:0 -4px 6px #00000030}.mobile-nav-line{background-color:var(--colors-neutral-800)}.mobile-nav ul li a{color:var(--colors-neutral-400)!important}nav.mobile-nav .active,nav.mobile-nav ul li a:hover{background-color:var(--colors-neutral-700)!important;color:var(--colors-blue-500)!important}}}@layer components{.right-menu{padding:var(--space-150) var(--space-200);border-left:1px solid var(--border-color);flex:0 1 258px;margin-right:var(--space-200)}.right-menu .actions{padding:var(--space-100) 0}.right-menu ul li{margin-bottom:var(--space-150)}.right-menu a{padding:var(--space-150);display:inline-block;width:100%}.action-button button{width:100%;color:var(--colors-neutral-600)!important;padding:var(--space-150);box-shadow:none!important}.action-button button:hover{border:1px solid transparent!important}.action-button button:hover svg{color:var(--colors-neutral-600)!important}.mobile-actions{display:flex;flex-direction:row;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding:var(--space-200);padding-top:0}.mobile-actions ul{display:flex;flex-direction:row;align-items:center;justify-content:flex-end}.mobile-actions ul li button{color:var(--primary-foreground)!important}.mobile-actions ul li:last-child button{color:var(--colors-blue-500)!important}.mobile-actions ul li button#cancel,.mobile-actions ul li button#save:hover{background-color:inherit!important}.mobile-actions ul li button svg{font-size:large}@media (max-width: 425px){.mobile-actions{padding:var(--space-150) 0}}@media (prefers-color-scheme: dark){.action-button button{color:var(--colors-neutral-100)!important}.action-button button:hover{color:var(--colors-neutral-600)!important}}}@layer utilities{.text-preset-1{font-family:var(--ff-sans);font-size:var(--fs-24);line-height:var(--lh-120);letter-spacing:var(--ls-05);font-weight:var(--fw-bold)}.text-preset-2{font-family:var(--ff-sans);font-size:var(--fs-20);line-height:var(--lh-120);letter-spacing:var(--ls-05);font-weight:var(--fw-bold)}.text-preset-3{font-family:var(--ff-sans);font-size:var(--fs-16);line-height:var(--lh-120);letter-spacing:var(--ls-03);font-weight:var(--fw-semibold)}.text-preset-4{font-family:var(--ff-sans);font-size:var(--fs-14);line-height:var(--lh-120);letter-spacing:var(--ls-02);font-weight:var(--fw-medium)}.text-preset-5{font-family:var(--ff-sans);font-size:var(--fs-14);line-height:var(--lh-120);letter-spacing:var(--ls-02);font-weight:var(--fw-regular)}.text-preset-6{font-family:var(--ff-sans);font-size:var(--fs-12);line-height:var(--lh-120);letter-spacing:var(--ls-02);font-weight:var(--fw-gular)}}