@layer components{html[data-theme=spectrum] .dp{flex-direction:column;gap:1rem;min-width:0;display:flex;position:relative}html[data-theme=spectrum] .dp-rail{align-items:start;gap:1.25rem;display:grid}@media (min-width:768px){html[data-theme=spectrum] .dp-rail{grid-template-columns:minmax(200px,280px) minmax(0,1fr);gap:2rem}}html[data-theme=spectrum] .dp-stage{flex-direction:column;gap:.875rem;width:100%;min-width:0;display:flex;position:relative}html[data-theme=spectrum] .dp-portrait .dp-stage,html[data-theme=spectrum] .dp-tile-portrait .dp-tile-frame{max-width:320px;margin-inline:auto}html[data-theme=spectrum] .dp-rail .dp-stage{justify-self:center}html[data-theme=spectrum] .dp-frame{transform-origin:50%;padding:10px;position:relative}html[data-theme=spectrum] .dp-landscape .dp-frame,html[data-theme=spectrum] .dp-tile-landscape .dp-tile-frame{border-radius:var(--radius-lg);padding:8px}html[data-theme=spectrum] .dp-tilt{transition:transform var(--dur-slow) var(--ease-out-expo);transform:perspective(1400px)rotateY(-6deg)rotateX(3deg)}html[data-theme=spectrum] .dp-tilt:hover,html[data-theme=spectrum] .dp-tilt:focus-within,html[data-theme=spectrum] .dp[data-playing=true] .dp-tilt{transform:perspective(1400px)rotateY(0)rotateX(0)}html[data-theme=spectrum] .dp-screen,html[data-theme=spectrum] .dp-tile-screen{border-radius:calc(var(--radius-xl) - 8px);aspect-ratio:9/16;isolation:isolate;background:#0b1b2b;position:relative;overflow:hidden}html[data-theme=spectrum] .dp-landscape .dp-screen,html[data-theme=spectrum] .dp-tile-landscape .dp-tile-screen{aspect-ratio:16/9;border-radius:var(--radius-md)}html[data-theme=spectrum] .dp-media{opacity:1;transition:opacity var(--dur-base) var(--ease-out-expo);position:absolute;inset:0}html[data-theme=spectrum] .dp-media[data-fade=out],html[data-theme=spectrum] .dp-media[data-fade=settling]{opacity:0}html[data-theme=spectrum] .dp-video{object-fit:cover;background:#0b1b2b;width:100%;height:100%;display:block}html[data-theme=spectrum] .dp-unavailable{z-index:2;text-align:center;color:#ffffffd9;pointer-events:none;margin:0;position:absolute;inset:auto 12px 12px}html[data-theme=spectrum] .dp-hud{z-index:2;border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(8px)saturate(140%);backdrop-filter:blur(8px)saturate(140%);max-width:calc(100% - 24px);color:var(--sp-text-1);white-space:nowrap;pointer-events:none;background:#ffffffe0;border:1px solid #fff9;align-items:center;gap:.55em;padding:7px 11px;display:inline-flex;position:absolute;top:12px;left:12px;overflow:hidden}html[data-theme=spectrum] .dp-hud-dot{background:var(--oc-teal-500);opacity:.6;border-radius:50%;flex:none;width:6px;height:6px;box-shadow:0 0 0 3px #14b8a633}html[data-theme=spectrum] .dp-hud[data-playing=true] .dp-hud-dot{opacity:1;animation:1.2s ease-in-out infinite dp-blink}html[data-theme=spectrum] .dp-hud-lang{animation:dp-type .48s steps(var(--dp-chars,8), end) both;display:inline-block}html[data-theme=spectrum] .dp-hud-sep{color:var(--sp-text-3)}html[data-theme=spectrum] .dp-hud-time{color:var(--sp-signal);min-width:5ch}html[data-theme=spectrum] .dp-bigplay{z-index:3;width:100%;color:var(--oc-sky-700);cursor:pointer;transition:opacity var(--dur-base) var(--ease-out-expo);background:linear-gradient(#0b1b2b00 45%,#0b1b2b66 100%);border:0;place-items:center;padding:0;display:grid;position:absolute;inset:0}html[data-theme=spectrum] .dp-bigplay[data-visible=false]{opacity:0}html[data-theme=spectrum] .dp-bigplay:focus-visible{outline:none}html[data-theme=spectrum] .dp-bigplay-disc{-webkit-backdrop-filter:blur(8px)saturate(140%);backdrop-filter:blur(8px)saturate(140%);width:72px;height:72px;transition:transform var(--dur-fast) var(--ease-out-expo), background-color var(--dur-base) var(--ease-out-expo), border-color var(--dur-base) var(--ease-out-expo);background:#ffffffeb;border:1px solid #ffffffb3;border-radius:50%;place-items:center;display:grid;box-shadow:0 16px 36px -14px #0369a1b3}html[data-theme=spectrum] .dp-bigplay-disc svg{fill:currentColor;width:28px;height:28px;margin-left:3px}html[data-theme=spectrum] .dp-bigplay:hover .dp-bigplay-disc{background:#fff;transform:scale(1.06)}html[data-theme=spectrum] .dp-bigplay:active .dp-bigplay-disc{transform:scale(.96)}html[data-theme=spectrum] .dp-bigplay:focus-visible .dp-bigplay-disc{outline:2px solid var(--sp-signal);outline-offset:3px}html[data-theme=spectrum] .dp-wave{justify-content:center;align-items:center;gap:3px;height:40px;padding-inline:4px;display:flex}html[data-theme=spectrum] .dp-bar{border-radius:var(--radius-pill);background-image:var(--sp-spectrum);background-size:calc(var(--dp-bars,48) * 100%) 100%;background-position:calc(var(--i,0) * 100% / (var(--dp-bars,48) - 1)) 0;opacity:.55;min-width:2px;max-width:6px;height:100%;transform:scaleY(var(--h,.2));transform-origin:50%;transition:transform var(--dur-base) var(--ease-out-expo), opacity var(--dur-base) var(--ease-out-expo);flex:1 1 0;display:block}html[data-theme=spectrum] .dp-wave[data-playing=true] .dp-bar{opacity:.95}html[data-theme=spectrum] .dp-wave[data-live=true] .dp-bar{transition:opacity var(--dur-base) var(--ease-out-expo);will-change:transform}html[data-theme=spectrum] .dp-controls{border-radius:var(--radius-pill);align-items:center;gap:.375rem;padding:6px;display:flex}html[data-theme=spectrum] .dp-ctl{width:36px;height:36px;color:var(--sp-text-1);cursor:pointer;transition:transform var(--dur-fast) var(--ease-out-expo), color var(--dur-base) var(--ease-out-expo), background-color var(--dur-base) var(--ease-out-expo), border-color var(--dur-base) var(--ease-out-expo);background:0 0;border:1px solid #0000;border-radius:50%;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}html[data-theme=spectrum] .dp-ctl svg{flex:none;width:18px;height:18px}html[data-theme=spectrum] .dp-ctl:hover{background:var(--oc-sky-50);border-color:var(--oc-sky-200)}html[data-theme=spectrum] .dp-ctl:active{transform:scale(.94)}html[data-theme=spectrum] .dp-ctl:disabled,html[data-theme=spectrum] .dp-ctl[aria-disabled=true]{opacity:.4;pointer-events:none}html[data-theme=spectrum] .dp-ctl:focus-visible{outline:2px solid var(--sp-signal);outline-offset:1px}html[data-theme=spectrum] .dp-ctl-sound{border-radius:var(--radius-pill);border-color:var(--sp-line-2);width:auto;font-family:var(--font-sans);white-space:nowrap;gap:6px;padding-inline:10px 13px;font-size:.8125rem;font-weight:500;line-height:1}html[data-theme=spectrum] .dp-ctl-sound svg{width:16px;height:16px}html[data-theme=spectrum] .dp-ctl-sound[data-mode=off]{color:#fff;background:var(--oc-sky-700);border-color:#0000;box-shadow:0 8px 18px -10px #0369a1b3}html[data-theme=spectrum] .dp-ctl-sound[data-mode=off]:hover{background:var(--oc-sky-800);border-color:#0000}html[data-theme=spectrum] .dp-ctl-sound[data-mode=on]{color:var(--sp-text-1);border-color:var(--sp-line-3)}html[data-theme=spectrum] .dp-time{font-family:var(--font-sans);letter-spacing:.02em;color:var(--sp-text-2);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none;padding-inline:2px;font-size:.75rem;font-weight:600}html[data-theme=spectrum] .dp-time-sep{color:var(--sp-text-3)}@media (max-width:400px){html[data-theme=spectrum] .dp-time{display:none}}html[data-theme=spectrum] .dp-seek{cursor:pointer;touch-action:none;border-radius:4px;flex:auto;align-items:center;min-width:48px;height:36px;display:flex;position:relative}html[data-theme=spectrum] .dp-seek[aria-disabled=true]{cursor:default;opacity:.5}html[data-theme=spectrum] .dp-seek:focus-visible{outline:2px solid var(--sp-signal);outline-offset:0}html[data-theme=spectrum] .dp-seek-track{border-radius:var(--radius-pill);background:var(--oc-sky-100);width:100%;height:4px;display:block;position:relative}html[data-theme=spectrum] .dp-seek-fill{border-radius:inherit;background:var(--sp-spectrum);transform:scaleX(var(--dp-progress,0));transform-origin:0;transition:transform .25s linear;position:absolute;inset:0}html[data-theme=spectrum] .dp-seek-thumb-rail{transform:translateX(calc(var(--dp-progress,0) * 100%));pointer-events:none;transition:transform .25s linear;position:absolute;inset:0}html[data-theme=spectrum] .dp-seek-thumb{background:var(--oc-sky-700);opacity:0;width:12px;height:12px;transition:opacity var(--dur-fast) var(--ease-out-expo), transform var(--dur-fast) var(--ease-out-expo);border-radius:50%;position:absolute;top:50%;left:0;transform:translate(-50%,-50%)scale(.6);box-shadow:0 0 0 3px #0369a133}html[data-theme=spectrum] .dp-seek:hover .dp-seek-thumb,html[data-theme=spectrum] .dp-seek:focus-visible .dp-seek-thumb,html[data-theme=spectrum] .dp-seek[data-dragging=true] .dp-seek-thumb{opacity:1;transform:translate(-50%,-50%)scale(1)}html[data-theme=spectrum] .dp-seek[data-dragging=true] .dp-seek-fill,html[data-theme=spectrum] .dp-seek[data-dragging=true] .dp-seek-thumb-rail{transition:none}html[data-theme=spectrum] .dp-tabs{flex-wrap:wrap;justify-content:center;gap:6px;min-width:0;display:flex}html[data-theme=spectrum] .dp-rail .dp-tabs{scrollbar-width:thin;flex-wrap:nowrap;justify-content:flex-start;padding:2px 2px 8px;overflow-x:auto}@media (min-width:768px){html[data-theme=spectrum] .dp-rail .dp-tabs{flex-direction:column;padding:0;overflow:visible}}html[data-theme=spectrum] .dp-tab{border-radius:var(--radius-pill);border:1px solid var(--sp-line-1);min-height:44px;color:var(--sp-text-2);font-family:var(--font-sans);white-space:nowrap;cursor:pointer;transition:transform var(--dur-fast) var(--ease-out-expo), color var(--dur-base) var(--ease-out-expo), background-color var(--dur-base) var(--ease-out-expo), border-color var(--dur-base) var(--ease-out-expo);background:#fff;flex:none;align-items:center;gap:10px;padding:8px 14px;font-size:.875rem;font-weight:600;line-height:1.2;display:inline-flex}html[data-theme=spectrum] .dp-tab:hover{color:var(--sp-text-1);background:var(--oc-sky-50);border-color:var(--oc-sky-200)}html[data-theme=spectrum] .dp-tab:active{transform:scale(.98)}html[data-theme=spectrum] .dp-tab:focus-visible{outline:2px solid var(--sp-signal);outline-offset:2px}html[data-theme=spectrum] .dp-tab[aria-selected=true]{color:#fff;background:var(--oc-sky-700);border-color:#0000;box-shadow:0 8px 18px -10px #0369a1b3}html[data-theme=spectrum] .dp-tab-code{background:var(--oc-sky-50);min-width:1.75rem;height:1.75rem;font-family:var(--font-sans);letter-spacing:.02em;color:var(--oc-sky-800);border-radius:999px;place-items:center;font-size:.6875rem;font-weight:700;display:inline-grid}html[data-theme=spectrum] .dp-tab[aria-selected=true] .dp-tab-code{color:#fff;background:#fff3}html[data-theme=spectrum] .dp-tab[aria-selected=true] .dp-tab-native{color:#ffffffeb}html[data-theme=spectrum] .dp-tab-native{color:var(--sp-text-3);font-size:.8125rem;font-weight:400}@media (min-width:768px){html[data-theme=spectrum] .dp-rail .dp-tab{border-radius:var(--radius-md);justify-content:space-between;width:100%;padding-inline:14px 12px}html[data-theme=spectrum] .dp-rail .dp-tab-native{margin-inline-start:auto}}html[data-theme=spectrum] .dp-stage:fullscreen{background:#0b1b2b;grid-template-rows:minmax(0,1fr) auto auto;gap:12px;max-width:none;padding:16px;display:grid}html[data-theme=spectrum] .dp-stage:fullscreen .dp-frame{height:100%;min-height:0;box-shadow:none;background:0 0;border:0;justify-content:center;padding:0;display:flex;transform:none}html[data-theme=spectrum] .dp-stage:fullscreen .dp-screen{border-radius:0;width:auto;max-width:100%;height:100%}html[data-theme=spectrum] .dp-stage:fullscreen .dp-video{object-fit:contain}html[data-theme=spectrum] .dp-stage:fullscreen .dp-controls{justify-self:center;width:min(100%,720px)}html[data-theme=spectrum] .dp-grid{grid-template-columns:minmax(0,1fr);align-items:start;gap:1.25rem;display:grid}@media (max-width:639.98px){html[data-theme=spectrum] .dp-grid{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;contain:inline-size;gap:.875rem;margin-inline:-20px;padding:6px 20px 8px;scroll-padding-inline:20px;display:flex;overflow-x:auto}html[data-theme=spectrum] .dp-grid::-webkit-scrollbar{display:none}html[data-theme=spectrum] .dp-grid .dp-tile{scroll-snap-align:center;flex:0 0 min(68vw,300px)}html[data-theme=spectrum] .dp-grid .dp-tile-landscape{flex-basis:min(86vw,420px)}}@media (min-width:640px){html[data-theme=spectrum] .dp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){html[data-theme=spectrum] .dp-grid{grid-template-columns:repeat(var(--dp-cols,3), minmax(0, 1fr))}}html[data-theme=spectrum] .dp-tile{flex-direction:column;gap:.875rem;min-width:0;display:flex}html[data-theme=spectrum] .dp-tile-frame{width:100%;padding:10px;position:relative}html[data-theme=spectrum] .dp-tile-poster{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}html[data-theme=spectrum] .dp-tile-label{color:var(--sp-text-2);justify-content:center;align-items:center;gap:10px;font-size:.875rem;font-weight:500;display:flex}html[data-theme=spectrum] .dp-tile[data-active=true] .dp-tile-label{color:var(--sp-text-1)}}@keyframes dp-type{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes dp-blink{0%,to{opacity:1}50%{opacity:.35}}@media (prefers-reduced-motion:reduce){html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-tilt{transition:none;transform:none!important}html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-media,html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-bar,html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-seek-fill,html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-seek-thumb-rail{transition:none}html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-hud-lang,html[data-theme=spectrum]:not([data-reduce-motion=false]) .dp-hud-dot{animation:none!important}}html[data-theme=spectrum][data-reduce-motion=true] .dp-tilt{transition:none;transform:none!important}html[data-theme=spectrum][data-reduce-motion=true] .dp-media,html[data-theme=spectrum][data-reduce-motion=true] .dp-bar,html[data-theme=spectrum][data-reduce-motion=true] .dp-seek-fill,html[data-theme=spectrum][data-reduce-motion=true] .dp-seek-thumb-rail{transition:none}html[data-theme=spectrum][data-reduce-motion=true] .dp-hud-lang,html[data-theme=spectrum][data-reduce-motion=true] .dp-hud-dot{animation:none!important}
