*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--yellow: #FFD60A;--orange: #FF9500;--bg: #F2F2F7;--card: #FFFFFF;--text-primary: #000000;--text-secondary: rgba(60,60,67,.6);--text-tertiary: #8E8E93;--separator: rgba(60,60,67,.29);--nav-blur: rgba(242,242,247,.92);--pinned-bg: #FFFBE6;--tag-bg: rgba(255,214,10,.13);--tag-color: #7A5C00;--shadow: 0 2px 12px rgba(0,0,0,.08);--radius-card: 16px;--radius-folder: 10px}@media (prefers-color-scheme: dark){:root{--bg: #000000;--card: #1C1C1E;--text-primary: #FFFFFF;--text-secondary: rgba(235,235,245,.6);--text-tertiary: rgba(235,235,245,.3);--separator: rgba(84,84,88,.65);--nav-blur: rgba(28,28,30,.92);--pinned-bg: #2A2800;--tag-bg: rgba(255,214,10,.15);--tag-color: var(--yellow);--shadow: 0 2px 12px rgba(0,0,0,.4)}}html,body{height:100%;background:var(--bg)}body{font-family:-apple-system,SF Pro Text,SF Pro Display,system-ui,sans-serif;color:var(--text-primary);-webkit-font-smoothing:antialiased}#app{max-width:430px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden;background:var(--bg)}.status-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 20px 6px;background:var(--nav-blur);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);position:sticky;top:0;z-index:100;flex-shrink:0}.status-time{font-size:15px;font-weight:600;letter-spacing:-.3px}.status-icons{display:flex;gap:6px;align-items:center}.status-icons svg{display:block}.top-nav{display:flex;justify-content:space-between;align-items:center;padding:8px 16px 12px;background:var(--nav-blur);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:.5px solid var(--separator);flex-shrink:0;position:sticky;top:44px;z-index:99;min-height:48px}.nav-title{font-size:17px;font-weight:600;letter-spacing:-.4px}.back-btn{display:flex;align-items:center;gap:3px;color:var(--yellow);font-size:17px;cursor:pointer;padding:4px 0;-webkit-user-select:none;user-select:none}.nav-actions{display:flex;gap:14px;align-items:center}.nav-btn{color:var(--yellow);cursor:pointer;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;transition:background .15s}.nav-btn:active{background:var(--separator)}.nav-spacer{width:44px}.scroll-area{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.scroll-area::-webkit-scrollbar{display:none}.large-title-section{padding:8px 20px 4px}.large-title{font-size:34px;font-weight:700;letter-spacing:-.6px}.search-container{padding:8px 16px 12px}.search-bar{background:var(--card);border-radius:12px;padding:8px 12px;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow)}.search-bar svg{flex-shrink:0;fill:var(--text-tertiary)}.search-bar input{border:none;background:transparent;font-size:17px;color:var(--text-primary);outline:none;width:100%;font-family:inherit}.search-bar input::placeholder{color:var(--text-tertiary)}.section-header{padding:20px 20px 8px;font-size:22px;font-weight:700;letter-spacing:-.4px}.icloud-label{padding:20px 20px 8px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-tertiary)}.folders-list{background:var(--card);border-radius:var(--radius-card);margin:0 16px;overflow:hidden;box-shadow:var(--shadow)}.folder-item{display:flex;align-items:center;padding:12px 16px;cursor:pointer;gap:14px;position:relative;transition:background .12s;-webkit-user-select:none;user-select:none}.folder-item:active{background:#0000000f}.folder-item+.folder-item:before{content:"";position:absolute;top:0;left:58px;right:0;height:.5px;background:var(--separator)}.folder-icon{width:36px;height:36px;border-radius:var(--radius-folder);display:flex;align-items:center;justify-content:center;flex-shrink:0}.folder-name{font-size:17px;flex:1;letter-spacing:-.2px}.folder-count{font-size:17px;color:var(--text-tertiary);margin-right:4px}.tags-section{background:var(--card);border-radius:var(--radius-card);margin:0 16px;padding:16px;box-shadow:var(--shadow)}.tags-grid{display:flex;flex-wrap:wrap;gap:8px}.tag-pill{background:var(--bg);border-radius:20px;padding:7px 14px;font-size:15px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:transform .15s,opacity .15s;-webkit-user-select:none;user-select:none}.tag-pill:active{transform:scale(.95);opacity:.8}.tag-pill-text{color:var(--text-secondary);font-size:14px}.pinned-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 16px 8px}.pinned-card{background:var(--pinned-bg);border-radius:var(--radius-card);padding:14px;cursor:pointer;transition:transform .15s,opacity .15s;position:relative;min-height:140px;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow)}.pinned-card.wide{grid-column:span 2;min-height:100px;flex-direction:column}.pinned-card:active{transform:scale(.97);opacity:.9}.pin-icon{position:absolute;top:12px;right:12px}.pinned-title{font-size:15px;font-weight:600;letter-spacing:-.3px;margin-bottom:4px;line-height:1.3}.pinned-preview{font-size:13px;color:var(--text-tertiary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}.notes-list{background:var(--card);border-radius:var(--radius-card);margin:0 16px;overflow:hidden;box-shadow:var(--shadow)}.note-item{display:flex;align-items:flex-start;padding:14px 16px;cursor:pointer;position:relative;transition:background .1s;-webkit-user-select:none;user-select:none}.note-item:active{background:#0000000d}.note-item+.note-item:before{content:"";position:absolute;top:0;left:16px;right:0;height:.5px;background:var(--separator)}.note-content{flex:1;min-width:0}.note-title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.2px;margin-bottom:3px}.note-meta{display:flex;gap:8px;align-items:center}.note-date{font-size:13px;color:var(--text-tertiary);flex-shrink:0}.note-preview{font-size:13px;color:var(--text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.note-tag{display:inline-flex;background:var(--tag-bg);color:var(--tag-color);border-radius:6px;padding:1px 7px;font-size:11px;font-weight:600;margin-left:4px;flex-shrink:0}.chevron{flex-shrink:0;margin-left:8px;margin-top:2px;color:var(--text-tertiary);opacity:.45}.bottom-bar{background:var(--nav-blur);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:.5px solid var(--separator);padding:12px 20px 28px;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.note-count{font-size:13px;color:var(--text-tertiary);text-align:center;flex:1}.compose-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--yellow);transition:transform .15s,opacity .15s}.compose-btn:active{transform:scale(.9);opacity:.8}.note-detail{position:fixed;top:0;right:0;bottom:0;left:0;max-width:430px;margin:0 auto;background:var(--card);z-index:200;display:flex;flex-direction:column;transform:translate(100%);transition:transform .36s cubic-bezier(.42,0,.12,1)}.note-detail.visible{transform:translate(0)}.detail-nav{display:flex;justify-content:space-between;align-items:center;padding:54px 16px 10px;border-bottom:.5px solid var(--separator);background:var(--nav-blur);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);flex-shrink:0}.detail-actions{display:flex;gap:10px;align-items:center}.detail-btn{display:flex;align-items:center;gap:4px;color:var(--yellow);font-size:17px;cursor:pointer;padding:4px 6px;border-radius:8px;transition:background .12s}.detail-btn:active{background:var(--separator)}.detail-content{flex:1;padding:20px 20px 8px;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--separator) transparent}.detail-content::-webkit-scrollbar{width:4px}.detail-content::-webkit-scrollbar-thumb{background:var(--separator);border-radius:4px}.detail-title{font-size:28px;font-weight:700;letter-spacing:-.5px;margin-bottom:4px;border:none;background:transparent;color:var(--text-primary);width:100%;outline:none;font-family:inherit;resize:none;line-height:1.2}.detail-date-line{font-size:13px;color:var(--text-tertiary);margin-bottom:16px}.detail-body{font-size:17px;line-height:1.7;color:var(--text-primary);border:none;background:transparent;width:100%;outline:none;font-family:inherit;resize:none;min-height:300px;white-space:pre-wrap}.detail-toolbar{display:flex;justify-content:space-around;padding:10px 10px 30px;border-top:.5px solid var(--separator);background:var(--nav-blur);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);flex-shrink:0}.tool-btn{color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;width:38px;height:38px;cursor:pointer;border-radius:9px;transition:background .15s,color .15s}.tool-btn:active{background:var(--separator);color:var(--text-primary)}.tool-btn.active{color:var(--yellow)}.bottom-spacer{height:24px;flex-shrink:0}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.note-item,.folder-item,.pinned-card{animation:fadeSlideUp .3s ease both}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 30px;color:var(--text-tertiary);gap:12px}.empty-state p{font-size:17px;text-align:center}