body{margin:0;background:#000;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}body.is-player{overflow:hidden;background:#000}body:not(.is-player){overflow:auto;background:#0b0b0b;color:#ffffffeb}.pageHidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}#fadeOverlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:9999;pointer-events:none;opacity:0;transition:opacity .3s ease-in-out}#fadeOverlay.active{opacity:1;pointer-events:auto}#homeRoot{min-height:100vh;padding:22px 18px 40px;box-sizing:border-box;display:flex;flex-direction:column;transition:opacity .3s ease-in-out}#homeRoot.pageHidden{opacity:0}#homeHeader{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px}#homeTitle{font-size:18px;font-weight:650;letter-spacing:.02em;text-shadow:0 0 2px rgba(42,169,255,.8),0 0 4px rgba(42,169,255,.6),0 0 8px rgba(42,169,255,.4),0 0 12px rgba(42,169,255,.3),0 0 16px rgba(42,169,255,.2)}#homeSub{font-size:12px;opacity:.75;text-shadow:0 0 2px rgba(42,169,255,.6),0 0 4px rgba(42,169,255,.5),0 0 6px rgba(42,169,255,.3),0 0 8px rgba(42,169,255,.2)}#demoGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}#homeIntro{margin-top:18px;padding:14px 14px 16px;border-radius:12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);width:400px;float:left}#homeIntro h2{margin:0 0 10px;font-size:15px;font-weight:700;letter-spacing:.01em;line-height:1.25}#homeIntro p{margin:0;font-size:12.5px;line-height:1.5;opacity:.86}#homeIntro p+p{margin-top:10px}#homeFooter{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);text-align:center;font-size:12px;opacity:.85;clear:both}#homeFooter a{color:#2aa9fff2;text-decoration:none}#homeFooter a:hover{text-decoration:underline}.demoCard{display:grid;grid-template-rows:124px auto;border-radius:10px;overflow:hidden;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);text-decoration:none;color:inherit}.demoCard:focus-visible{outline:2px solid rgba(42,169,255,.95);outline-offset:2px}.demoThumb{width:100%;height:124px;background:#00000073;display:grid;place-items:center}.demoThumb img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.02)}.demoThumb .thumbLoading{font-size:12px;opacity:.65}.demoMeta{padding:10px 10px 12px;display:grid;gap:6px}.demoName{font-size:13px;font-weight:650;line-height:1.2}.demoDesc{font-size:12px;opacity:.78;line-height:1.3}.pillRow{display:flex;flex-wrap:wrap;gap:6px}.pill{font-size:11px;padding:3px 7px;border-radius:999px;background:#ffffff17;border:1px solid rgba(255,255,255,.12);opacity:.9}#playerRoot{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;transition:opacity .3s ease-in-out}#playerRoot.pageHidden{opacity:0}#demoTopbar{position:absolute;left:10px;top:10px;z-index:3;display:flex;gap:10px;align-items:center;padding:6px 8px;border-radius:10px;background:#00000073;border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .2s ease}#demoTopbar.hidden{opacity:0;pointer-events:none}#backLink{color:#ffffffeb;text-decoration:none;font-size:12px}#demoTitle{color:#ffffffeb;font-size:12px;opacity:.9;max-width:min(70vw,680px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#app{width:100%;height:100%;display:block}#controls{position:absolute;left:0;right:0;bottom:0;padding:10px;display:grid;grid-template-columns:auto 1fr auto auto auto;grid-template-rows:auto auto;gap:8px;align-items:center;background:linear-gradient(to top,#000000bf,#0000);transition:opacity .2s ease}#controls.hidden{opacity:0;pointer-events:none}#playPause{grid-column:1;grid-row:2}#seek{grid-column:1 / -1;grid-row:1;width:100%}#seek{--buffer-gradient: linear-gradient(to right, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, .16) 100%);background:transparent}#seek{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:16px}#seek::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:var(--buffer-gradient);cursor:pointer}#seek::-moz-range-track{height:6px;border-radius:999px;background:var(--buffer-gradient);cursor:pointer}#seek::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#2aa9ff;cursor:pointer;margin-top:-4px;box-shadow:0 0 0 2px #0003}#seek::-moz-range-thumb{width:14px;height:14px;border:none;border-radius:50%;background:#2aa9ff;cursor:pointer;box-shadow:0 0 0 2px #0003}#time{grid-column:3;grid-row:2;color:#fff;font-size:12px;white-space:nowrap;opacity:.9}#volumeWrap{grid-column:4;grid-row:2;display:inline-flex;gap:6px;align-items:center;color:#fff;font-size:12px;white-space:nowrap}#volumeValue{display:inline-block;width:4ch;text-align:right;font-variant-numeric:tabular-nums;flex:0 0 4ch}#volume{width:110px}#fullscreen{grid-column:5;grid-row:2}#displayModes{grid-column:2;grid-row:2;justify-self:center;align-self:center;display:inline-flex;align-items:center;gap:6px;padding:4px 6px;border-radius:10px;background:#00000040;border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#displayModes .modeBtn{display:inline-grid;place-items:center;width:28px;height:26px;padding:0;border-radius:8px;font-size:12px;line-height:1;font-weight:650;letter-spacing:.02em;background:#ffffff1f;border:1px solid rgba(255,255,255,.18);color:#ffffffeb}#displayModes .iconButton{width:32px;height:26px;border-radius:8px}#displayModes .modeBtn:hover{background:#ffffff2e}#displayModes .modeBtn[aria-pressed=true],#displayModes .iconButton[aria-pressed=true]{background:#2aa9ff4d;border-color:#2aa9ffa6}#displayModes .modeBtn:focus-visible{outline:2px solid rgba(42,169,255,.95);outline-offset:2px}button{background:#ffffffe6;border:1px solid rgba(0,0,0,.3);border-radius:4px;padding:4px 8px;font-size:12px;cursor:pointer}#controls .iconButton{display:inline-grid;place-items:center;width:34px;height:30px;padding:0;background:#ffffff24;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#ffffffeb}#controls .iconButton:hover{background:#fff3}#controls .iconButton:active{transform:translateY(.5px)}#controls .iconButton:focus-visible{outline:2px solid rgba(42,169,255,.95);outline-offset:2px}#controls .btnIcon{width:18px;height:18px;display:block;fill:currentColor}input[type=range]{accent-color:#2aa9ff}#loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#00000059;z-index:2;transition:opacity .18s ease;pointer-events:none}#loading>div{display:grid;place-items:center;text-align:center}#loading.hidden{opacity:0}#spinner{width:46px;height:46px;border-radius:50%;border:4px solid rgba(255,255,255,.25);border-top-color:#fffffff2;animation:spin .9s linear infinite}#loadingText{margin-top:10px;color:#ffffffe6;font-size:12px;letter-spacing:.03em}@keyframes spin{to{transform:rotate(360deg)}}