:root{--primary-color: #667eea;--secondary-color: #f093fb;--accent-color: #667eea;--background-primary: #ffffff;--background-secondary: #f8f9fa;--background-hover: #f1f3f4;--background-active: #e9ecef;--text-primary: #212529;--text-secondary: #6c757d;--text-muted: #adb5bd;--text-faint: #ced4da;--text-error: #dc3545;--text-success: #28a745;--border-color: #dee2e6;--border-radius: 8px;--box-shadow: 0 2px 4px rgba(0, 0, 0, .1);--box-shadow-hover: 0 4px 8px rgba(0, 0, 0, .15);--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}body{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Inter,sans-serif;margin:0;padding:0;line-height:1.6}*{box-sizing:border-box}.glass-morphism{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0000001a}.glass-morphism-dark{background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.app{height:100vh;display:flex;flex-direction:column;background:transparent;color:#fff}.app-header{display:flex;align-items:center;gap:16px;padding:20px 32px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.2);box-shadow:0 2px 4px #0000001a;position:relative;transition:all var(--transition-normal)}.app-header:before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent)}.app-header h1{margin:0;flex:1;font-size:24px;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3);transition:all var(--transition-normal)}.app-header h1:hover{transform:translateY(-2px);text-shadow:0 4px 8px rgba(0,0,0,.4)}.app-header button{padding:12px 24px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);border-radius:12px;color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.app-header button:hover{background:#ffffff4d;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.app-header button:active{transform:translateY(0)}.app-main{flex:1;overflow:hidden;display:flex;flex-direction:column;background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.search{padding:20px 32px;background:#ffffff14;border-bottom:1px solid rgba(255,255,255,.1)}.search-input{display:flex;gap:12px;align-items:center}.search-input input{flex:1;padding:14px 20px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);border-radius:12px;color:#fff;font-size:16px;font-weight:500;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.search-input input::placeholder{color:#ffffffb3}.search-input input:focus{outline:none;background:#ffffff4d;box-shadow:0 0 0 3px #667eea33}.search-input button{padding:14px 24px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.search-input button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.search-input button:active{transform:translateY(0)}.search-input button:disabled{background:#fff3;transform:none;cursor:not-allowed}.search-error{margin-top:12px;color:#ff6b6b;font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.3)}.note-list{height:100%;display:flex;flex-direction:column;overflow:hidden;background:#ffffff0d}.note-list h3{margin:0;padding:16px 24px;background:#ffffff1a;font-size:16px;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3);transition:all var(--transition-normal)}.note-list h3:hover{transform:translate(4px)}.note-list-items{flex:1;overflow-y:auto;background:#ffffff05}.note-list-item{padding:16px 24px;border-bottom:1px solid rgba(255,255,255,.1);cursor:pointer;transition:all var(--transition-normal);background:#ffffff05}.note-list-item:hover{transform:translate(4px);background:#ffffff14}.note-list-item.selected{transform:translate(0);background:#667eea1a;border-left:4px solid #667eea}.note-item-title{font-weight:600;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3);transition:all var(--transition-normal)}.note-list-item:hover .note-item-title{transform:scale(1.02)}.note-item-path{font-size:13px;color:#ffffffb3;text-shadow:0 1px 2px rgba(0,0,0,.3);margin-bottom:4px}.note-item-date{font-size:11px;color:#ffffff80;text-shadow:0 1px 2px rgba(0,0,0,.3)}.note-list-loading,.note-list-error{padding:40px;text-align:center;color:#ffffffb3;text-shadow:0 2px 4px rgba(0,0,0,.3)}.note-list-error{color:#ff6b6b}.note-view{height:100%;display:flex;flex-direction:column;overflow:hidden;background:#ffffff0d}.note-view-header{display:flex;align-items:center;gap:16px;padding:20px 32px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.2);box-shadow:0 2px 4px #0000001a;position:relative;transition:all var(--transition-normal)}.note-view-header:before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent)}.note-view-header h2{margin:0;flex:1;font-size:20px;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3);transition:all var(--transition-normal)}.note-view-header h2:hover{transform:translateY(-2px);text-shadow:0 4px 8px rgba(0,0,0,.4)}.back-button{padding:10px 20px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.back-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.edit-button{padding:10px 20px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.edit-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.note-view-meta{display:flex;gap:16px;padding:12px 32px;background:#ffffff14;font-size:13px;color:#ffffffb3;text-shadow:0 1px 2px rgba(0,0,0,.3);border-bottom:1px solid rgba(255,255,255,.1)}.note-view-content{flex:1;overflow-y:auto;padding:24px 32px;background:#ffffff05}.note-view-content pre{margin:0;white-space:pre-wrap;word-wrap:break-word;font-family:JetBrains Mono,Fira Code,Courier New,monospace;font-size:15px;line-height:1.7;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.markdown-body{color:#fff;line-height:1.7;font-size:16px}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.markdown-body h1{font-size:2em;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.3em}.markdown-body h2{font-size:1.5em;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:.3em}.markdown-body h3{font-size:1.25em}.markdown-body h4{font-size:1em}.markdown-body p{margin-top:0;margin-bottom:16px}.markdown-body a{color:#667eea;text-decoration:none}.markdown-body a:hover{text-decoration:underline}.markdown-body strong{font-weight:600;color:#fff}.markdown-body em{font-style:italic}.markdown-body ul,.markdown-body ol{padding-left:2em;margin-top:0;margin-bottom:16px}.markdown-body li{margin-bottom:4px}.markdown-body li>p{margin-top:16px}.markdown-body code{padding:.2em .4em;margin:0;font-size:85%;background-color:#ffffff1a;border-radius:6px;font-family:JetBrains Mono,Fira Code,Courier New,monospace}.markdown-body pre{padding:16px;overflow:auto;font-size:85%;line-height:1.45;background-color:#ffffff1a;border-radius:8px;margin-bottom:16px}.markdown-body pre code{padding:0;margin:0;font-size:100%;background-color:transparent;border-radius:0}.markdown-body blockquote{padding:0 1em;color:#ffffffb3;border-left:4px solid #667eea;margin:0 0 16px}.markdown-body hr{height:2px;padding:0;margin:24px 0;background-color:#fff3;border:0}.markdown-body table{border-collapse:collapse;width:100%;margin-bottom:16px}.markdown-body table th,.markdown-body table td{padding:8px 12px;border:1px solid rgba(255,255,255,.2)}.markdown-body table th{background-color:#ffffff1a;font-weight:600}.markdown-body table tr:nth-child(2n){background-color:#ffffff0d}.markdown-body img{max-width:100%;height:auto;border-radius:8px;margin:16px 0;box-shadow:0 4px 12px #0000004d}.markdown-body input[type=checkbox]{margin-right:8px}.note-edit{height:100%;display:flex;flex-direction:column;background:#ffffff0d}.note-edit form{height:100%;display:flex;flex-direction:column;padding:24px 32px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#fff;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group input,.form-group textarea{width:100%;padding:16px 20px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);border-radius:12px;color:#fff;font-size:16px;font-family:JetBrains Mono,Fira Code,Courier New,monospace;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group input::placeholder,.form-group textarea::placeholder{color:#ffffffb3}.form-group input:focus,.form-group textarea:focus{outline:none;background:#ffffff4d;box-shadow:0 0 0 3px #667eea33}.form-actions{display:flex;gap:12px;justify-content:flex-end;padding-top:20px}.form-actions button{padding:12px 24px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-normal);text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-actions button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.form-actions button:disabled{background:#ffffff1a;transform:none;cursor:not-allowed}.note-edit-error{margin-bottom:20px;padding:12px;background:#ff5f5f33;border:1px solid rgba(255,95,95,.3);border-radius:8px;color:#ff6b6b;text-shadow:0 1px 2px rgba(0,0,0,.3)}.loading{display:flex;align-items:center;justify-content:center;flex:1;color:#ffffffb3;text-shadow:0 2px 4px rgba(0,0,0,.3)}.error{display:flex;align-items:center;justify-content:center;flex:1;color:#ff6b6b;text-shadow:0 2px 4px rgba(0,0,0,.3)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.fade-in{animation:fadeIn .5s ease-out}.slide-in{animation:slideIn .5s ease-out}@media(max-width:768px){.app-header{padding:16px 20px}.app-header h1{font-size:18px}.app-header button{padding:10px 16px;font-size:14px}.search{padding:16px 20px}.search-input{flex-direction:column}.search-input input{padding:12px 16px;font-size:14px}.search-input button{padding:10px 16px;font-size:14px}.note-list h3{padding:12px 16px;font-size:14px}.note-list-items{background:#ffffff05}.note-list-item{padding:12px 16px}.note-view-header{padding:16px 20px}.note-view-header h2{font-size:16px}.note-view-meta{padding:8px 20px;font-size:11px}.note-view-content{padding:16px 20px}.note-view-content pre{font-size:14px;line-height:1.6}.note-edit form{padding:16px 20px}.form-group{margin-bottom:16px}.form-group input,.form-group textarea{padding:12px 16px;font-size:14px}.form-actions{padding-top:16px}.form-actions button{padding:10px 16px;font-size:14px}}@media(prefers-color-scheme:dark){:root{--background-primary: #1a1a1a;--background-secondary: #2a2a2a;--background-hover: #3a3a3a;--background-active: #4a4a4a;--text-primary: #ffffff;--text-secondary: #b3b3b3;--text-muted: #808080;--text-faint: #606060;--text-error: #ff6b6b;--text-success: #28a745;--border-color: #404040}body{background:linear-gradient(135deg,#1a1a1a,#0a0a0a)}}@media(prefers-contrast:high){:root{--border-color: #ffffff;--box-shadow: 0 4px 8px rgba(255, 255, 255, .3);--box-shadow-hover: 0 8px 16px rgba(255, 255, 255, .5)}.app-header,.search,.note-list h3,.note-view-header,.note-view-meta,.note-view-content,.note-edit form{border:2px solid #ffffff}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}