:root{color-scheme:light;--ink:#202723;--muted:#717a74;--green:#456d53;--paper:#f3f4ef;font-family:Inter,"Segoe UI",Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}.shell{max-width:1168px;margin:auto;padding:0 40px}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce0d8}.brand{color:var(--ink);font-size:23px;font-weight:800;letter-spacing:-1px;text-decoration:none;display:flex;align-items:center}.brand>span:last-child{font-weight:400}.brand-icon{font-size:29px;color:var(--green);margin-right:10px;line-height:1}.site-name{color:var(--muted);font-size:13px;letter-spacing:.04em}.intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:54px 0 29px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:.19em;color:var(--green);margin:0 0 12px}h1{font-size:clamp(28px,4vw,42px);font-weight:500;letter-spacing:-1.5px;line-height:1.15;margin:0}.status{flex-shrink:0;border:1px solid #d4dbd1;padding:9px 13px;border-radius:30px;font-size:12px;display:flex;align-items:center;gap:8px;color:#5a645d}.dot,.small-dot,.caption-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#919a94}.status[data-state=live]{color:#2b6540;background:#e5eddf;border-color:#cfdcc7}.status[data-state=live] .dot{background:#4c8b59;box-shadow:0 0 0 3px #4c8b5915}.viewer{overflow:hidden;border-radius:14px;background:#171c19;box-shadow:0 8px 30px #162b1710}.feed{position:relative;aspect-ratio:16/9;display:grid;place-items:center;background:radial-gradient(ellipse at center,#232c27 0%,#141a17 85%)}#frame{position:absolute;width:100%;height:100%;object-fit:contain}.placeholder{text-align:center;padding:44px 22px;color:#9daa9f}.placeholder svg{margin-bottom:20px;color:#7f9385}.placeholder h2{font-size:19px;font-weight:500;color:#e7ece5;margin:0 0 10px}.placeholder p{font-size:13px;line-height:1.6;margin:0;max-width:360px}.camera-label{position:absolute;top:20px;left:22px;display:flex;gap:7px;align-items:center;color:#e0e7de;background:#16231bbd;border:1px solid #ffffff17;padding:7px 10px;border-radius:5px;font-size:9px;letter-spacing:.14em;backdrop-filter:blur(10px)}.small-dot{width:5px;height:5px;background:#a8b6a8}.toolbar{height:59px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;color:#a8b3aa;border-top:1px solid #ffffff0b}.feed-info{display:flex;gap:14px;align-items:center;font-size:11px}.feed-info #resolution{letter-spacing:.08em;font-size:10px}.separator{color:#4b5750}button{display:flex;align-items:center;gap:8px;border:1px solid #46514a;color:#dce5dc;background:#252e28;font:inherit;font-size:11px;padding:8px 11px;border-radius:6px;cursor:pointer}button:hover{background:#344139}button:focus-visible,a:focus-visible{outline:3px solid #90b59a;outline-offset:4px}.caption{display:flex;justify-content:space-between;gap:16px;margin-top:17px;font-size:11px;color:var(--muted)}.caption>span:first-child{display:flex;align-items:center;gap:7px}.caption-dot{width:5px;height:5px;background:#7f9383}.notice{font-size:12px;color:var(--muted);min-height:16px}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #dce0d8;margin-top:38px;padding:24px 0 30px;font-size:10px;color:#7d857e}footer>span:first-child{letter-spacing:.12em}.footer-slash{padding:0 10px;color:#b7bdb4}.viewer:fullscreen{width:100vw;height:100dvh;border-radius:0;display:flex;flex-direction:column}.viewer:fullscreen .feed{flex:1;aspect-ratio:auto;min-height:0}.viewer:fullscreen .toolbar{flex-shrink:0}[hidden]{display:none!important}@media(max-width:600px){.shell{padding:0 20px}header{height:76px}.intro{align-items:flex-start;flex-direction:column;gap:21px;margin-top:35px;margin-bottom:23px}.status{font-size:11px;padding:7px 11px}h1{font-size:32px}.viewer{border-radius:10px}.feed{min-height:240px}.camera-label{top:13px;left:13px}.toolbar{padding:0 13px}.placeholder{padding:48px 14px 20px}.placeholder svg{width:32px;height:32px;margin-bottom:10px}.placeholder h2{font-size:16px}.placeholder p{font-size:12px}.caption{font-size:10px;flex-wrap:wrap}footer{margin-top:24px}}@media(prefers-reduced-motion:no-preference){.status{transition:background .2s,color .2s}}
.expanded-view{overflow:hidden}.viewer.expanded{position:fixed;inset:0;z-index:1000;width:100vw;height:100dvh;border-radius:0;display:flex;flex-direction:column}.viewer.expanded .feed{flex:1;aspect-ratio:auto;min-height:0}.viewer.expanded .toolbar{flex-shrink:0}