:root{--bg-gradient:oklch(17.5% 0 0);--text-primary:#fff;--text-secondary:#fffc;--accent-color:#b9edff;--accent-hover:#9adcf5;--glass-bg:#0006;--glass-border:#ffffff1a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background:var(--bg-gradient);width:100vw;height:100vh;font-family:Noto Sans Thai Looped,Inter,sans-serif;overflow:hidden}.app-background{z-index:-1;background:radial-gradient(circle at 50% 120%,#3b82f626 0%,#0000 60%);width:100vw;height:100vh;position:fixed;top:0;left:0}.overlay{width:100vw;height:100vh;transition:opacity .5s;position:absolute;top:0;left:0}.flex-center{flex-direction:column;justify-content:center;align-items:center;display:flex}.hidden{opacity:0;pointer-events:none;display:none!important}#splash-screen{z-index:100;background:0 0}.splash-content{text-align:center;flex-direction:column;align-items:center;display:flex}.app-logo{width:240px;height:auto;margin-bottom:.5rem}.splash-content h1{letter-spacing:-.05em;color:#fff;margin-bottom:2.5rem;font-size:3rem;font-weight:900}.start-button{background:var(--text-primary);color:#000;cursor:pointer;border:none;border-radius:50px;align-items:center;gap:.75rem;padding:1rem 2.5rem;font-size:1.25rem;font-weight:700;transition:transform .2s,box-shadow .2s;display:inline-flex}.start-button:hover{transform:scale(1.05);box-shadow:0 10px 25px #fff3}.footer-text{text-align:center;color:#ffffff4d;width:100%;font-size:10px;position:absolute;bottom:24px}@media (width>=640px){.footer-text{font-size:12px}}.icon-button:active{transform:scale(.95)}.mute-button.muted{background:#ef444426;border-color:#ef444466}.top-bar{z-index:10;justify-content:space-between;align-items:center;width:100%;padding:1.5rem 2rem;transition:opacity .5s,transform .5s;display:flex;position:absolute;top:0;left:0}.top-bar.inactive{opacity:0;pointer-events:none;transform:translateY(-20px)}.top-controls{align-items:center;gap:.5rem;display:flex}.language-toggle{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:30px;align-items:center;gap:1rem;padding:.5rem 1rem;display:flex}.lang-label{color:var(--text-secondary);font-size:1rem;font-weight:600}.lang-label.active{color:var(--text-primary)}.icon-button{color:var(--text-primary);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:50%;justify-content:center;align-items:center;padding:.6rem;transition:background .2s,color .2s,transform .2s,border-color .2s;display:flex}.icon-button:hover{color:var(--text-primary);background:#ffffff1a;transform:scale(1.05)}#fullscreen-btn{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:50%;padding:.75rem}.subtitles-container{text-align:center;pointer-events:none;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;padding:3rem 3rem 5rem;display:flex;position:absolute;bottom:0;left:0}.lyrics-history{flex-direction:column;align-items:center;gap:1.5rem;width:100%;margin-bottom:2rem;display:flex}.lyric-block{flex-direction:column;align-items:center;width:100%;transition:all .6s cubic-bezier(.2,.8,.2,1);display:flex}.history-item{transform-origin:bottom;transform:translateY(0)scale(.85)}.lyrics-history .lyric-block:last-child{opacity:.5}.lyrics-history .lyric-block:nth-last-child(2){opacity:.25;filter:blur(1px)}.lyrics-history .lyric-block:nth-last-child(3){opacity:.1;filter:blur(2px)}.lyrics-history .lyric-block:nth-last-child(n+4){display:none}.active-lyric{opacity:1;transform:translateY(0)scale(1)}.original-text{color:var(--text-secondary);text-wrap:balance;text-shadow:0 2px 10px #000c;max-width:90%;min-height:2rem;margin-bottom:.5rem;font-size:1.75rem;font-weight:500;line-height:1.5;transition:opacity .3s}.translated-text{color:var(--text-primary);text-wrap:balance;letter-spacing:-.01em;text-shadow:0 4px 20px #000000f2;max-width:90%;min-height:4.4rem;padding-bottom:.2rem;font-size:3.8rem;font-weight:900;line-height:1.45;transition:opacity .3s}.interim{opacity:.4!important}.visualizer{justify-content:center;align-items:center;gap:6px;height:40px;margin-bottom:2rem;transition:opacity .3s;display:flex}.visualizer .bar{background:var(--accent-color);border-radius:3px;width:6px;animation:0s linear -800ms infinite alternate sound}.visualizer .bar:first-child{height:10px;animation-duration:.474s}.visualizer .bar:nth-child(2){height:20px;animation-duration:.433s}.visualizer .bar:nth-child(3){height:30px;animation-duration:.407s}.visualizer .bar:nth-child(4){height:15px;animation-duration:.458s}@keyframes sound{0%{opacity:.35;height:6px}to{opacity:1;height:30px}}.loader{gap:.5rem;margin-top:1rem;display:flex;position:absolute;bottom:2rem}.dot{background-color:var(--text-secondary);border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite both bounce}.dot:first-child{animation-delay:-.32s}.dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@media (width<=768px){.subtitles-container{padding:1.5rem 1.5rem 3rem}.original-text{font-size:1.25rem}.translated-text{font-size:2.5rem}.top-bar{padding:1rem}}