:root{--bg:#100e17;--surface:#191622;--surface-2:#211d2c;--text:#f7f3f0;--muted:#aaa3b4;--line:rgba(255,255,255,.1);--pink:#ff718d;--violet:#9670f5;--font:"DM Sans",sans-serif;color-scheme:dark}*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{min-height:100vh;margin:0;background:radial-gradient(circle at 12% 0,rgba(150,112,245,.14),transparent 34%),radial-gradient(circle at 100% 100%,rgba(255,113,141,.08),transparent 30%),var(--bg);color:var(--text);font-family:var(--font);-webkit-tap-highlight-color:transparent}.topbar,main{width:min(1080px,calc(100% - 32px));margin:auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:9px;color:inherit;text-decoration:none;font-weight:700}.brand img{width:42px;height:42px}.quiet-button,.stop-button{appearance:none;border:1px solid var(--line);border-radius:10px;background:rgba(25,22,34,.7);color:var(--muted);font:600 12px var(--font);padding:9px 12px;cursor:pointer}.quiet-button:hover,.stop-button:not(:disabled):hover{border-color:rgba(255,255,255,.25);color:var(--text)}.login-view{min-height:calc(100vh - 76px);display:grid;place-items:center;padding:20px 0 70px}.login-card{width:min(100%,390px);padding:35px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,rgba(255,113,141,.04),rgba(150,112,245,.07)),var(--surface);box-shadow:0 30px 80px rgba(0,0,0,.25);text-align:center}.login-logo{width:96px;height:96px;margin-bottom:9px}.eyebrow{display:block;color:var(--pink);font-size:10px;font-weight:700;letter-spacing:.16em}.login-card h1{margin:7px 0 8px;font-size:29px;letter-spacing:-.04em}.login-card>p{margin:0 auto 28px;color:var(--muted);font-size:14px;line-height:1.5}.login-card form{text-align:left}.login-card label{display:grid;gap:7px;margin-top:14px;color:#d9d2e2;font-size:12px;font-weight:600}.login-card input,.search input,.category-label select{width:100%;border:1px solid var(--line);outline:none;background:var(--surface-2);color:var(--text);font:500 14px var(--font)}.login-card input{height:46px;padding:0 13px;border-radius:10px}.login-card input:focus,.search:focus-within,.category-label select:focus{border-color:var(--violet);box-shadow:0 0 0 3px rgba(150,112,245,.12)}.form-error{min-height:18px;margin:10px 0 2px;color:#ff879c;font-size:12px}.primary-button{width:100%;height:46px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--pink),var(--violet));color:#fff;font:700 14px var(--font);cursor:pointer}.primary-button:disabled{opacity:.65;cursor:wait}.player-view{padding:45px 0 80px}.player-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}.player-heading h1{margin:5px 0 0;font-size:34px;letter-spacing:-.04em}.stop-button{color:#d9d2e2}.stop-button span{font-size:8px;color:var(--pink);margin-right:5px}.stop-button:disabled{opacity:.4;cursor:default}.controls{display:grid;grid-template-columns:minmax(210px,1fr) 210px 220px;gap:10px;margin-bottom:26px}.search{height:45px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}.search span{color:var(--muted);font-size:22px;transform:rotate(-20deg)}.search input{height:100%;padding:0;border:0;background:transparent}.category-label select{height:45px;padding:0 34px 0 12px;border-radius:11px;background-color:var(--surface)}.volume-control{height:45px;display:grid;grid-template-columns:30px 1fr 38px;align-items:center;gap:6px;padding:0 10px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--muted);font-size:12px}.volume-control>span{font-size:11px;letter-spacing:-3px}.volume-control input{width:100%;accent-color:var(--violet)}.volume-control output{text-align:right;font-size:11px}.status{margin:0 0 15px;color:var(--muted);font-size:12px}.sound-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:12px}.sound-card{position:relative;min-height:154px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);font-family:var(--font);text-align:left;cursor:pointer;overflow:hidden;transition:transform .15s,border-color .15s,background .15s;touch-action:manipulation}.sound-card:hover{transform:translateY(-2px);border-color:rgba(150,112,245,.55)}.sound-card:active{transform:scale(.98)}.sound-card.playing{border-color:var(--category,var(--violet));background:linear-gradient(145deg,color-mix(in srgb,var(--category,var(--violet)) 11%,transparent),transparent 65%),var(--surface)}.sound-card.loading{cursor:wait}.sound-visual{height:79px;display:grid;place-items:center;border-radius:11px;background:color-mix(in srgb,var(--category,var(--violet)) 12%,var(--surface-2));font-size:30px}.sound-card.playing .sound-visual{animation:pulse 1.1s ease-in-out infinite}.sound-card strong{display:block;margin:11px 0 2px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sound-card small{display:block;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress{position:absolute;left:0;bottom:0;width:0;height:3px;background:var(--category,var(--violet))}.sound-card.playing .progress{animation:progress var(--duration,1s) linear forwards}.loader{width:22px;height:22px;border:2px solid rgba(255,255,255,.18);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.empty-state{padding:65px 20px;text-align:center;color:var(--muted)}.empty-state span{font-size:40px}.empty-state p{font-size:13px}.toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));z-index:10;max-width:calc(100% - 30px);padding:11px 15px;border:1px solid rgba(255,113,141,.35);border-radius:11px;background:#27212d;color:#fff;box-shadow:0 10px 35px rgba(0,0,0,.35);font-size:13px;transform:translateX(-50%)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{filter:brightness(1.2)}}@keyframes progress{to{width:100%}}@media(max-width:720px){.topbar,main{width:min(100% - 24px,1080px)}.topbar{height:66px}.brand img{width:36px;height:36px}.brand span{font-size:14px}.login-view{min-height:calc(100vh - 66px);padding-bottom:45px}.login-card{padding:27px 22px}.player-view{padding-top:27px}.player-heading{align-items:center}.player-heading h1{font-size:26px}.controls{grid-template-columns:1fr 1fr}.search{grid-column:1/-1}.volume-control{grid-column:1/-1}.sound-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sound-card{min-height:145px;padding:11px}.sound-visual{height:75px}.stop-button{padding:9px;font-size:0}.stop-button span{font-size:10px;margin:0}.stop-button:after{content:"Arrêter";font:600 12px var(--font);margin-left:6px}}@media(max-width:360px){.controls{grid-template-columns:1fr}.search,.volume-control{grid-column:auto}.sound-grid{grid-template-columns:1fr 1fr}}