@font-face{font-family:'SC Roboto';src:url('fonts/Roboto-Regular.ttf') format('truetype');font-weight:400}@font-face{font-family:'SC Roboto';src:url('fonts/Roboto-Bold.ttf') format('truetype');font-weight:700}*{box-sizing:border-box}html,body{height:100%;width:100%;margin:0;overflow:hidden;background:#102b20;font-family:'SC Roboto',Arial,sans-serif}#player-stage{position:fixed;inset:0}#player-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#102b20}#player-stage iframe.preparing{opacity:0;pointer-events:none}.player-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(90vw,620px);padding:36px;background:#f9fcf8;border-radius:24px;text-align:center;color:#173c29;box-shadow:0 16px 80px #0003}.player-panel img{max-width:260px;width:65%;margin:0 auto 20px}.player-panel h1{font-size:32px;margin:6px 0 18px}.player-panel p{font-size:19px;line-height:1.5}.player-panel button{display:block;margin:18px auto 0;padding:14px 24px;border:0;border-radius:12px;background:#08794b;color:#fff;font:600 18px 'SC Roboto',Arial;cursor:pointer}.player-panel button:disabled{opacity:.5}.player-panel label{display:block;text-align:left;font-weight:700;margin:22px 0 8px}.player-panel input{display:block;width:100%;font:28px monospace;text-align:center;letter-spacing:.12em;text-transform:uppercase;padding:14px;border:1px solid #9db5a6;border-radius:12px}.player-panel .player-small{font-size:13px;color:#526c5b}[hidden]{display:none!important}

.player-panel.is-idle{background:transparent;box-shadow:none;color:#f5faf6;width:min(90vw,1100px)}.is-idle h1{font-size:clamp(24px,3vw,48px)}.is-idle img{max-width:340px;max-height:30vh;object-fit:contain}.is-idle .player-small{display:none}.is-idle #player-fullscreen{opacity:0}.is-idle:hover #player-fullscreen,.is-idle:focus-within #player-fullscreen{opacity:1}

/* Shared narrow footer. Clock and ticker occupy the same row at the bottom. */
:root{--screen-bar-bg:#101b19;--screen-bar-accent:#f4cb28;--screen-bar-height:clamp(40px,7.5vmin,120px)}
#screen-ticker{position:fixed;bottom:0;left:0;right:0;height:var(--screen-bar-height);z-index:10;background:var(--screen-bar-bg);color:#fff;border-top:2px solid var(--screen-bar-accent);display:flex;align-items:center;justify-content:flex-start;overflow:hidden;font-size:clamp(20px,3.5vmin,56px);font-weight:400;line-height:1.2}
#screen-ticker span{display:block;flex:none;white-space:nowrap;padding:0 16px}
#screen-ticker[data-motion="scroll"] span{animation:screen-ticker var(--ticker-duration,30s) linear infinite;will-change:transform}
@keyframes screen-ticker{from{transform:translateX(var(--ticker-start,100vw))}to{transform:translateX(-100%)}}
#screen-clock{position:fixed;width:34vw;height:var(--screen-bar-height);padding:0 1.5vw;background:var(--screen-bar-bg);color:#fff;border-top:2px solid var(--screen-bar-accent);z-index:11;font:400 clamp(14px,2.5vmin,40px)/1.15 'SC Roboto',Arial,sans-serif;display:flex;align-items:center;justify-content:center;gap:1.5vw;box-sizing:border-box}
#screen-clock:before{content:'';position:absolute;left:0;top:20%;bottom:20%;border-left:1px solid #ffffff70}
#screen-clock[data-position$="left"]:before{left:auto;right:0}
#screen-clock strong{color:var(--screen-bar-accent);font-size:1.3em;white-space:nowrap}#screen-clock span{text-align:left;overflow-wrap:normal}#screen-clock [hidden],#screen-clock[hidden]{display:none!important}
@media(orientation:portrait){:root{--screen-bar-height:clamp(54px,8vmin,120px)}#screen-clock{width:36vw;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;font-size:clamp(12px,2.4vmin,30px);padding:0 2vw}#screen-clock span{font-size:.85em}#screen-clock strong{font-size:1.2em}}

/* Pairing stays readable at TV viewing distance and within small TV viewports. */
#player-pair{width:min(92vw,820px);max-height:94vh;overflow:auto;padding:clamp(16px,3vh,32px)}
#player-pair>img{width:190px;margin:0 auto 10px}#player-pair h1{margin:0 0 8px;font-size:clamp(24px,3.8vh,36px)}
#player-pair p{margin:10px 0;font-size:clamp(15px,2.5vh,20px);line-height:1.35}
#player-pair button{margin-top:12px;padding:12px 22px}#player-pair label{margin-top:14px}
.pair-code-card{margin:18px 0 10px;padding:16px;background:#e7f5ed;border:2px solid #138052;border-radius:18px}
.pair-code-label{display:block;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
#reverse-code{display:block;font:700 clamp(34px,6vw,64px)/1.2 monospace;letter-spacing:.1em;white-space:nowrap;margin:8px 0}
#player-pair .pair-help{font-size:clamp(14px,2.3vh,18px)}#player-pair .pair-secondary{background:#e2ebe5;color:#173c29;font-size:16px}
.pair-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.pair-actions button{margin-left:0;margin-right:0}
.player-panel button:focus-visible,.player-panel input:focus-visible{outline:4px solid #e3ac00;outline-offset:3px}
.pair-success{position:fixed;z-index:100;top:4vh;left:50%;transform:translateX(-50%);width:min(90vw,700px);padding:24px;background:#edf9f0;color:#134c2c;border:3px solid #21965a;border-radius:18px;box-shadow:0 8px 40px #0004;text-align:center;font-size:20px}
.pair-success strong{display:block;font-size:30px;margin-bottom:8px}.pair-success span{display:block;margin-top:6px}
@media(max-height:600px){#player-pair{padding:16px 24px}#player-pair>img{width:150px;max-height:36px;margin-bottom:6px}#player-pair h1{font-size:24px;margin-bottom:6px}#player-pair p{font-size:14px;margin:6px 0}#player-pair button{font-size:15px;padding:9px 18px;margin-top:8px}.pair-code-card{padding:10px;margin:12px 0 8px}.pair-code-label{font-size:13px}#reverse-code{font-size:44px;margin:5px 0}#player-pair .pair-help{font-size:14px}#player-pair .pair-secondary{font-size:14px}.pair-success{padding:16px;font-size:17px}.pair-success strong{font-size:24px}}
