:root{--player-accent: var(--gold);--player-accent-bright: var(--gold-bright);--player-glow: var(--gold-glow);--player-track: rgba(255, 255, 255, .07);--player-muted: var(--text-3);--player-active-bg: rgba(212, 162, 74, .06);--player-ink: var(--bg)}.player-row{margin-top:.75rem}.player-play{width:44px;height:44px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-full);color:var(--player-ink);background:linear-gradient(135deg,var(--player-accent),var(--player-accent-bright));transition:transform .18s ease,box-shadow .18s ease}@media (min-width: 768px){.player-play{width:38px;height:38px}}.player-play-lg{width:44px;height:44px}.player-play:hover{transform:scale(1.08);box-shadow:0 0 0 7px var(--player-glow)}.player-play:active{transform:scale(.96)}.player-play:focus-visible,.player-chip:focus-visible,.player-track:focus-visible,.player-retry:focus-visible,.player-speed-option:focus-visible{outline:2px solid var(--player-accent);outline-offset:2px}.player-spin{animation:player-spin .9s linear infinite}@keyframes player-spin{to{transform:rotate(360deg)}}.player-track{position:relative;padding-block:8px;touch-action:none}.player-track-rail{position:relative;height:5px;border-radius:var(--r-full);background:var(--player-track);transition:height .18s ease}.player-track:hover .player-track-rail,.player-track.is-dragging .player-track-rail,.player-track-md .player-track-rail{height:7px}.player-track-fill{height:100%;border-radius:var(--r-full);background:linear-gradient(90deg,var(--player-accent),var(--player-accent-bright))}.player-track-thumb{position:absolute;top:50%;width:12px;height:12px;margin-left:-6px;border-radius:var(--r-full);background:var(--player-accent-bright);transform:translateY(-50%) scale(0);transition:transform .15s ease}.player-track:hover .player-track-thumb,.player-track:focus-visible .player-track-thumb,.player-track.is-dragging .player-track-thumb{transform:translateY(-50%) scale(1)}.player-times{display:flex;justify-content:space-between;font-size:10.5px;line-height:1.2;color:var(--player-muted);font-variant-numeric:tabular-nums}.player-chip{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.25rem;min-width:34px;height:30px;padding-inline:.5rem;border-radius:var(--r-sm);font-size:11px;font-variant-numeric:tabular-nums;color:var(--player-muted);background:#ffffff0a;border:1px solid rgba(255,255,255,.07);transition:color .18s ease,border-color .18s ease,background .18s ease}.player-chip:hover{color:var(--player-accent-bright);border-color:#d4a24a66}.player-chip.is-on{color:var(--player-accent);border-color:#d4a24a73;background:var(--player-active-bg)}.player-chip-wide{padding-inline:.7rem}@media (max-width: 767px){.player-chip{min-width:44px;height:44px}}.player-repeat-badge{position:absolute;top:-5px;right:-5px;min-width:15px;height:15px;padding-inline:3px;border-radius:var(--r-full);font-size:9px;line-height:15px;font-weight:700;color:var(--player-ink);background:var(--player-accent)}.player-credit{display:flex;align-items:center;gap:.3rem;margin-top:.4rem;font-size:10.5px;color:var(--player-muted)}.player-error{font-size:11.5px;color:var(--player-muted)}.player-retry{color:var(--player-accent);text-decoration:underline}.player-speed-popup{position:absolute;right:0;bottom:calc(100% + 6px);z-index:40;min-width:132px;padding:4px;border-radius:var(--r-md);background:var(--surface);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px #00000073}.player-speed-list,.player-sheet-list{display:flex;flex-direction:column;gap:2px}.player-speed-option{width:100%;display:flex;align-items:baseline;gap:.4rem;padding:7px 9px;border-radius:var(--r-sm);font-size:12px;color:hsl(var(--foreground));text-align:left}.player-speed-option:hover{background:#ffffff0d}.player-speed-option.is-active{color:var(--player-accent);background:var(--player-active-bg);font-weight:600}.player-speed-hint{font-size:9.5px;color:var(--player-muted)}.player-sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#00000080;display:flex;align-items:flex-end}.player-sheet{width:100%;padding:16px 16px calc(16px + env(safe-area-inset-bottom));border-radius:var(--r-xl) var(--r-xl) 0 0;background:var(--surface);border-top:1px solid rgba(255,255,255,.08)}.player-sheet-title{font-size:12px;color:var(--player-muted);margin-bottom:8px}.player-sheet .player-speed-option{padding:13px 10px;font-size:14px}.player-bar{position:sticky;top:12px;z-index:30;padding:12px 14px;border-radius:var(--r-lg);background:#0a1410c7;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.07)}.player-bar-title{font-size:14px;font-weight:600;color:hsl(var(--foreground))}.player-bar-meta{font-size:11px;color:var(--player-muted)}.mini-player{position:fixed;left:0;right:0;bottom:0;z-index:50;padding-bottom:env(safe-area-inset-bottom);background:#0a1410db;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid rgba(255,255,255,.08)}@media (min-width: 1024px){.mini-player{top:64px;bottom:auto;border-top:0;border-bottom:1px solid var(--border-line);box-shadow:var(--sh-2)}}.player-btn-primary{flex-shrink:0;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-full);background:var(--player-accent);color:var(--player-ink);box-shadow:0 4px 14px #d4a24a47}.player-btn-ghost{position:relative;flex-shrink:0;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-md);color:var(--player-muted);transition:color .18s ease,background .18s ease}.player-btn-ghost:hover{color:var(--player-accent-bright);background:#ffffff0d}.action-btn{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:48px;padding:9px 4px;border-radius:var(--r-md);font-size:9.5px;color:var(--player-muted);transition:color .18s ease,background .18s ease}.action-btn:hover{color:var(--player-accent-bright);background:#ffffff0a}.ayah-tool{position:relative;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-sm);color:var(--player-muted);transition:color .18s ease,background .18s ease}.ayah-tool:after{content:"";position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px}.ayah-tool:hover{color:var(--player-accent-bright);background:#ffffff0d}.sheet-mobile{border-radius:var(--r-xl) var(--r-xl) 0 0;padding-bottom:calc(1.25rem + env(safe-area-inset-bottom));max-height:80vh;overflow-y:auto}.sheet-handle{display:block;width:38px;height:4px;margin:0 auto 10px;border-radius:var(--r-full);background:#ffffff2e}.ayah-card{position:relative;transition:background .25s ease,border-color .25s ease}.ayah-card.is-active{background:var(--player-active-bg);border-color:#d4a24a66}.ayah-card.is-active:before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:var(--r-full);background:linear-gradient(180deg,var(--player-accent),var(--player-accent-bright))}@media (prefers-reduced-motion: reduce){.player-play:hover,.player-play:active{transform:none}.player-track-rail,.player-track-thumb,.ayah-card{transition:none}.player-spin{animation:none}}
