/* Soft, touch-friendly controls shared by the three karaoke songs. */
:root{color-scheme:light;--ink:#193f45;--ink-soft:#4d6e70;--ink-dim:#66858a;--night:#f6fffc;--mantle:#dcf5f4;--panel:#fff;--gold:#087f82;--gold-dim:#b7dcda;--rose:#b65226;--paper:#f8fcf8;--line:#c8e3df;--green:#effbf7;--muted:#527475}
body.karaoke-bright{background:linear-gradient(#0000001a,#0000001a),radial-gradient(ellipse at 15% 10%,#d5f7ef,transparent 55%),linear-gradient(135deg,#f4fffb,#e5f5ff 55%,#fff1df);color:var(--ink);min-height:100vh;color-scheme:light}
.song-navigation{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px max(20px,env(safe-area-inset-right,0px)) 8px max(20px,env(safe-area-inset-left,0px));border-bottom:1px solid #c8e3df;background:linear-gradient(#0000001a,#0000001a),#ffffffa8;font:600 13px/1.5 system-ui,sans-serif}
.song-navigation a{display:inline-flex;align-items:center;min-height:44px;color:#205f63;text-decoration:none}
.song-navigation span{font-size:10px;letter-spacing:1px}
.wrap{max-width:1120px;gap:24px;padding-top:24px}
.karaoke-bright .player{background:linear-gradient(#0000001a,#0000001a),linear-gradient(145deg,#ffffff,#e7faf5 60%,#fff6e8);color:var(--ink);border:1px solid #b9deda;box-shadow:0 16px 45px #2c696610}
.karaoke-bright .p-head{display:block;padding:16px 16px 0}
.karaoke-bright .audio-toolbar{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.1fr) minmax(240px,1.2fr);align-items:start;gap:16px;position:relative;inset:auto;z-index:3;width:100%;margin:0;padding:16px;background:linear-gradient(#0000001a,#0000001a),#ffffffed;color:var(--ink);border:1px solid #bdded9;border-radius:14px;box-shadow:0 4px 14px #366b6508;box-sizing:border-box}
.karaoke-bright .audio-toolbar>*{min-width:0;margin:0;order:initial}
.control-label,.audio-track-control .setting-label{display:block;font:700 11px/1.4 system-ui,sans-serif!important;text-transform:uppercase;letter-spacing:1px;color:#527475!important;margin:0 0 9px!important}
.karaoke-bright .seg,.karaoke-bright .segments{display:flex;width:100%;max-width:none;gap:3px;background:#edf7f4;border:1px solid #bcded7;border-radius:12px;padding:3px}
.karaoke-bright .seg button,.karaoke-bright .segments button{flex:1;min-width:0;min-height:44px;padding:8px 7px;border:0;border-radius:9px;font-size:13px;line-height:1.4;color:#2d5a60;background:transparent}
.karaoke-bright .seg button[aria-pressed=true],.karaoke-bright .segments button.active{background:#0b7e80;color:white;box-shadow:0 2px 5px #166b6520}
.karaoke-bright button,.karaoke-bright .download-links a{color:#255a5f;border-color:#a8d0ca;background:#fff;min-height:44px}
.karaoke-bright button:hover{background:#dff4ec}
.karaoke-bright select,.karaoke-bright input[type=number]{background:#fff;color:#254f55;border:1px solid #9ac9c4;font-size:16px;min-height:48px}
.karaoke-bright .audio-track-control select{width:100%;border-radius:10px;padding:11px}
.karaoke-bright .vocal-mixer{width:100%;max-width:none;font-family:system-ui,sans-serif;color:#214d53}
.vocal-mixer>label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0;font:700 14px/1.4 system-ui,sans-serif}
.vocal-mixer output{background:#dff5e8;border:1px solid #a2d9bb;color:#176c50;padding:3px 9px;border-radius:8px;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.karaoke-bright .vocal-mixer input[type=range]{display:block;width:100%;max-width:none;min-width:0;height:44px;min-height:44px;margin:0;padding:0;border:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:pan-y}
.vocal-mixer input[type=range]::-webkit-slider-runnable-track{height:9px;border:1px solid #95c8bd;border-radius:8px;background:linear-gradient(to right,#12a69c 0%,#12a69c var(--mix-percent,50%),#dbeee9 var(--mix-percent,50%),#dbeee9 100%)}
.vocal-mixer input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;margin-top:-9px;background:#087f82;border:3px solid #fff;border-radius:50%;box-shadow:0 1px 5px #22685f60}
.vocal-mixer input[type=range]::-moz-range-track{height:9px;border:1px solid #95c8bd;border-radius:8px;background:#dbeee9}
.vocal-mixer input[type=range]::-moz-range-progress{height:9px;background:#12a69c;border-radius:8px}
.vocal-mixer input[type=range]::-moz-range-thumb{width:22px;height:22px;background:#087f82;border:3px solid #fff;border-radius:50%}
.vocal-scale{display:flex;justify-content:space-between;gap:8px;font:11px/1.4 system-ui,sans-serif;color:#527475;margin:-2px 0 9px}
.mix-actions{display:grid;grid-template-columns:minmax(80px,1.4fr) minmax(44px,.65fr) minmax(78px,1fr);gap:7px}
.mix-actions button{font:600 12px/1.3 system-ui,sans-serif!important;padding:8px!important;border:1px solid #accfc7!important;border-radius:9px}
.karaoke-bright #mix-play,.karaoke-bright #play,.karaoke-bright .primary,.karaoke-bright .start button{background:#087f82;color:#fff;border-color:#087f82}
.karaoke-bright #play svg{fill:#fff}
.karaoke-bright .mix-status{font-size:11px!important;line-height:1.5!important;opacity:1;color:#527475!important;margin:8px 0 0;min-height:17px}
.karaoke-bright .stage{grid-template-rows:auto auto minmax(320px,1fr) auto;min-height:calc(100svh - 60px);gap:18px;max-width:1200px;margin:auto;padding-top:18px}
.stage header h1{color:#245c62;font-size:26px}
.karaoke-bright .player .start{background:linear-gradient(#0000001a,#0000001a),#f1fffae6;backdrop-filter:blur(2px)}
.karaoke-bright .start small{color:#527475}
.karaoke-bright .eyebrow,.karaoke-bright .badge,.karaoke-bright .notes h2{color:#b05f24;opacity:1}
.karaoke-bright #prev,.karaoke-bright #next,.karaoke-bright .previous,.karaoke-bright .next{color:#53797c;opacity:1;text-shadow:none}
.karaoke-bright #cur{filter:none}
.karaoke-bright .current{color:#096b71}
.karaoke-bright .time,.karaoke-bright .cue,.karaoke-bright .player-top,.karaoke-bright .timing-note,.karaoke-bright .fine-controls{color:#476f73}
.karaoke-bright .player-top{padding-bottom:15px}
.karaoke-bright .lyric-stage.scenic{background:#d7e2dd;border-color:#b8ddd6}
.karaoke-bright .scenic canvas{opacity:.3}
.karaoke-bright .scene-shade{background:linear-gradient(180deg,#f7fff95c,#f5fffbab 40%,#f5fffb80 70%,#e4f5ed38)}
.karaoke-bright .scenic .current{color:#105e68;text-shadow:none}
.karaoke-bright .scene-caption,.karaoke-bright .scenic .cue{color:#426f70}
.karaoke-bright .scene-controls button{background:#fff;color:#285c5c;border-color:#a7cdc1}
.karaoke-bright .intro .latin-title,.karaoke-bright .intro p,.karaoke-bright .notes p,.karaoke-bright .foot{color:#4d6e70}
.karaoke-bright .foot a{color:#276367;background:#ffffff9c;border-color:#b8d7cd}
.karaoke-bright .fine-controls{margin-top:20px;padding-top:16px;border-top:1px solid #bcd9d2}
.karaoke-bright #cur.waiting,.karaoke-bright #current.waiting{color:#117b80!important;animation:waiting-glow 3s ease-in-out infinite}
.waiting::after{content:'•••';display:block;font:700 20px/1.2 system-ui,sans-serif;letter-spacing:9px;color:#b96727;animation:waiting-dots 1.8s ease-in-out infinite;margin-top:14px}
.waiting .count{color:#087f82;animation:none;font-variant-numeric:tabular-nums}
@keyframes waiting-glow{0%,100%{opacity:.65;text-shadow:0 0 0 transparent;transform:translateY(0)}50%{opacity:1;text-shadow:0 0 18px #32aa9e40;transform:translateY(-2px)}}
@keyframes waiting-dots{0%,100%{opacity:.25;letter-spacing:6px}50%{opacity:1;letter-spacing:10px}}
@media(min-width:900px){.karaoke-bright .lyrics{min-height:620px;padding-inline:50px}.karaoke-bright .player:has(.lyrics){grid-template-rows:auto minmax(620px,1fr) auto}.karaoke-bright #cur{font-size:48px}.karaoke-bright .stage .lyrics{min-height:620px}}
@media(max-width:1000px){.karaoke-bright .audio-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}.karaoke-bright .audio-toolbar .vocal-mixer{grid-column:1/-1}.mix-actions{grid-template-columns:minmax(90px,1.4fr) minmax(50px,.65fr) minmax(85px,1fr)}}
@media(max-width:600px){.song-navigation{padding-inline:14px}.song-navigation span{display:none}.wrap{padding:18px 10px 28px;gap:18px}.karaoke-bright .p-head{padding:10px 10px 0}.karaoke-bright .audio-toolbar{grid-template-columns:minmax(0,1fr);padding:12px;gap:12px}.karaoke-bright .audio-toolbar .vocal-mixer{grid-column:auto}.karaoke-bright .audio-toolbar .audio-track-control{width:auto}.control-label,.audio-track-control .setting-label{margin-bottom:5px!important}.karaoke-bright .seg button,.karaoke-bright .segments button{font-size:14px}.karaoke-bright .lyrics{min-height:310px;padding:24px 14px}.karaoke-bright .player:has(.lyrics){grid-template-rows:auto minmax(310px,1fr) auto}.karaoke-bright .stage{padding-inline:12px;gap:14px}.stage header h1{font-size:21px}.karaoke-bright .intro h1{font-size:29px}.karaoke-bright .mix-status{font-size:12px!important}.mix-actions button{font-size:13px!important}.karaoke-bright .player{padding:16px 12px}.karaoke-bright .wrap .player{padding:0}.karaoke-bright .lyric-stage.scenic{min-height:350px}.waiting::after{font-size:18px}}
@media(prefers-reduced-motion:reduce){.karaoke-bright .waiting,.waiting::after{animation:none!important}.waiting::after{opacity:.65}}

.karaoke-bright #cur.interlude{font-size:20px!important;letter-spacing:.22em}
@media(max-width:600px){.karaoke-bright #cur.interlude{font-size:16px!important}}

/* Larger rewind and forward controls, with room for a thumb on phones. */
.karaoke-bright #nudges{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;width:100%;max-width:620px;margin:12px auto 0}
.karaoke-bright .stage #nudges{grid-template-columns:repeat(3,minmax(0,1fr))}
.karaoke-bright #nudges>button,.karaoke-bright .transport>button{min-height:68px;min-width:0;padding:14px 20px;font:700 20px/1.3 system-ui,sans-serif;border:2px solid #8cbbb5;box-shadow:0 3px 8px #2866600d}
.karaoke-bright #nudges>button:hover,.karaoke-bright .transport>button:hover{background:#d7f2e9;border-color:#087f82}
@media(max-width:600px){.karaoke-bright #nudges{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.karaoke-bright .stage #nudges{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.karaoke-bright #nudges>button,.karaoke-bright .transport>button{min-height:64px;padding:12px 8px;font-size:20px}}

/* Yellow follows the sung words; dark lettering stays readable on the light stage. */
.karaoke-bright #cur .w{background:linear-gradient(90deg,#ffe15b var(--p),transparent var(--p));-webkit-background-clip:border-box;background-clip:border-box;color:#244e52;padding:.04em .06em;border-radius:.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.karaoke-bright .current.singing{background:#ffe15b;color:#244e52;text-shadow:none;border-radius:10px;padding:4px 12px}
.karaoke-bright .lyric-row.active{background:#fff0a1;color:#244e52}

/* Keep one complete title in the selected script, including on small phones. */
.karaoke-bright #song-title{width:100%;max-width:100%;min-width:0;margin:0;white-space:nowrap;text-wrap:nowrap;font:700 clamp(26px,4.2vw,48px)/1.45 Manjari,"Noto Sans Malayalam",sans-serif;letter-spacing:0;color:#245c62}
.karaoke-bright #song-title[lang=en]{font-family:Manrope,system-ui,sans-serif}
.karaoke-bright #song-title>span{display:inline-block;white-space:nowrap}
.karaoke-bright #nudges>button,.karaoke-bright .transport>button:has(.seek-icon){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.karaoke-bright .seek-icon{font:800 26px/1 monospace;letter-spacing:-3px;padding-right:3px}
.karaoke-bright .seek-seconds{font:700 12px/1.2 system-ui,sans-serif}