:root{--navy:#2e3984;--navy-soft:#2e39848c;--icon:#47975e;--orange:#d47b40;--olive:#a9a334;--brick-red:#c1584a;--brick-blue:#45659c;--text:#2a2f4d;--text-muted:#5a5f80;--font-arcade:"Press Start 2P", "Courier New", monospace;color:var(--text);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:linear-gradient(160deg,#eef0fb 0%,#dfe3f7 45%,#cfd5f2 100%);flex-direction:column;min-height:100svh;display:flex;overflow-x:hidden}#app{flex-direction:column;flex:1;min-height:100svh;display:flex;position:relative}.bg-decor{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.bg-stripes{opacity:.12;background:linear-gradient(180deg, var(--brick-red) 0%, var(--brick-red) 20%, var(--orange) 20%, var(--orange) 40%, var(--olive) 40%, var(--olive) 60%, var(--icon) 60%, var(--icon) 80%, var(--brick-blue) 80%, var(--brick-blue) 100%);position:absolute;inset:0}.bg-ball{opacity:.16;border-radius:2px;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;position:absolute}.ball-navy{background:var(--navy)}.ball-orange{background:var(--orange);opacity:.22}.ball-olive{background:var(--olive);opacity:.22}@keyframes ball-path-1{0%{transform:translate(0)}25%{transform:translate(60vw,30vh)}50%{transform:translate(15vw,65vh)}75%{transform:translate(75vw,55vh)}to{transform:translate(30vw,10vh)}}@keyframes ball-path-2{0%{transform:translate(0)}30%{transform:translate(-40vw,40vh)}60%{transform:translate(-70vw,5vh)}to{transform:translate(-20vw,55vh)}}@keyframes ball-path-3{0%{transform:translate(0)}20%{transform:translate(35vw,-25vh)}55%{transform:translate(60vw,20vh)}to{transform:translate(10vw,45vh)}}.page-header{z-index:1;text-align:center;padding:28px 24px 0;position:relative}.page-header h1{font:15px/1.6 var(--font-arcade);letter-spacing:.01em;color:var(--navy);margin:0 0 10px}.page-header h1 .accent-dot{color:var(--orange)}.page-header p{color:var(--text-muted);margin:0;font-size:13.5px}.page-header .header-note{max-width:560px;color:var(--text-muted);opacity:.85;margin:8px auto 0;font-size:12px;line-height:1.5}main.stage{z-index:1;flex:1;justify-content:center;align-items:center;gap:28px;padding:24px 24px 40px;display:flex;position:relative}.video-frame{border:3px solid var(--navy);background:#000;border-radius:14px;line-height:0;position:relative;overflow:hidden;box-shadow:0 18px 40px -18px #2e398480}.video-frame video{width:auto;max-width:min(78vw,900px);height:auto;max-height:74vh;display:block}.scrubber{background:var(--navy);border-top:2px solid #fdfdff;align-items:center;gap:10px;padding:10px 14px;line-height:1;display:flex}.scrubber-time{font:9px var(--font-arcade);letter-spacing:.02em;color:var(--olive);flex:none}.seek-slider{--progress:0%;appearance:none;background:linear-gradient(to right, var(--orange) var(--progress), #ffffff47 var(--progress));cursor:pointer;border-radius:3px;outline:none;flex:1;height:6px}.seek-slider::-webkit-slider-thumb{appearance:none;background:var(--orange);width:14px;height:14px;box-shadow:2px 2px 0 var(--navy-soft);cursor:pointer;border:2px solid #fdfdff;border-radius:3px;transition:transform .12s}.seek-slider::-webkit-slider-thumb:hover{transform:scale(1.12)}.seek-slider::-moz-range-track{background:#ffffff47;border-radius:3px;height:6px}.seek-slider::-moz-range-progress{background:var(--orange);border-radius:3px;height:6px}.seek-slider::-moz-range-thumb{background:var(--orange);width:14px;height:14px;box-shadow:2px 2px 0 var(--navy-soft);cursor:pointer;border:2px solid #fdfdff;border-radius:3px}.controls{flex-direction:column;gap:16px;display:flex}.ctrl-btn{background:var(--navy);width:64px;height:64px;color:var(--icon);box-shadow:6px 6px 0 var(--navy-soft);cursor:pointer;border:2px solid #fdfdff;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:2px;transition:transform .12s,box-shadow .12s;display:flex}.ctrl-btn svg{width:22px;height:22px}.ctrl-btn:hover{box-shadow:7px 7px 0 var(--navy-soft);transform:translate(-1px,-1px)}.ctrl-btn:active{box-shadow:2px 2px 0 var(--navy-soft);transform:translate(4px,4px)}.ctrl-btn.is-active{border-color:var(--orange);background:#232b66}.speed-label{font:9px var(--font-arcade);letter-spacing:.02em;color:var(--olive)}.site-footer{z-index:1;color:var(--text-muted);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff59;border-top:1px solid #2e398426;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:12px 16px;font-size:13px;display:flex;position:relative}.footer-author{font:10px var(--font-arcade);letter-spacing:.02em;color:var(--navy)}.footer-divider{color:#2e398466}.site-footer a{color:var(--text-muted);text-decoration:none}.site-footer a:hover{color:var(--orange);text-decoration:underline}@media (width<=720px){main.stage{flex-direction:column;gap:20px;padding:24px 16px}.video-frame video{max-width:90vw;max-height:50vh}.controls{flex-flow:row;justify-content:center;gap:8px}.ctrl-btn{width:44px;height:44px;box-shadow:4px 4px 0 var(--navy-soft);border-width:1.5px;gap:1px}.ctrl-btn svg{width:16px;height:16px}.ctrl-btn:hover{box-shadow:5px 5px 0 var(--navy-soft)}.speed-label{font-size:7px}.site-footer{flex-direction:column;gap:4px;padding:10px 16px}.footer-divider{display:none}}