:root{--accent: #ff3841;--bg: #0f1b24;--panel: #162633;--surface-deep: #0e1f2b;--ink: #ffffff;--muted: #9fb0bd;--line-soft: #2a3a45;--toast-dark: #222;--toast-dark-btn: #444}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--ink);font-family:Segoe UI,sans-serif}.App{display:flex;flex-direction:column;margin:0 auto;padding:1rem;width:80%;max-width:1400px}.App>h1{display:none}@media (max-width: 768px){.App{width:100%;padding:.75rem}}.page,.add-album-page,.settings-page,.artist-page,.edit-album-page{width:100%;background:var(--panel);border:1px solid var(--line-soft);border-radius:12px;padding:1rem;margin:0 auto}.section{background:var(--panel);border:1px solid var(--line-soft);border-radius:12px;padding:1rem;margin-bottom:1rem}.stack{display:flex;flex-direction:column;gap:.5rem}.page-title,.settings-page h2,.add-album-page h2{font-weight:700;font-size:1.2rem;margin:0 0 .5rem;color:var(--ink)}.section-title{font-weight:600;font-size:1rem;margin:0 0 .5rem;color:var(--ink)}.text-muted{color:var(--muted)}.input,input[type=text],select{width:100%;padding:.45rem;border-radius:6px;border:1px solid var(--line-soft);background:var(--surface-deep);color:var(--ink);font-size:.9rem}.input:focus,input:focus,select:focus{outline:none;border-color:var(--accent)}button,.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--surface-deep);color:var(--ink);border:1px solid var(--line-soft);border-radius:28px;padding:.45rem 1.2rem;font-weight:600;cursor:pointer;font-size:.9rem;transition:all .15s ease}button:hover,.btn:hover{border-color:var(--accent);color:var(--accent)}button:disabled,.btn:disabled{opacity:.6;cursor:not-allowed}.btn--primary{background:var(--accent);color:#000;border:none}.btn--primary:hover{filter:brightness(1.05)}.btn--ghost{background:var(--surface-deep);color:var(--ink);border:1px solid var(--line-soft)}.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}.icon-btn{border-radius:8px;padding:.3rem .45rem;border:1px solid var(--line-soft);background:var(--surface-deep);color:var(--muted);display:flex;align-items:center;justify-content:center}.icon-btn:hover{color:var(--ink);border-color:var(--accent)}.header-wrapper{display:flex;flex-direction:column;margin-bottom:1rem}.header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;font-size:1rem}.header-title{font-weight:700;font-size:1.3rem;color:var(--ink)}.header-controls{display:flex;flex-direction:column;align-items:flex-end}.user-greeting{font-size:.9rem;color:var(--muted);margin-bottom:.25rem}.header-icons{display:flex;align-items:center;gap:.5rem}.header-icons a,.header-icons button{font-size:1rem;background:none;border:none;color:var(--muted);padding:.4rem;cursor:pointer;border-radius:4px;text-decoration:none}.header-icons a:hover,.header-icons button:hover{color:var(--ink)}.header-divider{border-bottom:1px solid var(--line-soft);margin-top:.6rem}.list,.artist-album-list,.service-list{display:flex;flex-direction:column;gap:.5rem}.row,.artist-album-row,.service-row,.library-row{display:flex;align-items:center;justify-content:space-between;background:var(--surface-deep);border:1px solid var(--line-soft);border-radius:8px;padding:.5rem .8rem;color:var(--ink);font-size:.9rem;text-decoration:none;transition:border-color .15s ease}.row:hover,.artist-album-row:hover,.service-row:hover,.library-row:hover{border-color:var(--accent);cursor:pointer}.album-card-large{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--panel);border:2px solid var(--accent);border-radius:12px;padding:1rem;gap:.75rem;text-align:center;max-width:400px;margin:0 auto}.album-title-large{display:flex;flex-direction:column;align-items:center;text-align:center}.album-artist-line{cursor:pointer;text-decoration:underline;margin-bottom:4px}.album-title-line{display:block}.album-controls{display:flex;align-items:center;justify-content:center;gap:1rem}.arrow-btn{background:var(--surface-deep);border:2px solid var(--line-soft);color:var(--ink);font-size:1.5rem;border-radius:50%;width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;cursor:pointer}.album-actions{display:flex;gap:.5rem;justify-content:center}.cover-ph{width:100px;height:100px;background:#000;border-radius:6px}.service-list{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem;width:100%}.service-row{justify-content:center;text-align:center;border-radius:28px;background:var(--surface-deep);border:1px solid var(--line-soft);padding:.55rem;color:var(--muted);font-weight:600;transition:all .15s ease}.service-row:hover{border-color:var(--accent);color:var(--accent);background:rgba(255,56,65,.08)}.add-task-btn{position:fixed;bottom:20px;right:20px;background-color:var(--accent);color:#000;font-size:1.5rem;border:none;border-radius:50%;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 24px #00000059}.toast{position:fixed;top:1rem;left:1rem;max-width:400px;background:var(--toast-dark);color:#fff;opacity:.98;padding:.75rem .85rem;border-radius:14px;z-index:999;display:grid;grid-template-columns:1fr auto;align-items:center;gap:.75rem;border:1px solid rgba(255,255,255,.06);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.toast-text{font-size:.95rem;line-height:1.25}a,.clickable{color:inherit;text-decoration:none}.row.clickable:hover{background:rgba(255,255,255,.05)}.title{font-weight:500}.list .row{border-bottom:1px solid rgba(255,255,255,.08);padding:.4rem .6rem;border-radius:8px}
