@import"https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=DM+Mono:wght@300;400;500&family=DM+Sans:wght@300;400;500&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--amber: #d4972a;--amber-light: #f0b94a;--green: #6aaa7a;--red: #c0614a;--blue: #5a8fbf}html,html[data-theme=dark]{--bg: #0f0e0c;--surface: #1a1814;--surface2: #232018;--border: #2e2a22;--ivory: #f5f0e8;--ivory-dim: #a89f8c;--ivory-faint: #4a4438}html[data-theme=light]{--bg: #f9f8f6;--surface: #ffffff;--surface2: #f0ece5;--border: #e6e2da;--ivory: #2b2824;--ivory-dim: #6b6357;--ivory-faint: #a8a094;--amber: #c2831b;--amber-light: #df9e1d;--green: #4d8f5d}body{background:var(--bg);color:var(--ivory);font-family:DM Sans,sans-serif;min-height:100vh;font-size:14px;transition:background-color .3s ease,color .3s ease}.app{max-width:420px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.header{padding:20px 20px 0;border-bottom:1px solid var(--border)}.header-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.header-title{font-family:Playfair Display,serif;font-size:22px;font-weight:700;color:var(--ivory);line-height:1.1}.header-subtitle{font-family:DM Mono,monospace;font-size:10px;color:var(--ivory-dim);letter-spacing:.15em;text-transform:uppercase;margin-top:3px}.streak-badge{background:var(--surface2);border:1px solid var(--amber);border-radius:8px;padding:6px 12px;text-align:center}.streak-number{font-family:Playfair Display,serif;font-size:24px;color:var(--amber-light);line-height:1}.streak-label{font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-dim);letter-spacing:.1em;text-transform:uppercase}.nav{display:flex;margin-top:16px}.nav-tab{flex:1;padding:10px 8px;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--ivory-dim);font-family:DM Mono,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s}.nav-tab.active{color:var(--amber-light);border-bottom-color:var(--amber-light)}.nav-tab:hover:not(.active){color:var(--ivory)}.content{flex:1;padding:20px;overflow-y:auto}.section{margin-bottom:20px}.section-label{font-family:DM Mono,monospace;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-dim);margin-bottom:10px;display:flex;align-items:center;gap:8px}.section-label:after{content:"";flex:1;height:1px;background:var(--border)}.keys-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}.key-chip{background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:8px 14px;font-family:Playfair Display,serif;font-size:16px;color:var(--ivory)}.key-chip.major{border-color:var(--amber);color:var(--amber-light)}.key-chip.minor{border-color:var(--blue);color:#7ab0d8}.key-meta{font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-faint);letter-spacing:.1em;margin-top:6px}.checklist{display:flex;flex-direction:column;gap:6px}.check-item{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:12px 14px;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.check-item:hover{border-color:var(--ivory-faint)}.check-item.checked{border-color:var(--green);background:#1a2420}.check-box{width:18px;height:18px;border-radius:4px;border:1.5px solid var(--ivory-faint);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.check-item.checked .check-box{background:var(--green);border-color:var(--green)}.check-mark{font-size:11px;color:#fff;display:none}.check-item.checked .check-mark{display:block}.check-text{flex:1;font-size:13px;color:var(--ivory);line-height:1.3}.check-item.checked .check-text{color:var(--ivory-dim);text-decoration:line-through;text-decoration-color:var(--ivory-faint)}.check-sub{font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-dim);margin-top:2px;display:block}.weekly-counter{display:flex;align-items:center;gap:6px;margin-top:6px}.week-dot{width:8px;height:8px;border-radius:50%;background:var(--ivory-faint);transition:all .2s;cursor:pointer}.week-dot.filled{background:var(--amber)}.week-label{font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-dim)}.progress-bar-wrap{background:var(--surface2);border-radius:4px;height:4px;overflow:hidden;margin-top:8px}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--amber),var(--amber-light));border-radius:4px;transition:width .4s ease}.progress-label{display:flex;justify-content:space-between;font-family:DM Mono,monospace;font-size:10px;color:var(--ivory-dim);margin-top:6px}.notes-area{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:12px;color:var(--ivory);font-family:DM Sans,sans-serif;font-size:13px;resize:none;min-height:80px;outline:none;transition:border-color .2s;line-height:1.5}.notes-area:focus{border-color:var(--ivory-faint)}.notes-area::placeholder{color:var(--ivory-faint)}.piece-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px}.piece-name{font-family:Playfair Display,serif;font-size:17px;color:var(--ivory);margin-bottom:4px}.piece-meta{font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-dim);letter-spacing:.1em;text-transform:uppercase}.section-chips{display:flex;flex-direction:column;gap:6px;margin-top:12px}.section-chip{display:flex;align-items:center;gap:10px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;cursor:pointer;transition:all .2s}.section-chip:hover{border-color:var(--ivory-faint)}.comfort-dots{display:flex;gap:2px;margin-left:auto;align-items:center}.comfort-dot{width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.comfort-dot:after{content:"";width:10px;height:10px;border-radius:50%;border:1.5px solid var(--ivory-faint);transition:all .15s}.comfort-dot:active:after{transform:scale(.85)}.comfort-dot.filled-1:after{background:var(--red);border-color:var(--red)}.comfort-dot.filled-2:after{background:var(--amber);border-color:var(--amber)}.comfort-dot.filled-3:after{background:var(--green);border-color:var(--green)}.heatmap{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:6px}.heatmap-day-label{font-family:DM Mono,monospace;font-size:8px;color:var(--ivory-faint);text-align:center;padding-bottom:3px}.heatmap-cell{aspect-ratio:1;border-radius:3px;background:var(--surface2);cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;position:relative}.heatmap-cell:hover{transform:scale(1.15);z-index:10}.heatmap-date{font-family:DM Mono,monospace;font-size:8px;color:var(--ivory-dim);opacity:.8;pointer-events:none}.heatmap-cell.level-0{background:var(--surface2)}.heatmap-cell.level-1{background:#3d2e10}.heatmap-cell.level-2{background:#7a5a1a}.heatmap-cell.level-3{background:var(--amber)}.heatmap-cell.level-3 .heatmap-date{color:#1a1400;font-weight:500;opacity:1}.heatmap-cell.level-2 .heatmap-date{color:#f5f0e8;opacity:.9}.heatmap-cell.level-1 .heatmap-date{color:#f5f0e8;opacity:.8}.heatmap-cell.today{box-shadow:0 0 0 1.5px var(--amber-light)}.stats-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:16px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:12px 10px;text-align:center}.stat-number{font-family:Playfair Display,serif;font-size:22px;color:var(--amber-light);line-height:1}.stat-label{font-family:DM Mono,monospace;font-size:8px;color:var(--ivory-dim);letter-spacing:.1em;text-transform:uppercase;margin-top:3px}.btn{width:100%;padding:13px;background:var(--amber);border:none;border-radius:8px;color:#1a1400;font-family:DM Mono,monospace;font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:all .2s}.btn:hover{background:var(--amber-light)}.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--ivory-dim);font-family:DM Mono,monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:10px;border-radius:8px;cursor:pointer;transition:all .2s;width:100%}.btn-ghost:hover{border-color:var(--ivory-dim);color:var(--ivory)}.divider{height:1px;background:var(--border);margin:16px 0}.tag{display:inline-block;background:var(--surface2);border:1px solid var(--border);border-radius:4px;padding:2px 8px;font-family:DM Mono,monospace;font-size:9px;color:var(--ivory-dim);letter-spacing:.1em}.tag.weekly{border-color:var(--blue);color:#7ab0d8}.done-banner{background:#1a2420;border:1px solid var(--green);border-radius:8px;padding:14px;text-align:center;margin-bottom:16px}.done-banner-title{font-family:Playfair Display,serif;font-size:16px;color:var(--green);margin-bottom:4px}.done-banner-sub{font-family:DM Mono,monospace;font-size:10px;color:var(--ivory-dim)}