*{box-sizing:border-box}body{margin:0;background:#071b15;color:#f0fff9;font-family:Arial,sans-serif}button,input{font:inherit;border-radius:8px;padding:12px;border:1px solid #47755f}button{cursor:pointer;background:#b0f7c9;color:#102c20;font-weight:bold}button:focus-visible,input:focus-visible{outline:4px solid #ffd75e}[hidden]{display:none!important}#gate{min-height:100vh;display:grid;place-items:center}form{width:min(420px,90vw);padding:28px;border:1px solid #47755f;border-radius:16px}label,input{display:block;width:100%;margin:14px 0}input{font-size:32px;letter-spacing:12px;text-align:center}form button{width:100%}#error{color:#ffb1a1}small{color:#b4c9c0}#screen{height:100vh;display:grid;grid-template-columns:80% 20%;overflow:hidden}#advert{position:relative;background:#000;min-width:0}#player,#player iframe{width:100%;height:100%;border:0}#player{display:grid;place-items:center;color:#bbb;text-align:center}#controls{position:absolute;bottom:16px;left:16px;right:16px;display:flex;gap:8px;opacity:0;transition:opacity .2s}#advert:hover #controls,#controls:focus-within,#controls.visible{opacity:1}aside{display:flex;flex-direction:column;min-width:0;padding:12px;background:#10372a}header{padding-bottom:10px;border-bottom:1px solid #32644e}header h1{font-size:clamp(20px,2.2vw,40px);margin:0 0 6px}#status,footer{font-size:clamp(11px,1vw,18px);color:#a8c6b9}#children{flex:1;overflow:auto;scrollbar-width:none}.child{padding:14px 3px;border-bottom:1px solid #32644e}.name{font-size:clamp(16px,1.7vw,32px);overflow-wrap:anywhere}.age{font-size:clamp(11px,1vw,18px);color:#bdd6c9}.timer{font-size:clamp(28px,3.3vw,64px);font-variant-numeric:tabular-nums;font-weight:bold;color:#a9ffb9}.expired .timer{color:#ff9c87}.warning .timer{color:#ffe28c}footer{padding-top:8px}.offline #status{color:#ffd28a}
/* Fixed viewport: only the participant list is scrollable. */
html,body{width:100%;height:100%;overflow:hidden}
#gate{height:100%;min-height:0;overflow-y:auto}
#screen{height:100vh;height:100dvh;max-height:100%;grid-template-rows:minmax(0,1fr)}
#advert,#player,aside{min-height:0;overflow:hidden}
aside{height:100%;max-height:100%}
aside>header,aside>footer{flex-shrink:0}
#children{flex:1 1 0%;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:auto;scrollbar-color:#81b99c #09291e;scrollbar-gutter:stable;outline-offset:-3px}
#children:focus-visible{outline:3px solid #ffd75e}
#children::-webkit-scrollbar{width:10px}
#children::-webkit-scrollbar-track{background:#09291e}
#children::-webkit-scrollbar-thumb{background:#81b99c;border-radius:8px}
.child{border-left:5px solid #70e6a0;padding:12px 8px;margin:8px 0;background:#123d2c;border-radius:8px}
.child.warning{border-left-color:#ffd34e;background:#493b11}
.child.warning .timer,.child.warning .time-label{color:#ffe079}
.child.expired{border-left-color:#ff6868;background:#501e24}
.child.expired .timer,.child.expired .time-label{color:#ff9999}
.time-label{font-size:clamp(11px,1vw,18px);color:#b8dec8;font-weight:bold;overflow-wrap:anywhere}