:root{--bg-deep:#060b24;--bg-mid:#0c1747;--glow:#22398f;--card:#8b9eff12;--card-border:#8b9eff29;--card-border-strong:#8b9eff52;--text:#eef2ff;--muted:#8f9fd6;--accent:#5b9dff;--accent-bright:#8ec1ff;--accent-deep:#2458e6;--violet:#8b7cf6;--mint:#5eead4;--mint-soft:#5eead424;--rose:#fb7185;--chip:#5b9dff29;--chip-hover:#5b9dff4d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--accent-bright);outline-offset:2px}body{background:radial-gradient(900px 600px at 50% -8%, var(--glow) 0%, #22398f00 65%), linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-mid) 100%) fixed;background-color:var(--bg-deep);color:var(--text);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5}.app{max-width:640px;margin:0 auto;padding:1.5rem 1rem 3rem}header{text-align:center}header h1{letter-spacing:.02em;margin:0;font-size:1.5rem}.subtitle{color:var(--muted);margin:.25rem 0 0;font-size:.88rem}.error{color:#fecdd3;background:#fb71851f;border:1px solid #fb718566;border-radius:12px;margin:1rem 0;padding:.75rem 1rem}.hero{flex-direction:column;justify-content:center;align-items:center;gap:2rem;min-height:62vh;display:flex}.pulse-wrap{place-items:center;width:230px;height:230px;display:grid;position:relative}.ripple{pointer-events:none;border:2px solid #8baeff8c;border-radius:50%;animation:3s ease-out infinite ripple;position:absolute;inset:0}.ripple-2{animation-delay:1s}.ripple-3{animation-delay:2s}@keyframes ripple{0%{opacity:0;transform:scale(1.02)}15%{opacity:.6}to{opacity:0;transform:scale(1.55)}}.countdown-ring{pointer-events:none;z-index:2;position:absolute;inset:0;transform:rotate(-90deg)}.ring-track,.ring-progress{fill:none;stroke-width:6px;stroke-linecap:round}.ring-track{stroke:#ffffff24}.ring-progress{stroke:var(--mint);filter:drop-shadow(0 0 6px #5eead480);transition:stroke-dashoffset 1s linear}.shazam-btn{cursor:pointer;color:#fff;background:radial-gradient(circle at 32% 26%, #ffffff59 0%, #fff0 42%), linear-gradient(150deg, var(--accent) 0%, var(--accent-deep) 55%, var(--violet) 130%);z-index:1;border:none;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;width:210px;height:210px;transition:transform .15s,box-shadow .35s;display:flex;box-shadow:0 0 45px #5b9dff59,0 14px 40px #00000080,inset 0 2px 10px #ffffff40}.shazam-btn:hover:not(:disabled){transform:scale(1.04)}.shazam-btn:active:not(:disabled){transform:scale(.96)}.shazam-btn:disabled{filter:saturate(.3)brightness(.7);cursor:default}.shazam-btn.listening:hover{transform:none}.shazam-btn.listening:active{transform:scale(.96)}.countdown-number{font-variant-numeric:tabular-nums;text-shadow:0 3px 8px #0000004d;font-size:3.6rem;font-weight:700;line-height:1}.shazam-icon{filter:drop-shadow(0 3px 6px #00000059);font-size:4.2rem;line-height:1}.shazam-label{letter-spacing:.06em;text-transform:uppercase;opacity:.9;font-size:.95rem;font-weight:600}.status{color:var(--muted);text-align:center;min-height:1.6rem;font-size:1rem}.status-dog{color:#fff;text-shadow:0 0 18px #5eead4cc;font-size:1.3rem;font-weight:700}section.training-panel,section.feed{background:var(--card);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:18px;margin-bottom:1.25rem;padding:1.25rem}h2{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 .85rem;font-size:.8rem;font-weight:700}.hint{color:var(--muted);margin:0;font-size:.92rem}.label-list{flex-wrap:wrap;gap:.5rem;display:flex}.chip{background:var(--chip);color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:999px;align-items:center;gap:.35rem;padding:.3rem .8rem;font-size:.88rem;transition:background .15s,transform .1s,border-color .15s;display:inline-flex}.chip:hover{background:var(--chip-hover);border-color:var(--card-border-strong)}.chip:active{transform:scale(.94)}.chip em{color:var(--muted);font-size:.8rem;font-style:normal}.chip-trained{background:var(--mint-soft)}.chip-active{background:var(--mint-soft);color:var(--mint);border-color:#5eead466;font-weight:600}.chip-delete{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:0 0 0 .15rem;font-size:.75rem;transition:color .15s}.chip-delete:hover{color:var(--rose)}.event-card{border:1px solid var(--card-border);background:#ffffff08;border-radius:14px;margin-bottom:.75rem;padding:.9rem 1rem;transition:border-color .2s}.event-card:hover{border-color:var(--card-border-strong)}.event-header{align-items:center;gap:.5rem;display:flex}.event-icon{font-size:1.3rem}.event-category{flex:1;font-weight:700}.event-secondary{color:var(--muted);font-size:.9em;font-weight:400}.event-time{color:var(--muted);font-size:.85rem}.icon-btn{border:1px solid var(--card-border);color:var(--text);cursor:pointer;background:#8b9eff14;border-radius:10px;justify-content:center;align-items:center;width:2.3rem;height:2.3rem;font-size:.95rem;transition:background .15s,transform .1s,border-color .15s,color .15s,box-shadow .15s;display:inline-flex}.icon-btn:hover{border-color:var(--card-border-strong);background:#8b9eff2e}.icon-btn:active{background:#8b9eff4d;transform:scale(.88)}.icon-btn-playing{background:linear-gradient(150deg, var(--accent) 0%, var(--accent-deep) 100%);border-color:var(--accent);color:#fff;box-shadow:0 0 14px #5b9dff8c}.icon-btn-playing:hover{background:linear-gradient(150deg, var(--accent-bright) 0%, var(--accent-deep) 100%)}.icon-btn-danger:hover{color:var(--rose);background:#fb71851f;border-color:#fb718580}.icon-btn-danger:active{background:#fb718540}.event-interpretation{margin:.6rem 0 .4rem;font-size:.95rem}.event-meta{color:var(--muted);font-size:.82rem}.event-prediction{color:var(--mint);margin-top:.5rem;font-size:.9rem}.event-labeling{flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.6rem;display:flex}.label-btn{border:1px dashed var(--card-border-strong);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:.3rem .8rem;font-size:.85rem;transition:color .15s,border-color .15s,background .15s,transform .1s}.label-btn:hover{color:var(--text);border-color:var(--accent);background:var(--chip)}.label-btn:active{transform:scale(.94)}.new-label-form input{border:1px solid var(--card-border);color:var(--text);background:#0000004d;border-radius:999px;width:8.5rem;padding:.3rem .8rem;font-size:.85rem;transition:border-color .15s}.new-label-form input:focus{border-color:var(--accent);outline:none}.new-label-form input::placeholder{color:var(--muted)}footer{color:var(--muted);text-align:center;font-size:.8rem}