:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#0b0d10;--foreground:#f2f4f7;--card:#111419;--card-foreground:#f2f4f7;--popover:#111419;--popover-foreground:#f2f4f7;--primary:#b8f36b;--primary-foreground:#10140a;--secondary:#1b2026;--secondary-foreground:#e8ebef;--muted:#171b20;--muted-foreground:#858d98;--accent:#1b2026;--accent-foreground:#e8ebef;--destructive:#fa7777;--border:#272d35;--input:#272d35;--ring:#b8f36b;--radius:.7rem}*{box-sizing:border-box}body{background:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased;margin:0;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}.shell{flex-direction:column;max-width:920px;min-height:100vh;margin:auto;padding:0 32px;display:flex}.topbar{border-bottom:1px solid #20242a;justify-content:space-between;align-items:center;height:76px;display:flex}.brand{color:#eff1f4;letter-spacing:-.5px;align-items:center;gap:9px;font-size:16px;font-weight:700;text-decoration:none;display:inline-flex}.brand-icon{color:#b8f36b;border:1px solid #30363d;border-radius:8px;place-items:center;width:29px;height:29px;display:grid}.brand-dot{color:#b8f36b;margin-left:-9px}.demo-badge{color:#a0a8b1;letter-spacing:1px;background:#14181d;border:1px solid #252b32;border-radius:5px;align-items:center;gap:7px;padding:6px 9px;font-size:9px;font-weight:700;display:flex}.demo-badge span{background:#b8f36b;border-radius:50%;width:6px;height:6px;box-shadow:0 0 8px #b8f36b88}.hero{padding:62px 0 35px}.eyebrow,.panel-kicker{color:#a5adba;letter-spacing:1.5px;align-items:center;gap:10px;font-size:10px;font-weight:700;display:flex}.eyebrow-line{background:#b8f36b;width:20px;height:1px}.hero h1{letter-spacing:-3.5px;margin:18px 0 14px;font-size:clamp(42px,6vw,62px);font-weight:650;line-height:.99}.hero h1 span{color:#aeb6c0}.intro{color:#9099a4;max-width:470px;margin:0;font-size:14px;line-height:1.7}.workspace{background:#101317;border:1px solid #282e36;border-radius:11px;padding:25px;box-shadow:0 18px 55px #0002}.panel-head{justify-content:space-between;align-items:center;margin-bottom:27px;display:flex}.panel-kicker{color:#9ca4ae;font-size:9px}.panel-kicker span{color:#48515c}.panel-head h2{letter-spacing:-.45px;margin:8px 0 0;font-size:18px}.protocol{color:#8f9a8a;letter-spacing:.8px;align-items:center;gap:7px;font-size:9px;font-weight:700;display:flex}.protocol svg{color:#b8f36b}.url-form label{color:#8f98a3;letter-spacing:1px;margin-bottom:9px;font-size:9px;font-weight:700;display:block}.input-row{background:#0b0e11;border:1px solid #2b323b;border-radius:7px;align-items:center;gap:8px;min-height:51px;padding:5px;display:flex}.input-row:focus-within{border-color:#65794e;box-shadow:0 0 0 2px #b8f36b12}.input-icon{color:#737d88;padding-left:10px;display:flex}.input-row input{color:#eef0f3;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:10px 0;font-size:13px}.input-row input::placeholder{color:#59616b}.test-button{color:#11150d;cursor:pointer;white-space:nowrap;background:#b8f36b;border:0;border-radius:5px;justify-content:center;align-items:center;gap:8px;height:39px;padding:0 15px;font-size:12px;font-weight:700;transition:background .15s,transform .15s;display:flex}.test-button:hover{background:#c8ff7e;transform:translateY(-1px)}.test-button:focus-visible,.reset-button:focus-visible,a:focus-visible{outline-offset:3px;outline:2px solid #b8f36b}.mode-fieldset{border:0;min-width:0;margin:0 0 18px;padding:0}.mode-fieldset legend{color:#8f98a3;letter-spacing:1px;margin-bottom:9px;font-size:9px;font-weight:700}.mode-toggle{grid-template-columns:1fr 1fr;gap:8px;display:grid}.mode-option{cursor:pointer;background:#0c0f12;border:1px solid #292f37;border-radius:6px;flex-direction:column;gap:4px;padding:11px 13px;position:relative;letter-spacing:0!important;margin:0!important;display:flex!important}.mode-option.active{background:#151a12;border-color:#64764e}.mode-option input{opacity:0;width:1px;height:1px;position:absolute}.mode-option:focus-within{outline-offset:2px;outline:2px solid #b8f36b}.mode-option span{color:#dce0e5;font-size:11px;font-weight:700}.mode-option small{color:#828b96;letter-spacing:0;font-size:9px;font-weight:400}.mode-option.active span{color:#c6f296}.form-meta{color:#737c86;justify-content:space-between;margin:9px 1px 22px;font-size:10px;display:flex}.player{aspect-ratio:16/7.8;background:#090b0d;border:1px solid #252a30;border-radius:6px;place-items:center;width:100%;display:grid;position:relative;overflow:hidden}.player video{object-fit:contain;width:100%;height:100%;display:block}.empty-player{flex-direction:column;align-items:center;gap:9px;display:flex}.play-mark{color:#b8f36b;background:#171d15;border:1px solid #313a2c;border-radius:50%;place-items:center;width:49px;height:49px;margin-bottom:4px;padding-left:3px;display:grid}.empty-title{color:#d0d4d9;font-size:12px;font-weight:600}.empty-subtitle{color:#727a84;font-size:10px}.player-overlay{color:#c5cbd2;pointer-events:none;background:#090b0ddd;flex-direction:column;justify-content:center;align-items:center;gap:10px;font-size:12px;display:flex;position:absolute;inset:0}.spin{color:#b8f36b;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result-row{align-items:center;gap:11px;min-height:63px;padding-top:13px;display:flex}.status-icon{color:#7d8793;display:flex}.status-icon.ready{color:#b8f36b}.status-icon.error{color:#fa7777}.status-dot{background:#68727d;border-radius:50%;width:7px;height:7px}.result-copy{flex-direction:column;flex:1;gap:3px;display:flex}.result-title{color:#dce0e5;font-size:11px;font-weight:600}.result-message{color:#818a95;font-size:10px;line-height:1.5}.reset-button{color:#a0a8b1;cursor:pointer;background:0 0;border:0;align-items:center;gap:6px;padding:7px;font-size:10px;display:inline-flex}.reset-button:hover{color:#fff}.notes{background:#0f1215;border:1px solid #242a30;border-radius:7px;align-items:flex-start;gap:12px;margin-top:20px;padding:15px 16px;display:flex}.note-icon{color:#a7cf72;padding-top:1px}.notes p{color:#858e98;flex:1;margin:0;font-size:10px;line-height:1.65}.notes p strong{color:#c6cbd1;font-weight:600}.notes a{color:#b8f36b;white-space:nowrap;align-items:center;gap:4px;padding-top:2px;font-size:9px;text-decoration:none;display:inline-flex}.notes a:hover{color:#d2ff9b}footer{color:#626a74;letter-spacing:.7px;justify-content:space-between;margin-top:auto;padding:34px 0 22px;font-size:9px;display:flex}footer span:last-child{text-transform:none;letter-spacing:0}.footer-sep{color:#39414b;margin:0 5px}@media (max-width:600px){.shell{padding:0 18px}.topbar{height:64px}.hero{padding:48px 0 27px}.hero h1{letter-spacing:-2.4px}.workspace{padding:18px 14px}.panel-head{margin-bottom:21px}.protocol{font-size:8px}.input-row{flex-wrap:wrap;padding:7px}.input-icon{padding-left:6px}.input-row input{font-size:12px}.test-button{width:100%}.form-meta{gap:8px;font-size:9px}.player{aspect-ratio:16/10}.notes{flex-wrap:wrap}.notes p{min-width:calc(100% - 32px)}.notes a{margin-left:29px}footer{gap:10px;font-size:8px}}