.notes{max-width:var(--max-w);margin:0 auto;padding:0 2.5rem}.notes__back{font-family:var(--font-mono);font-size:.8125rem;color:var(--c-text-3);text-decoration:none;letter-spacing:.02em;transition:color .2s ease;display:inline-block;margin-bottom:2rem}.notes__back:hover{color:var(--c-accent)}.notes__title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.15;letter-spacing:-.02em;color:var(--c-text);font-variation-settings:'opsz' 72;margin-bottom:.75rem}.notes__desc{font-size:1.0625rem;color:var(--c-text-2);line-height:1.6;max-width:640px;margin-bottom:2.5rem}.notes__layout{display:grid;grid-template-columns:300px 1fr;gap:1px;background:var(--c-border);border:1px solid var(--c-border);border-radius:6px;overflow:hidden;min-height:65vh}.notes__sidebar{display:flex;flex-direction:column;background:var(--c-bg-elevated);min-height:0}.notes__sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--c-border);flex-shrink:0}.notes__new-btn{font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:#fff;background:var(--c-accent);border:none;border-radius:100px;padding:.4375rem 1rem;cursor:pointer;letter-spacing:.04em;text-transform:uppercase;transition:background .2s ease}.notes__new-btn:hover{background:var(--c-accent-hover)}.notes__count{font-family:var(--font-mono);font-size:.6875rem;color:var(--c-text-3);letter-spacing:.02em}.notes__list{flex:1;overflow-y:auto}.notes__list-item{padding:.875rem 1.25rem;border-bottom:1px solid var(--c-border);cursor:pointer;transition:background .15s ease;border-left:3px solid transparent}.notes__list-item:hover{background:var(--c-bg)}.notes__list-item--active{border-left-color:var(--c-accent);background:var(--c-bg)}.notes__list-item-title{display:block;font-family:var(--font-display);font-size:.9375rem;font-weight:500;color:var(--c-text);font-variation-settings:'opsz' 28;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:.25rem}.notes__list-item-date{display:block;font-family:var(--font-mono);font-size:.6875rem;color:var(--c-text-3);letter-spacing:.02em}.notes__editor-panel{display:flex;flex-direction:column;background:var(--c-bg-elevated);min-height:0}.notes__editor-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--c-text-3);font-size:.9375rem}.notes__editor-active{display:flex;flex-direction:column;height:100%}.notes__editor-empty[hidden],.notes__editor-active[hidden]{display:none}.notes__mobile-back{display:none}.notes__editor-title{width:100%;font-family:var(--font-display);font-size:1.375rem;font-weight:600;color:var(--c-text);font-variation-settings:'opsz' 48;background:0 0;border:none;border-bottom:1px solid var(--c-border);padding:1.25rem 1.5rem .75rem;outline:none;transition:border-color .2s ease}.notes__editor-title::placeholder{color:var(--c-text-3)}.notes__editor-title:focus{border-bottom-color:var(--c-accent)}.notes__editor-content{flex:1;width:100%;font-family:var(--font-body);font-size:1.0625rem;font-weight:400;line-height:1.8;color:var(--c-text);background:0 0;border:none;padding:1rem 1.5rem;resize:none;outline:none}.notes__editor-content::placeholder{color:var(--c-text-3);font-style:italic}.notes__editor-footer{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-top:1px solid var(--c-border);flex-shrink:0}.notes__editor-meta{font-family:var(--font-mono);font-size:.6875rem;color:var(--c-text-3);letter-spacing:.02em}.notes__editor-delete{font-family:var(--font-mono);font-size:.6875rem;color:var(--c-text-3);background:0 0;border:1px solid var(--c-border);border-radius:100px;padding:.25rem .75rem;cursor:pointer;letter-spacing:.02em;transition:all .2s ease}.notes__editor-delete:hover{color:var(--c-accent);border-color:var(--c-accent)}.notes__backup{margin-top:2rem;border-top:1px solid var(--c-border);padding-top:1rem}.notes__backup-toggle{font-family:var(--font-mono);font-size:.75rem;font-weight:400;color:var(--c-text-3);text-transform:uppercase;letter-spacing:.08em;background:0 0;border:none;cursor:pointer;padding:.375rem 0;display:flex;align-items:center;gap:.5rem;transition:color .2s ease;width:100%}.notes__backup-toggle:hover{color:var(--c-accent)}.notes__backup-chevron{transition:transform .2s ease;flex-shrink:0}.notes__backup-toggle[aria-expanded=true] .notes__backup-chevron{transform:rotate(180deg)}.notes__backup-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--ease)}.notes__backup-body--open{grid-template-rows:1fr}.notes__backup-inner{overflow:hidden}.notes__backup-section{padding:1rem 0 .5rem}.notes__backup-desc{font-size:.875rem;color:var(--c-text-3);line-height:1.6;margin-bottom:1rem}.notes__backup-actions{display:flex;flex-wrap:wrap;gap:.75rem}.notes__backup-btn{font-family:var(--font-mono);font-size:.75rem;font-weight:400;color:var(--c-text-2);background:var(--c-bg);border:1px solid var(--c-border);border-radius:100px;padding:.5rem 1.25rem;cursor:pointer;letter-spacing:.02em;transition:all .2s ease;text-align:center}.notes__backup-btn:hover{color:var(--c-text);border-color:var(--c-accent)}.notes__backup-file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.notes__backup-status{font-family:var(--font-mono);font-size:.8125rem;line-height:1.5;padding:.75rem 1rem;border-radius:4px;margin-top:.75rem}.notes__backup-status--success{color:var(--c-text-2);background:var(--c-tag-bg);border:1px solid var(--c-tag-border)}.notes__backup-status--error{color:#a33;background:rgba(170,51,51,8%);border:1px solid rgba(170,51,51,.2)}body.dark-theme .notes__backup-status--error{color:#e88;background:rgba(238,136,136,8%);border-color:rgba(238,136,136,.2)}.notes__backup-confirm{margin-top:.75rem;padding:1rem;background:var(--c-bg-elevated);border:1px solid var(--c-border);border-radius:6px}.notes__backup-confirm-text{font-size:.875rem;color:var(--c-text-2);line-height:1.6;margin-bottom:1rem}.notes__backup-confirm-actions{display:flex;flex-wrap:wrap;gap:.5rem}.notes__backup-confirm-btn{font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:#fff;background:var(--c-accent);border:none;border-radius:100px;padding:.5rem 1.25rem;cursor:pointer;letter-spacing:.02em;transition:background .2s ease}.notes__backup-confirm-btn:hover{background:var(--c-accent-hover)}.notes__backup-confirm-btn--cancel{color:var(--c-text-2);background:0 0;border:1px solid var(--c-border)}.notes__backup-confirm-btn--cancel:hover{color:var(--c-text);border-color:var(--c-accent);background:0 0}.notes__info{padding-top:2rem;border-top:1px solid var(--c-border);margin-top:1rem;margin-bottom:4rem}.notes__info p{font-size:.9375rem;color:var(--c-text-3);line-height:1.7;max-width:640px}@media(max-width:768px){.notes{padding:0 1.5rem}.notes__layout{grid-template-columns:1fr;min-height:auto}.notes__sidebar{max-height:60vh}.notes__editor-panel{display:none;min-height:60vh}.notes__layout--editing .notes__sidebar{display:none}.notes__layout--editing .notes__editor-panel,.notes__layout--empty .notes__editor-panel{display:flex}.notes__mobile-back{display:block;font-family:var(--font-mono);font-size:.8125rem;color:var(--c-text-3);background:0 0;border:none;border-bottom:1px solid var(--c-border);padding:.75rem 1.25rem;cursor:pointer;text-align:left;width:100%;letter-spacing:.02em;transition:color .2s ease}.notes__mobile-back:hover{color:var(--c-accent)}}@media(max-width:480px){.notes{padding:0 1rem}.notes__editor-title{font-size:1.2rem;padding:1rem 1.25rem .625rem}.notes__editor-content{padding:.75rem 1.25rem}.notes__editor-footer{padding:.625rem 1.25rem}.notes__backup-actions{flex-direction:column}.notes__backup-confirm-actions{flex-direction:column}}@media(prefers-reduced-motion:reduce){.notes__list-item,.notes__back,.notes__editor-title,.notes__editor-delete,.notes__new-btn,.notes__backup-toggle,.notes__backup-chevron,.notes__backup-body,.notes__backup-btn,.notes__backup-confirm-btn,.notes__mobile-back{transition:none}}