*{box-sizing:border-box}html,body{min-height:100%}body{color:#111;background:#fff;margin:0;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,iframe{font:inherit}.site-header{color:#fff;background:#282c34;border-bottom:1px solid #e2e2e2}.site-nav{justify-content:space-between;align-items:center;width:min(1200px,100% - 40px);min-height:72px;margin:0 auto;display:flex}.brand{letter-spacing:.08em;font-size:1.6rem;font-weight:800}.nav-links{align-items:center;gap:24px;display:flex}.nav-links a{color:#e9e9e9}.nav-links a:hover,.nav-links a:focus-visible{color:#fff;text-underline-offset:5px;text-decoration:underline}.app{color:#f7f3ea;text-align:center;background:radial-gradient(circle at 8% 12%,#16803a3d,#0000 25rem),radial-gradient(circle at 92% 45%,#16803a2e,#0000 32rem),linear-gradient(145deg,#101216 0%,#07080a 54%,#111419 100%);min-height:calc(100vh - 73px);padding:20px 20px 72px;overflow:hidden}.hero{align-content:center;place-items:center;max-width:850px;min-height:calc(100vh - 185px);margin:0 auto;padding:80px 0;display:grid;position:relative}.hero:after{content:"";background:linear-gradient(90deg,#0000,#16803a,#0000);width:84px;height:1px;margin:36px auto 0;display:block}.hero h1,.page-header h1{margin:0}.hero h1{color:#f7f3ea;letter-spacing:-.055em;max-width:800px;font-family:Georgia,Times New Roman,serif;font-size:clamp(3rem,8vw,6.25rem);font-weight:500;line-height:.96}.eyebrow{color:#16803a;text-shadow:0 0 22px #16803a80;letter-spacing:.28em;text-transform:uppercase;margin:0 0 18px;font-size:.72rem;font-weight:800}.hero-copy{color:#9fa5ae;max-width:620px;margin:26px 0 30px;font-size:clamp(1rem,2vw,1.15rem);line-height:1.65}.hero-actions{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.button{letter-spacing:.08em;text-transform:uppercase;border:1px solid #16803a;border-radius:4px;justify-content:center;align-items:center;min-height:50px;padding:0 22px;font-size:.75rem;font-weight:700;transition:background-color .18s,border-color .18s,transform .18s,box-shadow .18s;display:inline-flex}.primary-button{color:#fff;background:#16803a;box-shadow:0 10px 28px #16803a38}.secondary-button{color:#dce7df;background:#16803a14;border-color:#356744}.button:hover{filter:brightness(1.06);border-color:#28a653;transform:translateY(-2px);box-shadow:0 14px 34px #16803a33}.button:focus-visible{outline-offset:4px;outline:3px solid #36a85a}.page-header{max-width:700px;margin:40px auto}.page-header h1{font-size:clamp(2.25rem,5vw,4rem)}.page-header p:last-child{color:#555;font-size:1.1rem}.tabs-container{grid-template-columns:minmax(190px,250px) minmax(0,1fr);align-items:start;gap:24px;max-width:1200px;margin:0 auto;display:grid}.tab-buttons{flex-direction:column;gap:5px;display:flex}.tab-button{cursor:pointer;text-align:left;background-color:#f0f0f0;border:0;border-radius:4px;width:100%;padding:10px 20px;transition:background-color .3s}.tab-button:hover{background-color:#e0e0e0}.tab-button:focus-visible{outline-offset:2px;outline:3px solid #7bd89a}.tab-button.active{color:#fff;background-color:#16803a}.stream-frame{background:#0b0d10;border:1px solid #343941;border-radius:8px;padding:8px;overflow:hidden;box-shadow:0 24px 60px #00000059,inset 0 0 0 1px #ffffff09}.stream-frame__header{color:#747b85;letter-spacing:.1em;text-transform:uppercase;align-items:center;gap:9px;min-height:38px;padding:0 8px 8px;font-size:.64rem;font-weight:700;display:flex}.stream-frame__header strong{color:#e8e3da;font-size:.7rem}.stream-frame__status{background:#16803a;border-radius:50%;width:8px;height:8px;box-shadow:0 0 10px #16803acc}.stream{border:0;border-radius:3px;width:100%;min-height:500px;display:block}.empty-state{background:#fafafa;border:1px dashed #b9b9b9;border-radius:8px;max-width:720px;margin:0 auto;padding:60px 24px}.empty-state h2{margin-top:0}.empty-state p{color:#555;margin-bottom:0}@media (max-width:600px){.site-nav{width:min(100% - 24px,1200px)}.nav-links{gap:12px;font-size:.9rem}.app{padding:12px 12px 52px}.hero{min-height:calc(100vh - 169px);padding:60px 0}.tabs-container{grid-template-columns:1fr;gap:16px}.tab-buttons{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.tab-button{text-align:center;padding:10px 12px}.stream{min-height:320px}}@media (max-width:400px){.tab-buttons{grid-template-columns:1fr}}
