:root{--bg:#0f172a;--surface:#1e293b;--surface-hover:#273548;--primary:#8b5cf6;--primary-hover:#7c3aed;--secondary:#06b6d4;--secondary-hover:#0891b2;--success:#34d399;--warning:#fbbf24;--danger:#fb7185;--danger-hover:#f43f5e;--text:#f8fafc;--text-muted:#94a3b8;--border:#334155;--border-hover:#475569}*,:before,:after{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}a{color:var(--secondary)}a:hover{color:var(--secondary-hover)}input,button{font-family:inherit}input:focus{outline:none;box-shadow:0 0 0 2px #8b5cf626;border-color:var(--primary)!important}::selection{background:#8b5cf64d}.layout{min-height:100vh;display:flex}.sidebar{background:var(--surface);width:220px;color:var(--text);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:1rem;padding:1.5rem;display:flex}.sidebar-brand{align-items:center;gap:.625rem;margin-bottom:.5rem;display:flex}.sidebar-logo{flex-shrink:0;width:32px;height:32px}.sidebar-brand h2{color:var(--primary);margin:0;font-size:1.3rem;font-weight:700}.sidebar-nav{flex-direction:column;flex:1;gap:.25rem;display:flex}.sidebar-nav a{color:var(--text-muted);border-radius:6px;padding:.5rem .75rem;text-decoration:none;transition:all .15s}.sidebar-nav a:hover{background:var(--surface-hover);color:var(--text)}.sidebar-nav a.active{color:var(--primary);background:#8b5cf61a}.logout-btn{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:6px;margin-top:auto;padding:.5rem;transition:all .15s}.logout-btn:hover{border-color:var(--danger);color:var(--danger);background:#fb71851a}.layout-body{flex-direction:column;flex:1;min-width:0;display:flex}.content{flex:1;padding:1.5rem;overflow-y:auto}.mobile-nav{display:none}@media (width<=768px){.layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--border);flex-direction:row;align-items:center;gap:.5rem;width:100%;padding:.75rem 1rem}.sidebar-brand{margin-bottom:0;margin-right:auto}.sidebar-logo{width:28px;height:28px}.sidebar-brand h2{font-size:1.1rem}.sidebar-nav{display:none}.logout-btn{margin-top:0;padding:.4rem .6rem;font-size:.85rem}.content{padding:1rem 1rem 2rem;padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px))}.layout-body{flex-direction:column;flex:1;display:flex}.mobile-nav{background:var(--surface);border-top:1px solid var(--border);padding:.5rem calc(.5rem + env(safe-area-inset-bottom,0px)) calc(.5rem + env(safe-area-inset-bottom,0px));z-index:100;justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-nav a{color:var(--text-muted);border-radius:6px;flex-direction:column;align-items:center;gap:2px;padding:.25rem .5rem;font-size:.65rem;text-decoration:none;transition:all .15s;display:flex}.mobile-nav a.active{color:var(--primary)}.mobile-nav a svg{display:block}}.auth-page{justify-content:center;align-items:center;min-height:100vh;display:flex}.auth-form{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:1rem;width:100%;max-width:400px;padding:2.5rem;display:flex}.auth-logo{flex-direction:column;align-items:center;gap:.75rem;margin-bottom:.5rem;display:flex}.auth-logo img{width:48px;height:48px}.auth-form h1{color:var(--primary);text-align:center;margin:0;font-size:1.8rem}.subtitle{text-align:center;color:var(--text-muted);margin:0}.auth-form input{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:6px;padding:.75rem;font-size:1rem}.auth-form button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:.75rem;font-size:1rem;font-weight:600;transition:background .15s}.auth-form button:disabled{opacity:.6;cursor:not-allowed}.auth-form button:hover:not(:disabled){background:var(--primary-hover)}.error{color:var(--danger);background:#fb71851a;border:1px solid #fb718533;border-radius:6px;padding:.5rem .75rem;font-size:.9rem}.switch{text-align:center;color:var(--text-muted);font-size:.9rem}.switch a{color:var(--secondary);text-decoration:none}.switch a:hover{color:var(--secondary-hover);text-decoration:underline}.heatmap{padding:.75rem 1rem}.heatmap-grid{gap:6px;display:flex}.heatmap-labels{grid-template-rows:14px repeat(7,13px);gap:3px;margin-right:2px;display:grid}.heatmap-month-spacer{height:14px}.heatmap-day-label{color:var(--text-muted);height:13px;font-size:10px;line-height:13px}.heatmap-weeks{flex:1;overflow-x:auto}.heatmap-month-row{height:14px;margin-bottom:2px;position:relative}.heatmap-month-label{color:var(--text-muted);white-space:nowrap;font-size:10px;position:absolute;top:0}.heatmap-cols{gap:3px;display:flex}.heatmap-week{grid-template-rows:repeat(7,13px);gap:3px;display:grid}.heatmap-cell{cursor:default;border-radius:3px;width:13px;height:13px}.heatmap-cell.empty,.heatmap-cell.level-0{outline-offset:-1px;outline:1px solid #475569}.heatmap-cell.empty{background:0 0}.heatmap-cell.level-1{background:#a78bfa}.heatmap-cell.level-2{background:#8b5cf6}.heatmap-cell.level-3{background:#6d28d9}.heatmap-cell.level-4{background:#4c1d95}.heatmap-legend{color:var(--text-muted);justify-content:flex-end;align-items:center;gap:3px;margin-top:8px;font-size:10px;display:flex}.heatmap-legend .heatmap-cell{width:0;min-width:11px;height:11px}.heatmap-legend .heatmap-cell.empty,.heatmap-legend .heatmap-cell.level-0{outline-offset:-1px;outline:1px solid #475569}.heatmap-legend .heatmap-cell.empty{background:0 0}.heatmap-legend .heatmap-cell.level-1{background:#a78bfa}.heatmap-legend .heatmap-cell.level-2{background:#8b5cf6}.heatmap-legend .heatmap-cell.level-3{background:#6d28d9}.heatmap-legend .heatmap-cell.level-4{background:#4c1d95}@media (width<=480px){.heatmap{--heatmap-col-w:13px;padding:.5rem}.heatmap-grid{gap:4px}.heatmap-labels{gap:2px;margin-right:1px}.heatmap-cols{gap:2px}.heatmap-week{grid-template-rows:repeat(7,11px);gap:2px}.heatmap-cell{border-radius:2px;width:11px;height:11px}.heatmap-month-label{font-size:9px}}.dashboard{max-width:800px}.header-row{justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:1.5rem;display:flex}.header-row h1{color:var(--text);margin:0;font-size:1.5rem}.header-actions{gap:.25rem;display:flex}.btn{border:1px solid var(--border);cursor:pointer;background:var(--surface);color:var(--text-muted);border-radius:6px;padding:.5rem 1rem;font-size:.9rem;transition:all .15s}.btn:hover{border-color:var(--border-hover);color:var(--text)}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.btn-danger{border-color:var(--border);color:var(--danger);background:0 0}.btn-danger:hover{border-color:var(--danger);background:#fb71851a}.btn-sm{padding:.3rem .6rem;font-size:.8rem}.btn-quick{border-color:var(--success);color:var(--success);background:#34d3991a;font-weight:600}.btn-quick:hover{background:var(--success);border-color:var(--success);color:#fff}.create-form{background:var(--surface);border:1px solid var(--border);border-radius:8px;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;padding:1rem;display:flex}.visibility-select{border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:6px;padding:.5rem;font-size:.9rem}.visibility-select:focus{border-color:var(--primary);outline:none}.form-error{color:var(--danger);width:100%;margin:0;font-size:.85rem}.create-form input{border:1px solid var(--border);background:var(--bg);min-width:120px;color:var(--text);border-radius:6px;flex:1;padding:.5rem}.track-list{flex-direction:column;gap:.5rem;display:flex}.track-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;transition:border-color .15s;overflow:hidden}.track-card.expanded{border-color:var(--primary)}.track-header{justify-content:space-between;align-items:center;padding:.75rem 1rem;display:flex}.track-info{align-items:center;gap:.5rem;display:flex}.days-since{color:var(--text-muted);background:#94a3b814;border-radius:4px;padding:.15rem .4rem;font-size:.75rem}.track-header strong{color:var(--text)}.badge{color:var(--text-muted);background:#94a3b81a;border-radius:4px;padding:.15rem .4rem;font-size:.7rem}.badge.public_r,.badge.public_rw{color:var(--success);background:#34d3991a}.track-actions{align-items:center;gap:.25rem;display:flex}.track-detail{padding:0 1rem 1rem}.track-event-form{align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.quantity-input{border:1px solid var(--border);background:var(--bg);width:60px;color:var(--text);text-align:center;border-radius:6px;padding:.4rem}.datetime-input{border:1px solid var(--border);background:var(--bg);min-width:0;color:var(--text);border-radius:6px;flex:1;padding:.4rem;font-family:monospace;font-size:.8rem}.datetime-input::-webkit-calendar-picker-indicator{filter:invert(.7);cursor:pointer}.btn-active{background:var(--primary);border-color:var(--primary);color:#fff}.btn-active:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.event-list h4{color:var(--text-muted);margin:0 0 .5rem}.event-row{border-bottom:1px solid #33415580;justify-content:space-between;padding:.4rem 0;font-size:.85rem;display:flex}.event-date{color:var(--text-muted)}.event-qty{color:var(--success);font-weight:700}.key-value{color:var(--text-muted);background:var(--bg);word-break:break-all;border-radius:4px;padding:.15rem .4rem;font-family:monospace;font-size:.8rem}.empty-state{color:var(--text-muted);text-align:center;padding:2rem}.usage-section{margin-top:1rem}.usage-section h3{color:var(--text);margin:0 0 .25rem;font-size:1.1rem}.usage-section h4{color:var(--text-muted);margin:1rem 0 .25rem;font-size:.85rem}.usage-subtitle{color:var(--text-muted);margin:0 0 .5rem;font-size:.85rem}.code-block{background:var(--bg);color:var(--success);white-space:pre-wrap;word-break:break-all;border:1px solid var(--border);border-radius:6px;margin:0 0 .5rem;padding:.75rem;font-family:monospace;font-size:.8rem;overflow-x:auto}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);border-radius:12px;width:90%;max-width:500px;padding:1.5rem}.modal h3{color:var(--text);margin:0 0 .5rem}.modal-warning{color:var(--warning);background:#fbbf2414;border:1px solid #fbbf2426;border-radius:6px;margin:0 0 1rem;padding:.5rem;font-size:.9rem;line-height:1.5}.modal-key-row{align-items:center;gap:.5rem;display:flex}.modal-key{color:var(--secondary);background:var(--bg);word-break:break-all;border-radius:6px;flex:1;padding:.5rem;font-family:monospace;font-size:.75rem;line-height:1.4}.modal-actions{justify-content:flex-end;gap:.5rem;margin-top:1rem;display:flex}@media (width<=768px){.track-header{flex-wrap:wrap;align-items:flex-start;gap:.5rem}.track-event-form{flex-wrap:wrap}.datetime-input{min-width:100%}.code-block{padding:.5rem;font-size:.7rem}}