*{box-sizing:border-box}html,body,#root{color:#fff;background:#020617;width:100%;height:100%;margin:0;font-family:Inter,Arial,sans-serif;overflow:hidden}.screen-root{width:100%;height:100%;position:relative;overflow:hidden}.media-zone{position:absolute;overflow:hidden}.base-media,.base-media img,.base-media video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.widget{color:#fff;text-shadow:0 2px 8px #000b;place-items:center;font-size:clamp(14px,2.2vw,48px);display:grid;position:absolute;overflow:hidden}.widget img,.widget svg{object-fit:contain;max-width:100%;max-height:100%}.digital-clock{font-variant-numeric:tabular-nums;font-weight:800}.analog-clock{aspect-ratio:1;background:#0004;border:.08em solid;border-radius:50%;width:min(100%,100vh);position:relative}.hand{transform-origin:50% 100%;background:currentColor;border-radius:1em;width:2%;height:31%;position:absolute;bottom:50%;left:49%}.hand.hour{height:23%}.hand.second{background:#ef4444;width:1%}.pairing,.loading,.empty-program{text-align:center;background:radial-gradient(circle at 50% 30%,#123c5a,#020617 55%);place-content:center;justify-items:center;gap:1.4rem;width:100%;height:100%;display:grid}.pairing p,.pairing small,.empty-program span{color:#9cb1c4}.mark{letter-spacing:.08em;font-size:clamp(20px,3vw,42px);font-weight:900}.mark strong{color:#2dd4bf}.pair-code{letter-spacing:.12em;font-variant-numeric:tabular-nums;background:#07111fcc;border:2px solid #2dd4bf;border-radius:.3em;padding:.7em 1em;font-size:clamp(44px,9vw,120px);font-weight:800;box-shadow:0 0 80px #2dd4bf22}.spinner{border:5px solid #1a354c;border-top-color:#2dd4bf;border-radius:50%;width:54px;height:54px;animation:1s linear infinite spin}.offline-dot{z-index:9000;background:#f59e0b;border-radius:50%;width:12px;height:12px;position:absolute;bottom:10px;right:10px;box-shadow:0 0 0 4px #0007}.emergency{z-index:10000;text-align:center;place-content:center;justify-items:center;padding:6vw;animation:.35s ease-out emergency-in;display:grid;position:absolute;inset:0}.emergency>span{font-size:clamp(70px,14vw,240px);line-height:.8}.emergency h1{text-transform:uppercase;margin:.35em 0 .2em;font-size:clamp(40px,7vw,120px)}.emergency p{max-width:80vw;margin:0 0 1em;font-size:clamp(22px,3.4vw,64px)}.emergency small{letter-spacing:.2em;font-weight:800}@keyframes spin{to{transform:rotate(360deg)}}@keyframes emergency-in{0%{opacity:0;transform:scale(1.03)}}