:root{font-family:"Avenir Next",Avenir,"Segoe UI",system-ui,sans-serif;color-scheme:dark;background:#070a0c;color:#fff;--panel:#11181d;--line:#29343c;--muted:#98a5ad}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:#070a0c;color:#fff;overscroll-behavior:none}body{min-height:100dvh}.controller{width:min(100%,620px);min-width:0;min-height:100dvh;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:grid;grid-template-rows:auto auto minmax(180px,1fr) auto auto auto auto;gap:10px}.controller header{display:flex;align-items:center;justify-content:space-between;min-height:38px}.controller header a{color:#fff;font-size:.68rem;font-weight:900;letter-spacing:.12em;text-decoration:none}.connection{color:var(--muted);font-size:.72rem}.connection.online{color:#6cdb9c}.connection.offline{color:#f18b80}.current-card{min-width:0;display:grid;grid-template-columns:1fr auto;gap:7px 10px;padding:12px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.presentation-name{margin:0;color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.current-card h1{margin:2px 0 0;font-size:clamp(1.1rem,5vw,1.55rem)}.mode-badge{align-self:start;padding:.35rem .55rem;border-radius:99px;background:#fff;color:#050505;font-size:.66rem;font-weight:950;letter-spacing:.08em}.preview-frame{position:relative;grid-column:1/-1;min-width:0;min-height:0;height:clamp(88px,18vh,155px);overflow:hidden;border-radius:10px;background:#000}.preview-frame img,.preview-frame video{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;min-width:0;min-height:0;object-fit:contain}.caption-preview{grid-column:1/-1;display:-webkit-box;overflow:hidden;margin:0;color:#dce2e5;font-size:clamp(.8rem,3.3vw,1rem);line-height:1.35;-webkit-line-clamp:3;-webkit-box-orient:vertical}.next-button,.play-button,.secondary-controls button,.reset-button{border:1px solid transparent;border-radius:15px;font-weight:950;letter-spacing:.04em;touch-action:manipulation;user-select:none}.next-button{width:100%;min-height:180px;background:linear-gradient(150deg,#ffc45f,#dd8e17);color:#211303;font-size:clamp(3rem,15vw,6rem);box-shadow:inset 0 1px #fff7,0 14px 40px #d88b1938}.next-button:active:not(:disabled){transform:scale(.987);background:#ffd07d}.next-button.end{background:#252e34;color:#76828a;box-shadow:none}.play-button{width:100%;min-height:74px;background:linear-gradient(150deg,#63e6ac,#20a86c);color:#031d12;font-size:clamp(1.25rem,6vw,2rem);box-shadow:inset 0 1px #fff7}.play-button:active:not(:disabled){transform:scale(.987)}.secondary-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}.secondary-controls button{min-height:68px;background:#1a242b;border-color:#33414b;color:#fff;font-size:clamp(1rem,4vw,1.3rem)}#black-button{background:#020303;border-color:#4b555a}.reset-button{min-height:50px;background:transparent;border-color:#344049;color:#b7c1c7;font-size:.8rem}.controller button:disabled{opacity:.42}.controller button.busy{filter:saturate(.5);pointer-events:none}.controller-message{min-height:18px;margin:0;text-align:center;color:var(--muted);font-size:.72rem}@media(min-height:850px){.controller{gap:13px}.next-button{min-height:260px}}@media(orientation:landscape) and (max-height:600px){.controller{width:100%;grid-template-columns:minmax(200px,.6fr) 1fr;grid-template-rows:auto 1fr auto auto auto;gap:8px}.controller header{grid-column:1/-1}.current-card{grid-column:1;grid-row:2/5}.preview-frame{height:30vh}.next-button{grid-column:2;grid-row:2;min-height:150px}.play-button{grid-column:2;grid-row:3;min-height:56px}.secondary-controls{grid-column:2;grid-row:4}.reset-button{grid-column:1/-1;grid-row:5;min-height:42px}.controller-message{display:none}}
.slide-previews{grid-column:1/-1;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.preview-panel{min-width:0;display:flex;flex-direction:column;gap:7px}.preview-label{margin:0;color:var(--muted);font-size:.72rem;line-height:1.35;font-weight:850;letter-spacing:.06em;text-transform:uppercase}.upcoming-panel .preview-label{color:#ffc45f}.preview-empty{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:12px;color:var(--muted);text-align:center;font-size:.8rem;line-height:1.4}.preview-empty[hidden]{display:none}.preview-panel .caption-preview[hidden]{display:none}
.lyrics-button{grid-column:1/-1;min-height:48px;padding:.65rem 1rem;border:1px solid #b97b23;border-radius:10px;background:#332613;color:#ffd18a;font:inherit;font-size:1rem;font-weight:850;cursor:pointer}.lyrics-button[hidden]{display:none}
html.lyrics-open,html.lyrics-open body{overflow:hidden}
.lyrics-dialog{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));border:0;border-radius:0;overflow:hidden;background:#11181d;color:#fff}
.lyrics-dialog::backdrop{background:#11181d}.lyrics-dialog[open]{display:flex;flex-direction:column;gap:12px}
.lyrics-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;min-width:0}.lyrics-header h2{min-width:0;margin:0;color:#aab8c2;font-size:clamp(1rem,2.2vw,1.4rem);line-height:1.2}
.lyrics-close{flex-shrink:0;min-height:44px;padding:.5rem 1rem;border:1px solid #596771;border-radius:10px;background:#26333d;color:#fff;font:inherit;font-size:1rem;font-weight:800;cursor:pointer}
.lyrics-text{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;min-height:0;overflow:hidden}
.lyrics-content{width:100%;flex-shrink:0;font-size:clamp(18px,min(4vw,6dvh),90px);font-weight:650;line-height:1.16;text-align:center;overflow-wrap:anywhere;text-wrap:balance}
.lyrics-content p{margin:0}.lyrics-content p+p{margin-top:.7em}
.lyrics-button:focus-visible,.lyrics-close:focus-visible{outline:3px solid #ffc45f;outline-offset:-3px}