@charset "UTF-8";/* inter-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-cyrillic-ext-wght-normal.BOeWTOD4.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-cyrillic-wght-normal.DqGufNeO.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-greek-ext-wght-normal.DlzME5K_.woff2) format('woff2-variations');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-greek-wght-normal.CkhJZR-_.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-vietnamese-wght-normal.CBcvBZtf.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-latin-ext-wght-normal.DO1Apj_S.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-latin-wght-normal.Dx4kXJAl.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* outfit-latin-ext-wght-normal */
@font-face {
  font-family: 'Outfit Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./outfit-latin-ext-wght-normal.DdQaqQDo.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* outfit-latin-wght-normal */
@font-face {
  font-family: 'Outfit Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./outfit-latin-wght-normal.Bc-8i84L.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* noto-sans-arabic-arabic-400-normal */
@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./noto-sans-arabic-arabic-400-normal.AAMxebZb.woff2) format('woff2'), url(./noto-sans-arabic-arabic-400-normal.hsqIUL9Q.woff) format('woff');
}
@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui :after,.plyr--full-ui :before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:20px;padding:calc(var(--plyr-control-spacing, 10px)*2)}}@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(-40px);transform:translateY(calc(var(--plyr-control-spacing, 10px)*-4))}.plyr__caption{background:#000c;background:var(--plyr-captions-background,#000c);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__caption div{display:inline}.plyr__control{background:#0000;border:0;border-radius:4px;border-radius:var(--plyr-control-radius,4px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7);position:relative;transition:all .3s ease}.plyr__control svg{fill:currentColor;display:block;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}.plyr__control:focus{outline:0}.plyr__control:focus-visible{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}a.plyr__control{text-decoration:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed,a.plyr__control:after,a.plyr__control:before{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:2.5px;margin-left:calc(var(--plyr-control-spacing, 10px)/4)}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:2.5px;padding-left:calc(var(--plyr-control-spacing, 10px)/4)}.plyr__controls .plyr__controls__item.plyr__time{padding:0 5px;padding:0 calc(var(--plyr-control-spacing, 10px)/2)}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip],.plyr__controls:empty{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:#ffffffe6;background:var(--plyr-menu-background,#ffffffe6);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-menu-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container:after{border:4px solid #0000;border-top-color:#ffffffe6;border:var(--plyr-menu-arrow-size,4px) solid #0000;border-top-color:var(--plyr-menu-background,#ffffffe6);content:"";height:0;position:absolute;right:14px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7 - var(--plyr-menu-arrow-size, 4px)/2);top:100%;width:0}.plyr__menu__container [role=menu]{padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7)}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding:4.66667px 10.5px;padding:calc(var(--plyr-control-spacing, 10px)*.7/1.5) calc(var(--plyr-control-spacing, 10px)*.7*1.5);-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control:after{border:4px solid #0000;border:var(--plyr-menu-item-arrow-size,4px) solid #0000;content:"";position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:28px;padding-right:calc(var(--plyr-control-spacing, 10px)*.7*4)}.plyr__menu__container .plyr__control--forward:after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:6.5px;right:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}.plyr__menu__container .plyr__control--forward:focus-visible:after,.plyr__menu__container .plyr__control--forward:hover:after{border-left-color:initial}.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:7px;margin:calc(var(--plyr-control-spacing, 10px)*.7);margin-bottom:3.5px;margin-bottom:calc(var(--plyr-control-spacing, 10px)*.7/2);padding-left:28px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*4);position:relative;width:calc(100% - 14px);width:calc(100% - var(--plyr-control-spacing, 10px)*.7*2)}.plyr__menu__container .plyr__control--back:after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:6.5px;left:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}.plyr__menu__container .plyr__control--back:before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:"";height:1px;left:0;margin-top:3.5px;margin-top:calc(var(--plyr-control-spacing, 10px)*.7/2);overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back:focus-visible:after,.plyr__menu__container .plyr__control--back:hover:after{border-right-color:initial}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7)}.plyr__menu__container .plyr__control[role=menuitemradio]:after,.plyr__menu__container .plyr__control[role=menuitemradio]:before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]:before{background:#0000001a;content:"";display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]:after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:#00b2ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)))}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before{background:#23282f1a}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;margin-right:calc(var(--plyr-control-spacing, 10px)*.7*-1 - -2px);overflow:hidden;padding-left:24.5px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*3.5);pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:0;border-radius:26px;border-radius:calc(var(--plyr-range-thumb-height, 13px)*2);color:#00b2ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));display:block;height:19px;height:calc(var(--plyr-range-thumb-active-shadow-width, 3px)*2 + var(--plyr-range-thumb-height, 13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:#0000;background-image:linear-gradient(90deg,currentColor 0,#0000 0);background-image:linear-gradient(to right,currentColor var(--value,0),#0000 var(--value,0));border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:-4px;margin-top:calc((var(--plyr-range-thumb-height, 13px) - var(--plyr-range-track-height, 5px))/2*-1);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-moz-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px)}.plyr--full-ui input[type=range]::-ms-track{color:#0000}.plyr--full-ui input[type=range]::-ms-fill-upper,.plyr--full-ui input[type=range]::-ms-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:#0000;background:currentColor;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:0;position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr--full-ui input[type=range]:focus-visible::-moz-range-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr--full-ui input[type=range]:focus-visible::-ms-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr__poster{background-color:#000;background-color:var(--plyr-video-background,var(--plyr-video-background,#000));background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster{display:none}.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__time+.plyr__time:before{content:"⁄";margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}@media (max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:#fff;background:var(--plyr-tooltip-background,#fff);border-radius:5px;border-radius:var(--plyr-tooltip-radius,5px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:5px 7.5px;padding:calc(var(--plyr-control-spacing, 10px)/2) calc(var(--plyr-control-spacing, 10px)/2*1.5);pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s ease .1s,opacity .2s ease .1s;white-space:nowrap;z-index:2}.plyr__tooltip:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control:focus-visible .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translateY(10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before{left:16px;left:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7)}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translateY(10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip:before{left:auto;right:16px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7);transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0) scale(1)}.plyr__progress{left:6.5px;left:calc(var(--plyr-range-thumb-height, 13px)*.5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-left:calc(var(--plyr-range-thumb-height, 13px)*-.5);margin-right:-6.5px;margin-right:calc(var(--plyr-range-thumb-height, 13px)*-.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height, 13px))}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{left:0;max-width:120px;overflow-wrap:break-word}.plyr__progress__buffer{-webkit-appearance:none;background:#0000;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:-2.5px;margin-top:calc((var(--plyr-range-track-height, 5px)/2)*-1);padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:#0000}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,#23282f99 25%,#0000 0,#0000 50%,#23282f99 0,#23282f99 75%,#0000 0,#0000);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,#23282f99) 25%,#0000 25%,#0000 50%,var(--plyr-progress-loading-background,#23282f99) 50%,var(--plyr-progress-loading-background,#23282f99) 75%,#0000 75%,#0000);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:#0000}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:#ffffff40;background-color:var(--plyr-video-progress-buffered-background,#ffffff40)}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:#c1c8d199;background-color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}.plyr__progress__marker{background-color:#fff;background-color:var(--plyr-progress-marker-background,#fff);border-radius:1px;height:5px;height:var(--plyr-range-track-height,5px);position:absolute;top:50%;transform:translate(-50%,-50%);width:3px;width:var(--plyr-progress-marker-width,3px);z-index:3}.plyr__volume{align-items:center;display:flex;position:relative}.plyr__volume input[type=range]{margin-left:5px;margin-left:calc(var(--plyr-control-spacing, 10px)/2);margin-right:5px;margin-right:calc(var(--plyr-control-spacing, 10px)/2);max-width:90px;min-width:60px;position:relative;z-index:2}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}.plyr--audio .plyr__control:focus-visible,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--audio .plyr__progress__buffer{color:#c1c8d199;color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}.plyr--video{overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));border-radius:inherit;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{aspect-ratio:16/9}@supports not (aspect-ratio:16/9){.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%;position:relative}}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;height:100%;left:0;position:absolute;top:0;width:100%}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:5px;padding:calc(var(--plyr-control-spacing, 10px)/2);padding-top:20px;padding-top:calc(var(--plyr-control-spacing, 10px)*2);position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:35px;padding-top:calc(var(--plyr-control-spacing, 10px)*3.5)}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control:focus-visible,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}.plyr__control--overlaid{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:15px;padding:calc(var(--plyr-control-spacing, 10px)*1.5);position:absolute;top:50%;transform:translate(-50%,-50%);transition:.3s;z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--video .plyr__progress__buffer{color:#ffffff40;color:var(--plyr-video-progress-buffered-background,#ffffff40)}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen video{height:100%}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;bottom:0;height:100%;left:0;margin:0;position:fixed;right:0;top:0;width:100%;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads:after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}.plyr__ads:empty:after{display:none}.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;opacity:.8;position:absolute;top:50%;transform:translateY(-50%);width:3px;z-index:3}.plyr__preview-thumb{background-color:#fff;background-color:var(--plyr-tooltip-background,#fff);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:3px;pointer-events:none;position:absolute;transform:translateY(10px) scale(.8);transform-origin:50% 100%;transition:transform .2s ease .1s,opacity .2s ease .1s;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0) scale(1)}.plyr__preview-thumb:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:calc(50% + var(--preview-arrow-offset));position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:7px;border-radius:calc(var(--plyr-menu-radius, 8px) - 1px);overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img,.plyr__preview-thumb__image-container:after{height:100%;left:0;position:absolute;top:0;width:100%}.plyr__preview-thumb__image-container:after{border-radius:inherit;box-shadow:inset 0 0 0 1px #00000026;content:"";pointer-events:none}.plyr__preview-thumb__image-container img{max-height:none;max-width:none}.plyr__preview-thumb__time-container{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:7px;border-bottom-left-radius:calc(var(--plyr-menu-radius, 8px) - 1px);border-bottom-right-radius:7px;border-bottom-right-radius:calc(var(--plyr-menu-radius, 8px) - 1px);bottom:0;left:0;line-height:1.1;padding:20px 6px 6px;position:absolute;right:0;z-index:3}.plyr__preview-thumb__time-container span{color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;-o-object-fit:contain;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);border:0!important;height:1px!important;overflow:hidden;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important}

*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/* ! tailwindcss v3.4.18 | MIT License | https://tailwindcss.com *//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: Inter Variable, Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
.\!container{
  width: 100% !important;
}
.container{
  width: 100%;
}
@media (min-width: 640px){
  .\!container{
    max-width: 640px !important;
  }
  .container{
    max-width: 640px;
  }
}
@media (min-width: 768px){
  .\!container{
    max-width: 768px !important;
  }
  .container{
    max-width: 768px;
  }
}
@media (min-width: 1024px){
  .\!container{
    max-width: 1024px !important;
  }
  .container{
    max-width: 1024px;
  }
}
@media (min-width: 1280px){
  .\!container{
    max-width: 1280px !important;
  }
  .container{
    max-width: 1280px;
  }
}
@media (min-width: 1536px){
  .\!container{
    max-width: 1536px !important;
  }
  .container{
    max-width: 1536px;
  }
}
.focus-ring{
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: transparent;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.focus-ring:focus-visible{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.7);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: var(--ink, #04040a);
}

.field{
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: transparent;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.field:focus-visible{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.7);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: var(--ink, #04040a);
}

.field{
  width: 100%;
  border-radius: 0.75rem;
  border-width: 1px;
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.04);
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 13px;
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.field::-moz-placeholder{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.35);
}

.field::placeholder{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.35);
}

.field:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.2);
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
}

select.field {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.45)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 2.5rem;
}

[data-theme='light'] select.field {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(23,24,28,0.45)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

select.field option {
  background: var(--surface-overlay);
  color: rgb(var(--fg-rgb));
}

.btn-primary{
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: transparent;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.btn-primary:focus-visible{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.7);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: var(--ink, #04040a);
}

.btn-primary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border-radius: 0.75rem;
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 13px;
  font-weight: 600;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.btn-primary:active{
  --tw-scale-x: 0.98;
  --tw-scale-y: 0.98;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.btn-primary {
  color: #ffffff;
  background: linear-gradient(120deg, var(--color-primary-deep) 0%, var(--color-primary) 50%, var(--color-secondary) 100%);
  background-size: 150% 100%;
  background-position: 0% 0%;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 4px 20px -4px rgb(var(--color-primary-rgb) / 0.5);
}

.btn-primary:hover {
  color: #ffffff;
  background-position: 100% 0%;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    0 6px 28px -4px rgb(var(--color-primary-soft-rgb) / 0.55);
}

[data-theme='light'] .btn-primary {
  color: #ffffff;
  background: linear-gradient(120deg, var(--color-primary-deep) 0%, var(--color-primary) 50%, var(--color-secondary) 100%);
}

[data-theme='light'] .btn-primary:hover {
  color: #ffffff;
}

.btn-secondary{
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: transparent;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.btn-secondary:focus-visible{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.7);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: var(--ink, #04040a);
}

.btn-secondary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border-radius: 0.75rem;
  border-width: 1px;
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 13px;
  font-weight: 600;
  color: rgb(var(--fg-rgb, 244 244 248) / 0.9);
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.btn-secondary:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.1);
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

.btn-secondary:active{
  --tw-scale-x: 0.98;
  --tw-scale-y: 0.98;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

[data-theme='light'] .btn-secondary {
  border-color: rgb(var(--fg-rgb) / 0.14);
  background: rgb(var(--fg-rgb) / 0.04);
  color: rgb(var(--fg-rgb) / 0.88);
}

[data-theme='light'] .btn-secondary:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.08);
  color: rgb(var(--fg-rgb) / 0.95);
}

/* Dark media heroes inherit canvas fg in light mode — restore media-plane chrome. */
.hype-engine .btn-secondary,
.title-hero .btn-secondary,
.video-player-shell .btn-secondary {
  border-color: rgb(var(--media-fg-rgb) / 0.16);
  background: rgb(var(--media-fg-rgb) / 0.08);
  color: rgb(var(--media-fg-rgb) / 0.92);
}

.title-hero .btn-secondary {
  border-color: rgb(var(--media-fg-rgb) / 0.22);
  background: rgb(var(--media-fg-rgb) / 0.14);
  color: rgb(var(--media-fg-rgb));
}

.hype-engine .btn-secondary:hover,
.title-hero .btn-secondary:hover,
.video-player-shell .btn-secondary:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: rgb(var(--color-primary-rgb) / 0.16);
  color: rgb(var(--media-fg-rgb));
}

.hype-engine .btn-primary,
.hype-engine a.btn-primary,
.title-hero .btn-primary,
.title-hero a.btn-primary,
.video-player-shell .btn-primary,
.video-player-shell a.btn-primary {
  color: #ffffff;
}

.video-player-shell .kbd {
  border-color: rgb(var(--media-fg-rgb) / 0.16);
  background: rgb(var(--media-fg-rgb) / 0.08);
  color: rgb(var(--media-fg-rgb) / 0.62);
}

.title-hero .badge {
  border-color: rgb(var(--media-fg-rgb) / 0.18);
  background: rgb(var(--media-fg-rgb) / 0.12);
  color: rgb(var(--media-fg-rgb) / 0.92);
}

.title-hero .field {
  border-color: rgb(var(--media-fg-rgb) / 0.14);
  background: rgb(var(--media-fg-rgb) / 0.06);
  color: rgb(var(--media-fg-rgb) / 0.92);
}

.title-hero select.field {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(244,244,248,0.55)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.title-hero select.field option {
  background: rgb(var(--media-ink-rgb));
  color: rgb(var(--media-fg-rgb));
}

.title-hero a[role='tab']:not(.nav-active-strong) {
  background: rgb(var(--media-fg-rgb) / 0.1);
  color: rgb(var(--media-fg-rgb) / 0.8);
}

.title-hero a[role='tab']:not(.nav-active-strong):hover {
  background: rgb(var(--media-fg-rgb) / 0.16);
  color: rgb(var(--media-fg-rgb));
}

.title-hero .nav-active-strong {
  color: rgb(var(--media-fg-rgb));
}

.btn-ghost{
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: transparent;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.btn-ghost:focus-visible{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.7);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: var(--ink, #04040a);
}

.btn-ghost{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border-radius: 0.75rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-size: 13px;
  font-weight: 500;
  color: rgb(var(--fg-rgb, 244 244 248) / 0.65);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.btn-ghost:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

.btn-ghost:active{
  --tw-scale-x: 0.98;
  --tw-scale-y: 0.98;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.panel{
  border-radius: 1rem;
  border-width: 1px;
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / 0.8);
  --tw-shadow: var(--shadow-card, 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 24px -12px rgba(0, 0, 0, 0.55));
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

.badge{
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 9999px;
  border-width: 1px;
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: 11px;
  font-weight: 500;
  color: rgb(var(--fg-rgb, 244 244 248) / 0.75);
}

.chip{
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  border-radius: 0.375rem;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: 10px;
  font-weight: 600;
  line-height: 1rem;
}

.kbd{
  display: inline-flex;
  height: 1.25rem;
  min-width: 1.25rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  border-width: 1px;
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.15);
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  font-family: Inter Variable, Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: 10px;
  font-weight: 600;
  color: rgb(var(--fg-rgb, 244 244 248) / 0.55);
}

.section-title{
  font-family: Outfit Variable, Outfit, Inter Variable, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

@media (min-width: 640px){
  .section-title{
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

.text-gradient{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: var(--color-primary-soft, #9ec5ff) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--color-secondary-rgb, 99 102 241) / 1) var(--tw-gradient-via-position), var(--tw-gradient-to);
  --tw-gradient-to: rgb(var(--color-info-rgb, 34 211 238) / 1) var(--tw-gradient-to-position);
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
}

@keyframes shimmer{
  0%{
    background-position: -200% 0;
  }
  100%{
    background-position: 200% 0;
  }
}

.skeleton{
  animation: shimmer 1.6s linear infinite;
  border-radius: 0.5rem;
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgb(var(--color-primary-soft-rgb) / 0.08) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  background-size: 200% 100%;
}

.poster-art {
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.16), transparent 8rem),
    linear-gradient(135deg, var(--poster-a, #2d2440), var(--poster-b, #1a2336));
}

/* Pointer-tracked 3D tilt for poster cards on detail-heavy pages. */
.tilt-card {
  transform: translate3d(var(--mag-x, 0px), var(--mag-y, 0px), 0) rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg));
  transition-property: transform, box-shadow;
  transition-duration: 200ms, 300ms;
  transition-timing-function: ease-out;
}

.tilt-glare {
  background: radial-gradient(
    24rem circle at var(--glare-x, 50%) var(--glare-y, 30%),
    rgba(255, 255, 255, 0.14),
    transparent 55%
  );
  mix-blend-mode: overlay;
}

[data-theme='light'] .tilt-glare {
  mix-blend-mode: soft-light;
  background: radial-gradient(
    24rem circle at var(--glare-x, 50%) var(--glare-y, 30%),
    rgba(255, 255, 255, 0.2),
    transparent 58%
  );
}

@media (pointer: coarse) {
  .tilt-card {
    transform: none;
  }
}

/* On Air — week ticker marquee */
.ticker {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, black 6%, black 94%, transparent);
          mask-image: linear-gradient(to right, transparent, black 6%, black 94%, transparent);
}

.ticker-track {
  display: flex;
  width: -moz-max-content;
  width: max-content;
  animation: ticker-scroll 45s linear infinite;
}

.ticker:hover .ticker-track,
.ticker:focus-within .ticker-track {
  animation-play-state: paused;
}

.ticker-item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 1rem;
  white-space: nowrap;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgb(var(--fg-rgb) / 0.55);
  transition: color 200ms ease-out;
}

.ticker-item:hover {
  color: var(--color-primary-soft);
}

@keyframes ticker-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}

/* On Air — episode deck */
.on-air-card {
  perspective: 900px;
}

.on-air-tilt {
  position: relative;
}

.on-air-tilt .tilt-glare {
  background: radial-gradient(
    20rem circle at var(--glare-x, 50%) var(--glare-y, 50%),
    rgba(255, 255, 255, 0.06),
    transparent 58%
  );
}

.on-air-deck {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.25rem;
}

.on-air-deck > * {
  flex: 0 0 clamp(16rem, 72vw, 20rem);
  scroll-snap-align: start;
  min-width: 0;
}

.on-air-poster {
  border-radius: 0;
}

.on-air-tilt > .on-air-poster {
  border-top-left-radius: inherit;
  border-bottom-left-radius: inherit;
}

@media (min-width: 768px) {
  .on-air-deck {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .on-air-deck > * {
    flex: unset;
  }
}

@media (min-width: 1024px) {
  .on-air-deck {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .on-air-deck {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.on-air-live {
  animation: pulse-glow 2.5s ease-in-out infinite;
}

/* Spotlight hero — accent atmosphere + kinetic reveal */
.hero-accent-orb {
  background:
    radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.08), transparent 18%),
    color-mix(in srgb, var(--hero-a, var(--color-primary)) 12%, transparent);
  animation: hero-orb-drift-a 18s ease-in-out infinite;
  mix-blend-mode: screen;
  transition: background 1.2s ease-out;
  will-change: transform, opacity;
}

.hero-accent-orb-b {
  background:
    radial-gradient(circle at 62% 40%, rgba(255, 255, 255, 0.07), transparent 18%),
    color-mix(in srgb, var(--hero-b, var(--color-secondary)) 10%, transparent);
  animation: hero-orb-drift-b 21s ease-in-out -4s infinite;
  mix-blend-mode: screen;
  transition: background 1.2s ease-out;
  will-change: transform, opacity;
}

[data-theme='light'] .hero-accent-orb,
[data-theme='light'] .hero-accent-orb-b {
  mix-blend-mode: multiply;
}

@keyframes hero-orb-drift-a {
  0%,
  100% {
    opacity: 0.42;
    transform: translate3d(0, 0, 0) scale(1);
  }
  42% {
    opacity: 0.64;
    transform: translate3d(1.6rem, -1.1rem, 0) scale(1.1);
  }
  72% {
    opacity: 0.48;
    transform: translate3d(-0.6rem, 0.9rem, 0) scale(0.98);
  }
}

@keyframes hero-orb-drift-b {
  0%,
  100% {
    opacity: 0.36;
    transform: translate3d(0, 0, 0) scale(1);
  }
  45% {
    opacity: 0.58;
    transform: translate3d(-1.4rem, 1rem, 0) scale(1.08);
  }
  78% {
    opacity: 0.42;
    transform: translate3d(0.8rem, -0.7rem, 0) scale(0.99);
  }
}

@keyframes hero-backdrop-in {
  from {
    opacity: 0;
    transform: scale(1.08);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.hero-backdrop-in {
  animation: hero-backdrop-in 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes hero-sweep-pass {
  from {
    transform: translate3d(-120%, 0, 0);
  }
  to {
    transform: translate3d(120%, 0, 0);
  }
}

.hero-sweep {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero-sweep::after {
  content: '';
  position: absolute;
  inset: -50% -20%;
  background: linear-gradient(
    110deg,
    transparent 42%,
    rgba(255, 255, 255, 0.07) 50%,
    transparent 58%
  );
  animation: hero-sweep-pass 1.1s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Spotlight holo card deck */
.holo-deck-stage {
  position: relative;
  width: clamp(22rem, 30vw, 26rem);
  height: 17rem;
  flex-shrink: 0;
  perspective: 1400px;
  transform: translate3d(var(--deck-px, 0px), var(--deck-py, 0px), 0);
  transition: transform 0.7s ease-out;
}

.holo-card-slot {
  position: absolute;
  left: 50%;
  bottom: 2.25rem;
  width: 10rem;
  margin-left: -5rem;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transform-origin: center bottom;
  transform: translate3d(var(--slot-x, 0), var(--slot-y, 0), 0) rotate(var(--slot-rot, 0deg))
    scale(var(--slot-scale, 1));
  filter: brightness(var(--slot-bright, 1));
  z-index: var(--slot-z, 1);
  transition:
    transform 0.65s cubic-bezier(0.34, 1.56, 0.64, 1),
    filter 0.55s ease,
    z-index 0s;
}

.holo-card-float {
  animation: card-float var(--float-dur, 5.5s) ease-in-out var(--float-delay, 0s) infinite;
  transform-origin: center bottom;
  will-change: transform;
}

@keyframes card-float {
  0%,
  100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  50% {
    transform: translate3d(0, -8px, 0) rotate(1deg);
  }
}

.holo-card {
  display: block;
  width: 100%;
  transform-style: preserve-3d;
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform 0.12s ease-out;
}

.holo-card--active {
  filter: drop-shadow(0 0 18px color-mix(in srgb, var(--card-accent, var(--color-primary)) 55%, transparent))
    drop-shadow(0 24px 48px -12px rgba(0, 0, 0, 0.65));
}

.holo-card--active .holo-frame::after {
  opacity: 0.35;
}

@keyframes holo-sheen {
  0%,
  100% {
    opacity: 0.35;
  }
  50% {
    opacity: 0.85;
  }
}

.holo-frame {
  position: relative;
  padding: 3px;
  border-radius: 0.85rem;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 4px 20px -4px rgba(0, 0, 0, 0.5);
}

.holo-frame::before {
  content: '';
  position: absolute;
  inset: -120%;
  background: conic-gradient(
    from 0deg,
    #ffd700,
    var(--card-accent, var(--color-primary)),
    #c084fc,
    #22d3ee,
    #f472b6,
    #ffd700
  );
  z-index: 0;
}

@keyframes holo-border-spin {
  to {
    transform: rotate(360deg);
  }
}

.holo-frame::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    115deg,
    transparent 38%,
    rgba(255, 255, 255, 0.22) 48%,
    transparent 58%
  );
  background-size: 220% 100%;
  opacity: 0;
  pointer-events: none;
  z-index: 4;
  mix-blend-mode: overlay;
}

.holo-card-inner {
  position: relative;
  aspect-ratio: 3 / 4;
  border-radius: 0.65rem;
  overflow: hidden;
  background: #0a0a12;
  z-index: 1;
}

.holo-card-inner img,
.holo-card-inner .poster-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.holo-foil {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: calc(0.25 + var(--hover, 0) * 0.55);
  background: linear-gradient(
    125deg,
    #ff6b9d 0%,
    #c084fc 18%,
    #60a5fa 36%,
    #34d399 54%,
    #fbbf24 72%,
    #f472b6 90%,
    #ff6b9d 100%
  );
  background-size: 250% 250%;
  background-position: var(--px, 50%) var(--py, 50%);
  mix-blend-mode: color-dodge;
  transition: opacity 0.25s ease;
}

.holo-sparkle {
  position: absolute;
  inset: -20%;
  z-index: 3;
  pointer-events: none;
  opacity: calc(0.15 + var(--hover, 0) * 0.45);
  background:
    radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.9) 0%, transparent 0.4%),
    radial-gradient(circle at 75% 15%, rgba(255, 255, 255, 0.8) 0%, transparent 0.35%),
    radial-gradient(circle at 45% 70%, rgba(255, 255, 255, 0.7) 0%, transparent 0.3%),
    radial-gradient(circle at 88% 55%, rgba(255, 255, 255, 0.85) 0%, transparent 0.4%),
    radial-gradient(circle at 12% 82%, rgba(255, 255, 255, 0.75) 0%, transparent 0.35%),
    conic-gradient(
      from 45deg at 50% 50%,
      transparent,
      rgba(255, 255, 255, 0.06),
      transparent,
      rgba(255, 255, 255, 0.04),
      transparent
    );
  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    200% 200%;
  background-position:
    calc(100% - var(--px, 50%)) calc(100% - var(--py, 50%)),
    calc(100% - var(--px, 50%)) calc(100% - var(--py, 50%)),
    calc(100% - var(--px, 50%)) calc(100% - var(--py, 50%)),
    calc(100% - var(--px, 50%)) calc(100% - var(--py, 50%)),
    calc(100% - var(--px, 50%)) calc(100% - var(--py, 50%)),
    var(--px, 50%) var(--py, 50%);
  mix-blend-mode: color-dodge;
  transition: opacity 0.25s ease;
}

.holo-glare {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  opacity: calc(var(--hover, 0) * 0.7);
  background: radial-gradient(
    circle at var(--px, 50%) var(--py, 50%),
    rgba(255, 255, 255, 0.45) 0%,
    rgba(255, 255, 255, 0.08) 28%,
    transparent 55%
  );
  mix-blend-mode: overlay;
  transition: opacity 0.2s ease;
}

.holo-nameplate {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.45rem 0.55rem 0.5rem;
  background: linear-gradient(to top, rgba(4, 4, 10, 0.92) 0%, rgba(4, 4, 10, 0.55) 70%, transparent 100%);
}

.holo-nameplate-name {
  min-width: 0;
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.holo-nameplate-score {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  font-size: 0.6rem;
  font-weight: 700;
  color: #fbbf24;
}

.holo-deck-progress {
  position: absolute;
  left: 50%;
  bottom: 0.35rem;
  width: 10rem;
  height: 2px;
  margin-left: -5rem;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.12);
}

.holo-deck-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(to right, var(--color-primary), var(--color-secondary));
}

.holo-card-slot--hidden {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

/* Card flight: gentle glide to center, dissolve into banner */
.card-flight {
  position: absolute;
  z-index: 30;
  pointer-events: none;
  transform-origin: center center;
}

.card-flight--fly {
  left: var(--fly-from-x);
  top: var(--fly-from-y);
  width: var(--fly-from-w);
  animation: card-fly-in 0.6s cubic-bezier(0.25, 0.9, 0.35, 1) forwards;
  animation-fill-mode: forwards;
}

.card-flight--morph {
  left: 50%;
  top: 46%;
  width: calc(var(--fly-from-w) * 1.1);
  animation: card-morph-out 0.95s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes card-fly-in {
  from {
    transform: translate(-50%, -50%) rotate(var(--fly-from-rot)) scale(1);
  }
  to {
    transform: translate(calc(-50% + var(--fly-dx)), calc(-50% + var(--fly-dy))) rotate(0deg) scale(1.1);
  }
}

@keyframes card-morph-out {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.88;
  }
  35% {
    opacity: 0.45;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.35);
    opacity: 0;
  }
}

.card-flight-poster {
  z-index: 1;
  transition: opacity 0.75s ease-out;
}

.card-flight-banner {
  z-index: 2;
  opacity: 0;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center bottom;
     object-position: center bottom;
  transition: opacity 0.9s ease-out 0.25s;
}

.card-flight--morph .card-flight-poster {
  opacity: 0;
}

.card-flight--morph .card-flight-banner {
  opacity: 0.72;
}

.card-flight--morph .holo-foil,
.card-flight--morph .holo-sparkle,
.card-flight--morph .holo-glare,
.card-flight--morph .holo-nameplate {
  opacity: 0;
  transition: opacity 0.5s ease-out;
}

.card-flight .holo-frame,
.card-flight .holo-frame::before,
.card-flight .holo-frame::after {
  transition:
    opacity 0.38s ease-out,
    padding 0.38s ease-out,
    box-shadow 0.38s ease-out;
}

.card-flight--fly .holo-frame::before {
  animation: card-border-fade 0.6s ease-out forwards;
}

@keyframes card-border-fade {
  0%,
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.card-flight--morph .holo-frame {
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.card-flight--morph .holo-frame::before,
.card-flight--morph .holo-frame::after {
  opacity: 0;
}

.card-flight .holo-card--active {
  transition: filter 0.4s ease-out;
}

.card-flight--morph .holo-card--active {
  filter: drop-shadow(0 0 0 transparent);
}

.card-ripples {
  position: absolute;
  inset: 0;
  z-index: 29;
  pointer-events: none;
  overflow: hidden;
}

.card-ripple {
  position: absolute;
  left: 50%;
  top: 46%;
  width: calc(var(--fly-from-w, 10.5rem) * 1.08);
  aspect-ratio: 3 / 4;
  border-radius: 1rem;
  border: 1px solid color-mix(in srgb, var(--hero-a, var(--color-primary)) 20%, white);
  box-shadow: 0 0 20px -14px color-mix(in srgb, var(--hero-a, var(--color-primary)) 10%, transparent);
  opacity: 0;
  animation: card-ripple 1.25s ease-out forwards;
  pointer-events: none;
}

@keyframes card-ripple {
  from {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.07;
  }
  50% {
    opacity: 0.03;
  }
  to {
    transform: translate(-50%, -50%) scale(4.4, 2.5);
    opacity: 0;
  }
}

@keyframes hero-title-in {
  from {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.hero-title-in {
  animation: hero-title-in 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-stagger-1 {
  animation-delay: 0.08s;
}

.hero-stagger-2 {
  animation-delay: 0.16s;
}

.hero-stagger-3 {
  animation-delay: 0.24s;
}

.hero-stagger-4 {
  animation-delay: 0.32s;
}

.hero-stagger-5 {
  animation-delay: 0.4s;
}

.btn-sheen {
  position: relative;
  overflow: hidden;
}

.btn-sheen::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, 0.22) 50%, transparent 62%);
  transform: translate3d(-100%, 0, 0);
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.btn-sheen:hover::after {
  transform: translate3d(100%, 0, 0);
}

.scrollbar-soft {
  scrollbar-color: rgb(var(--color-primary-soft-rgb) / 0.3) transparent;
}

.no-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.carousel-track {
  display: flex;
  gap: var(--rail-gap, 0.75rem);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 0.25rem;
}

.carousel-track > * {
  flex: 0 0 var(--rail-item, clamp(8.5rem, 11vw, 11rem));
  scroll-snap-align: start;
  min-width: 0;
}

@media (pointer: fine) {
  .carousel-track {
    cursor: grab;
  }
}

.carousel-track.dragging {
  scroll-snap-type: none;
  scroll-behavior: auto;
  cursor: grabbing;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.carousel-track.dragging > * {
  pointer-events: none;
}

.scrim-b {
  position: absolute;
  inset: 0;
  bottom: -2px;
  opacity: 0.6;
  transition: opacity 300ms ease;
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.78) 0%,
    rgb(var(--media-ink-rgb) / 0.32) 42%,
    transparent 72%
  );
  pointer-events: none;
}

.group:hover .scrim-b,
.group:focus-within .scrim-b {
  opacity: 0.8;
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.84) 0%,
    rgb(var(--media-ink-rgb) / 0.38) 46%,
    transparent 74%
  );
}

/* Light canvas poster rails — keep artwork visible; bottom scrim only. */
[data-theme='light'] .group .scrim-b {
  opacity: 0.42;
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.52) 0%,
    rgb(var(--media-ink-rgb) / 0.16) 38%,
    transparent 66%
  );
}

[data-theme='light'] .group:hover .scrim-b,
[data-theme='light'] .group:focus-within .scrim-b {
  opacity: 0.52;
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.6) 0%,
    rgb(var(--media-ink-rgb) / 0.2) 42%,
    transparent 70%
  );
}

/* Single GPU layer for poster/thumbnail hover — avoids scrim/image desync. */
.poster-zoom {
  position: absolute;
  inset: -1px;
  transform: translateZ(0);
  transition: transform 300ms ease-out;
}

.group:hover .poster-zoom {
  transform: translate3d(0, -2px, 0) scale(1.05);
}

.poster-card--compact {
  transition:
    transform 160ms ease-out,
    box-shadow 180ms ease-out;
}

.group:hover .poster-card--compact {
  transform: translate3d(0, -2px, 0);
}

.noise-overlay {
  position: relative;
}

.noise-overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.24;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='0.05'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

[data-theme='light'] .noise-overlay::after {
  opacity: 0.08;
}

.bg-canvas.noise-overlay::after {
  opacity: 0.11;
}

[data-theme='light'] .bg-canvas.noise-overlay::after {
  opacity: 0.05;
}

/* ── Home experience: Hype Engine + Discovery Arcade ── */

.home-experience {
  isolation: isolate;
  overflow-x: clip;
}

.mobile-spotlight {
  min-height: clamp(20rem, 54svh, 25rem);
  isolation: isolate;
  background: rgb(var(--media-ink-rgb));
  color: rgb(var(--media-fg-rgb));
}

.mobile-spotlight-backdrop {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}

.mobile-spotlight-backdrop img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  opacity: 0.64;
}

.mobile-spotlight-scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom, rgb(var(--media-ink-rgb) / 0.12) 0%, rgb(var(--media-ink-rgb) / 0.54) 48%, rgb(var(--media-ink-rgb) / 0.98) 100%),
    linear-gradient(to right, rgb(var(--media-ink-rgb) / 0.48), transparent 80%);
}

.mobile-spotlight-content {
  display: flex;
  width: min(100%, 100rem);
  min-height: inherit;
  margin-inline: auto;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding:
    3.5rem max(1rem, var(--safe-right))
    calc(1.5rem + var(--safe-bottom)) max(1rem, var(--safe-left));
}

.mobile-spotlight-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid rgb(var(--media-fg-rgb) / 0.18);
  border-radius: 999px;
  background: rgb(var(--media-ink-rgb) / 0.58);
  padding: 0.25rem 0.55rem;
  color: rgb(var(--media-fg-rgb) / 0.82);
  font-size: 0.625rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mobile-spotlight-content h1 {
  max-width: 42rem;
  margin-top: 0.65rem;
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.75rem;
  font-weight: 850;
  line-height: 1.04;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

.mobile-spotlight-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.6rem;
}

.mobile-spotlight-meta span {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 999px;
  background: rgb(var(--media-ink-rgb) / 0.58);
  padding: 0.2rem 0.45rem;
  color: rgb(var(--media-fg-rgb) / 0.82);
  font-size: 0.625rem;
  font-weight: 700;
}

.mobile-spotlight-content p {
  display: -webkit-box;
  max-width: 38rem;
  margin-top: 0.65rem;
  overflow: hidden;
  color: rgb(var(--media-fg-rgb) / 0.76);
  font-size: 0.8rem;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.mobile-spotlight-action {
  display: inline-flex;
  min-height: 2.5rem;
  margin-top: 0.9rem;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  border-radius: 0.6rem;
  background: var(--color-primary);
  padding: 0.5rem 0.9rem;
  color: white;
  font-size: 0.75rem;
  font-weight: 750;
  text-decoration: none;
}

.home-experience::before,
.home-experience::after {
  content: '';
  position: absolute;
  inset: auto;
  z-index: -1;
  pointer-events: none;
  opacity: 0.25;
  will-change: transform, opacity;
}

.home-experience::before {
  top: 14vh;
  right: -14rem;
  width: 34rem;
  height: 34rem;
  border-radius: 999px;
  background:
    radial-gradient(circle at 42% 36%, rgba(255, 255, 255, 0.035), transparent 16%),
    radial-gradient(circle, rgba(251, 191, 36, 0.07), transparent 70%);
  animation: home-bloom-drift-a 27s ease-in-out infinite;
}

.home-experience::after {
  left: -17rem;
  bottom: 10vh;
  width: 38rem;
  height: 38rem;
  border-radius: 999px;
  background:
    radial-gradient(circle at 58% 42%, rgba(255, 255, 255, 0.026), transparent 18%),
    radial-gradient(circle, rgba(129, 140, 248, 0.075), transparent 72%);
  animation: home-bloom-drift-b 31s ease-in-out -7s infinite;
}

@keyframes home-bloom-drift-a {
  0%,
  100% {
    opacity: 0.14;
    transform: translate3d(0, 0, 0) scale(1);
  }
  45% {
    opacity: 0.24;
    transform: translate3d(-3rem, 4rem, 0) scale(1.12);
  }
  75% {
    opacity: 0.17;
    transform: translate3d(1.5rem, 1rem, 0) scale(0.98);
  }
}

@keyframes home-bloom-drift-b {
  0%,
  100% {
    opacity: 0.13;
    transform: translate3d(0, 0, 0) scale(1);
  }
  48% {
    opacity: 0.23;
    transform: translate3d(4rem, -3rem, 0) scale(1.12);
  }
  78% {
    opacity: 0.16;
    transform: translate3d(-1rem, 1.5rem, 0) scale(0.99);
  }
}

.hype-engine::before,
.hype-engine::after {
  content: '';
  position: absolute;
  z-index: 1;
  pointer-events: none;
  border-radius: 1rem;
  border: 1px solid var(--glass-border);
  background:
    linear-gradient(135deg, rgb(var(--fg-rgb) / 0.07), transparent 54%),
    linear-gradient(145deg, rgb(var(--color-primary-soft-rgb) / 0.08), rgb(var(--color-secondary-rgb) / 0.045));
  box-shadow: 0 18px 56px -30px rgb(var(--color-primary-soft-rgb) / 0.34);
  opacity: 0.28;
  will-change: transform, opacity;
}

.hype-engine::before {
  right: clamp(1rem, 6vw, 6rem);
  top: 9rem;
  width: 6rem;
  aspect-ratio: 3 / 4;
  animation: hero-ghost-card-a 16s ease-in-out infinite;
}

.hype-engine::after {
  left: clamp(1rem, 7vw, 8rem);
  bottom: 7rem;
  width: 4.5rem;
  aspect-ratio: 3 / 4;
  animation: hero-ghost-card-b 18s ease-in-out -4s infinite;
}

@keyframes hero-ghost-card-a {
  0%,
  100% {
    opacity: 0.2;
    transform: translate3d(0, 0, 0) rotate(18deg);
  }
  48% {
    opacity: 0.34;
    transform: translate3d(-0.55rem, -0.75rem, 0) rotate(20deg) scale(1.035);
  }
}

@keyframes hero-ghost-card-b {
  0%,
  100% {
    opacity: 0.18;
    transform: translate3d(0, 0, 0) rotate(-16deg);
  }
  52% {
    opacity: 0.31;
    transform: translate3d(0.65rem, -0.5rem, 0) rotate(-18deg) scale(1.04);
  }
}

.hype-engine-backdrop {
  opacity: 1;
}

.hype-engine-content {
  opacity: 1;
  text-shadow: 0 1px 2px rgb(0 0 0 / 0.35);
}

.home-hype-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.35);
  background: linear-gradient(135deg, rgb(var(--color-primary-rgb) / 0.18), rgb(var(--color-secondary-rgb) / 0.12));
  padding: 0.28rem 0.62rem;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-primary-soft);
  box-shadow: 0 0 18px -8px rgb(var(--color-primary-rgb) / 0.55);
}

.hero-title-glow {
  background-image: linear-gradient(135deg, #fff 0%, var(--color-primary-soft) 45%, var(--color-secondary) 85%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 40px rgb(var(--color-primary-rgb) / 0.25));
}

/* Home spotlight: keep copy legible over busy banners. */
.hype-engine .hero-title-glow {
  background-image: linear-gradient(
    135deg,
    #fff 0%,
    #fff 38%,
    var(--color-primary-soft) 72%,
    var(--color-secondary) 100%
  );
  filter:
    drop-shadow(0 1px 2px rgb(0 0 0 / 0.55))
    drop-shadow(0 6px 18px rgb(0 0 0 / 0.45))
    drop-shadow(0 0 36px rgb(var(--color-primary-rgb) / 0.22));
}

.hype-engine .hero-media-scrim {
  background: linear-gradient(
    to right,
    var(--ink) 0%,
    color-mix(in srgb, var(--ink) 92%, transparent) 28%,
    color-mix(in srgb, var(--ink) 72%, transparent) 52%,
    color-mix(in srgb, var(--ink) 35%, transparent) 78%,
    color-mix(in srgb, var(--ink) 14%, transparent) 100%
  );
}

.hype-engine .hero-media-scrim-bottom {
  height: 11rem;
  background: linear-gradient(
    to top,
    var(--ink) 0%,
    color-mix(in srgb, var(--ink) 78%, transparent) 42%,
    color-mix(in srgb, var(--ink) 28%, transparent) 72%,
    transparent 100%
  );
}

/* Light heroes sit on a dark media scrim — keep title glow bright like dark mode. */
[data-theme='light'] .hero-title-glow {
  background-image: linear-gradient(
    135deg,
    rgb(var(--media-fg-rgb)) 0%,
    color-mix(in srgb, var(--color-primary) 42%, white) 45%,
    color-mix(in srgb, var(--color-secondary) 55%, white) 85%
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 28px rgb(var(--color-primary-rgb) / 0.28));
}

/* Light heroes: keep artwork visible while preserving readable foreground contrast. */
.hero-media-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, var(--ink) 0%, color-mix(in srgb, var(--ink) 80%, transparent) 55%, color-mix(in srgb, var(--ink) 25%, transparent) 100%);
  pointer-events: none;
}

.hero-media-scrim-bottom {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 8rem;
  background: linear-gradient(to top, var(--ink) 0%, color-mix(in srgb, var(--ink) 55%, transparent) 55%, transparent 100%);
  pointer-events: none;
}

.hero-media-scrim-bottom.h-36 {
  height: 9rem;
}

[data-theme='light'] .hero-media-scrim {
  background: linear-gradient(
    to right,
    rgb(var(--media-ink-rgb) / 0.62) 0%,
    rgb(var(--media-ink-rgb) / 0.38) 42%,
    rgb(var(--media-ink-rgb) / 0.12) 72%,
    rgb(var(--media-ink-rgb) / 0.04) 100%
  );
}

[data-theme='light'] .hero-media-scrim-bottom {
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.55) 0%,
    rgb(var(--media-ink-rgb) / 0.22) 55%,
    transparent 100%
  );
}

/* Title page: darker left-weighted scrim so metadata stays readable over busy banners. */
[data-theme='light'] .title-hero .hero-media-scrim {
  background: linear-gradient(
    to right,
    rgb(var(--media-ink-rgb) / 0.88) 0%,
    rgb(var(--media-ink-rgb) / 0.72) 28%,
    rgb(var(--media-ink-rgb) / 0.42) 58%,
    rgb(var(--media-ink-rgb) / 0.16) 82%,
    rgb(var(--media-ink-rgb) / 0.06) 100%
  );
}

[data-theme='light'] .title-hero .hero-media-scrim-bottom {
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.78) 0%,
    rgb(var(--media-ink-rgb) / 0.4) 50%,
    transparent 100%
  );
}

[data-theme='light'] .hype-engine .hero-media-scrim {
  background: linear-gradient(
    to right,
    rgb(var(--media-ink-rgb) / 0.9) 0%,
    rgb(var(--media-ink-rgb) / 0.78) 28%,
    rgb(var(--media-ink-rgb) / 0.5) 55%,
    rgb(var(--media-ink-rgb) / 0.2) 80%,
    rgb(var(--media-ink-rgb) / 0.08) 100%
  );
}

[data-theme='light'] .hype-engine .hero-media-scrim-bottom {
  background: linear-gradient(
    to top,
    rgb(var(--media-ink-rgb) / 0.82) 0%,
    rgb(var(--media-ink-rgb) / 0.45) 48%,
    transparent 100%
  );
}

[data-theme='light'] .hype-engine .hero-title-glow {
  background-image: linear-gradient(
    135deg,
    rgb(var(--media-fg-rgb)) 0%,
    rgb(var(--media-fg-rgb)) 40%,
    color-mix(in srgb, var(--color-primary) 42%, white) 75%,
    color-mix(in srgb, var(--color-secondary) 55%, white) 100%
  );
  filter:
    drop-shadow(0 1px 2px rgb(0 0 0 / 0.55))
    drop-shadow(0 6px 18px rgb(0 0 0 / 0.45))
    drop-shadow(0 0 28px rgb(var(--color-primary-rgb) / 0.28));
}

[data-theme='light'] .hype-engine .hero-backdrop-in img {
  opacity: 0.48;
  filter: saturate(1.05) brightness(0.9);
}

[data-theme='light'] .title-hero-art {
  opacity: 0.72;
  filter: saturate(1.05);
}

[data-theme='light'] .title-hero .title-hero-art {
  opacity: 0.55;
  filter: saturate(1.02) brightness(0.92);
}

.home-rarity-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  padding: 0.25rem 0.6rem;
  font-size: 0.625rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgb(var(--fg-rgb) / 0.55);
}

.home-rarity-chip--ssr {
  border-color: rgba(251, 191, 36, 0.35);
  color: #fbbf24;
  background:
    linear-gradient(120deg, rgba(251, 191, 36, 0.14), rgba(244, 114, 182, 0.1), rgba(34, 211, 238, 0.1)),
    var(--glass-bg);
  box-shadow: 0 0 22px -8px rgba(251, 191, 36, 0.7);
}

/* Light canvas tokens on dark media heroes — switch to media-plane colors. */
[data-theme='light'] .hype-engine .home-hype-badge {
  color: color-mix(in srgb, var(--color-primary) 38%, white);
  border-color: rgb(var(--media-fg-rgb) / 0.18);
  background: linear-gradient(
    135deg,
    rgb(var(--color-primary-rgb) / 0.22),
    rgb(var(--color-secondary-rgb) / 0.14)
  );
}

[data-theme='light'] .hype-engine .home-rarity-chip {
  border-color: rgb(var(--media-fg-rgb) / 0.16);
  background: rgb(var(--media-fg-rgb) / 0.08);
  color: rgb(var(--media-fg-rgb) / 0.72);
}

[data-theme='light'] .hype-engine .home-rarity-chip--ssr {
  border-color: rgba(251, 191, 36, 0.45);
  color: #fde68a;
  background:
    linear-gradient(120deg, rgba(251, 191, 36, 0.22), rgba(244, 114, 182, 0.12), rgba(34, 211, 238, 0.12)),
    rgb(var(--media-fg-rgb) / 0.06);
}

.home-cta-pulse {
  animation: cta-pulse 2.8s ease-in-out infinite;
}

@keyframes cta-pulse {
  0%,
  100% {
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.18),
      0 4px 20px -4px rgb(var(--color-primary-rgb) / 0.5);
  }
  50% {
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.22),
      0 6px 32px -2px rgb(var(--color-primary-soft-rgb) / 0.65);
  }
}

@keyframes scroll-bounce {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, 6px, 0);
  }
}

@keyframes scroll-hint-fade {
  0%,
  100% {
    opacity: 0.88;
  }
  50% {
    opacity: 1;
  }
}

.home-arcade-nav {
  overflow: hidden;
  border: 1px solid var(--glass-border);
  background:
    linear-gradient(90deg, rgb(var(--color-primary-rgb) / 0.06), transparent 34%, rgba(94, 234, 212, 0.035) 76%, transparent),
    var(--chrome-panel-bg);
  box-shadow:
    0 1px 0 rgb(var(--fg-rgb) / 0.04) inset,
    0 8px 28px -18px rgba(0, 0, 0, 0.65);
}

[data-theme='light'] .home-arcade-nav {
  box-shadow:
    0 1px 0 rgb(var(--fg-rgb) / 0.04) inset,
    0 6px 20px -16px rgba(15, 23, 42, 0.22);
}

.home-arcade-strip {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  overflow-x: auto;
  /* Room for active chip translateY(-1px) — overflow-x:auto also clips Y */
  padding-block: 0.15rem;
  scrollbar-width: none;
}

.home-arcade-strip::-webkit-scrollbar {
  display: none;
}

.home-mood-strip {
  display: flex;
  flex: 0 0 auto;
  gap: 0.45rem;
}

.home-mood-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border-radius: 999px;
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  padding: 0.28rem 0.58rem;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: rgb(var(--fg-rgb) / 0.68);
  transition:
    border-color 200ms ease,
    background 200ms ease,
    color 200ms ease,
    box-shadow 200ms ease,
    transform 200ms ease;
}

.home-mood-chip:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  color: rgb(var(--fg-rgb) / 0.85);
}

.home-mood-chip--active {
  border-color: rgb(var(--color-primary-rgb) / 0.5);
  background: linear-gradient(135deg, rgb(var(--color-primary-rgb) / 0.22), rgb(var(--color-secondary-rgb) / 0.14));
  color: rgb(var(--fg-rgb));
  box-shadow: 0 0 16px -8px rgb(var(--color-primary-rgb) / 0.7);
  transform: translateY(-1px);
}

.home-arcade-divider {
  display: block;
  height: 1.3rem;
  width: 1px;
  flex: 0 0 auto;
  margin-inline: 0.15rem;
  background: var(--glass-border);
}

.home-chapter-strip {
  display: flex;
  flex: 0 0 auto;
  gap: 0.25rem;
}

.home-chapter-pill {
  flex-shrink: 0;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  padding: 0.24rem 0.48rem;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgb(var(--fg-rgb) / 0.55);
  transition:
    color 200ms ease,
    border-color 200ms ease,
    background 200ms ease;
}

.home-chapter-pill:hover {
  color: rgb(var(--fg-rgb) / 0.88);
}

.home-chapter-pill--active {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.1);
  color: var(--color-primary-soft);
}

.home-watched-toggle {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.32rem;
  border-radius: 999px;
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  padding: 0.28rem 0.58rem;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: rgb(var(--fg-rgb) / 0.62);
  transition:
    border-color 200ms ease,
    background 200ms ease,
    color 200ms ease,
    box-shadow 200ms ease;
}

.home-watched-toggle:hover {
  border-color: rgb(var(--color-success-rgb) / 0.35);
  color: rgb(var(--fg-rgb) / 0.88);
}

.home-watched-toggle--active {
  border-color: rgb(var(--color-success-rgb) / 0.42);
  background: linear-gradient(135deg, rgb(var(--color-success-rgb) / 0.16), rgb(var(--color-primary-rgb) / 0.1));
  color: var(--color-success);
  box-shadow: 0 0 16px -9px rgb(var(--color-success-rgb) / 0.75);
}

[data-theme='light'] .home-watched-toggle--active {
  border-color: rgb(var(--color-success-rgb) / 0.45);
  background: linear-gradient(135deg, rgb(var(--color-success-rgb) / 0.12), rgb(var(--color-primary-rgb) / 0.08));
  color: var(--color-success);
  box-shadow: 0 0 14px -10px rgb(var(--color-success-rgb) / 0.55);
}

.home-arcade-tunnel {
  position: relative;
  perspective: 1200px;
}

.home-arcade-tunnel::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(
    to bottom,
    transparent,
    rgb(var(--color-primary-soft-rgb) / 0.08) 8%,
    rgb(var(--color-secondary-rgb) / 0.045) 50%,
    transparent
  );
  pointer-events: none;
  opacity: 0.34;
  transform-origin: 50% 50%;
  animation: home-tunnel-scan 15s ease-in-out infinite;
  will-change: transform, opacity;
}

@keyframes home-tunnel-scan {
  0%,
  100% {
    opacity: 0.14;
    transform: translateX(-50%) scaleY(0.92);
  }
  45% {
    opacity: 0.32;
    transform: translateX(-50%) scaleY(1.06);
  }
  68% {
    opacity: 0.2;
    transform: translateX(-50%) scaleY(0.98);
  }
}

.home-chapter {
  position: relative;
  padding: 0.65rem 0 0;
}

.home-chapter::before {
  content: '';
  position: absolute;
  inset: -0.75rem 0 auto;
  height: 5.5rem;
  border-radius: 1.5rem;
  opacity: 0.14;
  pointer-events: none;
  filter: blur(32px);
  animation: home-chapter-aura 14s ease-in-out infinite;
  will-change: transform, opacity;
}

.home-chapter::after {
  content: '';
  position: absolute;
  right: clamp(0rem, 4vw, 3rem);
  top: 0.15rem;
  width: 2rem;
  aspect-ratio: 3 / 4;
  border-radius: 0.45rem;
  border: 1px solid var(--glass-border);
  background:
    linear-gradient(135deg, rgb(var(--fg-rgb) / 0.1), transparent 48%),
    linear-gradient(145deg, rgb(var(--color-primary-rgb) / 0.14), rgba(244, 114, 182, 0.07));
  opacity: 0.09;
  pointer-events: none;
  animation: home-chapter-card-drift 15s ease-in-out infinite;
  will-change: transform, opacity;
}

@keyframes home-chapter-aura {
  0%,
  100% {
    opacity: 0.14;
    transform: translate3d(0, 0, 0) scaleX(0.96);
  }
  50% {
    opacity: 0.24;
    transform: translate3d(0.55rem, -0.25rem, 0) scaleX(1.035);
  }
}

@keyframes home-chapter-card-drift {
  0%,
  100% {
    opacity: 0.08;
    transform: translate3d(0, 0, 0) rotate(-14deg);
  }
  52% {
    opacity: 0.16;
    transform: translate3d(-0.35rem, -0.45rem, 0) rotate(-11deg) scale(1.035);
  }
}

.home-chapter--aqua::before {
  background: radial-gradient(ellipse 60% 80% at 20% 0%, rgba(34, 211, 238, 0.14), transparent 70%);
}

.home-chapter--primary::before {
  background: radial-gradient(ellipse 70% 80% at 50% 0%, rgb(var(--color-primary-rgb) / 0.16), transparent 72%);
}

.home-chapter--secondary::before {
  background: radial-gradient(ellipse 60% 80% at 30% 0%, rgb(var(--color-secondary-rgb) / 0.14), transparent 70%);
}

.home-chapter--mint::before {
  background: radial-gradient(ellipse 60% 80% at 68% 0%, rgba(94, 234, 212, 0.12), transparent 70%);
}

.home-chapter--live::before {
  background:
    radial-gradient(ellipse 52% 70% at 16% 0%, rgba(34, 211, 238, 0.14), transparent 70%),
    radial-gradient(ellipse 48% 70% at 82% 6%, rgb(var(--color-primary-rgb) / 0.12), transparent 72%);
}

.home-chapter-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.55rem;
}

.home-chapter-num {
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.04em;
  background: linear-gradient(180deg, rgb(var(--fg-rgb) / 0.48), rgb(var(--color-primary-soft-rgb) / 0.18));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.home-chapter-title {
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: rgb(var(--fg-rgb));
}

.home-popular-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.45rem;
}

.home-popular-title-base {
  flex-shrink: 0;
}

.home-popular-timeframe {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.1rem 0.2rem;
}

.home-popular-timeframe-sep {
  color: rgb(var(--fg-rgb) / 0.22);
  font-weight: 500;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.home-popular-timeframe-btn {
  position: relative;
  border: 0;
  background: transparent;
  padding: 0 0.08rem 0.12rem;
  font: inherit;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: rgb(var(--fg-rgb) / 0.38);
  transition:
    color 220ms ease,
    text-shadow 220ms ease;
}

.home-popular-timeframe-btn:hover {
  color: rgb(var(--fg-rgb) / 0.72);
}

.home-popular-timeframe-btn--active {
  color: var(--color-primary-soft);
  text-shadow: 0 0 18px rgb(var(--color-primary-rgb) / 0.35);
}

.home-popular-timeframe-btn--active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgb(var(--color-primary-rgb) / 0.15), var(--color-primary), rgb(var(--color-primary-soft-rgb) / 0.85));
  box-shadow: 0 0 12px rgb(var(--color-primary-rgb) / 0.45);
}

.home-popular-rail-swap {
  animation: home-popular-rail-in 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes home-popular-rail-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-popular-rail-swap {
    animation: none;
  }
}

.home-chapter-sub {
  margin-top: 0.15rem;
  font-size: 0.75rem;
  color: rgb(var(--fg-rgb) / 0.68);
}

.home-chapter-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0;
  border-radius: 999px;
  border: 1px solid var(--glass-border);
  background: var(--glass-bg);
  padding: 0.26rem 0.5rem;
  font-size: 0.65rem;
  font-weight: 700;
  color: rgb(var(--fg-rgb) / 0.68);
  transition:
    border-color 200ms ease,
    color 200ms ease,
    background 200ms ease;
}

.home-chapter-link:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  background: rgb(var(--color-primary-rgb) / 0.1);
  color: var(--color-primary-soft);
}

@keyframes home-card-drift {
  0%,
  100% {
    transform: translate3d(0, var(--idle-y, 0px), 0) rotate(var(--idle-rot, 0deg)) scale(1);
  }
  38% {
    transform: translate3d(0, calc(var(--idle-y, 0px) - var(--idle-lift, 4px)), 0)
      rotate(calc(var(--idle-rot, 0deg) + var(--idle-sway, 0.28deg))) scale(var(--idle-scale, 1.01));
  }
  72% {
    transform: translate3d(0, calc(var(--idle-y, 0px) + var(--idle-dip, 1px)), 0)
      rotate(calc(var(--idle-rot, 0deg) + var(--idle-counter-sway, -0.16deg))) scale(1);
  }
}

@keyframes home-glow-breathe {
  0%,
  100% {
    opacity: var(--glow-min, 0.22);
    transform: scale(0.98);
  }
  50% {
    opacity: var(--glow-max, 0.62);
    transform: scale(1.04);
  }
}

@keyframes shimmer {
  from {
    background-position: 120% 0;
  }
  to {
    background-position: -80% 0;
  }
}

/* Continue watching prism */
.home-prism-grid {
  display: grid;
  gap: 0.6rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr));
}

.home-prism-card {
  position: relative;
  overflow: hidden;
  padding: 0.65rem;
  --idle-lift: 1px;
  --idle-scale: 1.001;
  animation: home-card-drift 9.2s ease-in-out var(--prism-delay, 0s) infinite;
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--prism-accent, var(--color-primary)) 12%, transparent), transparent 12rem),
    var(--glass-bg);
  transition:
    transform 350ms cubic-bezier(0.22, 1, 0.36, 1),
    border-color 300ms ease,
    box-shadow 300ms ease;
  will-change: transform;
}

.home-prism-card:hover,
.home-prism-card:focus-visible {
  animation: none;
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--prism-accent, var(--color-primary)) 45%, transparent);
}

.home-prism-poster {
  position: relative;
  height: 3.75rem;
  width: 2.75rem;
  box-shadow: 0 6px 18px -8px rgba(0, 0, 0, 0.65);
}

.home-prism-progress {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 4px;
  background: var(--glass-border);
}

.home-prism-progress > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--prism-accent, var(--color-primary)), var(--color-secondary));
  box-shadow: 0 0 18px color-mix(in srgb, var(--prism-accent, var(--color-primary)) 70%, transparent);
  transition: width 400ms ease;
}

.home-heat-slot {
  position: relative;
  transition: transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.home-heat-slot > article {
  --idle-lift: 1.5px;
  --idle-sway: 0.08deg;
  --idle-scale: 1.002;
  animation: home-card-drift 9.1s ease-in-out var(--heat-delay, 0s) infinite;
  transform-origin: center bottom;
  will-change: transform;
}

.home-heat-slot:hover,
.home-heat-slot:focus-within {
  transform: translateY(-2px) scale(1.005);
  z-index: 2;
}

.home-heat-slot:hover > article,
.home-heat-slot:focus-within > article {
  animation: none;
  transform: translateZ(0);
}

.home-rank-ribbon {
  position: absolute;
  left: 0.35rem;
  top: 0.35rem;
  z-index: 5;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--heat-accent, var(--color-primary)) 40%, white 8%);
  background: var(--chrome-panel-bg);
  padding: 0.2rem 0.45rem;
  color: color-mix(in srgb, var(--heat-accent, var(--color-primary)) 70%, white 30%);
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Seasonal mood wall — staggered vertical offset */
.home-mood-tile {
  position: relative;
  --idle-y: 0px;
  --idle-lift: 1.5px;
  --idle-sway: 0.08deg;
  --idle-scale: 1.002;
  transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-mood-tile > article {
  --idle-y: 0px;
  animation: home-card-drift 9.4s ease-in-out var(--mood-delay, 0s) infinite;
  transform-origin: center bottom;
  will-change: transform;
}

.home-mood-wall .carousel-track > .home-mood-tile:nth-child(odd) {
  --idle-y: 2px;
  transform: translateY(var(--idle-y));
}

.home-mood-wall .carousel-track > .home-mood-tile:nth-child(even) {
  --idle-y: -1px;
  transform: translateY(var(--idle-y));
}

.home-mood-wall .carousel-track > .home-mood-tile:hover,
.home-mood-wall .carousel-track > .home-mood-tile:focus-within {
  transform: translateY(-3px) scale(1.008);
  z-index: 2;
}

.home-mood-tile:hover > article,
.home-mood-tile:focus-within > article {
  animation: none;
  transform: translateZ(0);
}

.home-mood-tile:hover .home-season-chip-row,
.home-mood-tile:focus-within .home-season-chip-row {
  opacity: 1;
  transform: translateY(0);
}

/* For you stream shimmer */
.home-foryou-card {
  position: relative;
  transition: transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.home-foryou-card > article {
  --idle-lift: 1.5px;
  --idle-sway: 0.08deg;
  --idle-scale: 1.002;
  animation: home-card-drift 9s ease-in-out var(--foryou-delay, 0s) infinite;
  transform-origin: center bottom;
  will-change: transform;
}

.home-foryou-card:hover,
.home-foryou-card:focus-within {
  transform: translateY(-2px) scale(1.005);
  z-index: 2;
}

.home-foryou-card:hover > article,
.home-foryou-card:focus-within > article {
  animation: none;
  transform: translateZ(0);
}

.home-reason-chip {
  position: absolute;
  left: 0.35rem;
  right: 0.35rem;
  bottom: 2.35rem;
  z-index: 4;
  display: inline-flex;
  max-width: calc(100% - 0.7rem);
  align-items: center;
  gap: 0.3rem;
  overflow: hidden;
  border-radius: 999px;
  border: 1px solid rgb(var(--color-success-rgb) / 0.26);
  background: rgb(var(--color-success-rgb) / 0.1);
  padding: 0.22rem 0.48rem;
  color: var(--color-success);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  opacity: 0;
  text-overflow: ellipsis;
  transform: translateY(4px);
  transition:
    opacity 180ms ease,
    transform 180ms ease;
  white-space: nowrap;
}

/* Reason chips sit on dark poster media — keep bright mint in light mode. */
[data-theme='light'] .home-reason-chip {
  border-color: rgba(94, 234, 212, 0.35);
  background: rgba(94, 234, 212, 0.14);
  color: #5eead4;
}

.home-foryou-card:hover .home-reason-chip,
.home-foryou-card:focus-within .home-reason-chip {
  opacity: 1;
  transform: translateY(0);
}

.home-feed-slot {
  position: relative;
  transition: transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.home-feed-slot > article {
  --idle-lift: 1.5px;
  --idle-sway: 0.08deg;
  --idle-scale: 1.002;
  animation: home-card-drift 9.2s ease-in-out var(--feed-delay, 0s) infinite;
  transform-origin: center bottom;
  will-change: transform;
}

.home-feed-slot:hover,
.home-feed-slot:focus-within {
  transform: translateY(-2px) scale(1.005);
  z-index: 2;
}

.home-feed-slot:hover > article,
.home-feed-slot:focus-within > article {
  animation: none;
  transform: translateZ(0);
}

.home-infinite-feed {
  position: relative;
  padding-top: 0.35rem;
}

.home-infinite-row {
  border-radius: 1.25rem;
  padding-block: 0.2rem;
}

.home-infinite-row::before {
  opacity: 0.18;
  background:
    radial-gradient(ellipse 42% 80% at 20% 0%, rgb(var(--color-secondary-rgb) / 0.12), transparent 72%),
    radial-gradient(ellipse 48% 80% at 84% 4%, rgba(34, 211, 238, 0.08), transparent 76%);
}

.home-infinite-row .carousel-track {
  --rail-gap: 0.75rem;
}

.home-resume-slot {
  min-height: 9.5rem;
}

.home-resume-empty {
  display: flex;
  min-height: 9.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: rgb(var(--fg-rgb) / 0.025);
  padding: 1rem;
}

.home-show-more-wrap {
  display: grid;
  place-items: center;
  margin: -0.25rem 0 2rem;
}

.home-show-more,
.home-load-more {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  background: rgb(var(--fg-rgb) / 0.035);
  padding: 0.65rem 1rem;
  color: rgb(var(--fg-rgb) / 0.72);
  font-size: 0.8125rem;
  font-weight: 700;
}

.home-load-more {
  width: min(100%, 20rem);
  margin: 0 auto;
}

.viewport-gate {
  min-width: 0;
  min-height: var(--viewport-gate-height, 20rem);
}

.viewport-gate-placeholder {
  min-height: var(--viewport-gate-height, 20rem);
  border-radius: 0.9rem;
  background:
    linear-gradient(90deg, transparent, rgb(var(--fg-rgb) / 0.025), transparent),
    rgb(var(--fg-rgb) / 0.018);
}

.home-arcade-tunnel .poster-zoom {
  transition-duration: 220ms;
}

.home-arcade-tunnel .group:hover .poster-zoom {
  transform: translate3d(0, -1px, 0) scale(1.02);
}

.home-arcade-tunnel .group:hover .poster-card--compact {
  transform: translate3d(0, -1px, 0);
}

/* Compact embedded schedule on home */
.home-schedule--compact .on-air-deck {
  gap: 0.55rem;
}

.home-schedule--compact .on-air-deck > * {
  flex: 0 0 clamp(14rem, 64vw, 17rem);
}

@media (min-width: 768px) {
  .home-schedule--compact .on-air-deck {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .home-schedule--compact .on-air-deck {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .hype-engine {
    height: clamp(28rem, 72svh, 34rem);
    min-height: clamp(28rem, 72svh, 34rem) !important;
    touch-action: pan-y;
  }

  .hype-engine-content {
    min-height: 100% !important;
    align-content: end;
    padding-top: 4.25rem;
    padding-right: max(1rem, var(--safe-right));
    padding-bottom: calc(6.75rem + var(--safe-bottom)) !important;
    padding-left: max(1rem, var(--safe-left));
  }

  .hype-engine::before,
  .hype-engine::after,
  .hype-engine .hero-accent-orb,
  .hype-engine .hero-accent-orb-b,
  .hype-engine .hero-sweep {
    display: none;
  }

  .hype-engine-backdrop > div {
    inset: 0;
    transform: none !important;
    transition: none;
  }

  .hype-engine-backdrop img {
    opacity: 0.58 !important;
    animation: none !important;
  }

  .hype-engine .hero-media-scrim {
    background: linear-gradient(
      to bottom,
      rgb(var(--media-ink-rgb) / 0.2) 0%,
      rgb(var(--media-ink-rgb) / 0.48) 38%,
      rgb(var(--media-ink-rgb) / 0.98) 100%
    );
  }

  .hype-engine .hero-title-in {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }

  .hype-engine .hero-title-glow {
    display: -webkit-box;
    overflow: hidden;
    background: none !important;
    color: rgb(var(--media-fg-rgb)) !important;
    -webkit-text-fill-color: rgb(var(--media-fg-rgb)) !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .hype-engine .home-rarity-chip,
  .hype-engine .hero-title-in > .h-px {
    display: none;
  }

  .hype-engine .hero-genre-chip:nth-of-type(n + 3) {
    display: none;
  }

  .hero-mobile-actions {
    flex-wrap: nowrap;
  }

  .hero-mobile-actions > * {
    min-height: 2.75rem;
  }

  .hero-mobile-actions .home-cta-pulse,
  .hero-mobile-actions .btn-sheen {
    animation: none !important;
  }

  .spotlight-mobile-dots {
    left: 50% !important;
    bottom: max(0.75rem, var(--safe-bottom)) !important;
    min-height: 2.75rem;
    transform: translateX(-50%) !important;
  }

  .spotlight-dot {
    width: 2.75rem;
    height: 2.75rem;
    position: relative;
    border: 0;
    background: transparent;
    padding: 0;
  }

  .spotlight-dot::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 999px;
    background: rgb(var(--media-fg-rgb) / 0.38);
    transform: translate(-50%, -50%);
    transition: width 160ms ease, background 160ms ease;
  }

  .spotlight-dot--active::after {
    width: 1.25rem;
    background: rgb(var(--media-fg-rgb) / 0.9);
  }

  .home-arcade-divider,
  .home-chapter-strip {
    display: none;
  }

  .home-arcade-nav {
    padding-left: max(0.75rem, var(--safe-left));
    padding-right: max(0.75rem, var(--safe-right));
  }

  .home-arcade-strip {
    gap: 0.5rem;
    overflow: hidden;
  }

  .home-mood-strip {
    min-width: 0;
    flex: 1 1 auto;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .home-mood-strip::-webkit-scrollbar {
    display: none;
  }

  .home-mood-chip {
    min-height: 2.75rem;
    flex: 0 0 auto;
    scroll-snap-align: start;
    padding-inline: 0.75rem;
    font-size: 0.7rem;
  }

  .home-sections-trigger {
    display: inline-flex;
    min-width: 2.75rem;
    min-height: 2.75rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    border: 1px solid var(--glass-border);
    border-radius: 0.7rem;
    background: var(--glass-bg);
    padding: 0.5rem 0.65rem;
    color: rgb(var(--fg-rgb) / 0.72);
    font-size: 0.7rem;
    font-weight: 750;
  }

  .home-sections-sheet {
    display: grid;
    gap: 0.2rem;
  }

  .home-section-sheet-link {
    display: flex;
    width: 100%;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.65rem;
    border: 0;
    border-radius: 0.65rem;
    background: transparent;
    padding: 0.65rem 0.75rem;
    color: rgb(var(--fg-rgb) / 0.7);
    font-size: 0.875rem;
    font-weight: 650;
    text-align: left;
  }

  .home-section-sheet-link--active {
    background: rgb(var(--color-primary-rgb) / 0.12);
    color: var(--color-primary-soft);
  }

  .home-arcade-tunnel::before {
    display: none;
  }

  .home-chapter-num {
    display: none;
  }

  .home-resume-slot {
    min-height: 9.5rem;
  }

  .home-resume-empty {
    display: flex;
    min-height: 9.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid var(--line);
    border-radius: 0.9rem;
    background: rgb(var(--fg-rgb) / 0.025);
    padding: 1rem;
  }

  .home-show-more-wrap {
    display: grid;
    place-items: center;
    margin: -0.25rem 0 2rem;
  }

  .home-show-more,
  .home-load-more {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid var(--line);
    border-radius: 0.7rem;
    background: rgb(var(--fg-rgb) / 0.035);
    padding: 0.65rem 1rem;
    color: rgb(var(--fg-rgb) / 0.72);
    font-size: 0.8125rem;
    font-weight: 700;
  }

  .home-load-more {
    width: min(100%, 20rem);
    margin: 0 auto;
  }

  .home-infinite-row {
    content-visibility: auto;
    contain-intrinsic-size: 24rem;
  }

  .home-arcade .carousel-track {
    --rail-item: clamp(8.2rem, 41vw, 10.25rem) !important;
    scroll-padding-inline: 0.1rem;
  }

  .home-latest-filters {
    max-width: 100%;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-bottom: 0.25rem;
    scrollbar-width: none;
  }

  .home-latest-filters::-webkit-scrollbar {
    display: none;
  }

  .home-latest-filters > * {
    flex: 0 0 auto;
  }

  .home-season-chip-row,
  .home-reason-chip {
    opacity: 1;
    transform: none;
  }

  .home-heat-slot,
  .home-mood-tile,
  .home-foryou-card,
  .home-feed-slot,
  .home-prism-card,
  .home-heat-slot > article,
  .home-mood-tile > article,
  .home-foryou-card > article,
  .home-feed-slot > article {
    animation: none;
    transform: none;
  }
}

@media (max-width: 767px), (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  /* Keep the global header above every non-modal player layer while the page scrolls. */
  #site-header {
    z-index: 100 !important;
  }

  .bg-canvas .aurora,
  .bg-canvas.noise-overlay::after,
  .home-experience::before,
  .home-experience::after,
  .home-arcade-tunnel::before,
  .home-chapter::before,
  .home-chapter::after {
    display: none !important;
  }

  .home-experience *,
  .home-experience *::before,
  .home-experience *::after {
    animation: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    will-change: auto !important;
  }

  .mobile-spotlight-backdrop img {
    filter: none !important;
    transform: none !important;
  }

  .home-arcade-nav {
    display: none !important;
  }

  .home-arcade-tunnel {
    padding-top: 0.75rem;
    padding-right: max(0.75rem, var(--safe-right));
    padding-left: max(0.75rem, var(--safe-left));
  }

  .home-chapter {
    margin-bottom: 1.5rem !important;
  }

  .home-chapter-head {
    min-height: 2rem;
    margin-bottom: 0.55rem;
    gap: 0.5rem;
  }

  .home-chapter-title {
    font-size: 0.875rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
  }

  .home-chapter-link,
  .home-popular-timeframe-btn {
    font-size: 0.6875rem;
  }

  .home-arcade .carousel-track {
    --rail-item: clamp(7.75rem, 39vw, 9.25rem) !important;
    --rail-gap: 0.6rem !important;
  }

  .home-arcade .carousel-track h3 {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
  }

  .home-arcade .carousel-track article > div:last-child {
    margin-top: 0.4rem;
  }

  .home-arcade-tunnel :is(.poster-zoom, .poster-card--compact, .home-prism-card, .home-feed-slot, .home-heat-slot, .home-mood-tile, .home-foryou-card) {
    filter: none !important;
    transform: none !important;
  }
}

@media (max-width: 359px) {
  .home-sections-trigger span {
    display: none;
  }

  .hero-mobile-actions .btn-primary {
    flex: 1 1 auto;
    justify-content: center;
  }

  .hero-mobile-actions .btn-secondary {
    padding-inline: 0.85rem;
  }
}

@media (max-width: 639px) {
  .title-hero .title-hero-layout {
    display: block;
    min-height: 0;
    padding-top: 1.25rem;
    padding-right: max(1rem, var(--safe-right));
    padding-bottom: 1.5rem;
    padding-left: max(1rem, var(--safe-left));
  }

  .title-hero-layout .title-hero-poster {
    position: absolute;
    top: 1.25rem;
    right: max(1rem, var(--safe-right));
    z-index: 1;
    width: 6.5rem;
  }

  .title-hero-layout .title-hero-copy {
    display: block;
    min-width: 0;
  }

  .title-hero-meta,
  .title-hero-native,
  .title-hero-copy h1,
  .title-hero-romaji {
    max-width: calc(100% - 7.5rem);
  }

  .title-hero-copy h1 {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 0.25rem;
    font-size: clamp(1.8rem, 9vw, 2.35rem);
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .title-hero-copy .title-hero-synopsis {
    width: 100%;
    max-width: 100%;
    margin-top: 1.25rem;
    -webkit-line-clamp: 4;
  }

  .title-hero-copy .title-hero-genres {
    width: 100%;
    max-width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.2rem;
    scrollbar-width: none;
  }

  .title-hero-genres::-webkit-scrollbar {
    display: none;
  }

  .title-hero-genres > * {
    flex: 0 0 auto;
  }

  .title-hero-copy .title-hero-actions {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
  }

  .title-hero-actions > a,
  .title-hero-actions > button {
    min-width: 0;
    min-height: 2.75rem;
    justify-content: center;
    padding-inline: 0.75rem;
    text-align: center;
  }

  .title-hero-actions > form {
    grid-column: 1 / -1;
    max-width: none;
  }

  .title-hero-actions > form .field,
  .title-hero-actions > form button {
    min-height: 2.75rem;
  }

  .latest-filters {
    max-width: 100%;
    gap: 0.4rem;
  }

  .latest-filters .chip {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
  }

  .latest-episode-card {
    max-width: 100%;
    gap: 0.75rem;
    padding: 0.7rem;
  }

  .latest-episode-thumb {
    width: clamp(5.25rem, 27vw, 6.5rem);
    height: clamp(3.25rem, 17vw, 4rem);
  }

  .latest-episode-copy,
  .latest-episode-copy > * {
    min-width: 0;
    max-width: 100%;
  }
}
.sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.pointer-events-none{
  pointer-events: none;
}
.pointer-events-auto{
  pointer-events: auto;
}
.\!visible{
  visibility: visible !important;
}
.visible{
  visibility: visible;
}
.invisible{
  visibility: hidden;
}
.collapse{
  visibility: collapse;
}
.static{
  position: static;
}
.fixed{
  position: fixed;
}
.\!absolute{
  position: absolute !important;
}
.absolute{
  position: absolute;
}
.relative{
  position: relative;
}
.sticky{
  position: sticky;
}
.-inset-6{
  inset: -1.5rem;
}
.inset-0{
  inset: 0px;
}
.inset-x-0{
  left: 0px;
  right: 0px;
}
.inset-x-2{
  left: 0.5rem;
  right: 0.5rem;
}
.inset-x-3{
  left: 0.75rem;
  right: 0.75rem;
}
.inset-x-\[max\(3rem\2c 5vw\)\]{
  left: max(3rem,5vw);
  right: max(3rem,5vw);
}
.inset-y-0{
  top: 0px;
  bottom: 0px;
}
.-bottom-0\.5{
  bottom: -0.125rem;
}
.-bottom-24{
  bottom: -6rem;
}
.-left-16{
  left: -4rem;
}
.-left-20{
  left: -5rem;
}
.-left-32{
  left: -8rem;
}
.-right-0\.5{
  right: -0.125rem;
}
.-right-10{
  right: -2.5rem;
}
.-right-12{
  right: -3rem;
}
.-right-16{
  right: -4rem;
}
.-right-20{
  right: -5rem;
}
.-top-0\.5{
  top: -0.125rem;
}
.-top-10{
  top: -2.5rem;
}
.-top-12{
  top: -3rem;
}
.-top-16{
  top: -4rem;
}
.-top-2{
  top: -0.5rem;
}
.-top-20{
  top: -5rem;
}
.-top-24{
  top: -6rem;
}
.bottom-0{
  bottom: 0px;
}
.bottom-1{
  bottom: 0.25rem;
}
.bottom-1\.5{
  bottom: 0.375rem;
}
.bottom-2{
  bottom: 0.5rem;
}
.bottom-3{
  bottom: 0.75rem;
}
.bottom-5{
  bottom: 1.25rem;
}
.bottom-\[-12rem\]{
  bottom: -12rem;
}
.bottom-\[max\(2rem\2c 4vh\)\]{
  bottom: max(2rem,4vh);
}
.left-0{
  left: 0px;
}
.left-1{
  left: 0.25rem;
}
.left-1\.5{
  left: 0.375rem;
}
.left-1\/2{
  left: 50%;
}
.left-1\/3{
  left: 33.333333%;
}
.left-2{
  left: 0.5rem;
}
.left-3{
  left: 0.75rem;
}
.left-3\.5{
  left: 0.875rem;
}
.left-\[8\%\]{
  left: 8%;
}
.right-0{
  right: 0px;
}
.right-1{
  right: 0.25rem;
}
.right-1\.5{
  right: 0.375rem;
}
.right-12{
  right: 3rem;
}
.right-2{
  right: 0.5rem;
}
.right-3{
  right: 0.75rem;
}
.right-4{
  right: 1rem;
}
.right-\[4\%\]{
  right: 4%;
}
.right-\[max\(2rem\2c 4vw\)\]{
  right: max(2rem,4vw);
}
.top-0{
  top: 0px;
}
.top-1{
  top: 0.25rem;
}
.top-1\.5{
  top: 0.375rem;
}
.top-1\/2{
  top: 50%;
}
.top-1\/3{
  top: 33.333333%;
}
.top-1\/4{
  top: 25%;
}
.top-16{
  top: 4rem;
}
.top-2{
  top: 0.5rem;
}
.top-3{
  top: 0.75rem;
}
.top-4{
  top: 1rem;
}
.top-7{
  top: 1.75rem;
}
.top-\[10\%\]{
  top: 10%;
}
.top-\[max\(2rem\2c 4vh\)\]{
  top: max(2rem,4vh);
}
.top-\[max\(7rem\2c 14vh\)\]{
  top: max(7rem,14vh);
}
.top-full{
  top: 100%;
}
.isolate{
  isolation: isolate;
}
.z-10{
  z-index: 10;
}
.z-20{
  z-index: 20;
}
.z-30{
  z-index: 30;
}
.z-50{
  z-index: 50;
}
.z-\[1\]{
  z-index: 1;
}
.z-\[55\]{
  z-index: 55;
}
.z-\[58\]{
  z-index: 58;
}
.z-\[5\]{
  z-index: 5;
}
.z-\[60\]{
  z-index: 60;
}
.z-\[70\]{
  z-index: 70;
}
.z-\[80\]{
  z-index: 80;
}
.order-first{
  order: -9999;
}
.col-span-2{
  grid-column: span 2 / span 2;
}
.col-span-5{
  grid-column: span 5 / span 5;
}
.col-span-full{
  grid-column: 1 / -1;
}
.-mx-4{
  margin-left: -1rem;
  margin-right: -1rem;
}
.mx-1{
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.mx-auto{
  margin-left: auto;
  margin-right: auto;
}
.my-2{
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.my-4{
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.my-5{
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}
.-mt-20{
  margin-top: -5rem;
}
.-mt-8{
  margin-top: -2rem;
}
.mb-0\.5{
  margin-bottom: 0.125rem;
}
.mb-1{
  margin-bottom: 0.25rem;
}
.mb-1\.5{
  margin-bottom: 0.375rem;
}
.mb-2{
  margin-bottom: 0.5rem;
}
.mb-3{
  margin-bottom: 0.75rem;
}
.mb-3\.5{
  margin-bottom: 0.875rem;
}
.mb-4{
  margin-bottom: 1rem;
}
.mb-5{
  margin-bottom: 1.25rem;
}
.mb-6{
  margin-bottom: 1.5rem;
}
.mb-7{
  margin-bottom: 1.75rem;
}
.mb-8{
  margin-bottom: 2rem;
}
.ml-0\.5{
  margin-left: 0.125rem;
}
.ml-1{
  margin-left: 0.25rem;
}
.ml-1\.5{
  margin-left: 0.375rem;
}
.ml-2{
  margin-left: 0.5rem;
}
.ml-5{
  margin-left: 1.25rem;
}
.ml-6{
  margin-left: 1.5rem;
}
.ml-auto{
  margin-left: auto;
}
.mr-1{
  margin-right: 0.25rem;
}
.mr-1\.5{
  margin-right: 0.375rem;
}
.mr-2{
  margin-right: 0.5rem;
}
.mt-0\.5{
  margin-top: 0.125rem;
}
.mt-1{
  margin-top: 0.25rem;
}
.mt-1\.5{
  margin-top: 0.375rem;
}
.mt-10{
  margin-top: 2.5rem;
}
.mt-12{
  margin-top: 3rem;
}
.mt-2{
  margin-top: 0.5rem;
}
.mt-2\.5{
  margin-top: 0.625rem;
}
.mt-3{
  margin-top: 0.75rem;
}
.mt-4{
  margin-top: 1rem;
}
.mt-5{
  margin-top: 1.25rem;
}
.mt-6{
  margin-top: 1.5rem;
}
.mt-7{
  margin-top: 1.75rem;
}
.mt-8{
  margin-top: 2rem;
}
.mt-9{
  margin-top: 2.25rem;
}
.mt-auto{
  margin-top: auto;
}
.line-clamp-1{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.line-clamp-2{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.line-clamp-3{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.line-clamp-4{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}
.block{
  display: block;
}
.inline-block{
  display: inline-block;
}
.\!inline{
  display: inline !important;
}
.inline{
  display: inline;
}
.flex{
  display: flex;
}
.inline-flex{
  display: inline-flex;
}
.grid{
  display: grid;
}
.contents{
  display: contents;
}
.hidden{
  display: none;
}
.aspect-\[16\/9\]{
  aspect-ratio: 16/9;
}
.aspect-\[3\/4\]{
  aspect-ratio: 3/4;
}
.aspect-square{
  aspect-ratio: 1 / 1;
}
.aspect-video{
  aspect-ratio: 16 / 9;
}
.h-0{
  height: 0px;
}
.h-0\.5{
  height: 0.125rem;
}
.h-1{
  height: 0.25rem;
}
.h-1\.5{
  height: 0.375rem;
}
.h-10{
  height: 2.5rem;
}
.h-11{
  height: 2.75rem;
}
.h-12{
  height: 3rem;
}
.h-14{
  height: 3.5rem;
}
.h-16{
  height: 4rem;
}
.h-2{
  height: 0.5rem;
}
.h-2\.5{
  height: 0.625rem;
}
.h-20{
  height: 5rem;
}
.h-24{
  height: 6rem;
}
.h-28{
  height: 7rem;
}
.h-3{
  height: 0.75rem;
}
.h-3\.5{
  height: 0.875rem;
}
.h-32{
  height: 8rem;
}
.h-36{
  height: 9rem;
}
.h-4{
  height: 1rem;
}
.h-40{
  height: 10rem;
}
.h-44{
  height: 11rem;
}
.h-48{
  height: 12rem;
}
.h-5{
  height: 1.25rem;
}
.h-52{
  height: 13rem;
}
.h-56{
  height: 14rem;
}
.h-6{
  height: 1.5rem;
}
.h-60{
  height: 15rem;
}
.h-64{
  height: 16rem;
}
.h-7{
  height: 1.75rem;
}
.h-72{
  height: 18rem;
}
.h-8{
  height: 2rem;
}
.h-9{
  height: 2.25rem;
}
.h-\[100dvh\]{
  height: 100dvh;
}
.h-\[32rem\]{
  height: 32rem;
}
.h-\[34rem\]{
  height: 34rem;
}
.h-\[3px\]{
  height: 3px;
}
.h-\[4\.25rem\]{
  height: 4.25rem;
}
.h-\[4\.5rem\]{
  height: 4.5rem;
}
.h-\[45\%\]{
  height: 45%;
}
.h-fit{
  height: -moz-fit-content;
  height: fit-content;
}
.h-full{
  height: 100%;
}
.h-px{
  height: 1px;
}
.max-h-36{
  max-height: 9rem;
}
.max-h-48{
  max-height: 12rem;
}
.max-h-72{
  max-height: 18rem;
}
.max-h-\[55vh\]{
  max-height: 55vh;
}
.max-h-\[78dvh\]{
  max-height: 78dvh;
}
.max-h-\[min\(60dvh\2c 32rem\)\]{
  max-height: min(60dvh,32rem);
}
.max-h-\[min\(68dvh\2c 42rem\)\]{
  max-height: min(68dvh,42rem);
}
.max-h-\[min\(88vh\2c 42rem\)\]{
  max-height: min(88vh,42rem);
}
.min-h-0{
  min-height: 0px;
}
.min-h-11{
  min-height: 2.75rem;
}
.min-h-16{
  min-height: 4rem;
}
.min-h-20{
  min-height: 5rem;
}
.min-h-24{
  min-height: 6rem;
}
.min-h-28{
  min-height: 7rem;
}
.min-h-32{
  min-height: 8rem;
}
.min-h-36{
  min-height: 9rem;
}
.min-h-40{
  min-height: 10rem;
}
.min-h-72{
  min-height: 18rem;
}
.min-h-\[100dvh\]{
  min-height: 100dvh;
}
.min-h-\[16px\]{
  min-height: 16px;
}
.min-h-\[18rem\]{
  min-height: 18rem;
}
.min-h-\[28rem\]{
  min-height: 28rem;
}
.min-h-\[30rem\]{
  min-height: 30rem;
}
.min-h-\[38vh\]{
  min-height: 38vh;
}
.min-h-\[4\.75rem\]{
  min-height: 4.75rem;
}
.min-h-\[46vh\]{
  min-height: 46vh;
}
.min-h-\[5\.5rem\]{
  min-height: 5.5rem;
}
.min-h-\[60dvh\]{
  min-height: 60dvh;
}
.min-h-\[65dvh\]{
  min-height: 65dvh;
}
.min-h-\[65vh\]{
  min-height: 65vh;
}
.min-h-\[70dvh\]{
  min-height: 70dvh;
}
.min-h-\[70vh\]{
  min-height: 70vh;
}
.min-h-screen{
  min-height: 100vh;
}
.w-0{
  width: 0px;
}
.w-0\.5{
  width: 0.125rem;
}
.w-1{
  width: 0.25rem;
}
.w-1\.5{
  width: 0.375rem;
}
.w-1\/2{
  width: 50%;
}
.w-1\/3{
  width: 33.333333%;
}
.w-10{
  width: 2.5rem;
}
.w-11{
  width: 2.75rem;
}
.w-12{
  width: 3rem;
}
.w-14{
  width: 3.5rem;
}
.w-16{
  width: 4rem;
}
.w-2{
  width: 0.5rem;
}
.w-2\.5{
  width: 0.625rem;
}
.w-20{
  width: 5rem;
}
.w-24{
  width: 6rem;
}
.w-28{
  width: 7rem;
}
.w-3\/4{
  width: 75%;
}
.w-32{
  width: 8rem;
}
.w-36{
  width: 9rem;
}
.w-4{
  width: 1rem;
}
.w-40{
  width: 10rem;
}
.w-48{
  width: 12rem;
}
.w-5{
  width: 1.25rem;
}
.w-52{
  width: 13rem;
}
.w-56{
  width: 14rem;
}
.w-6{
  width: 1.5rem;
}
.w-64{
  width: 16rem;
}
.w-7{
  width: 1.75rem;
}
.w-72{
  width: 18rem;
}
.w-8{
  width: 2rem;
}
.w-9{
  width: 2.25rem;
}
.w-\[18px\]{
  width: 18px;
}
.w-\[3\.75rem\]{
  width: 3.75rem;
}
.w-\[32rem\]{
  width: 32rem;
}
.w-\[34rem\]{
  width: 34rem;
}
.w-\[36rem\]{
  width: 36rem;
}
.w-\[4\.25rem\]{
  width: 4.25rem;
}
.w-\[4\.5rem\]{
  width: 4.5rem;
}
.w-\[min\(22rem\2c calc\(100vw-1\.5rem\)\)\]{
  width: min(22rem,calc(100vw - 1.5rem));
}
.w-auto{
  width: auto;
}
.w-fit{
  width: -moz-fit-content;
  width: fit-content;
}
.w-full{
  width: 100%;
}
.w-px{
  width: 1px;
}
.w-screen{
  width: 100vw;
}
.min-w-0{
  min-width: 0px;
}
.min-w-5{
  min-width: 1.25rem;
}
.min-w-6{
  min-width: 1.5rem;
}
.min-w-7{
  min-width: 1.75rem;
}
.min-w-\[11rem\]{
  min-width: 11rem;
}
.min-w-\[13rem\]{
  min-width: 13rem;
}
.min-w-\[16px\]{
  min-width: 16px;
}
.max-w-16{
  max-width: 4rem;
}
.max-w-2xl{
  max-width: 42rem;
}
.max-w-32{
  max-width: 8rem;
}
.max-w-3xl{
  max-width: 48rem;
}
.max-w-5xl{
  max-width: 64rem;
}
.max-w-6xl{
  max-width: 72rem;
}
.max-w-7xl{
  max-width: 80rem;
}
.max-w-\[100rem\]{
  max-width: 100rem;
}
.max-w-\[106rem\]{
  max-width: 106rem;
}
.max-w-\[110rem\]{
  max-width: 110rem;
}
.max-w-\[25rem\]{
  max-width: 25rem;
}
.max-w-\[76rem\]{
  max-width: 76rem;
}
.max-w-\[84rem\]{
  max-width: 84rem;
}
.max-w-\[90rem\]{
  max-width: 90rem;
}
.max-w-\[92rem\]{
  max-width: 92rem;
}
.max-w-\[calc\(100\%-1\.5rem\)\]{
  max-width: calc(100% - 1.5rem);
}
.max-w-full{
  max-width: 100%;
}
.max-w-lg{
  max-width: 32rem;
}
.max-w-md{
  max-width: 28rem;
}
.max-w-sm{
  max-width: 24rem;
}
.max-w-xl{
  max-width: 36rem;
}
.max-w-xs{
  max-width: 20rem;
}
.flex-1{
  flex: 1 1 0%;
}
.shrink-0{
  flex-shrink: 0;
}
.grow{
  flex-grow: 1;
}
.basis-full{
  flex-basis: 100%;
}
.origin-left{
  transform-origin: left;
}
.-translate-x-1\/2{
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2{
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-0\.5{
  --tw-translate-x: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-3{
  --tw-translate-y: 0.75rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-105{
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-110{
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-75{
  --tw-scale-x: .75;
  --tw-scale-y: .75;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes kenburns{
  0%{
    transform: scale(1.05) translateY(0);
  }
  100%{
    transform: scale(1.14) translateY(-1.5%);
  }
}
.animate-kenburns{
  animation: kenburns 9s ease-out forwards;
}
@keyframes ping{
  75%, 100%{
    transform: scale(2);
    opacity: 0;
  }
}
.animate-ping{
  animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes pulse{
  50%{
    opacity: .5;
  }
}
.animate-pulse{
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes spin{
  to{
    transform: rotate(360deg);
  }
}
.animate-spin{
  animation: spin 1s linear infinite;
}
@keyframes spotlight-progress{
  0%{
    width: 0%;
  }
  100%{
    width: 100%;
  }
}
.animate-spotlight-progress{
  animation: spotlight-progress 6s linear forwards;
}
.cursor-default{
  cursor: default;
}
.cursor-grab{
  cursor: grab;
}
.cursor-pointer{
  cursor: pointer;
}
.resize-none{
  resize: none;
}
.resize-y{
  resize: vertical;
}
.resize{
  resize: both;
}
.scroll-mt-24{
  scroll-margin-top: 6rem;
}
.scroll-mt-32{
  scroll-margin-top: 8rem;
}
.list-disc{
  list-style-type: disc;
}
.list-none{
  list-style-type: none;
}
.grid-cols-1{
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-5{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.grid-cols-8{
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.grid-cols-\[auto_minmax\(0\2c 1fr\)\]{
  grid-template-columns: auto minmax(0,1fr);
}
.flex-row{
  flex-direction: row;
}
.flex-col{
  flex-direction: column;
}
.flex-col-reverse{
  flex-direction: column-reverse;
}
.flex-wrap{
  flex-wrap: wrap;
}
.place-items-end{
  place-items: end;
}
.place-items-center{
  place-items: center;
}
.content-center{
  align-content: center;
}
.content-start{
  align-content: flex-start;
}
.content-end{
  align-content: flex-end;
}
.items-start{
  align-items: flex-start;
}
.items-end{
  align-items: flex-end;
}
.items-center{
  align-items: center;
}
.items-baseline{
  align-items: baseline;
}
.justify-end{
  justify-content: flex-end;
}
.justify-center{
  justify-content: center;
}
.justify-between{
  justify-content: space-between;
}
.justify-items-center{
  justify-items: center;
}
.gap-0{
  gap: 0px;
}
.gap-0\.5{
  gap: 0.125rem;
}
.gap-1{
  gap: 0.25rem;
}
.gap-1\.5{
  gap: 0.375rem;
}
.gap-2{
  gap: 0.5rem;
}
.gap-2\.5{
  gap: 0.625rem;
}
.gap-3{
  gap: 0.75rem;
}
.gap-3\.5{
  gap: 0.875rem;
}
.gap-4{
  gap: 1rem;
}
.gap-5{
  gap: 1.25rem;
}
.gap-6{
  gap: 1.5rem;
}
.gap-8{
  gap: 2rem;
}
.gap-\[clamp\(2rem\2c 5vw\2c 7rem\)\]{
  gap: clamp(2rem,5vw,7rem);
}
.gap-x-2{
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.gap-x-3{
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-x-4{
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-x-6{
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-x-7{
  -moz-column-gap: 1.75rem;
       column-gap: 1.75rem;
}
.gap-y-1{
  row-gap: 0.25rem;
}
.gap-y-1\.5{
  row-gap: 0.375rem;
}
.gap-y-2{
  row-gap: 0.5rem;
}
.gap-y-3{
  row-gap: 0.75rem;
}
.gap-y-5{
  row-gap: 1.25rem;
}
.space-y-1 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-7 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(1.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.75rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]){
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-fg\/\[0\.05\] > :not([hidden]) ~ :not([hidden]){
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
}
.divide-fg\/\[0\.07\] > :not([hidden]) ~ :not([hidden]){
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
}
.self-stretch{
  align-self: stretch;
}
.justify-self-center{
  justify-self: center;
}
.overflow-auto{
  overflow: auto;
}
.\!overflow-hidden{
  overflow: hidden !important;
}
.overflow-hidden{
  overflow: hidden;
}
.overflow-visible{
  overflow: visible;
}
.overflow-x-auto{
  overflow-x: auto;
}
.overflow-y-auto{
  overflow-y: auto;
}
.truncate{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap{
  white-space: nowrap;
}
.whitespace-pre-wrap{
  white-space: pre-wrap;
}
.break-words{
  overflow-wrap: break-word;
}
.rounded{
  border-radius: 0.5rem;
}
.rounded-2xl{
  border-radius: 1rem;
}
.rounded-3xl{
  border-radius: 1.5rem;
}
.rounded-\[1\.6rem\]{
  border-radius: 1.6rem;
}
.rounded-\[2\.25rem\]{
  border-radius: 2.25rem;
}
.rounded-\[2rem\]{
  border-radius: 2rem;
}
.rounded-full{
  border-radius: 9999px;
}
.rounded-lg{
  border-radius: 0.5rem;
}
.rounded-md{
  border-radius: 0.375rem;
}
.rounded-xl{
  border-radius: 0.75rem;
}
.rounded-l-lg{
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.rounded-t-3xl{
  border-top-left-radius: 1.5rem;
  border-top-right-radius: 1.5rem;
}
.rounded-t-lg{
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}
.border{
  border-width: 1px;
}
.border-0{
  border-width: 0px;
}
.border-2{
  border-width: 2px;
}
.border-4{
  border-width: 4px;
}
.border-y{
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-b{
  border-bottom-width: 1px;
}
.border-l{
  border-left-width: 1px;
}
.border-l-2{
  border-left-width: 2px;
}
.border-t{
  border-top-width: 1px;
}
.border-dashed{
  border-style: dashed;
}
.border-\[\#22d3ee\]\/30{
  border-color: rgb(34 211 238 / 0.3);
}
.border-\[\#a78bfa\]\/35{
  border-color: rgb(167 139 250 / 0.35);
}
.border-\[\#fbbf24\]\/30{
  border-color: rgb(251 191 36 / 0.3);
}
.border-\[color\:var\(--glass-border\)\]{
  border-color: var(--glass-border);
}
.border-amber-300\/20{
  border-color: rgb(252 211 77 / 0.2);
}
.border-aqua\/15{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.15);
}
.border-aqua\/20{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.2);
}
.border-aqua\/25{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.25);
}
.border-aqua\/30{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.3);
}
.border-aqua\/40{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.4);
}
.border-black\/35{
  border-color: rgb(0 0 0 / 0.35);
}
.border-danger\/15{
  border-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.15);
}
.border-danger\/20{
  border-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.2);
}
.border-danger\/25{
  border-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.25);
}
.border-danger\/30{
  border-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.3);
}
.border-emerald-300\/25{
  border-color: rgb(110 231 183 / 0.25);
}
.border-emerald-400\/20{
  border-color: rgb(52 211 153 / 0.2);
}
.border-fg\/10{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}
.border-fg\/15{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.15);
}
.border-fg\/20{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.2);
}
.border-fg\/25{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.25);
}
.border-fg\/30{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.3);
}
.border-fg\/35{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.35);
}
.border-fg\/\[0\.05\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
}
.border-fg\/\[0\.06\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
}
.border-fg\/\[0\.07\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
}
.border-fg\/\[0\.08\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.08);
}
.border-fg\/\[0\.09\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.09);
}
.border-fg\/\[0\.1\]{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}
.border-gold\/20{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.2);
}
.border-gold\/25{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.25);
}
.border-gold\/30{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.3);
}
.border-gold\/35{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.35);
}
.border-gold\/40{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.4);
}
.border-ink{
  border-color: var(--ink, #04040a);
}
.border-media-fg\/10{
  border-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.1);
}
.border-media-fg\/15{
  border-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.15);
}
.border-mint\/20{
  border-color: rgb(var(--color-success-rgb, 94 234 212) / 0.2);
}
.border-mint\/25{
  border-color: rgb(var(--color-success-rgb, 94 234 212) / 0.25);
}
.border-mint\/30{
  border-color: rgb(var(--color-success-rgb, 94 234 212) / 0.3);
}
.border-mint\/40{
  border-color: rgb(var(--color-success-rgb, 94 234 212) / 0.4);
}
.border-primary{
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / var(--tw-border-opacity, 1));
}
.border-primary\/15{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
}
.border-primary\/20{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.2);
}
.border-primary\/25{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.25);
}
.border-primary\/30{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.3);
}
.border-primary\/35{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.35);
}
.border-primary\/40{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
}
.border-primary\/50{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.5);
}
.border-primary\/60{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.6);
}
.border-red-400\/30{
  border-color: rgb(248 113 113 / 0.3);
}
.border-red-500\/20{
  border-color: rgb(239 68 68 / 0.2);
}
.border-red-500\/25{
  border-color: rgb(239 68 68 / 0.25);
}
.border-secondary\/25{
  border-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.25);
}
.border-secondary\/30{
  border-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.3);
}
.border-success\/20{
  border-color: rgb(var(--color-success-rgb, 94 234 212) / 0.2);
}
.border-surface-raised{
  --tw-border-opacity: 1;
  border-color: rgb(var(--surface-raised-rgb, 15 15 24) / var(--tw-border-opacity, 1));
}
.border-transparent{
  border-color: transparent;
}
.border-warning\/20{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.2);
}
.border-white{
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-white\/10{
  border-color: rgb(255 255 255 / 0.1);
}
.border-white\/15{
  border-color: rgb(255 255 255 / 0.15);
}
.border-white\/20{
  border-color: rgb(255 255 255 / 0.2);
}
.border-white\/35{
  border-color: rgb(255 255 255 / 0.35);
}
.border-l-primary\/20{
  border-left-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.2);
}
.bg-\[\#07070b\]{
  --tw-bg-opacity: 1;
  background-color: rgb(7 7 11 / var(--tw-bg-opacity, 1));
}
.bg-\[\#09090f\]{
  --tw-bg-opacity: 1;
  background-color: rgb(9 9 15 / var(--tw-bg-opacity, 1));
}
.bg-\[\#12121a\]{
  --tw-bg-opacity: 1;
  background-color: rgb(18 18 26 / var(--tw-bg-opacity, 1));
}
.bg-\[\#22d3ee\]\/15{
  background-color: rgb(34 211 238 / 0.15);
}
.bg-\[\#5eead4\]{
  --tw-bg-opacity: 1;
  background-color: rgb(94 234 212 / var(--tw-bg-opacity, 1));
}
.bg-\[\#a78bfa\]\/15{
  background-color: rgb(167 139 250 / 0.15);
}
.bg-\[\#fbbf24\]\/15{
  background-color: rgb(251 191 36 / 0.15);
}
.bg-\[var\(--chrome-panel-bg\)\]{
  background-color: var(--chrome-panel-bg);
}
.bg-amber-400{
  --tw-bg-opacity: 1;
  background-color: rgb(251 191 36 / var(--tw-bg-opacity, 1));
}
.bg-amber-400\/10{
  background-color: rgb(251 191 36 / 0.1);
}
.bg-amber-500{
  --tw-bg-opacity: 1;
  background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
}
.bg-aqua{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-info-rgb, 34 211 238) / var(--tw-bg-opacity, 1));
}
.bg-aqua\/10{
  background-color: rgb(var(--color-info-rgb, 34 211 238) / 0.1);
}
.bg-aqua\/15{
  background-color: rgb(var(--color-info-rgb, 34 211 238) / 0.15);
}
.bg-aqua\/90{
  background-color: rgb(var(--color-info-rgb, 34 211 238) / 0.9);
}
.bg-aqua\/\[0\.1\]{
  background-color: rgb(var(--color-info-rgb, 34 211 238) / 0.1);
}
.bg-black{
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-black\/20{
  background-color: rgb(0 0 0 / 0.2);
}
.bg-black\/25{
  background-color: rgb(0 0 0 / 0.25);
}
.bg-black\/35{
  background-color: rgb(0 0 0 / 0.35);
}
.bg-black\/40{
  background-color: rgb(0 0 0 / 0.4);
}
.bg-black\/50{
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/55{
  background-color: rgb(0 0 0 / 0.55);
}
.bg-black\/60{
  background-color: rgb(0 0 0 / 0.6);
}
.bg-black\/65{
  background-color: rgb(0 0 0 / 0.65);
}
.bg-black\/70{
  background-color: rgb(0 0 0 / 0.7);
}
.bg-black\/75{
  background-color: rgb(0 0 0 / 0.75);
}
.bg-black\/80{
  background-color: rgb(0 0 0 / 0.8);
}
.bg-black\/85{
  background-color: rgb(0 0 0 / 0.85);
}
.bg-black\/90{
  background-color: rgb(0 0 0 / 0.9);
}
.bg-danger{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / var(--tw-bg-opacity, 1));
}
.bg-danger\/10{
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.1);
}
.bg-danger\/85{
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.85);
}
.bg-danger\/90{
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.9);
}
.bg-emerald-400{
  --tw-bg-opacity: 1;
  background-color: rgb(52 211 153 / var(--tw-bg-opacity, 1));
}
.bg-emerald-400\/10{
  background-color: rgb(52 211 153 / 0.1);
}
.bg-emerald-400\/\[0\.055\]{
  background-color: rgb(52 211 153 / 0.055);
}
.bg-fg\/10{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}
.bg-fg\/25{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.25);
}
.bg-fg\/80{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.8);
}
.bg-fg\/\[0\.025\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.025);
}
.bg-fg\/\[0\.02\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.02);
}
.bg-fg\/\[0\.035\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.035);
}
.bg-fg\/\[0\.03\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.03);
}
.bg-fg\/\[0\.04\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.04);
}
.bg-fg\/\[0\.05\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
}
.bg-fg\/\[0\.06\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
}
.bg-fg\/\[0\.08\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.08);
}
.bg-fg\/\[0\.09\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.09);
}
.bg-fg\/\[0\.12\]{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.12);
}
.bg-fuchsia-700\/10{
  background-color: rgb(162 28 175 / 0.1);
}
.bg-gold{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / var(--tw-bg-opacity, 1));
}
.bg-gold\/10{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.1);
}
.bg-gold\/15{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.15);
}
.bg-gold\/90{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.9);
}
.bg-gold\/\[0\.04\]{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.04);
}
.bg-gold\/\[0\.07\]{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.07);
}
.bg-gold\/\[0\.08\]{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.08);
}
.bg-ink{
  background-color: var(--ink, #04040a);
}
.bg-media-fg\/\[0\.05\]{
  background-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.05);
}
.bg-media-fg\/\[0\.06\]{
  background-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.06);
}
.bg-media-fg\/\[0\.08\]{
  background-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.08);
}
.bg-media-ink\/40{
  background-color: rgb(var(--media-ink-rgb, 4 4 10) / 0.4);
}
.bg-media-ink\/55{
  background-color: rgb(var(--media-ink-rgb, 4 4 10) / 0.55);
}
.bg-media-ink\/95{
  background-color: rgb(var(--media-ink-rgb, 4 4 10) / 0.95);
}
.bg-mint{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-success-rgb, 94 234 212) / var(--tw-bg-opacity, 1));
}
.bg-mint\/10{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.1);
}
.bg-mint\/15{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.15);
}
.bg-mint\/5{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.05);
}
.bg-mint\/90{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.9);
}
.bg-panel{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / var(--tw-bg-opacity, 1));
}
.bg-primary{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / var(--tw-bg-opacity, 1));
}
.bg-primary-soft{
  background-color: var(--color-primary-soft, #9ec5ff);
}
.bg-primary\/10{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.1);
}
.bg-primary\/15{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
}
.bg-primary\/20{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.2);
}
.bg-primary\/25{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.25);
}
.bg-primary\/80{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.8);
}
.bg-primary\/90{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.9);
}
.bg-primary\/\[0\.04\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.04);
}
.bg-primary\/\[0\.06\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.06);
}
.bg-primary\/\[0\.07\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.07);
}
.bg-primary\/\[0\.08\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.08);
}
.bg-primary\/\[0\.09\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.09);
}
.bg-primary\/\[0\.12\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.12);
}
.bg-primary\/\[0\.16\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.16);
}
.bg-primary\/\[0\.18\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.18);
}
.bg-primary\/\[0\.1\]{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.1);
}
.bg-red-400\/10{
  background-color: rgb(248 113 113 / 0.1);
}
.bg-red-500{
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
}
.bg-red-500\/10{
  background-color: rgb(239 68 68 / 0.1);
}
.bg-red-500\/15{
  background-color: rgb(239 68 68 / 0.15);
}
.bg-red-600{
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
.bg-secondary{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / var(--tw-bg-opacity, 1));
}
.bg-secondary\/10{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.1);
}
.bg-secondary\/15{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.15);
}
.bg-secondary\/20{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.2);
}
.bg-secondary\/90{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.9);
}
.bg-secondary\/\[0\.035\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.035);
}
.bg-secondary\/\[0\.06\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.06);
}
.bg-secondary\/\[0\.12\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.12);
}
.bg-secondary\/\[0\.14\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.14);
}
.bg-secondary\/\[0\.16\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.16);
}
.bg-secondary\/\[0\.1\]{
  background-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.1);
}
.bg-success\/10{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.1);
}
.bg-surface-overlay{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--surface-overlay-rgb, 21 21 32) / var(--tw-bg-opacity, 1));
}
.bg-surface-overlay\/70{
  background-color: rgb(var(--surface-overlay-rgb, 21 21 32) / 0.7);
}
.bg-surface-overlay\/80{
  background-color: rgb(var(--surface-overlay-rgb, 21 21 32) / 0.8);
}
.bg-surface-overlay\/90{
  background-color: rgb(var(--surface-overlay-rgb, 21 21 32) / 0.9);
}
.bg-surface-overlay\/95{
  background-color: rgb(var(--surface-overlay-rgb, 21 21 32) / 0.95);
}
.bg-surface-raised{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / var(--tw-bg-opacity, 1));
}
.bg-surface-raised\/40{
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / 0.4);
}
.bg-surface-raised\/70{
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / 0.7);
}
.bg-surface-raised\/90{
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / 0.9);
}
.bg-surface-raised\/95{
  background-color: rgb(var(--surface-raised-rgb, 15 15 24) / 0.95);
}
.bg-transparent{
  background-color: transparent;
}
.bg-violet-700\/15{
  background-color: rgb(109 40 217 / 0.15);
}
.bg-warning\/10{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.1);
}
.bg-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/10{
  background-color: rgb(255 255 255 / 0.1);
}
.bg-white\/\[0\.045\]{
  background-color: rgb(255 255 255 / 0.045);
}
.bg-white\/\[0\.05\]{
  background-color: rgb(255 255 255 / 0.05);
}
.bg-white\/\[0\.06\]{
  background-color: rgb(255 255 255 / 0.06);
}
.bg-gradient-to-b{
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}
.bg-gradient-to-br{
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.bg-gradient-to-l{
  background-image: linear-gradient(to left, var(--tw-gradient-stops));
}
.bg-gradient-to-r{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
.bg-gradient-to-t{
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
}
.from-\[var\(--poster-a\)\]{
  --tw-gradient-from: var(--poster-a) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-black{
  --tw-gradient-from: #000 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-black\/80{
  --tw-gradient-from: rgb(0 0 0 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-black\/85{
  --tw-gradient-from: rgb(0 0 0 / 0.85) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-black\/95{
  --tw-gradient-from: rgb(0 0 0 / 0.95) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-ink{
  --tw-gradient-from: var(--ink, #04040a) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 1) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(var(--color-primary-rgb, 79 124 255) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary-deep{
  --tw-gradient-from: var(--color-primary-deep, #1e3a8a) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/15{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.15) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/20{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/25{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.25) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/30{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.3) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/70{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.7) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/\[0\.08\]{
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.08) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-red-500\/\[0\.08\]{
  --tw-gradient-from: rgb(239 68 68 / 0.08) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(239 68 68 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-transparent{
  --tw-gradient-from: transparent var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-black{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #000 var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-black\/20{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.2) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-black\/55{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.55) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-black\/70{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.7) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-black\/75{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.75) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-primary{
  --tw-gradient-to: rgb(var(--color-primary-rgb, 79 124 255) / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--color-primary-rgb, 79 124 255) / 1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-primary\/50{
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--color-primary-rgb, 79 124 255) / 0.5) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-secondary{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--color-secondary-rgb, 99 102 241) / 1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-secondary\/50{
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--color-secondary-rgb, 99 102 241) / 0.5) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-transparent{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), transparent var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-\[var\(--poster-b\)\]{
  --tw-gradient-to: var(--poster-b) var(--tw-gradient-to-position);
}
.to-aqua{
  --tw-gradient-to: rgb(var(--color-info-rgb, 34 211 238) / 1) var(--tw-gradient-to-position);
}
.to-black\/10{
  --tw-gradient-to: rgb(0 0 0 / 0.1) var(--tw-gradient-to-position);
}
.to-black\/20{
  --tw-gradient-to: rgb(0 0 0 / 0.2) var(--tw-gradient-to-position);
}
.to-secondary{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 1) var(--tw-gradient-to-position);
}
.to-secondary-deep{
  --tw-gradient-to: var(--color-secondary-deep, #4338ca) var(--tw-gradient-to-position);
}
.to-secondary\/10{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0.1) var(--tw-gradient-to-position);
}
.to-secondary\/15{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0.15) var(--tw-gradient-to-position);
}
.to-secondary\/20{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0.2) var(--tw-gradient-to-position);
}
.to-secondary\/70{
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0.7) var(--tw-gradient-to-position);
}
.to-transparent{
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}
.object-contain{
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover{
  -o-object-fit: cover;
     object-fit: cover;
}
.object-\[center_bottom\]{
  -o-object-position: center bottom;
     object-position: center bottom;
}
.p-0{
  padding: 0px;
}
.p-0\.5{
  padding: 0.125rem;
}
.p-1{
  padding: 0.25rem;
}
.p-1\.5{
  padding: 0.375rem;
}
.p-10{
  padding: 2.5rem;
}
.p-12{
  padding: 3rem;
}
.p-2{
  padding: 0.5rem;
}
.p-2\.5{
  padding: 0.625rem;
}
.p-3{
  padding: 0.75rem;
}
.p-3\.5{
  padding: 0.875rem;
}
.p-4{
  padding: 1rem;
}
.p-5{
  padding: 1.25rem;
}
.p-6{
  padding: 1.5rem;
}
.p-7{
  padding: 1.75rem;
}
.p-8{
  padding: 2rem;
}
.p-\[clamp\(1\.25rem\2c 2vw\2c 2rem\)\]{
  padding: clamp(1.25rem,2vw,2rem);
}
.p-px{
  padding: 1px;
}
.px-0\.5{
  padding-left: 0.125rem;
  padding-right: 0.125rem;
}
.px-1{
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5{
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-2{
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-2\.5{
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-3{
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-3\.5{
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}
.px-4{
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5{
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6{
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-7{
  padding-left: 1.75rem;
  padding-right: 1.75rem;
}
.px-8{
  padding-left: 2rem;
  padding-right: 2rem;
}
.px-\[8vw\]{
  padding-left: 8vw;
  padding-right: 8vw;
}
.px-\[clamp\(2\.5rem\2c 6vw\2c 8rem\)\]{
  padding-left: clamp(2.5rem,6vw,8rem);
  padding-right: clamp(2.5rem,6vw,8rem);
}
.px-\[max\(1rem\2c env\(safe-area-inset-left\)\)\]{
  padding-left: max(1rem,env(safe-area-inset-left));
  padding-right: max(1rem,env(safe-area-inset-left));
}
.py-0{
  padding-top: 0px;
  padding-bottom: 0px;
}
.py-0\.5{
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1{
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5{
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-10{
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12{
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16{
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2{
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5{
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-3{
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-3\.5{
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
.py-4{
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5{
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-6{
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-7{
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
}
.py-8{
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.py-\[clamp\(2rem\2c 5vh\2c 5rem\)\]{
  padding-top: clamp(2rem,5vh,5rem);
  padding-bottom: clamp(2rem,5vh,5rem);
}
.py-\[max\(1\.5rem\2c env\(safe-area-inset-top\)\)\]{
  padding-top: max(1.5rem,env(safe-area-inset-top));
  padding-bottom: max(1.5rem,env(safe-area-inset-top));
}
.py-px{
  padding-top: 1px;
  padding-bottom: 1px;
}
.pb-0\.5{
  padding-bottom: 0.125rem;
}
.pb-1{
  padding-bottom: 0.25rem;
}
.pb-1\.5{
  padding-bottom: 0.375rem;
}
.pb-10{
  padding-bottom: 2.5rem;
}
.pb-12{
  padding-bottom: 3rem;
}
.pb-3{
  padding-bottom: 0.75rem;
}
.pb-4{
  padding-bottom: 1rem;
}
.pb-44{
  padding-bottom: 11rem;
}
.pl-0{
  padding-left: 0px;
}
.pl-1{
  padding-left: 0.25rem;
}
.pl-1\.5{
  padding-left: 0.375rem;
}
.pl-10{
  padding-left: 2.5rem;
}
.pl-2\.5{
  padding-left: 0.625rem;
}
.pl-5{
  padding-left: 1.25rem;
}
.pl-8{
  padding-left: 2rem;
}
.pl-9{
  padding-left: 2.25rem;
}
.pr-1{
  padding-right: 0.25rem;
}
.pr-1\.5{
  padding-right: 0.375rem;
}
.pr-2{
  padding-right: 0.5rem;
}
.pt-0\.5{
  padding-top: 0.125rem;
}
.pt-1{
  padding-top: 0.25rem;
}
.pt-1\.5{
  padding-top: 0.375rem;
}
.pt-14{
  padding-top: 3.5rem;
}
.pt-16{
  padding-top: 4rem;
}
.pt-2{
  padding-top: 0.5rem;
}
.pt-3{
  padding-top: 0.75rem;
}
.pt-4{
  padding-top: 1rem;
}
.pt-6{
  padding-top: 1.5rem;
}
.pt-\[12vh\]{
  padding-top: 12vh;
}
.text-left{
  text-align: left;
}
.text-center{
  text-align: center;
}
.text-right{
  text-align: right;
}
.align-\[-1px\]{
  vertical-align: -1px;
}
.font-display{
  font-family: Outfit Variable, Outfit, Inter Variable, ui-sans-serif, system-ui, sans-serif;
}
.font-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.text-2xl{
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl{
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl{
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.text-5xl{
  font-size: 3rem;
  line-height: 1;
}
.text-\[0\.68rem\]{
  font-size: 0.68rem;
}
.text-\[10\.5px\]{
  font-size: 10.5px;
}
.text-\[10px\]{
  font-size: 10px;
}
.text-\[11px\]{
  font-size: 11px;
}
.text-\[12px\]{
  font-size: 12px;
}
.text-\[13px\]{
  font-size: 13px;
}
.text-\[15px\]{
  font-size: 15px;
}
.text-\[7rem\]{
  font-size: 7rem;
}
.text-\[9px\]{
  font-size: 9px;
}
.text-\[clamp\(\.75rem\2c 1vw\2c 1rem\)\]{
  font-size: clamp(.75rem,1vw,1rem);
}
.text-\[clamp\(\.8rem\2c 1\.1vw\2c 1\.05rem\)\]{
  font-size: clamp(.8rem,1.1vw,1.05rem);
}
.text-\[clamp\(\.8rem\2c 1vw\2c 1rem\)\]{
  font-size: clamp(.8rem,1vw,1rem);
}
.text-\[clamp\(1\.05rem\2c 1\.65vw\2c 1\.6rem\)\]{
  font-size: clamp(1.05rem,1.65vw,1.6rem);
}
.text-\[clamp\(1\.4rem\2c 2\.3vw\2c 2\.6rem\)\]{
  font-size: clamp(1.4rem,2.3vw,2.6rem);
}
.text-\[clamp\(2\.7rem\2c 5\.2vw\2c 6\.5rem\)\]{
  font-size: clamp(2.7rem,5.2vw,6.5rem);
}
.text-\[clamp\(2rem\2c 3\.3vw\2c 3\.25rem\)\]{
  font-size: clamp(2rem,3.3vw,3.25rem);
}
.text-base{
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg{
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm{
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl{
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs{
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-black{
  font-weight: 900;
}
.font-bold{
  font-weight: 700;
}
.font-extrabold{
  font-weight: 800;
}
.font-medium{
  font-weight: 500;
}
.font-normal{
  font-weight: 400;
}
.font-semibold{
  font-weight: 600;
}
.uppercase{
  text-transform: uppercase;
}
.lowercase{
  text-transform: lowercase;
}
.capitalize{
  text-transform: capitalize;
}
.italic{
  font-style: italic;
}
.tabular-nums{
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-4{
  line-height: 1rem;
}
.leading-5{
  line-height: 1.25rem;
}
.leading-6{
  line-height: 1.5rem;
}
.leading-7{
  line-height: 1.75rem;
}
.leading-\[\.98\]{
  line-height: .98;
}
.leading-\[1\.02\]{
  line-height: 1.02;
}
.leading-\[1\.05\]{
  line-height: 1.05;
}
.leading-none{
  line-height: 1;
}
.leading-relaxed{
  line-height: 1.625;
}
.leading-snug{
  line-height: 1.375;
}
.leading-tight{
  line-height: 1.25;
}
.tracking-\[-0\.045em\]{
  letter-spacing: -0.045em;
}
.tracking-\[0\.08em\]{
  letter-spacing: 0.08em;
}
.tracking-\[0\.12em\]{
  letter-spacing: 0.12em;
}
.tracking-\[0\.13em\]{
  letter-spacing: 0.13em;
}
.tracking-\[0\.14em\]{
  letter-spacing: 0.14em;
}
.tracking-\[0\.15em\]{
  letter-spacing: 0.15em;
}
.tracking-\[0\.16em\]{
  letter-spacing: 0.16em;
}
.tracking-\[0\.18em\]{
  letter-spacing: 0.18em;
}
.tracking-\[0\.1em\]{
  letter-spacing: 0.1em;
}
.tracking-\[0\.22em\]{
  letter-spacing: 0.22em;
}
.tracking-\[0\.23em\]{
  letter-spacing: 0.23em;
}
.tracking-\[0\.25em\]{
  letter-spacing: 0.25em;
}
.tracking-\[0\.2em\]{
  letter-spacing: 0.2em;
}
.tracking-tight{
  letter-spacing: -0.025em;
}
.tracking-wide{
  letter-spacing: 0.025em;
}
.tracking-wider{
  letter-spacing: 0.05em;
}
.text-\[\#22d3ee\]{
  --tw-text-opacity: 1;
  color: rgb(34 211 238 / var(--tw-text-opacity, 1));
}
.text-\[\#5eead4\]{
  --tw-text-opacity: 1;
  color: rgb(94 234 212 / var(--tw-text-opacity, 1));
}
.text-\[\#a78bfa\]{
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity, 1));
}
.text-\[\#f7f7fb\]{
  --tw-text-opacity: 1;
  color: rgb(247 247 251 / var(--tw-text-opacity, 1));
}
.text-\[\#fbbf24\]{
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.text-amber-200{
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}
.text-amber-300{
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}
.text-aqua{
  --tw-text-opacity: 1;
  color: rgb(var(--color-info-rgb, 34 211 238) / var(--tw-text-opacity, 1));
}
.text-aqua\/80{
  color: rgb(var(--color-info-rgb, 34 211 238) / 0.8);
}
.text-aqua\/90{
  color: rgb(var(--color-info-rgb, 34 211 238) / 0.9);
}
.text-black{
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}
.text-danger{
  --tw-text-opacity: 1;
  color: rgb(var(--color-danger-rgb, 248 113 113) / var(--tw-text-opacity, 1));
}
.text-danger\/70{
  color: rgb(var(--color-danger-rgb, 248 113 113) / 0.7);
}
.text-emerald-300{
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}
.text-emerald-300\/75{
  color: rgb(110 231 183 / 0.75);
}
.text-emerald-400{
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}
.text-fg{
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}
.text-fg\/10{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}
.text-fg\/20{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.2);
}
.text-fg\/25{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.25);
}
.text-fg\/30{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.3);
}
.text-fg\/35{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.35);
}
.text-fg\/40{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.4);
}
.text-fg\/45{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.45);
}
.text-fg\/50{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.5);
}
.text-fg\/55{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.55);
}
.text-fg\/60{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.6);
}
.text-fg\/65{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.65);
}
.text-fg\/70{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.7);
}
.text-fg\/75{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.75);
}
.text-fg\/80{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.8);
}
.text-fg\/85{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.85);
}
.text-fg\/90{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.9);
}
.text-gold{
  --tw-text-opacity: 1;
  color: rgb(var(--color-warning-rgb, 251 191 36) / var(--tw-text-opacity, 1));
}
.text-gold\/70{
  color: rgb(var(--color-warning-rgb, 251 191 36) / 0.7);
}
.text-gold\/80{
  color: rgb(var(--color-warning-rgb, 251 191 36) / 0.8);
}
.text-ink{
  color: var(--ink, #04040a);
}
.text-media-fg{
  --tw-text-opacity: 1;
  color: rgb(var(--media-fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}
.text-media-fg\/35{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.35);
}
.text-media-fg\/45{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.45);
}
.text-media-fg\/50{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.5);
}
.text-media-fg\/55{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.55);
}
.text-media-fg\/60{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.6);
}
.text-media-fg\/65{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.65);
}
.text-media-fg\/70{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.7);
}
.text-media-fg\/75{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.75);
}
.text-media-fg\/80{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.8);
}
.text-media-fg\/85{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.85);
}
.text-media-fg\/90{
  color: rgb(var(--media-fg-rgb, 244 244 248) / 0.9);
}
.text-mint{
  --tw-text-opacity: 1;
  color: rgb(var(--color-success-rgb, 94 234 212) / var(--tw-text-opacity, 1));
}
.text-on-accent{
  color: var(--color-on-accent, #ffffff);
}
.text-primary{
  --tw-text-opacity: 1;
  color: rgb(var(--color-primary-rgb, 79 124 255) / var(--tw-text-opacity, 1));
}
.text-primary-soft{
  color: var(--color-primary-soft, #9ec5ff);
}
.text-red-200{
  --tw-text-opacity: 1;
  color: rgb(254 202 202 / var(--tw-text-opacity, 1));
}
.text-red-300{
  --tw-text-opacity: 1;
  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
}
.text-red-300\/80{
  color: rgb(252 165 165 / 0.8);
}
.text-red-400{
  --tw-text-opacity: 1;
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}
.text-secondary{
  --tw-text-opacity: 1;
  color: rgb(var(--color-secondary-rgb, 99 102 241) / var(--tw-text-opacity, 1));
}
.text-secondary\/80{
  color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.8);
}
.text-sky-400{
  --tw-text-opacity: 1;
  color: rgb(56 189 248 / var(--tw-text-opacity, 1));
}
.text-success{
  --tw-text-opacity: 1;
  color: rgb(var(--color-success-rgb, 94 234 212) / var(--tw-text-opacity, 1));
}
.text-warning{
  --tw-text-opacity: 1;
  color: rgb(var(--color-warning-rgb, 251 191 36) / var(--tw-text-opacity, 1));
}
.text-white{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/35{
  color: rgb(255 255 255 / 0.35);
}
.text-white\/40{
  color: rgb(255 255 255 / 0.4);
}
.text-white\/45{
  color: rgb(255 255 255 / 0.45);
}
.text-white\/50{
  color: rgb(255 255 255 / 0.5);
}
.text-white\/55{
  color: rgb(255 255 255 / 0.55);
}
.text-white\/60{
  color: rgb(255 255 255 / 0.6);
}
.text-white\/65{
  color: rgb(255 255 255 / 0.65);
}
.text-white\/70{
  color: rgb(255 255 255 / 0.7);
}
.text-white\/75{
  color: rgb(255 255 255 / 0.75);
}
.text-white\/80{
  color: rgb(255 255 255 / 0.8);
}
.underline{
  text-decoration-line: underline;
}
.decoration-media-fg\/20{
  text-decoration-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.2);
}
.decoration-media-fg\/25{
  text-decoration-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.25);
}
.underline-offset-2{
  text-underline-offset: 2px;
}
.underline-offset-4{
  text-underline-offset: 4px;
}
.accent-aqua{
  accent-color: rgb(var(--color-info-rgb, 34 211 238) / 1);
}
.accent-primary{
  accent-color: rgb(var(--color-primary-rgb, 79 124 255) / 1);
}
.accent-red-600{
  accent-color: #dc2626;
}
.opacity-0{
  opacity: 0;
}
.opacity-100{
  opacity: 1;
}
.opacity-15{
  opacity: 0.15;
}
.opacity-30{
  opacity: 0.3;
}
.opacity-35{
  opacity: 0.35;
}
.opacity-40{
  opacity: 0.4;
}
.opacity-45{
  opacity: 0.45;
}
.opacity-55{
  opacity: 0.55;
}
.opacity-60{
  opacity: 0.6;
}
.opacity-65{
  opacity: 0.65;
}
.opacity-70{
  opacity: 0.7;
}
.opacity-75{
  opacity: 0.75;
}
.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl{
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_10px_rgb\(var\(--color-info-rgb\)\/0\.75\)\]{
  --tw-shadow: 0 0 10px rgb(var(--color-info-rgb)/0.75);
  --tw-shadow-colored: 0 0 10px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_70px_rgba\(52\2c 211\2c 153\2c \.16\)\]{
  --tw-shadow: 0 0 70px rgba(52,211,153,.16);
  --tw-shadow-colored: 0 0 70px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-card{
  --tw-shadow: var(--shadow-card, 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 24px -12px rgba(0, 0, 0, 0.55));
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-glow{
  --tw-shadow: 0 0 0 1px rgb(var(--color-primary-rgb, 79 124 255) / 0.28), 0 8px 32px -6px rgb(var(--color-primary-rgb, 79 124 255) / 0.32);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 32px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-glow-soft{
  --tw-shadow: 0 0 24px -4px rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
  --tw-shadow-colored: 0 0 24px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-inner{
  --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lift{
  --tw-shadow: var(--shadow-lift, 0 2px 4px rgba(0, 0, 0, 0.4), 0 16px 40px -16px rgba(0, 0, 0, 0.65));
  --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm{
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl{
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-black\/50{
  --tw-shadow-color: rgb(0 0 0 / 0.5);
  --tw-shadow: var(--tw-shadow-colored);
}
.outline-none{
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline{
  outline-style: solid;
}
.ring-1{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-black\/20{
  --tw-ring-color: rgb(0 0 0 / 0.2);
}
.ring-fg\/10{
  --tw-ring-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}
.ring-primary{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / var(--tw-ring-opacity, 1));
}
.ring-primary\/35{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.35);
}
.ring-primary\/40{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
}
.ring-primary\/75{
  --tw-ring-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.75);
}
.ring-offset-1{
  --tw-ring-offset-width: 1px;
}
.ring-offset-2{
  --tw-ring-offset-width: 2px;
}
.ring-offset-ink{
  --tw-ring-offset-color: var(--ink, #04040a);
}
.ring-offset-surface-raised{
  --tw-ring-offset-color: rgb(var(--surface-raised-rgb, 15 15 24) / 1);
}
.blur{
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-2xl{
  --tw-blur: blur(40px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-3xl{
  --tw-blur: blur(64px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[2px\]{
  --tw-blur: blur(2px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[8rem\]{
  --tw-blur: blur(8rem);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-sm{
  --tw-blur: blur(4px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow{
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-\[0_2px_10px_rgba\(4\2c 4\2c 10\2c 0\.9\)\]{
  --tw-drop-shadow: drop-shadow(0 2px 10px rgba(4,4,10,0.9));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-sm{
  --tw-drop-shadow: drop-shadow(0 1px 1px rgb(0 0 0 / 0.05));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.saturate-50{
  --tw-saturate: saturate(.5);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur{
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-2xl{
  --tw-backdrop-blur: blur(40px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-lg{
  --tw-backdrop-blur: blur(16px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-md{
  --tw-backdrop-blur: blur(12px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm{
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-xl{
  --tw-backdrop-blur: blur(24px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter{
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\2c height\2c transform\]{
  transition-property: width,height,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity{
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform{
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-200{
  transition-duration: 200ms;
}
.duration-300{
  transition-duration: 300ms;
}
.duration-500{
  transition-duration: 500ms;
}
.duration-700{
  transition-duration: 700ms;
}
.ease-\[cubic-bezier\(0\.34\2c 1\.56\2c 0\.64\2c 1\)\]{
  transition-timing-function: cubic-bezier(0.34,1.56,0.64,1);
}
.ease-out{
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
  .nav-active-soft{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
  color: var(--color-primary-soft, #9ec5ff);
    box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.25);
}

  .nav-active-strong{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: rgb(var(--color-primary-rgb, 79 124 255) / 0.3) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: rgb(var(--color-secondary-rgb, 99 102 241) / 0.2) var(--tw-gradient-to-position);
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
    box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.35);
}

  .chip-active{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
    box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.3);
}
.\[perspective\:800px\]{
  perspective: 800px;
}
.\[view-transition-name\:none\]{
  view-transition-name: none;
}
.\[view-transition-name\:poster-hero\]{
  view-transition-name: poster-hero;
}

:root {
  --header-height: 3.5rem;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --sticky-offset: calc(var(--header-height) + var(--safe-top));
  --layer-header: 30;
  --layer-player-cover: 50;
  --layer-player-controls: 60;
  --layer-overlay-backdrop: 80;
  --layer-overlay-panel: 81;
  --layer-toast: 90;
}

:root,
[data-theme='dark'] {
  color-scheme: dark;
  font-family: 'Inter Variable', Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --color-primary: #4f7cff;
  --color-primary-soft: #9ec5ff;
  --color-primary-deep: #1e3a8a;
  --color-primary-fg: #9ec5ff;
  --color-primary-rgb: 79 124 255;
  --color-primary-soft-rgb: 158 197 255;
  --color-secondary: #6366f1;
  --color-secondary-deep: #4338ca;
  --color-secondary-fg: #6366f1;
  --color-secondary-rgb: 99 102 241;
  --color-on-accent: #ffffff;
  --color-info: #22d3ee;
  --color-info-rgb: 34 211 238;
  --color-success: #5eead4;
  --color-success-rgb: 94 234 212;
  --color-warning: #fbbf24;
  --color-warning-rgb: 251 191 36;
  --color-danger: #f87171;
  --color-danger-rgb: 248 113 113;
  --ink: #04040a;
  --ink-rgb: 4, 4, 10;
  --ink-mid: #070710;
  --ink-deep: #010104;
  --ink-violet: #110d1e;
  --ink-navy: #020810;
  --surface: #090912;
  --surface-raised: #0f0f18;
  --surface-overlay: #151520;
  --surface-rgb: 9 9 18;
  --surface-raised-rgb: 15 15 24;
  --surface-overlay-rgb: 21 21 32;
  --fg-rgb: 244 244 248;
  --line: rgba(255, 255, 255, 0.08);
  --glass-bg: rgba(255, 255, 255, 0.04);
  --glass-border: rgba(255, 255, 255, 0.08);
  --chrome-panel-bg: rgba(4, 4, 10, 0.82);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 24px -12px rgba(0, 0, 0, 0.55);
  --shadow-lift: 0 2px 4px rgba(0, 0, 0, 0.4), 0 16px 40px -16px rgba(0, 0, 0, 0.65);
  --media-ink: #04040a;
  --media-ink-rgb: 4 4 10;
  --media-fg-rgb: 244 244 248;
  --media-scrim: rgba(4, 4, 10, 0.72);
  --player-panel: rgba(21, 21, 32, 0.96);
  --player-panel-strong: rgba(21, 21, 32, 0.98);
  --player-bar: rgba(21, 21, 32, 0.8);
  --player-fg-rgb: 244 244 248;
  --player-border: rgb(var(--player-fg-rgb) / 0.1);
  --player-shadow: 0 2px 4px rgba(0, 0, 0, 0.4), 0 16px 40px -16px rgba(0, 0, 0, 0.65);
  --player-accent-fg: #b8d0ff;
  --player-accent-fg-strong: #d0e0ff;
  --plyr-color-main: var(--color-primary);
  --plyr-badge-background: var(--color-primary);
  --plyr-range-fill-background: var(--color-primary);
  background: var(--ink);
}

[data-theme='light'] {
  color-scheme: light;
  --ink: #f6f7fb;
  --ink-rgb: 246, 247, 251;
  --ink-mid: #eef1f5;
  --ink-deep: #e5e8ef;
  --ink-violet: #f0eef8;
  --ink-navy: #e8ecf4;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-overlay: #f2f4f8;
  --surface-rgb: 255 255 255;
  --surface-raised-rgb: 255 255 255;
  --surface-overlay-rgb: 242 244 248;
  --fg-rgb: 23 24 28;
  --line: rgba(23, 24, 28, 0.1);
  --glass-bg: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(23, 24, 28, 0.1);
  --chrome-panel-bg: rgba(255, 255, 255, 0.88);
  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px -12px rgba(15, 23, 42, 0.16);
  --shadow-lift: 0 2px 4px rgba(15, 23, 42, 0.08), 0 16px 40px -16px rgba(15, 23, 42, 0.22);
  --color-info: #0e7490;
  --color-info-rgb: 14 116 144;
  --color-success: #047857;
  --color-success-rgb: 4 120 87;
  --color-warning: #a16207;
  --color-warning-rgb: 161 98 7;
  --color-danger: #b91c1c;
  --color-danger-rgb: 185 28 28;
  --media-ink: #04040a;
  --media-ink-rgb: 4 4 10;
  --media-fg-rgb: 244 244 248;
  --media-scrim: rgba(4, 4, 10, 0.72);
  --player-panel: rgba(255, 255, 255, 0.96);
  --player-panel-strong: rgba(255, 255, 255, 0.98);
  --player-bar: rgba(255, 255, 255, 0.9);
  --player-fg-rgb: 23 24 28;
  --player-border: rgb(var(--player-fg-rgb) / 0.1);
  --player-shadow: var(--shadow-lift);
  --player-accent-fg: var(--color-primary-fg);
  --player-accent-fg-strong: var(--color-primary-fg);
  background: var(--ink);
}

body {
  margin: 0;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  color: rgb(var(--fg-rgb));
  font-feature-settings: 'cv11', 'ss01';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(main, section, article, aside, nav, form) {
  min-width: 0;
}

:where(input, textarea, select) {
  max-width: 100%;
}

[data-theme='dark'] body,
:root:not([data-theme='light']) body {
  background:
    radial-gradient(ellipse 120% 90% at 50% 34%, transparent 28%, rgba(0, 0, 0, 0.62) 100%),
    radial-gradient(ellipse 90% 58% at 50% -18%, rgb(var(--color-primary-soft-rgb) / 0.13), transparent 66%),
    radial-gradient(ellipse 48% 38% at 86% 18%, rgb(var(--color-secondary-rgb) / 0.08), transparent 70%),
    radial-gradient(ellipse 52% 42% at 8% 76%, rgba(34, 211, 238, 0.045), transparent 68%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 12%, transparent 74%, rgba(255, 255, 255, 0.016)),
    linear-gradient(145deg, #0b0914 0%, var(--ink-navy) 30%, #050711 58%, var(--ink-deep) 100%);
}

[data-theme='light'] body {
  background:
    radial-gradient(ellipse 90% 58% at 50% -18%, rgb(var(--color-primary-rgb) / 0.07), transparent 66%),
    radial-gradient(ellipse 48% 38% at 86% 18%, rgb(var(--color-secondary-rgb) / 0.05), transparent 70%),
    radial-gradient(ellipse 52% 42% at 8% 76%, rgb(var(--color-info-rgb) / 0.04), transparent 68%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.72), transparent 24%, transparent 74%, rgba(23, 24, 28, 0.02)),
    linear-gradient(145deg, #ffffff 0%, var(--ink-navy) 30%, var(--ink-mid) 58%, var(--ink) 100%);
}

button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Unlayered so it beats `a { color: inherit }` over `@layer components` .btn-primary.
   Without this, light-mode CTAs (Watch now, Log in, …) inherit near-black body text. */
a.btn-primary,
a.btn-primary:hover,
a.btn-primary:focus-visible,
a.btn-primary:visited,
a.btn-primary:active {
  color: #ffffff;
}

::-moz-selection {
  background: rgb(var(--color-primary-rgb) / 0.45);
  color: #fff;
}

::selection {
  background: rgb(var(--color-primary-rgb) / 0.45);
  color: #fff;
}

* {
  scrollbar-width: thin;
  scrollbar-color: rgb(var(--color-primary-soft-rgb) / 0.25) transparent;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgb(var(--color-primary-soft-rgb) / 0.22);
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(var(--color-primary-soft-rgb) / 0.38);
  border: 2px solid transparent;
  background-clip: content-box;
}

.sticky-below-header {
  position: sticky;
  top: var(--sticky-offset);
  z-index: 20;
}

#site-header {
  z-index: var(--layer-header);
  padding-top: var(--safe-top);
}

.site-header-inner {
  padding-left: max(0.75rem, var(--safe-left));
  padding-right: max(0.75rem, var(--safe-right));
}

.mobile-sheet-root {
  position: fixed;
  inset: 0;
  z-index: var(--layer-overlay-backdrop);
  pointer-events: none;
}

.mobile-sheet-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--layer-overlay-backdrop);
  pointer-events: auto;
  border: none;
  padding: 0;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(2px);
  animation: mobile-sheet-backdrop-in 180ms ease-out;
}

.mobile-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--layer-overlay-panel);
  display: flex;
  box-sizing: border-box;
  max-height: min(88vh, 88dvh);
  flex-direction: column;
  overflow: hidden;
  border-radius: 1rem 1rem 0 0;
  border: 1px solid var(--line);
  border-bottom: none;
  background: color-mix(in srgb, var(--surface) 96%, var(--surface-overlay));
  padding-bottom: max(0.75rem, var(--safe-bottom));
  box-shadow: var(--shadow-lift);
  animation: mobile-sheet-in 240ms cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: auto;
  outline: none;
}

.mobile-sheet--left {
  inset: 0 auto 0 0;
  width: min(21rem, calc(100vw - 0.75rem));
  max-height: none;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0 1rem 1rem 0;
  padding-top: var(--safe-top);
  padding-bottom: var(--safe-bottom);
  animation-name: mobile-drawer-in;
}

.mobile-sheet--left .mobile-sheet-handle {
  display: none;
}

.mobile-sheet--left .mobile-sheet-header {
  min-height: var(--header-height);
  padding-top: 0.5rem;
}

.mobile-sheet--left .mobile-sheet-body {
  padding-inline: max(0.75rem, var(--safe-left)) 0.75rem;
}

[data-theme='light'] .mobile-sheet-backdrop {
  background: rgba(23, 24, 28, 0.35);
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
}

[data-theme='light'] .modal-backdrop {
  background: rgba(23, 24, 28, 0.35);
}

.mobile-sheet-handle {
  margin: 0.5rem auto 0;
  width: 2.25rem;
  height: 0.25rem;
  flex-shrink: 0;
  border-radius: 999px;
  background: rgb(var(--fg-rgb) / 0.18);
}

.mobile-sheet-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1rem 0.5rem;
}

.mobile-sheet-header-title {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: 0.5rem;
}

.mobile-sheet-back {
  display: grid;
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 auto;
  place-items: center;
  border: 0;
  border-radius: 0.65rem;
  background: transparent;
  color: rgb(var(--fg-rgb) / 0.72);
}

.mobile-sheet-header h3 {
  min-width: 0;
  overflow: hidden;
  margin: 0;
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.9375rem;
  font-weight: 700;
  color: rgb(var(--fg-rgb));
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-sheet-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.5rem 1rem 0.75rem;
}

/* Personal title controls use the sheet's portal but remain a quiet, narrow panel on larger screens. */
.mobile-sheet.title-library-sheet .mobile-sheet-body {
  padding-top: 0.75rem;
}

@media (min-width: 640px) {
  .mobile-sheet.title-library-sheet {
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    width: min(29rem, calc(100vw - 2rem));
    max-height: min(42rem, calc(100vh - 4rem));
    border: 1px solid var(--line);
    border-radius: 0.75rem;
    padding-bottom: 0.75rem;
    transform: translate(-50%, -50%);
    animation: none;
  }

  .mobile-sheet.title-library-sheet .mobile-sheet-handle {
    display: none;
  }
}

@keyframes mobile-sheet-backdrop-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes mobile-sheet-in {
  from {
    opacity: 0;
    transform: translateY(1.25rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mobile-drawer-in {
  from {
    opacity: 0.8;
    transform: translateX(-1.5rem);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.mobile-drawer-nav {
  display: grid;
  gap: 0.25rem;
  padding-bottom: 0.75rem;
}

.mobile-drawer-label {
  margin: 0;
  padding: 0.35rem 0.75rem;
  color: rgb(var(--fg-rgb) / 0.42);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mobile-drawer-link {
  display: flex;
  min-width: 0;
  min-height: 2.75rem;
  align-items: center;
  gap: 0.75rem;
  border: 0;
  border-radius: 0.65rem;
  background: transparent;
  padding: 0.65rem 0.75rem;
  color: rgb(var(--fg-rgb) / 0.72);
  font-size: 0.875rem;
  font-weight: 650;
  text-align: left;
  transition: background 160ms ease, color 160ms ease;
}

.mobile-drawer-link:hover {
  background: rgb(var(--fg-rgb) / 0.055);
  color: rgb(var(--fg-rgb));
}

.mobile-drawer-link .badge {
  margin-left: auto;
}

.topbar-mobile-drawer .mobile-sheet-body {
  padding-top: 0.15rem;
}

.touch-only {
  display: none;
}

@media (pointer: coarse) {
  .touch-only {
    display: revert;
  }

  .pointer-fine-only {
    display: none !important;
  }

  header[aria-label='Mobile'] a,
  .btn-ghost,
  .btn-secondary,
  .btn-primary {
    min-height: 2.75rem;
  }

  .player-autoplay-toggle,
  .player-menu-trigger,
  .player-download-trigger,
  .player-report-trigger,
  .player-source-trigger--bar {
    min-height: 2.75rem;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
  }

  .video-player-shell .plyr--video {
    --plyr-control-icon-size: 18px;
  }

  .comment-action-btn {
    min-height: 2.75rem;
    min-width: 2.75rem;
  }

  .footer-keyboard-hint {
    display: none;
  }
}

@media (max-width: 767px) {
  .pointer-fine-only,
  .footer-keyboard-hint {
    display: none !important;
  }

  html {
    scrollbar-width: none;
  }

  html::-webkit-scrollbar {
    width: 0;
    height: 0;
  }

  .mobile-sheet-header .btn-ghost {
    min-width: 2.75rem;
    min-height: 2.75rem;
  }

  .tv-landing-inner {
    align-content: center;
    gap: 1.75rem;
    padding-top: max(1.5rem, var(--safe-top));
    padding-right: max(1rem, var(--safe-right));
    padding-bottom: max(1.5rem, var(--safe-bottom));
    padding-left: max(1rem, var(--safe-left));
  }

  .tv-landing h1 {
    font-size: clamp(2.15rem, 11vw, 3.25rem);
    line-height: 1;
  }

  .tv-landing section:first-of-type > p:first-child {
    margin-bottom: 1rem;
  }

  .tv-landing section:first-of-type > p:nth-of-type(2) {
    margin-top: 1.25rem;
    font-size: 1rem;
  }

  .tv-pair-card {
    border-radius: 1.5rem;
  }

  .tv-pair-code {
    overflow-wrap: anywhere;
    font-size: clamp(1.35rem, 8vw, 2rem);
    letter-spacing: 0.14em;
  }

  .tv-pair-status {
    align-items: flex-start;
    flex-direction: column;
    text-align: left;
  }

  .admin-shell {
    padding-top: 1rem;
  }

  .admin-section-tabs {
    margin-right: calc(-1 * max(1rem, var(--safe-right)));
    margin-left: calc(-1 * max(1rem, var(--safe-left)));
    padding-right: max(1rem, var(--safe-right));
    padding-left: max(1rem, var(--safe-left));
    scroll-padding-inline: max(1rem, var(--safe-left));
    overscroll-behavior-inline: contain;
  }

  .admin-shell :is(input, textarea, select, code) {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .admin-shell :is(.panel, form, form > *, .grid > *, .flex > *) {
    min-width: 0;
  }
}

.watch-episode-fab {
  position: fixed;
  right: max(1rem, var(--safe-right));
  bottom: max(1rem, var(--safe-bottom));
  z-index: 25;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid rgb(var(--fg-rgb) / 0.12);
  border-radius: 0.625rem;
  background: rgb(var(--surface-raised-rgb) / 0.94);
  padding: 0.625rem 1rem;
  font-size: 0.8125rem;
  font-weight: 650;
  color: rgb(var(--fg-rgb) / 0.82);
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(12px);
}

.watch-page {
  position: relative;
  min-width: 0;
  padding-left: max(1rem, var(--safe-left));
  padding-right: max(1rem, var(--safe-right));
}

.watch-breadcrumb {
  min-height: 1.75rem;
}

.watch-layout {
  display: grid;
  align-items: start;
  gap: 1rem;
  min-width: 0;
}

.watch-main-column {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 0.75rem;
}

.watch-control-strip {
  display: flex;
  min-width: 0;
  align-items: stretch;
  justify-content: space-between;
  gap: 0.5rem;
  border: 1px solid rgb(var(--fg-rgb) / 0.085);
  border-radius: 0.625rem;
  background: rgb(var(--surface-raised-rgb) / 0.56);
  padding: 0.35rem;
  box-shadow: 0 1px 0 rgb(var(--fg-rgb) / 0.025);
}

.watch-control-strip__navigation,
.watch-control-strip__utilities {
  display: flex;
  min-width: 0;
  align-items: stretch;
  gap: 0.25rem;
}

.watch-control-strip__utilities {
  flex: 0 0 auto;
  border-left: 1px solid rgb(var(--fg-rgb) / 0.08);
  padding-left: 0.35rem;
}

.watch-nav-control,
.watch-toolbar-button,
.watch-sidebar-collapse {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  color: rgb(var(--fg-rgb) / 0.68);
  cursor: pointer;
  transition:
    background-color 150ms ease,
    color 150ms ease,
    border-color 150ms ease;
}

.watch-nav-control {
  display: flex;
  min-width: 8.5rem;
  min-height: 2.65rem;
  align-items: center;
  gap: 0.55rem;
  border-radius: 0.5rem;
  background: transparent;
  padding: 0.45rem 0.7rem;
  text-decoration: none;
}

.watch-nav-control:hover {
  background: rgb(var(--fg-rgb) / 0.055);
  color: rgb(var(--fg-rgb) / 0.94);
}

.watch-nav-control--next {
  justify-content: flex-end;
  border-left: 1px solid rgb(var(--fg-rgb) / 0.07);
}

.watch-nav-control--next:not(:disabled) {
  border-left-color: rgb(var(--color-secondary-rgb) / 0.18);
  background: rgb(var(--color-secondary-rgb) / 0.055);
  color: var(--color-secondary-fg);
}

.watch-nav-control--next:not(:disabled):hover {
  background: rgb(var(--color-secondary-rgb) / 0.1);
  color: var(--color-secondary-fg);
}

.watch-nav-control:disabled {
  cursor: default;
  opacity: 0.34;
}

.watch-nav-control:disabled:hover {
  background: transparent;
}

.watch-nav-control__copy {
  display: grid;
  min-width: 0;
  gap: 0.05rem;
}

.watch-nav-control--next .watch-nav-control__copy {
  text-align: right;
}

.watch-nav-control__label {
  font-size: 0.675rem;
  font-weight: 650;
  line-height: 1;
  color: rgb(var(--fg-rgb) / 0.42);
}

.watch-nav-control--next:not(:disabled) .watch-nav-control__label {
  color: rgb(var(--color-secondary-rgb) / 0.78);
}

.watch-nav-control__episode {
  overflow: hidden;
  font-size: 0.775rem;
  font-weight: 650;
  line-height: 1.15;
  color: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.watch-toolbar-button {
  display: inline-flex;
  min-height: 2.65rem;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  border-radius: 0.5rem;
  background: transparent;
  padding: 0.55rem 0.7rem;
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}

.watch-toolbar-button:hover {
  background: rgb(var(--fg-rgb) / 0.055);
  color: rgb(var(--fg-rgb) / 0.94);
}

.watch-toolbar-button--active {
  background: rgb(var(--color-primary-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.22);
  color: var(--color-primary-fg);
}

.watch-theater-toggle:not(.watch-toolbar-button--active),
.watch-episode-list-button {
  color: var(--color-primary-fg);
}

.watch-toolbar-button--together {
  background: rgb(var(--color-secondary-rgb) / 0.05);
  box-shadow: inset 0 0 0 1px rgb(var(--color-secondary-rgb) / 0.16);
  color: var(--color-secondary-fg);
}

.watch-toolbar-button--together:hover {
  background: rgb(var(--color-secondary-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--color-secondary-rgb) / 0.26);
  color: var(--color-secondary-fg);
}

.watch-episode-list-button {
  display: inline-flex;
  min-width: 7.25rem;
}

.watch-theater-toggle {
  display: none;
}

.watch-episode-meta {
  border-top: 1px solid rgb(var(--fg-rgb) / 0.085);
  padding: 1.1rem 0.25rem 0.35rem;
}

.watch-episode-meta__header {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.watch-series-link {
  display: inline-flex;
  max-width: 100%;
  overflow: hidden;
  font-size: 0.75rem;
  font-weight: 620;
  color: var(--color-primary-fg);
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 150ms ease;
}

.watch-series-link:hover {
  color: var(--color-primary-fg);
}

.watch-episode-meta h1 {
  margin-top: 0.3rem;
  overflow-wrap: anywhere;
  font-family: 'Outfit Variable', 'Inter Variable', sans-serif;
  font-size: clamp(1.3rem, 2vw, 1.75rem);
  font-weight: 680;
  line-height: 1.18;
  letter-spacing: -0.025em;
}

.watch-episode-title-separator {
  color: rgb(var(--fg-rgb) / 0.28);
}

.watch-watchlist-control {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.45rem;
}

.watch-watchlist-control .field {
  width: 9.5rem;
  min-height: 2.35rem;
  padding: 0.4rem 1.9rem 0.4rem 0.65rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
}

.watch-episode-details {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  margin-top: 0.75rem;
  font-size: 0.7rem;
  font-weight: 570;
  color: rgb(var(--fg-rgb) / 0.44);
}

.watch-episode-details > span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.watch-episode-details > span:not(:first-child)::before {
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.2rem;
  border-radius: 999px;
  background: rgb(var(--fg-rgb) / 0.22);
  content: '';
}

.watch-episode-detail--warning {
  color: rgb(var(--color-warning-rgb) / 0.85);
}

.watch-episode-detail--subbed,
.watch-episode-detail--recap {
  color: rgb(var(--color-info-rgb) / 0.9);
}

.watch-episode-detail--dubbed {
  color: var(--color-secondary-fg);
}

.watch-episode-detail--date {
  color: rgb(var(--fg-rgb) / 0.44);
}

.watch-episode-synopsis {
  max-width: 52rem;
  margin-top: 0.8rem;
  font-size: 0.875rem;
  line-height: 1.65;
  color: rgb(var(--fg-rgb) / 0.54);
}

.watch-sidebar {
  position: sticky;
  top: calc(var(--sticky-offset) + 0.75rem);
  display: flex;
  max-height: calc(100dvh - var(--sticky-offset) - 1.5rem);
  flex-direction: column;
  align-self: start;
  border-radius: 0.75rem;
  background: rgb(var(--surface-raised-rgb) / 0.72);
  padding: 0.75rem;
  box-shadow: 0 1px 0 rgb(var(--fg-rgb) / 0.025);
}

.watch-sidebar-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-bottom: 1px solid rgb(var(--fg-rgb) / 0.075);
  padding: 0.1rem 0.1rem 0.65rem;
}

.watch-sidebar-header h2 {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  font-weight: 680;
  color: rgb(var(--fg-rgb) / 0.84);
}

.watch-sidebar-header h2 svg {
  color: var(--color-primary-fg);
}

.watch-sidebar-header p {
  margin-top: 0.12rem;
  padding-left: 1.45rem;
  font-size: 0.65rem;
  color: rgb(var(--fg-rgb) / 0.36);
}

.watch-sidebar-collapse {
  display: grid;
  width: 2.2rem;
  height: 2.2rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.45rem;
  background: transparent;
}

.watch-sidebar-collapse:hover {
  background: rgb(var(--fg-rgb) / 0.06);
  color: rgb(var(--fg-rgb) / 0.94);
}

.watch-sidebar-title-seasons,
.watch-sidebar-season-tabs,
.watch-sidebar-airing,
.watch-sidebar-jump {
  flex: 0 0 auto;
  margin-top: 0.65rem;
}

.watch-sidebar-season-tabs {
  padding-bottom: 0.1rem;
}

.watch-sidebar-season-tab {
  display: inline-flex;
  min-height: 2rem;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid transparent;
  border-radius: 0.45rem;
  background: transparent;
  padding: 0.35rem 0.6rem;
  font-size: 0.7rem;
  font-weight: 600;
  color: rgb(var(--fg-rgb) / 0.46);
  transition:
    background-color 150ms ease,
    border-color 150ms ease,
    color 150ms ease;
}

.watch-sidebar-season-tab:hover {
  background: rgb(var(--fg-rgb) / 0.045);
  color: rgb(var(--fg-rgb) / 0.82);
}

.watch-sidebar-season-tab--active {
  border-color: rgb(var(--color-primary-rgb) / 0.26);
  background: rgb(var(--color-primary-rgb) / 0.08);
  color: var(--color-primary-fg);
}

.watch-sidebar-airing {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  border: 1px solid rgb(var(--fg-rgb) / 0.08);
  border-radius: 0.5rem;
  background: rgb(var(--fg-rgb) / 0.025);
  padding: 0.45rem 0.55rem;
  font-size: 0.675rem;
  font-weight: 550;
  color: rgb(var(--fg-rgb) / 0.54);
}

.watch-sidebar-chunk {
  min-height: 1.75rem;
  border: 1px solid transparent;
  border-radius: 0.4rem;
  background: transparent;
  padding: 0.25rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgb(var(--fg-rgb) / 0.4);
  transition:
    background-color 150ms ease,
    border-color 150ms ease,
    color 150ms ease;
}

.watch-sidebar-chunk:hover,
.watch-sidebar-chunk--active {
  border-color: rgb(var(--color-primary-rgb) / 0.2);
  background: rgb(var(--color-primary-rgb) / 0.065);
  color: var(--color-primary-fg);
}

.watch-sidebar-list {
  min-height: 0;
  flex: 1 1 auto;
  margin-top: 0.65rem;
  padding-right: 0.15rem;
}

.watch-sidebar-episode::before {
  position: absolute;
  top: 0.55rem;
  bottom: 0.55rem;
  left: -0.05rem;
  width: 0.125rem;
  border-radius: 0 999px 999px 0;
  background: transparent;
  content: '';
}

.watch-sidebar-episode--active::before {
  background: var(--color-primary);
}

.watch-sidebar-episode--up-next::before {
  background: var(--color-secondary);
}

.watch-sidebar-episode-meta--subbed,
.watch-sidebar-episode-meta--recap {
  color: rgb(var(--color-info-rgb) / 0.9);
}

.watch-sidebar-episode-meta--dubbed,
.watch-sidebar-episode-meta--up-next {
  color: var(--color-secondary-fg);
}

.watch-sidebar-episode-meta--filler {
  color: rgb(var(--color-warning-rgb) / 0.88);
}

.watch-sidebar-episode-meta--watched {
  color: rgb(var(--color-success-rgb) / 0.9);
}

.watch-sidebar--sheet {
  display: flex;
  min-height: 0;
  flex-direction: column;
}

.watch-sidebar--sheet .watch-sidebar-list {
  flex: 0 1 auto;
}

.watch-sidebar--sheet .watch-sidebar-header {
  padding-inline: 0;
}

.watch-episode-meta h1,
.watch-sidebar--sheet a {
  overflow-wrap: anywhere;
}

.watch-sidebar--sheet .watch-sidebar-season-tabs {
  position: sticky;
  top: -0.5rem;
  z-index: 2;
  margin-inline: -0.25rem;
  padding: 0.5rem 0.25rem 0.35rem;
  background: color-mix(in srgb, var(--surface) 96%, var(--surface-overlay));
}

.watch-sidebar--sheet a,
.watch-sidebar--sheet button {
  min-height: 2.75rem;
}

@media (min-width: 1024px) {
  .watch-layout[data-episode-rail='open'] {
    grid-template-columns: minmax(0, 1fr) minmax(19rem, 21rem);
  }

  .watch-layout[data-episode-rail='closed'] {
    grid-template-columns: minmax(0, 1fr);
  }

  .watch-episode-fab {
    display: none;
  }

  .watch-episode-list-button {
    display: none;
  }

  .watch-theater-toggle {
    display: inline-flex;
  }
}

@media (max-width: 1023px) {
  .watch-control-strip {
    flex-direction: column;
    gap: 0.35rem;
  }

  .watch-control-strip__navigation {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  .watch-control-strip__utilities {
    width: 100%;
    overflow-x: auto;
    border-top: 1px solid rgb(var(--fg-rgb) / 0.07);
    border-left: 0;
    padding-top: 0.35rem;
    padding-left: 0;
    scrollbar-width: none;
  }

  .watch-control-strip__utilities::-webkit-scrollbar {
    display: none;
  }

  .watch-control-strip__utilities .watch-toolbar-button {
    flex: 1 0 auto;
  }

  .watch-nav-control {
    min-width: 0;
  }
}

@media (max-width: 639px) {
  .watch-playback-mount {
    margin-left: calc(-1 * max(1rem, var(--safe-left)));
    margin-right: calc(-1 * max(1rem, var(--safe-right)));
  }

  .watch-playback-mount .watch-player-shell {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .watch-control-strip {
    margin-inline: -0.25rem;
  }

  .watch-nav-control,
  .watch-toolbar-button {
    min-height: 2.75rem;
  }

  .watch-episode-meta {
    padding-top: 1rem;
  }

  .watch-episode-meta__header {
    flex-direction: column;
    gap: 0.75rem;
  }

  .watch-watchlist-control {
    width: 100%;
  }

  .watch-watchlist-control .field {
    width: min(100%, 13rem);
  }
}

@media (max-width: 359px) {
  .watch-episode-list-button {
    min-width: 2.75rem;
    padding-inline: 0.6rem;
  }

  .watch-episode-list-button span {
    display: none;
  }

  .watch-nav-control {
    gap: 0.3rem;
    padding-inline: 0.45rem;
  }

  .watch-nav-control__episode {
    font-size: 0.7rem;
  }
}

@media (max-width: 767px), (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  .watch-control-strip {
    gap: 0.25rem;
    padding: 0.25rem;
  }

  .watch-control-strip__navigation {
    gap: 0.2rem;
  }

  .watch-control-strip__utilities {
    gap: 0.2rem;
    padding-top: 0.25rem;
  }

  .watch-control-strip__utilities--mobile-empty {
    display: none;
  }

  .watch-nav-control,
  .watch-toolbar-button {
    min-height: 2.5rem;
    height: 2.5rem;
    gap: 0.3rem;
    padding: 0.35rem 0.5rem;
    border-radius: 0.45rem;
  }

  .watch-nav-control svg,
  .watch-toolbar-button svg {
    width: 0.875rem;
    height: 0.875rem;
  }

  .watch-nav-control__label {
    font-size: 0.6rem;
  }

  .watch-nav-control__episode,
  .watch-toolbar-button {
    font-size: 0.6875rem;
  }

  .watch-episode-list-button {
    min-width: 2.5rem;
  }
}

/* Fixed ambient canvas: grain + slow-drifting blobs (transform-only, composited). */
.bg-canvas {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.bg-canvas::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 78% 52% at 50% -14%, rgb(var(--color-primary-soft-rgb) / 0.1), transparent 68%),
    radial-gradient(ellipse 42% 36% at 76% 46%, rgb(var(--color-secondary-rgb) / 0.075), transparent 72%),
    radial-gradient(ellipse 46% 42% at 18% 62%, rgba(34, 211, 238, 0.04), transparent 72%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.028), transparent 17%, transparent 83%, rgba(255, 255, 255, 0.022)),
    linear-gradient(180deg, rgba(1, 1, 4, 0.08), transparent 34%, rgba(1, 1, 4, 0.78) 100%);
  pointer-events: none;
}

[data-theme='light'] .bg-canvas::before {
  background:
    radial-gradient(ellipse 78% 52% at 50% -14%, rgb(var(--color-primary-rgb) / 0.06), transparent 68%),
    radial-gradient(ellipse 42% 36% at 76% 46%, rgb(var(--color-secondary-rgb) / 0.05), transparent 72%),
    radial-gradient(ellipse 46% 42% at 18% 62%, rgba(34, 211, 238, 0.03), transparent 72%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.02), transparent 17%, transparent 83%, rgba(0, 0, 0, 0.015)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.02), transparent 34%, rgba(0, 0, 0, 0.04) 100%);
}

.aurora {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.aurora span {
  position: absolute;
  border-radius: 9999px;
  filter: blur(78px);
  opacity: 0.22;
  mix-blend-mode: screen;
  will-change: transform, opacity;
}

[data-theme='light'] .aurora span {
  mix-blend-mode: multiply;
  opacity: 0.14;
}

.aurora span:nth-child(1) {
  top: -18rem;
  left: -14rem;
  height: 46rem;
  width: 46rem;
  background: radial-gradient(circle, rgb(var(--color-primary-soft-rgb) / 0.16) 0%, rgb(var(--color-primary-rgb) / 0.07) 42%, transparent 76%);
  animation: aurora-a 32s ease-in-out infinite alternate;
}

.aurora span:nth-child(2) {
  right: -18rem;
  top: 3rem;
  height: 42rem;
  width: 42rem;
  background: radial-gradient(circle, rgba(129, 140, 248, 0.13) 0%, rgba(67, 56, 202, 0.065) 42%, transparent 76%);
  animation: aurora-b 38s ease-in-out -8s infinite alternate;
}

.aurora span:nth-child(3) {
  bottom: -20rem;
  left: 24%;
  height: 48rem;
  width: 48rem;
  background: radial-gradient(circle, rgba(34, 211, 238, 0.08) 0%, rgba(30, 58, 138, 0.055) 46%, transparent 76%);
  animation: aurora-c 42s ease-in-out -14s infinite alternate;
}

@keyframes aurora-a {
  from {
    opacity: 0.16;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 0.24;
    transform: translate3d(7rem, 4rem, 0) scale(1.18);
  }
}

@keyframes aurora-b {
  from {
    opacity: 0.14;
    transform: translate3d(0, 0, 0) scale(1.15);
  }
  to {
    opacity: 0.22;
    transform: translate3d(-6rem, 7rem, 0) scale(0.96);
  }
}

@keyframes aurora-c {
  from {
    opacity: 0.12;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 0.2;
    transform: translate3d(-4rem, -6rem, 0) scale(1.2);
  }
}

/* Scroll-reveal (applied via the `reveal` action; skipped for reduced motion). */
.reveal-init {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 0.55s ease-out,
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-init.reveal-in {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered rail reveal: items cascade in after their rail scrolls into view. */
.reveal-stagger .carousel-track > * {
  opacity: 0;
}

.reveal-stagger.reveal-in .carousel-track > * {
  animation: stagger-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
  animation-delay: var(--stagger, 0ms);
}

@keyframes stagger-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Spotlight hero: progress ring around the active mobile dot. */
.spotlight-ring {
  stroke-dasharray: 50.27;
  stroke-dashoffset: 50.27;
  animation: spotlight-ring 6s linear forwards;
}

@keyframes spotlight-ring {
  to {
    stroke-dashoffset: 0;
  }
}

/* Single spotlight backdrop: one image, clipped to the hero, faded out via scrims. */
.spotlight-backdrop {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

/* Cross-document page fades via the View Transitions API */
::view-transition-old(root) {
  animation: 140ms cubic-bezier(0.4, 0, 1, 1) both vt-fade-out;
}

::view-transition-new(root) {
  animation: 220ms cubic-bezier(0, 0, 0.2, 1) both vt-fade-in;
}

@keyframes vt-fade-out {
  to {
    opacity: 0;
  }
}

@keyframes vt-fade-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}

.nav-progress {
  position: fixed;
  inset-inline: 0;
  top: 0;
  z-index: 40;
  height: 2px;
  pointer-events: none;
  overflow: hidden;
  background: transparent;
}

.nav-progress__bar {
  height: 100%;
  width: 40%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--color-primary) 35%,
    var(--color-primary-soft) 65%,
    transparent 100%
  );
  animation: nav-progress-indeterminate 0.9s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes nav-progress-indeterminate {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(320%);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Video player — Plyr theme */
.watch-player-shell {
  background: var(--player-panel);
  color: rgb(var(--player-fg-rgb));
}

.playback-session-host--docked {
  width: min(25rem, calc(100vw - 1.5rem - var(--safe-left) - var(--safe-right)));
  max-height: calc(100dvh - 1.5rem - var(--safe-top) - var(--safe-bottom));
  overscroll-behavior: contain;
}

@media (pointer: coarse) and (min-width: 600px) {
  .playback-session-host--docked {
    width: min(22rem, calc(100vw - 2rem - var(--safe-left) - var(--safe-right)));
  }
}

.video-player-shell .plyr {
  width: 100%;
  height: 100%;
}

.video-player-shell {
  /* The transport is now two rows tall: keep low captions above its controls. */
  --player-caption-transport-offset: 5.25rem;
}

.video-player-shell .plyr--video .plyr__controls {
  align-items: center;
  justify-content: flex-start;
  padding-top: calc(var(--plyr-control-spacing, 10px) * 3.5);
}

.video-player-shell .plyr--video .plyr__controls > .plyr__controls__item:first-child {
  margin-right: 0;
}

.video-player-shell .plyr--video .plyr__controls .plyr__progress__container {
  position: absolute;
  top: calc(var(--plyr-control-spacing, 10px) * 0.8);
  right: max(calc(var(--plyr-control-spacing, 10px) * 0.75), var(--safe-right));
  left: max(calc(var(--plyr-control-spacing, 10px) * 0.75), var(--safe-left));
  width: auto;
  min-width: 0;
  flex: none;
  margin: 0;
  padding: 0;
}

.video-player-shell .plyr--video .plyr__controls .plyr__time {
  min-width: 0;
  padding: 0 1px;
  color: rgb(var(--player-fg-rgb) / 0.82);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  text-align: left;
}

.video-player-shell .plyr--video .plyr__volume input[type='range'] {
  width: 0;
  min-width: 0;
  margin-right: 0;
  margin-left: 0;
  opacity: 0;
  pointer-events: none;
  transition:
    width 160ms ease,
    min-width 160ms ease,
    margin 160ms ease,
    opacity 120ms ease;
}

.video-player-shell .plyr--video .plyr__volume:hover input[type='range'],
.video-player-shell .plyr--video .plyr__volume:focus-within input[type='range'] {
  width: 80px;
  min-width: 60px;
  margin-right: calc(var(--plyr-control-spacing, 10px) / 2);
  margin-left: calc(var(--plyr-control-spacing, 10px) / 2);
  opacity: 1;
  pointer-events: auto;
}

.video-player-shell .plyr--video .plyr__volume .player-volume-slider {
  width: 0;
  min-width: 0;
  gap: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition:
    width 160ms ease,
    min-width 160ms ease,
    gap 160ms ease,
    opacity 120ms ease;
}

.video-player-shell .plyr--video .plyr__volume:hover .player-volume-slider,
.video-player-shell .plyr--video .plyr__volume:focus-within .player-volume-slider {
  width: 7.5rem;
  min-width: 7.5rem;
  gap: 0.35rem;
  opacity: 1;
  pointer-events: auto;
}

.video-player-shell .plyr--video .plyr__progress__container + :is(
  .player-external-control,
  .player-enhance-control,
  .plyr__menu,
  [data-plyr='pip'],
  [data-plyr='fullscreen']
) {
  margin-left: auto;
}

.video-player-shell .plyr--video .plyr__time + .plyr__time::before {
  margin-right: 3px;
  color: rgb(var(--player-fg-rgb) / 0.5);
  content: '/';
}

.video-player-shell .plyr__progress {
  position: relative;
  --chapter-gap: 4px;
}

.video-player-shell .plyr__progress__chapter-rail {
  position: absolute;
  top: 50%;
  left: calc(var(--plyr-range-thumb-height, 13px) / -2);
  width: calc(100% + var(--plyr-range-thumb-height, 13px));
  height: 5px;
  transform: translateY(-50%);
  transition: height 140ms ease;
  pointer-events: none;
  z-index: 1;
}

.video-player-shell .plyr__progress:hover .plyr__progress__chapter-rail {
  height: 7px;
}

.video-player-shell .plyr__progress input[type='range'] {
  color: transparent;
  z-index: 2;
}

.video-player-shell .plyr__progress__buffer {
  opacity: 0;
}

.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-webkit-slider-runnable-track {
  background-color: transparent;
  background-image: none;
}

.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-moz-range-track,
.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-moz-range-progress,
.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-ms-track,
.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-ms-fill-lower,
.video-player-shell .plyr--full-ui.plyr--video .plyr__progress input[type='range']::-ms-fill-upper {
  background: transparent;
}

.video-player-shell .plyr__progress .plyr__tooltip {
  display: none !important;
}

.video-player-shell .plyr__progress__segment {
  position: absolute;
  top: 0;
  left: calc(var(--chapter-left) + (var(--chapter-gap) / 2));
  width: max(0px, calc(var(--chapter-width) - var(--chapter-gap)));
  height: 100%;
  border-radius: 3px;
  overflow: hidden;
  pointer-events: none;
  z-index: auto;
}

.video-player-shell .plyr__progress__segment--episode,
.video-player-shell .plyr__progress__segment--chapter {
  background: rgb(var(--player-fg-rgb) / 0.26);
}

.video-player-shell .plyr__progress__segment--opening {
  --chapter-section-fill: #fbbf24;
  background: rgb(251 191 36 / 0.54);
}

.video-player-shell .plyr__progress__segment--ending {
  --chapter-section-fill: #a855f7;
  background: rgb(168 85 247 / 0.56);
}

.video-player-shell .plyr__progress__segment::after {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--chapter-fill-width, 0%);
  border-radius: inherit;
  background: var(--chapter-section-fill, var(--color-primary));
  content: '';
  transition: width 120ms linear;
}

.video-player-shell .plyr__progress__section-tick {
  display: none;
}

.video-player-shell .plyr__chapter-label {
  align-items: center;
  color: rgb(var(--player-fg-rgb) / 0.9);
  display: inline-flex;
  flex: 0 1 auto;
  font-size: 12px;
  font-weight: 400;
  justify-content: flex-start;
  line-height: 1.2;
  max-width: 14rem;
  min-width: 0;
  overflow: hidden;
  padding: 0 0.35rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-player-shell .plyr__chapter-label[data-section-id='opening'] {
  color: #fcd34d;
}

.video-player-shell .plyr__chapter-label[data-section-id='ending'] {
  color: #c084fc;
}

@media (max-width: 600px) {
  .video-player-shell .plyr__chapter-label {
    flex-basis: auto;
    font-size: 10px;
    max-width: 5.5rem;
  }
}

.video-player-shell .plyr__progress__section-tooltip {
  position: absolute;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 7px 11px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.16);
  border-radius: 8px;
  background: color-mix(in srgb, var(--player-panel) 90%, black);
  color: rgb(var(--player-fg-rgb));
  pointer-events: none;
  z-index: 6;
  box-shadow: var(--player-shadow);
  box-sizing: border-box;
  width: 9rem;
}

.video-player-shell .plyr__progress__section-tooltip-title {
  font-size: 11px;
  font-weight: 700;
  color: rgb(var(--player-fg-rgb) / 0.9);
  line-height: 1.2;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-player-shell .plyr__progress__section-tooltip-time {
  font-size: 11px;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.68);
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  white-space: nowrap;
}

.video-player-shell .plyr__progress__section-tooltip[hidden] {
  display: none;
}

.video-player-shell .plyr--video {
  height: 100%;
  --plyr-color-main: var(--color-primary);
  --plyr-video-background: #000;
  --plyr-menu-background: var(--player-panel);
  --plyr-menu-color: rgb(var(--player-fg-rgb));
  --plyr-control-icon-size: 16px;
  --plyr-font-family: inherit;
  --plyr-badge-background: var(--color-primary);
  --plyr-range-fill-background: var(--color-primary);
  --plyr-video-controls-background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.82));
  --plyr-tooltip-background: var(--player-panel);
  --plyr-tooltip-color: rgb(var(--player-fg-rgb));
}

.video-player-shell .plyr__control--overlaid {
  background: rgb(var(--color-primary-rgb) / 0.92);
}

.video-player-shell .plyr__control--overlaid:hover {
  background: var(--color-primary);
}

.video-player-shell .plyr__menu__container .plyr__control[role='menuitemradio'][aria-checked='true']::before {
  background: var(--color-primary);
}

.video-player-shell .plyr__menu__container [id^='plyr-settings-'] {
  min-width: 13.5rem;
}

.video-player-shell .plyr__menu__container .plyr__control--back span[aria-hidden='true'] {
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.88);
}

.video-player-shell .plyr-extra-settings-heading {
  margin: 0.625rem 0 0.125rem;
  padding: 0 0.75rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.5);
}

.video-player-shell .plyr-extra-settings-heading:first-child {
  margin-top: 0.25rem;
}

.video-player-shell .plyr-extra-settings-note {
  margin: 0.375rem 0 0.25rem;
  padding: 0.5rem 0.75rem 0.25rem;
  font-size: 0.6875rem;
  line-height: 1.4;
  color: rgb(var(--player-fg-rgb) / 0.42);
  border-top: 1px solid rgb(var(--player-fg-rgb) / 0.06);
}

.video-player-shell .plyr-extra-settings-section {
  margin-top: 0.125rem;
  padding-top: 0.125rem;
  border-top: 1px solid rgb(var(--player-fg-rgb) / 0.06);
}

.video-player-shell .plyr-extra-settings-section .plyr-extra-settings-heading {
  margin-top: 0.375rem;
}

.video-player-shell .plyr__volume {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.video-player-shell .plyr__volume .player-volume-slider {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  position: relative;
  min-width: 5.75rem;
}

.video-player-shell .plyr__volume .player-volume-slider__input {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  width: 5.75rem;
  height: 1.75rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(
      to right,
      transparent 0,
      transparent calc(50% - 0.5px),
      rgba(255, 255, 255, 0.32) calc(50% - 0.5px),
      rgba(255, 255, 255, 0.32) calc(50% + 0.5px),
      transparent calc(50% + 0.5px),
      transparent 100%
    )
      center / 100% var(--plyr-range-track-height, 5px) no-repeat,
    linear-gradient(
      to right,
      var(--plyr-range-fill-background, var(--color-primary)) 0%,
      var(--plyr-range-fill-background, var(--color-primary)) min(var(--value, 0%), 50%),
      var(--color-primary-soft, #9dd4ff) min(var(--value, 0%), 50%),
      var(--color-primary-soft, #9dd4ff) var(--value, 0%),
      rgba(255, 255, 255, 0.18) var(--value, 0%),
      rgba(255, 255, 255, 0.18) 100%
    )
      center / 100% var(--plyr-range-track-height, 5px) no-repeat;
  color: var(--plyr-range-fill-background, var(--color-primary));
  cursor: pointer;
  touch-action: none;
}

.video-player-shell .plyr__volume .player-volume-slider__input::-webkit-slider-runnable-track {
  height: var(--plyr-range-track-height, 5px);
  background: transparent;
  border-radius: calc(var(--plyr-range-track-height, 5px) / 2);
}

.video-player-shell .plyr__volume .player-volume-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 12px;
  height: 12px;
  margin-top: calc((var(--plyr-range-track-height, 5px) - 12px) / 2);
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  -webkit-transition: transform 0.12s ease;
  transition: transform 0.12s ease;
}

.video-player-shell .plyr__volume .player-volume-slider__input:hover::-webkit-slider-thumb,
.video-player-shell .plyr__volume .player-volume-slider__input:active::-webkit-slider-thumb,
.video-player-shell .plyr__volume .player-volume-slider__input:focus-visible::-webkit-slider-thumb {
  transform: scale(1.15);
}

.video-player-shell .plyr__volume .player-volume-slider__input::-moz-range-track {
  height: var(--plyr-range-track-height, 5px);
  background: transparent;
  border: 0;
  border-radius: calc(var(--plyr-range-track-height, 5px) / 2);
}

.video-player-shell .plyr__volume .player-volume-slider__input::-moz-range-thumb {
  width: 12px;
  height: 12px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  -moz-transition: transform 0.12s ease;
  transition: transform 0.12s ease;
}

.video-player-shell .plyr__volume .player-volume-slider__input:hover::-moz-range-thumb,
.video-player-shell .plyr__volume .player-volume-slider__input:active::-moz-range-thumb,
.video-player-shell .plyr__volume .player-volume-slider__input:focus-visible::-moz-range-thumb {
  transform: scale(1.15);
}

.video-player-shell .plyr__volume .player-volume-slider__boost-label {
  display: inline-block;
  min-width: 2rem;
  font-size: 0.5625rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
  white-space: nowrap;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s ease, color 0.12s ease;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.video-player-shell .plyr__volume .player-volume-slider__boost-label--visible {
  opacity: 1;
}

.video-player-shell .plyr__volume .player-volume-slider__boost-label--boosted {
  color: var(--color-primary-soft, #9dd4ff);
}

/* Caption appearance preferences */
.video-player-shell .plyr__captions {
  bottom: calc(
    var(--player-caption-bottom, 2.5%) + var(--player-caption-transport-offset)
  ) !important;
}

.video-player-shell .plyr__captions .plyr__caption {
  font-family: var(--player-caption-font, system-ui, sans-serif);
  font-size: calc(1em * var(--player-caption-scale, 1));
  line-height: 1.4;
  color: var(--player-caption-color, #fff);
  font-weight: 400;
}

.video-player-shell--caption-bold .plyr__captions .plyr__caption {
  font-weight: 700;
}

.video-player-shell--caption-bg-semi .plyr__captions .plyr__caption,
.video-player-shell--caption-bg-solid .plyr__captions .plyr__caption {
  background: rgba(
    0,
    0,
    0,
    calc(var(--player-caption-bg-opacity, 0.7) * 1)
  );
  border-radius: 0.25rem;
  padding: 0.15rem 0.45rem;
}

.video-player-shell--caption-bg-solid .plyr__captions .plyr__caption {
  background: rgba(0, 0, 0, 1);
}

.video-player-shell--caption-bg-off .plyr__captions .plyr__caption {
  background: transparent;
}

.video-player-shell--caption-edge-outline .plyr__captions .plyr__caption {
  -webkit-text-stroke: var(--player-caption-outline-width, 2px)
    var(--player-caption-outline-color, #000);
  paint-order: stroke fill;
  text-shadow:
    1px 1px 0 var(--player-caption-outline-color, #000),
    -1px 1px 0 var(--player-caption-outline-color, #000),
    1px -1px 0 var(--player-caption-outline-color, #000),
    -1px -1px 0 var(--player-caption-outline-color, #000);
}

.video-player-shell--caption-edge-dropShadow .plyr__captions .plyr__caption {
  text-shadow:
    0 2px 4px rgba(0, 0, 0, 0.95),
    0 0 8px rgba(0, 0, 0, 0.85),
    1px 1px 0 var(--player-caption-outline-color, #000);
}

.video-player-shell--caption-edge-none.video-player-shell--caption-bg-off
  .plyr__captions
  .plyr__caption {
  -webkit-text-stroke: 0;
  text-shadow: none;
}

/* Native archive overlay: hide browser-painted cues; HTML overlay uses Plyr caption styles */
.video-player-shell--native-captions.plyr--full-ui video::-webkit-media-text-track-container {
  display: none !important;
}

.video-player-shell--native-captions
  .plyr__captions:not(.video-player-native-caption-overlay) {
  display: none !important;
}

.video-player-shell--native-captions .video-player-native-caption-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(
    var(--player-caption-bottom, 2.5%) + var(--player-caption-transport-offset)
  ) !important;
  display: none;
  text-align: center;
  pointer-events: none;
  z-index: 5;
}

.video-player-shell--native-captions .video-player-native-caption-overlay.plyr__captions--active {
  display: block !important;
}

.video-player-shell--native-captions .video-player-native-caption-overlay .plyr__caption {
  font-family: var(--player-caption-font, inherit);
  font-size: calc(1em * var(--player-caption-scale, 1));
  line-height: 1.4;
  color: var(--player-caption-color, #fff);
  font-weight: 400;
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-bold
  .plyr__caption {
  font-weight: 700;
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-bg-semi
  .plyr__caption,
.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-bg-solid
  .plyr__caption {
  background: rgba(
    0,
    0,
    0,
    calc(var(--player-caption-bg-opacity, 0.7) * 1)
  );
  border-radius: 0.25rem;
  padding: 0.15rem 0.45rem;
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-bg-solid
  .plyr__caption {
  background: rgba(0, 0, 0, 1);
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-bg-off
  .plyr__caption {
  background: transparent;
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-edge-outline
  .plyr__caption {
  -webkit-text-stroke: var(--player-caption-outline-width, 2px)
    var(--player-caption-outline-color, #000);
  paint-order: stroke fill;
  text-shadow:
    1px 1px 0 var(--player-caption-outline-color, #000),
    -1px 1px 0 var(--player-caption-outline-color, #000),
    1px -1px 0 var(--player-caption-outline-color, #000),
    -1px -1px 0 var(--player-caption-outline-color, #000);
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-edge-dropShadow
  .plyr__caption {
  text-shadow:
    0 2px 4px rgba(0, 0, 0, 0.95),
    0 0 8px rgba(0, 0, 0, 0.85),
    1px 1px 0 var(--player-caption-outline-color, #000);
}

.video-player-shell--native-captions
  .video-player-native-caption-overlay.video-player-shell--caption-edge-none.video-player-shell--caption-bg-off
  .plyr__caption {
  -webkit-text-stroke: 0;
  text-shadow: none;
}

.video-player-shell .plyr-extra-caption-preview {
  margin: 0.25rem 0.75rem 0.5rem;
  padding: 0.75rem;
  border-radius: 0.5rem;
  background:
    linear-gradient(135deg, rgb(var(--color-primary-rgb) / 0.18), rgba(0, 0, 0, 0.55)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(0, 0, 0, 0.35));
  min-height: 3.25rem;
  display: grid;
  place-items: center;
}

.video-player-shell .plyr-extra-caption-preview__line {
  margin: 0;
  text-align: center;
  font-size: calc(0.875rem * var(--preview-scale, 1));
  color: var(--preview-color, #fff);
  font-weight: var(--preview-bold, 400);
  -webkit-text-stroke: var(--preview-outline-width, 2px) var(--preview-outline-color, #000);
  paint-order: stroke fill;
  text-shadow:
    1px 1px 0 var(--preview-outline-color, #000),
    -1px 1px 0 var(--preview-outline-color, #000),
    1px -1px 0 var(--preview-outline-color, #000),
    -1px -1px 0 var(--preview-outline-color, #000);
}

.video-player-shell .plyr-extra-caption-preview[data-bold='true'] .plyr-extra-caption-preview__line {
  font-weight: 700;
}

.video-player-shell .plyr-extra-caption-preview[data-edge='dropShadow'] .plyr-extra-caption-preview__line {
  -webkit-text-stroke: 0;
  text-shadow:
    0 2px 4px rgba(0, 0, 0, 0.95),
    0 0 8px rgba(0, 0, 0, 0.85);
}

.video-player-shell .plyr-extra-caption-preview[data-edge='none'] .plyr-extra-caption-preview__line {
  -webkit-text-stroke: 0;
  text-shadow: none;
}

.video-player-shell .plyr-extra-caption-preview[data-background='semi'] .plyr-extra-caption-preview__line,
.video-player-shell .plyr-extra-caption-preview[data-background='solid'] .plyr-extra-caption-preview__line {
  background: rgba(0, 0, 0, var(--preview-bg-opacity, 0.7));
  border-radius: 0.25rem;
  padding: 0.15rem 0.45rem;
}

.video-player-shell .plyr-extra-caption-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  padding: 0 0.75rem 0.375rem;
}

.video-player-shell .plyr-extra-caption-preset {
  border: 1px solid rgb(var(--player-fg-rgb) / 0.12);
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.05);
  color: rgb(var(--player-fg-rgb) / 0.82);
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.3rem 0.55rem;
  transition:
    border-color 160ms ease,
    background 160ms ease,
    color 160ms ease;
}

.video-player-shell .plyr-extra-caption-preset[aria-checked='true'] {
  border-color: rgb(var(--color-primary-rgb) / 0.55);
  background: rgb(var(--color-primary-rgb) / 0.2);
  color: var(--player-accent-fg-strong);
}

.video-player-shell .plyr-extra-caption-preset:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  background: rgb(var(--color-primary-rgb) / 0.14);
}

.video-player-shell .plyr-extra-settings-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.video-player-shell .plyr-extra-settings-nav .plyr__menu__value {
  font-size: 0.6875rem;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.video-player-shell .plyr-extra-settings-action span {
  color: rgb(var(--player-fg-rgb) / 0.72);
}

.video-player-shell .plyr-extra-caption-swatches {
  display: flex;
  gap: 0.5rem;
  padding: 0 0.75rem 0.5rem;
}

.video-player-shell .plyr-extra-caption-swatch {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  border: 2px solid rgb(var(--player-fg-rgb) / 0.18);
  background: var(--swatch-color, #fff);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
}

.video-player-shell .plyr-extra-caption-swatch[aria-checked='true'] {
  border-color: rgb(var(--color-primary-rgb) / 0.85);
  box-shadow:
    0 0 0 2px rgb(var(--color-primary-rgb) / 0.25),
    inset 0 0 0 1px rgba(0, 0, 0, 0.25);
}

.video-player-shell .plyr-extra-settings-option-note {
  margin: -0.125rem 0 0.375rem;
  padding: 0 0.75rem 0.25rem 1.5rem;
  font-size: 0.625rem;
  line-height: 1.35;
  color: rgb(var(--player-fg-rgb) / 0.38);
}

.player-media-layer {
  position: relative;
  z-index: 0;
}

.player-shell--captions-pending :is(.plyr__captions, .plyr__caption, .jassub-canvas, canvas.jassub, canvas.JASSUB, canvas[class*='jassub'], .native-caption-overlay, .video-player-native-caption-overlay) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Plyr transport must stay above poster/loading presentation covers. */
.video-player-shell .plyr__controls {
  z-index: 40;
}

.video-player-shell .plyr__menu,
.video-player-shell .plyr__tooltip {
  z-index: 41;
}

/* The dock is a container-sized player, even when the viewport itself is desktop. */
.watch-player-shell--compact .video-player-shell {
  --player-caption-transport-offset: 4.75rem;
}

.watch-player-shell--compact .video-player-shell .plyr__controls {
  padding: 0.45rem;
  padding-top: 2.15rem;
  gap: 0.2rem;
}

.watch-player-shell--compact .video-player-shell :is(
  .plyr__time--duration,
  [data-plyr='pip'],
  .player-enhance-control,
  .player-external-control,
  .player-volume-slider,
  input[data-plyr='volume']
) {
  display: none !important;
}

.watch-player-shell--compact .video-player-shell .plyr__progress__container {
  min-width: 0;
  flex: 1 1 auto;
}

.player-terminal-cover {
  z-index: var(--layer-player-cover);
}

.player-shell--awaiting-gesture .player-loading-overlay {
  pointer-events: none;
}

.player-status-pill {
  pointer-events: none;
}

.player-chrome-layer {
  z-index: 20;
}

.player-shortcuts-panel {
  --media-fg-rgb: var(--player-fg-rgb);
  border-color: var(--player-border);
  background: var(--player-panel);
  color: rgb(var(--player-fg-rgb));
  box-shadow: var(--player-shadow);
}

.video-player-shell .player-shortcuts-panel .kbd {
  border-color: rgb(var(--player-fg-rgb) / 0.16);
  background: rgb(var(--player-fg-rgb) / 0.08);
  color: rgb(var(--player-fg-rgb) / 0.62);
}

.player-loading-overlay {
  z-index: 20;
  animation: player-loading-fade-in 180ms ease-out;
}

.player-loading-overlay--quiet {
  background: transparent;
}

.player-options-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.player-options-toggle input {
  accent-color: rgb(var(--color-primary-rgb));
}


@keyframes player-loading-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .player-loading-overlay {
    animation: none;
  }
}

.player-resume-prompt {
  animation: resume-prompt-in 220ms ease-out;
  bottom: calc(4.5rem + var(--safe-bottom));
  left: max(0.75rem, var(--safe-left));
}

@keyframes resume-prompt-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .player-resume-prompt {
    animation: none;
  }
}

.player-chrome-panel {
  position: absolute;
  top: calc(100% + 0.375rem);
  z-index: 30;
  width: 14rem;
  border-radius: 0.75rem;
  border: 1px solid var(--player-border);
  background: var(--player-panel);
  padding: 0.875rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  color: rgb(var(--player-fg-rgb));
  box-shadow: var(--player-shadow);
  backdrop-filter: blur(12px);
}

.player-control-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.5rem 0.625rem;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  background: var(--player-bar);
  color: rgb(var(--player-fg-rgb));
  padding: 0.5rem 0.75rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.player-control-bar--below {
  position: relative;
  z-index: var(--layer-player-controls); /* > terminal cover; < app overlays */
  border-top: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  border-bottom: none;
}

.player-control-bar--below .player-popover {
  top: auto;
  bottom: calc(100% + 0.375rem);
}

@media (min-width: 640px) {
  .player-control-bar {
    gap: 0.625rem 0.75rem;
    padding: 0.625rem 1rem;
    overflow-x: visible;
  }
}

.player-control-bar__start {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: 0.5rem;
}

.player-control-bar__end {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.375rem;
}

.watch-player-shell--compact .player-control-bar {
  gap: 0.35rem;
  padding: 0.4rem 0.5rem;
  overflow: visible;
}

.watch-player-shell--compact .player-control-bar__start {
  justify-content: space-between;
  gap: 0.3rem;
}

.watch-player-shell--compact .player-control-bar__start > * {
  min-width: 0;
  flex: 1 1 0;
}

.watch-player-shell--compact .player-control-bar__start > .player-menu-root > button,
.watch-player-shell--compact :is(.player-audio-trigger, .player-source-trigger, .player-menu-trigger, .player-server-badge) {
  min-height: 34px !important;
  min-width: 0 !important;
  width: 100%;
  max-width: 100%;
  padding-inline: 0.45rem;
  font-size: 0.65rem;
}

.watch-player-shell--compact .player-fallback-badge {
  display: none;
}

.watch-player-shell--compact .player-popover {
  max-width: min(18rem, calc(100vw - 1.5rem));
}

.player-control-divider {
  display: none;
  width: 1px;
  height: 1.25rem;
  flex-shrink: 0;
  background: rgb(var(--player-fg-rgb) / 0.08);
}

@media (min-width: 640px) {
  .player-control-divider {
    display: block;
  }
}

.player-popover--auto {
  width: 14rem;
}

.player-popover--audio-subs {
  display: flex;
  left: 0;
  right: auto;
  width: 16.5rem;
  max-height: min(70vh, 24rem);
  flex-direction: column;
  gap: 0.625rem;
  overflow: hidden;
}

@media (min-width: 768px) {
  .player-popover--audio-subs {
    animation: player-audio-subs-in 160ms cubic-bezier(0.22, 1, 0.36, 1);
  }
}

.player-audio-subs-section {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  min-height: 0;
}

.player-audio-subs-content {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.625rem;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 -0.15rem;
  padding: 0 0.15rem 0.1rem;
  scrollbar-gutter: stable;
}

.player-popover--audio-subs .player-audio-subs-content > * {
  flex-shrink: 0;
}

.player-audio-subs-section--subs {
  flex: 1 1 auto;
  min-height: 0;
}

.player-audio-subs-section-label {
  margin: 0;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-audio-subs-segments {
  width: 100%;
}

.player-audio-subs-segments .player-segment {
  flex: 1 1 0;
  justify-content: center;
}

.player-audio-subs-divider {
  height: 1px;
  background: rgb(var(--player-fg-rgb) / 0.08);
}

.player-audio-subs-list {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  flex-direction: column;
  gap: 0.125rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 -0.15rem;
  padding: 0 0.15rem;
}

.player-popover--audio-subs .player-audio-subs-section--subs,
.player-popover--audio-subs .player-audio-subs-list {
  flex: none;
}

.player-popover--audio-subs .player-audio-subs-list {
  overflow: visible;
}

.player-popover--audio-subs .player-audio-subs-option {
  flex-direction: row;
  align-items: center;
  padding: 0.45rem 0.55rem;
}

.player-popover-heading--spaced {
  margin-top: 0.75rem;
}

.player-audio-subs-trigger-label {
  max-width: 9.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-audio-subs-option-row {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.player-audio-subs-section--timing {
  flex-shrink: 0;
  gap: 0.55rem;
}

.player-audio-subs-timing-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

.player-audio-subs-timing-hint {
  margin: 0;
  font-size: 0.68rem;
  color: rgb(var(--player-fg-rgb) / 0.45);
  text-align: right;
}

.player-audio-subs-timing-controls {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 0.45rem;
}

.player-audio-subs-timing-btn,
.player-audio-subs-timing-reset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 2rem;
  border-radius: 0.55rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.04);
  color: rgb(var(--player-fg-rgb) / 0.88);
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.player-audio-subs-timing-btn {
  width: 2rem;
  padding: 0;
}

.player-audio-subs-timing-reset {
  padding: 0 0.55rem;
  font-size: 0.72rem;
}

.player-audio-subs-timing-btn:hover:not(:disabled),
.player-audio-subs-timing-reset:hover:not(:disabled) {
  background: rgb(var(--player-fg-rgb) / 0.08);
  border-color: rgb(var(--player-fg-rgb) / 0.16);
}

.player-audio-subs-timing-btn:disabled,
.player-audio-subs-timing-reset:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.player-audio-subs-timing-value {
  min-width: 3.5rem;
  text-align: center;
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  color: rgb(var(--player-fg-rgb) / 0.92);
}

@keyframes player-audio-subs-in {
  from {
    opacity: 0;
    transform: translateY(0.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.player-popover--more {
  width: 15rem;
}

.player-popover-panel-back {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-bottom: 0.5rem;
  border-radius: 0.5rem;
  padding: 0.25rem 0.375rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.55);
  transition: color 160ms ease, background 160ms ease;
}

.player-popover-panel-back:hover {
  background: rgb(var(--player-fg-rgb) / 0.06);
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-popover-menu-list {
  display: grid;
  gap: 0.125rem;
}

.player-popover-menu-item {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  border-radius: 0.5rem;
  border: 1px solid transparent;
  background: transparent;
  padding: 0.5rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.88);
  text-align: left;
  transition: background 160ms ease, border-color 160ms ease;
}

.player-popover-menu-item:hover {
  background: rgb(var(--player-fg-rgb) / 0.06);
}

.player-popover-menu-item-meta {
  font-size: 0.625rem;
  font-weight: 500;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-auto-badge {
  display: inline-grid;
  place-items: center;
  min-width: 1rem;
  height: 1rem;
  border-radius: 999px;
  background: rgb(var(--color-primary-rgb) / 0.35);
  padding: 0 0.2rem;
  font-size: 0.5625rem;
  font-weight: 800;
  color: var(--player-accent-fg-strong);
}

.player-chip-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.25rem 0;
}

.player-chip-toggle-row + .player-chip-toggle-row {
  border-top: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  margin-top: 0.125rem;
  padding-top: 0.375rem;
}

.player-chip-toggle-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.82);
}

.player-chip-toggle {
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.25rem 0.55rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgb(var(--player-fg-rgb) / 0.55);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.player-chip-toggle:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.16);
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-chip-toggle--active {
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: rgb(var(--color-primary-rgb) / 0.14);
  color: var(--player-accent-fg);
}

.player-menu-trigger--active,
.player-menu-trigger--open {
  border-color: rgb(var(--color-primary-rgb) / 0.28);
  background: rgb(var(--color-primary-rgb) / 0.08);
  color: var(--player-accent-fg);
}

.player-more-sheet-item {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.75rem 0.875rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.88);
  text-align: left;
  transition: background 160ms ease, border-color 160ms ease;
}

.player-more-sheet-item:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.14);
  background: rgb(var(--player-fg-rgb) / 0.07);
}

.player-more-sheet-item-meta {
  font-size: 0.6875rem;
  font-weight: 500;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-more-sheet-section-heading {
  margin: 0 0 0.5rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-codec-picker-section {
  margin-bottom: 0.25rem;
}

.player-codec-picker-heading {
  margin-top: 0;
}

.player-codec-picker .player-popover-heading:first-of-type {
  margin-top: 0;
}

.player-segment-group {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.125rem;
}

.player-segment {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  padding: 0.32rem 0.62rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgb(var(--player-fg-rgb) / 0.58);
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.player-segment:hover:not(:disabled) {
  color: rgb(var(--player-fg-rgb) / 0.92);
  background: rgb(var(--player-fg-rgb) / 0.06);
}

.player-segment--active {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.14);
  color: var(--player-accent-fg);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.12);
}

.player-segment--disabled {
  cursor: not-allowed;
  opacity: 0.38;
}

.player-menu-root {
  position: relative;
}

.player-menu-trigger {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  gap: 0.375rem;
  border-radius: 0.625rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.05);
  padding: 0.375rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.82);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.player-menu-trigger:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.14);
  background: rgb(var(--player-fg-rgb) / 0.08);
  color: rgb(var(--player-fg-rgb));
}

.player-menu-trigger-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-menu-trigger-chevron {
  flex-shrink: 0;
  color: rgb(var(--player-fg-rgb) / 0.45);
  transition: transform 180ms ease;
}

.player-menu-trigger-chevron--open {
  transform: rotate(180deg);
}

.player-download-trigger {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  gap: 0.375rem;
  border-radius: 0.625rem;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.28);
  background: rgb(var(--color-primary-rgb) / 0.1);
  padding: 0.375rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--player-accent-fg);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.player-download-trigger:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: rgb(var(--color-primary-rgb) / 0.16);
  color: var(--player-accent-fg);
}

.player-download-trigger--open {
  border-color: rgb(var(--color-primary-rgb) / 0.5);
  background: rgb(var(--color-primary-rgb) / 0.18);
  color: var(--player-accent-fg);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.2);
}

.player-download-trigger-meta {
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--player-accent-fg);
}

.player-report-trigger {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  gap: 0.375rem;
  border-radius: 0.625rem;
  border: 1px solid rgb(var(--color-danger-rgb) / 0.28);
  background: rgb(var(--color-danger-rgb) / 0.1);
  padding: 0.375rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--color-danger);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.player-report-trigger:hover {
  border-color: rgb(var(--color-danger-rgb) / 0.42);
  background: rgb(var(--color-danger-rgb) / 0.16);
  color: var(--color-danger);
}

.player-report-trigger--open {
  border-color: rgb(var(--color-danger-rgb) / 0.5);
  background: rgb(var(--color-danger-rgb) / 0.18);
  color: var(--color-danger);
  box-shadow: inset 0 0 0 1px rgb(var(--color-danger-rgb) / 0.18);
}

.player-popover--report {
  width: 15rem;
}

.player-popover {
  --fg-rgb: var(--player-fg-rgb);
  position: absolute;
  top: calc(100% + 0.375rem);
  right: 0;
  z-index: 40;
  min-width: 12rem;
  border-radius: 0.75rem;
  border: 1px solid var(--player-border);
  background: var(--player-panel);
  padding: 0.75rem;
  color: rgb(var(--player-fg-rgb));
  box-shadow: var(--player-shadow);
  backdrop-filter: blur(12px);
}

.player-popover--source {
  width: 15rem;
}

.player-popover--torrents {
  width: min(24rem, calc(100vw - 1.5rem));
}

.player-torrents-panel {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  min-height: 0;
}

.player-torrents-tabs {
  position: sticky;
  top: 0;
  z-index: 1;
  margin: 0 -0.15rem;
  padding: 0 0.15rem 0.625rem;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: var(--player-panel-strong);
}

.player-torrents-tabs .player-segment-group {
  display: flex;
  width: 100%;
}

.player-torrents-tabs .player-segment {
  flex: 1 1 0;
  justify-content: center;
}

.player-torrents-body {
  max-height: min(60vh, 24rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 -0.15rem;
  padding: 0 0.15rem;
}

.player-downloads-list {
  max-height: min(42vh, 16rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 -0.15rem;
  padding: 0 0.15rem;
}

.player-torrent-row-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  line-height: 1.35;
}

.player-torrent-row-badges {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.25rem;
}

.player-torrent-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 0.25rem;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.28);
  background: rgb(var(--color-primary-rgb) / 0.1);
  padding: 0.05rem 0.35rem;
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-primary-soft);
}

.player-torrent-badge--resolution {
  border-color: rgb(var(--player-fg-rgb) / 0.12);
  background: rgb(var(--player-fg-rgb) / 0.06);
  color: rgb(var(--player-fg-rgb) / 0.72);
  text-transform: none;
  letter-spacing: 0.02em;
}

.player-torrent-row--detailed {
  padding: 0.5rem 0.625rem;
}

.player-torrent-row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.375rem;
  font-size: 0.625rem;
  line-height: 1.3;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-torrent-row-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.player-torrent-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.5rem;
}

.player-popover--quality {
  width: 14.5rem;
}

.player-popover-heading {
  margin-bottom: 0.375rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-popover-heading + .player-codec-group {
  margin-bottom: 0.75rem;
}

.player-popover-option {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.125rem;
  border-radius: 0.5rem;
  border: 1px solid transparent;
  background: transparent;
  padding: 0.5rem 0.625rem;
  text-align: left;
  transition:
    border-color 180ms ease,
    background 180ms ease;
}

.player-popover-option:hover {
  background: rgb(var(--player-fg-rgb) / 0.06);
}

.player-popover-option:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.player-popover-option:disabled:hover {
  background: transparent;
}

.player-popover-option--active {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.1);
}

.player-popover-option-main {
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-popover-option-meta {
  font-size: 0.625rem;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-codec-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.player-codec-chip {
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.3rem 0.65rem;
  font-size: 0.6875rem;
  font-weight: 700;
  color: rgb(var(--player-fg-rgb) / 0.65);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.player-codec-chip:hover:not(:disabled) {
  border-color: rgb(var(--player-fg-rgb) / 0.16);
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-codec-chip--active {
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: rgb(var(--color-primary-rgb) / 0.14);
  color: var(--player-accent-fg);
}

.player-codec-chip--disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

.player-autoplay-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.28rem 0.62rem 0.28rem 0.34rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgb(var(--player-fg-rgb) / 0.58);
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.player-autoplay-toggle::before {
  content: '';
  width: 1.625rem;
  height: 0.875rem;
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.12);
  box-shadow: inset 0 0 0 1px rgb(var(--player-fg-rgb) / 0.08);
  transition:
    background 180ms ease,
    box-shadow 180ms ease;
}

.player-autoplay-toggle::after {
  content: '';
  position: absolute;
  left: 0.42rem;
  top: 50%;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.72);
  transform: translateY(-50%);
  transition:
    transform 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.player-autoplay-toggle:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.14);
  background: rgb(var(--player-fg-rgb) / 0.06);
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-autoplay-toggle--active {
  border-color: rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.12);
  color: var(--player-accent-fg);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.1);
}

.player-autoplay-toggle--active::before {
  background: rgb(var(--color-primary-rgb) / 0.42);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.24);
}

.player-autoplay-toggle--active::after {
  transform: translate(0.72rem, -50%);
  background: var(--player-accent-fg-strong);
  box-shadow: 0 0 0 1px rgb(var(--color-primary-rgb) / 0.18);
}

.player-autoplay-toggle--active:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  background: rgb(var(--color-primary-rgb) / 0.16);
  color: var(--player-accent-fg-strong);
}

.player-autoplay-upnext {
  position: absolute;
  inset: 0;
  z-index: 30;
  pointer-events: auto;
}

.player-autoplay-upnext__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  border: none;
  background: transparent;
  cursor: default;
}

.player-autoplay-upnext__gradient {
  position: absolute;
  inset: auto 0 0;
  height: 55%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.42) 45%, transparent 100%);
  pointer-events: none;
}

.player-autoplay-upnext__card {
  position: absolute;
  right: 0.75rem;
  bottom: 0.75rem;
  left: auto;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 7.5rem;
  gap: 0.75rem;
  width: min(22rem, calc(100% - 1.5rem));
  padding: 0.85rem 0.85rem 0.85rem 1rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(12, 12, 16, 0.88);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.45),
    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(14px);
  pointer-events: auto;
  animation: player-autoplay-upnext-in 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes player-autoplay-upnext-in {
  from {
    opacity: 0;
    transform: translateX(1.25rem) translateY(0.5rem);
  }

  to {
    opacity: 1;
    transform: translateX(0) translateY(0);
  }
}

.player-autoplay-upnext__close {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.62);
  transition:
    color 160ms ease,
    background 160ms ease;
}

.player-autoplay-upnext__close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.95);
}

.player-autoplay-upnext__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.75rem;
  padding-right: 1.25rem;
}

.player-autoplay-upnext__meta {
  min-width: 0;
}

.player-autoplay-upnext__eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.48);
}

.player-autoplay-upnext__show {
  margin-top: 0.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}

.player-autoplay-upnext__episode {
  margin-top: 0.15rem;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.35;
  color: #fff;
}

.player-autoplay-upnext__actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.player-autoplay-upnext__play {
  position: relative;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 999px;
  color: #fff;
  transition: transform 160ms ease;
}

.player-autoplay-upnext__play:hover {
  transform: scale(1.04);
}

.player-autoplay-upnext__ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.player-autoplay-upnext__ring-track {
  fill: none;
  stroke: rgba(255, 255, 255, 0.14);
  stroke-width: 2.5;
}

.player-autoplay-upnext__ring-progress {
  fill: none;
  stroke: var(--color-primary);
  stroke-width: 2.5;
  stroke-linecap: round;
  transition: stroke-dashoffset 250ms linear;
}

.player-autoplay-upnext__play-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: #111;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
}

.player-autoplay-upnext__countdown {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.58);
}

.player-autoplay-upnext__cancel {
  margin-left: 0.15rem;
  padding: 0.35rem 0.55rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.58);
  transition:
    color 160ms ease,
    background 160ms ease;
}

.player-autoplay-upnext__cancel:hover {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.92);
}

.player-autoplay-upnext__thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 0.5rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}

.player-autoplay-upnext__thumb-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.player-autoplay-upnext__thumb-image--poster {
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0.92;
}

@media (max-width: 480px) {
  .player-autoplay-upnext__card {
    grid-template-columns: minmax(0, 1fr) 6.25rem;
    width: min(20rem, calc(100% - 1rem));
    right: max(0.5rem, var(--safe-right));
    bottom: max(0.5rem, var(--safe-bottom));
    padding: 0.75rem;
  }

  .player-autoplay-upnext__episode {
    font-size: 0.875rem;
  }
}

@media (max-width: 400px) {
  .player-autoplay-upnext__card {
    grid-template-columns: minmax(0, 1fr);
    width: calc(100% - 1rem);
  }

  .player-autoplay-upnext__thumb {
    display: none;
  }
}

.player-fallback-badge {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  border-radius: 999px;
  background: rgb(var(--color-warning-rgb) / 0.14);
  padding: 0.25rem 0.625rem;
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--color-warning);
}

.player-server-badge {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  border-radius: 0.625rem;
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.375rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.68);
}

.player-server-badge--readonly {
  gap: 0.375rem;
}

.player-source-trigger {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  gap: 0.375rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.12);
  background: var(--player-panel);
  padding: 0.35rem 0.65rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.9);
  box-shadow: var(--player-shadow);
  backdrop-filter: blur(12px);
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease,
    opacity 0.3s ease;
}

.player-source-trigger--pill {
  border-radius: 999px;
}

.player-source-trigger--bar {
  border-radius: 0.625rem;
  cursor: pointer;
}

.player-source-trigger--bar:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: var(--player-panel-strong);
  color: rgb(var(--player-fg-rgb));
}

.player-source-trigger--open {
  opacity: 1;
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: var(--player-panel-strong);
  color: rgb(var(--player-fg-rgb));
}

.player-source-trigger--highlighted {
  animation: player-source-highlight 1.1s ease-in-out 3;
}

@keyframes player-source-highlight {
  0%,
  100% {
    border-color: rgb(var(--color-primary-rgb) / 0.42);
    box-shadow: none;
  }
  50% {
    border-color: rgb(var(--color-primary-rgb) / 0.85);
    box-shadow: 0 0 0 1px rgb(var(--color-primary-rgb) / 0.35);
  }
}

.player-source-trigger-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-source-trigger-chevron {
  flex-shrink: 0;
  opacity: 0.65;
  transition: transform 0.2s ease;
}

.player-source-trigger-chevron--open {
  transform: rotate(180deg);
}

.player-source-trigger-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  flex-shrink: 0;
}

.player-source-trigger-dot--online {
  background: var(--color-success);
  box-shadow: 0 0 6px rgb(var(--color-success-rgb) / 0.35);
}

.player-source-trigger-dot--offline {
  background: var(--color-danger);
  box-shadow: 0 0 6px rgb(var(--color-danger-rgb) / 0.3);
}

.player-source-trigger-dot--scanning {
  background: var(--color-primary);
  animation: pulse-glow 1.2s ease-in-out infinite;
}

.player-source-trigger-dot--unknown {
  background: rgb(var(--player-fg-rgb) / 0.4);
}

.player-skip-pill {
  pointer-events: auto;
  z-index: 20;
}

.player-skip-notice {
  position: absolute;
  left: 50%;
  top: 0.75rem;
  z-index: 22;
  transform: translateX(-50%);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(4, 4, 10, 0.82);
  padding: 0.375rem 0.75rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 24px -12px rgba(0, 0, 0, 0.65);
  pointer-events: none;
}

@media (min-width: 640px) {
  .player-skip-notice {
    top: 1rem;
  }
}

.player-router {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  z-index: 25;
  max-width: min(20rem, calc(100% - 1.5rem));
  pointer-events: auto;
}

.player-router--expanded,
.player-router--scanning {
  z-index: 60;
}

.player-router--chrome-hidden:not(.player-router--expanded):not(.player-router--scanning) .player-source-trigger {
  opacity: 0;
  pointer-events: none;
}

.player-router--chrome-hidden:not(.player-router--expanded):not(.player-router--scanning):hover .player-source-trigger {
  opacity: 0.82;
  pointer-events: auto;
}

@media (pointer: coarse) {
  .player-router--chrome-hidden:not(.player-router--expanded):not(.player-router--scanning) .player-source-trigger {
    opacity: 0.82;
    pointer-events: auto;
  }

  .player-router--chrome-hidden:not(.player-router--expanded):not(.player-router--scanning):hover .player-source-trigger {
    opacity: 0.82;
  }
}

@media (min-width: 640px) {
  .player-router {
    left: 1rem;
    top: 1rem;
  }
}

.player-router:not(.player-router--expanded):not(.player-router--scanning):not(.player-router--chrome-hidden) .player-source-trigger {
  opacity: 0.82;
}

.player-router:not(.player-router--expanded):not(.player-router--scanning):not(.player-router--chrome-hidden):hover .player-source-trigger {
  opacity: 1;
}

.player-router--expanded .player-source-trigger,
.player-router--scanning .player-source-trigger {
  opacity: 1;
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: var(--player-panel-strong);
}

.player-router-panel {
  margin-top: 0.5rem;
  overflow: hidden;
  border-radius: 0.875rem;
  border: 1px solid var(--player-border);
  background: var(--player-panel);
  color: rgb(var(--player-fg-rgb));
  box-shadow: var(--player-shadow);
  backdrop-filter: blur(14px);
  animation: player-router-panel-in 0.15s ease-out;
}

@keyframes player-router-panel-in {
  from {
    opacity: 0;
    transform: translateY(-0.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .player-router-panel {
    animation: none;
  }
}

.player-router-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 0.75rem 0.625rem;
}

.player-router-title {
  margin: 0;
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-router-subtitle {
  margin: 0.15rem 0 0;
  font-size: 0.625rem;
  color: rgb(var(--player-fg-rgb) / 0.48);
}

.player-router-mode-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.14);
  padding: 0.25rem 0.55rem;
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--player-accent-fg);
  white-space: nowrap;
  transition:
    border-color 0.15s ease,
    background 0.15s ease,
    color 0.15s ease;
}

.player-router-mode-toggle:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.5);
  background: rgb(var(--color-primary-rgb) / 0.2);
  color: var(--player-accent-fg-strong);
}

.player-router-scanline {
  height: 1px;
  margin: 0 0.75rem 0.5rem;
  background: linear-gradient(90deg, transparent, rgb(var(--color-primary-rgb) / 0.75), transparent);
  animation: player-router-scan 1.4s linear infinite;
}

@keyframes player-router-scan {
  0% {
    transform: translateX(-120%);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    transform: translateX(120%);
    opacity: 0;
  }
}

.player-router-list {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  margin: 0;
  padding: 0 0.45rem 0.45rem;
  list-style: none;
  max-height: min(16rem, calc(100dvh - 10rem));
  overflow-y: auto;
  overscroll-behavior: contain;
}

.player-router-tier-heading {
  position: sticky;
  top: 0;
  z-index: 1;
  margin: 0 0 0.125rem;
  padding: 0.55rem 0.55rem 0.3rem;
  border-top: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: var(--player-panel);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.42);
  backdrop-filter: blur(8px);
}

.player-router-tier-heading--first {
  border-top: none;
  padding-top: 0.15rem;
}

.player-router-empty {
  padding: 0.75rem 0.55rem 0.85rem;
  font-size: 0.6875rem;
  color: rgb(var(--player-fg-rgb) / 0.45);
  text-align: center;
}

.player-router-unavailable-toggle {
  display: block;
  width: calc(100% - 0.9rem);
  margin: 0 0.45rem 0.45rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.5rem;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.45);
  background: transparent;
  transition: color 0.15s ease, background 0.15s ease;
}

.player-router-unavailable-toggle:hover {
  color: rgb(var(--player-fg-rgb) / 0.7);
  background: rgb(var(--player-fg-rgb) / 0.04);
}

.player-router-row {
  position: relative;
  display: block;
  width: 100%;
  border: none;
  border-radius: 0.625rem;
  background: transparent;
  padding: 0.5rem 0.55rem;
  text-align: left;
  color: inherit;
  cursor: pointer;
  transition: background 0.15s ease;
}

.player-router-row:hover {
  background: rgb(var(--player-fg-rgb) / 0.06);
}

.player-router-row--active {
  background: rgb(var(--color-primary-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.28);
}

.player-router-row--active::before {
  content: '';
  position: absolute;
  left: 0.2rem;
  top: 0.45rem;
  bottom: 0.45rem;
  width: 0.15rem;
  border-radius: 999px;
  background: var(--color-primary);
}

.player-router-row--missing {
  cursor: not-allowed;
  opacity: 0.45;
}

.player-router-row--missing:hover {
  background: transparent;
}

.player-router-list-item--retryable {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.35rem;
}

.player-router-list-item--retryable .player-router-row {
  min-width: 0;
}

.player-router-row:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.player-router-retry {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-right: 0.45rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.13);
  border-radius: 0.45rem;
  background: rgb(var(--player-fg-rgb) / 0.05);
  padding: 0.3rem 0.42rem;
  color: rgb(var(--player-fg-rgb) / 0.7);
  font-size: 0.6rem;
  font-weight: 700;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.player-router-retry:hover:not(:disabled) {
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  background: rgb(var(--color-primary-rgb) / 0.12);
  color: var(--player-accent-fg);
}

.player-router-retry:disabled {
  cursor: wait;
  opacity: 0.6;
}

.player-router-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.player-router-row-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.9);
}

.player-router-row-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.player-router-kind {
  border-radius: 0.3rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.08rem 0.3rem;
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: none;
  color: rgb(var(--player-fg-rgb) / 0.5);
}

.player-router-quality {
  border-radius: 0.3rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.07);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.08rem 0.3rem;
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgb(var(--player-fg-rgb) / 0.7);
}

.player-router-auto-chip {
  border-radius: 0.3rem;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.35);
  background: rgb(var(--color-primary-rgb) / 0.16);
  padding: 0.08rem 0.3rem;
  font-size: 0.5625rem;
  font-weight: 700;
  color: var(--player-accent-fg);
}

.player-router-row-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
  min-height: 1.125rem;
}

.player-router-row-bottom--status {
  grid-template-columns: minmax(0, 1fr);
}

.player-router-row-bottom--status .player-router-status-chip {
  justify-self: start;
}

.player-router-bar {
  position: relative;
  height: 0.25rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.08);
}

.player-router-bar-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  transition: width 0.35s ease;
}

.player-router-bar-fill--good {
  background: var(--color-success);
}

.player-router-bar-fill--playing {
  background: var(--color-primary);
}

.player-router-bar-fill--fair {
  background: var(--color-warning);
}

.player-router-bar-fill--poor {
  background: var(--color-danger);
}

.player-router-bar-fill--offline {
  background: rgb(var(--player-fg-rgb) / 0.14);
}

.player-router-bar-fill--scanning {
  width: 35% !important;
  background: linear-gradient(
    90deg,
    rgb(var(--color-primary-rgb) / 0.15),
    rgb(var(--color-primary-rgb) / 0.9),
    rgb(var(--color-primary-rgb) / 0.15)
  );
  background-size: 200% 100%;
  animation: shimmer 1.2s linear infinite;
}

.player-router-throughput {
  min-width: 3.25rem;
  justify-self: end;
  text-align: right;
  font-size: 0.625rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.player-router-throughput--numeric {
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.player-router-throughput--good {
  color: var(--color-success);
}

.player-router-throughput--playing {
  color: var(--player-accent-fg);
}

.player-router-throughput--fair {
  color: var(--color-warning);
}

.player-router-throughput--poor {
  color: var(--color-danger);
}

.player-router-throughput--offline,
.player-router-throughput--scanning {
  color: rgb(var(--player-fg-rgb) / 0.48);
}

.player-router-throughput--neutral {
  color: rgb(var(--player-fg-rgb) / 0.38);
}

.player-router-status-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.04);
  padding: 0.12rem 0.45rem 0.12rem 0.35rem;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.62);
}

.player-router-row-bottom--scanning .player-router-status-chip {
  justify-self: end;
}

.player-router-status-chip-dot {
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 999px;
  flex-shrink: 0;
  background: rgb(var(--player-fg-rgb) / 0.35);
}

.player-router-status-chip--good {
  color: var(--color-success);
  border-color: rgb(var(--color-success-rgb) / 0.22);
  background: rgb(var(--color-success-rgb) / 0.08);
}

.player-router-status-chip--good .player-router-status-chip-dot {
  background: var(--color-success);
}

.player-router-status-chip--playing {
  color: var(--player-accent-fg);
  border-color: rgb(var(--color-primary-rgb) / 0.28);
  background: rgb(var(--color-primary-rgb) / 0.1);
}

.player-router-status-chip--playing .player-router-status-chip-dot {
  background: var(--color-primary);
}

.player-router-status-chip--fair {
  color: var(--color-warning);
  border-color: rgb(var(--color-warning-rgb) / 0.22);
  background: rgb(var(--color-warning-rgb) / 0.08);
}

.player-router-status-chip--fair .player-router-status-chip-dot {
  background: var(--color-warning);
}

.player-router-status-chip--poor {
  color: var(--color-danger);
  border-color: rgb(var(--color-danger-rgb) / 0.22);
  background: rgb(var(--color-danger-rgb) / 0.08);
}

.player-router-status-chip--poor .player-router-status-chip-dot {
  background: var(--color-danger);
}

.player-router-status-chip--offline,
.player-router-status-chip--scanning {
  color: rgb(var(--player-fg-rgb) / 0.48);
}

.player-router-status-chip--offline .player-router-status-chip-dot,
.player-router-status-chip--scanning .player-router-status-chip-dot {
  background: rgb(var(--player-fg-rgb) / 0.35);
}

.player-router-status-chip--neutral {
  color: rgb(var(--player-fg-rgb) / 0.38);
}

.player-router-status-chip--neutral .player-router-status-chip-dot {
  background: rgb(var(--player-fg-rgb) / 0.28);
}

.player-router-bar-fill--neutral {
  background: rgb(var(--player-fg-rgb) / 0.12);
}

.player-router-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.player-router-prefs-toggle {
  display: inline-grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.12);
  background: rgb(var(--player-fg-rgb) / 0.05);
  color: rgb(var(--player-fg-rgb) / 0.55);
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.player-router-prefs-toggle:hover,
.player-router-prefs-toggle--open {
  color: var(--player-accent-fg);
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: rgb(var(--color-primary-rgb) / 0.14);
}

.player-router-prefs {
  margin: 0 0.75rem 0.5rem;
  padding: 0.45rem 0.5rem;
  max-height: none;
  overflow: visible;
  border-radius: 0.5rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  background: rgb(var(--player-fg-rgb) / 0.03);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.player-router-codecs {
  margin: 0 0.75rem 0.5rem;
  padding: 0.45rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.2);
  background: rgb(var(--color-primary-rgb) / 0.06);
}

.player-router-codecs-content {
  min-width: 0;
}

.player-router-prefs-row {
  display: grid;
  grid-template-columns: 3.25rem minmax(0, 1fr);
  align-items: center;
  gap: 0.4rem;
}

.player-router-prefs-row--toggles {
  align-items: stretch;
}

.player-router-prefs-label {
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgb(var(--player-fg-rgb) / 0.42);
  white-space: nowrap;
}

.player-router-seg {
  display: flex;
  min-width: 0;
  overflow: hidden;
  border-radius: 0.4rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.03);
}

.player-router-seg-btn {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  border: 0;
  border-right: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  border-radius: 0;
  background: transparent;
  padding: 0.28rem 0.2rem;
  font-size: 0.625rem;
  font-weight: 600;
  line-height: 1.1;
  color: rgb(var(--player-fg-rgb) / 0.55);
  white-space: nowrap;
  transition:
    color 0.12s ease,
    background 0.12s ease;
}

.player-router-seg-btn:last-child {
  border-right: 0;
}

.player-router-seg-btn:hover:not(:disabled) {
  color: rgb(var(--player-fg-rgb) / 0.92);
  background: rgb(var(--player-fg-rgb) / 0.05);
}

.player-router-seg-btn--active {
  color: var(--player-accent-fg-strong);
  background: rgb(var(--color-primary-rgb) / 0.22);
}

.player-router-seg-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.player-router-prefs-toggles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.3rem;
  min-width: 0;
}

.player-router-toggle {
  margin: 0;
  border-radius: 0.4rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.03);
  padding: 0.28rem 0.35rem;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.55);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition:
    color 0.12s ease,
    border-color 0.12s ease,
    background 0.12s ease;
}

.player-router-toggle:hover:not(:disabled) {
  color: rgb(var(--player-fg-rgb) / 0.9);
  border-color: rgb(var(--player-fg-rgb) / 0.18);
}

.player-router-toggle--active {
  color: var(--player-accent-fg-strong);
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: rgb(var(--color-primary-rgb) / 0.16);
}

.player-router-toggle:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

@media (max-width: 767px) {
  .player-control-bar {
    overflow-x: hidden;
    padding-left: max(0.75rem, var(--safe-left));
    padding-right: max(0.75rem, var(--safe-right));
    padding-bottom: max(0.5rem, var(--safe-bottom));
  }

  .player-control-bar__end .player-bar-control--desktop,
  .player-control-bar__end .player-download-trigger,
  .player-control-bar__start .player-download-trigger {
    display: none !important;
  }

  .player-control-bar__mobile-more,
  .player-control-bar__end .player-menu-trigger {
    min-height: 44px;
    min-width: 44px;
  }

  .player-control-bar__start .player-source-trigger,
  .player-control-bar__start .player-audio-trigger,
  .player-control-bar__start button {
    min-height: 44px;
  }

  .player-control-bar__desktop-more {
    display: none;
  }

  .player-control-bar__mobile-more {
    display: inline-flex;
  }

  .player-skip-pill {
    top: auto;
    right: max(0.75rem, var(--safe-right));
    bottom: calc(3.75rem + var(--safe-bottom));
  }

  .player-router {
    left: max(0.75rem, var(--safe-left));
    top: max(0.75rem, var(--safe-top));
    max-width: calc(100% - 1.5rem - var(--safe-left) - var(--safe-right));
  }

  .player-router-panel {
    max-height: min(70dvh, calc(100dvh - var(--sticky-offset) - 2rem));
  }

  .player-router-list {
    max-height: min(50dvh, calc(100dvh - var(--sticky-offset) - 8rem));
  }

  .player-menu-root .player-popover {
    position: fixed;
    inset: auto 0 0;
    top: auto;
    z-index: 52;
    width: 100%;
    max-width: none;
    min-width: 0;
    border-radius: 1rem 1rem 0 0;
    border-bottom: none;
    padding-bottom: max(1rem, var(--safe-bottom));
    animation: mobile-sheet-in 240ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .player-router--expanded {
    z-index: 72;
  }

  .player-menu-root .player-popover--audio-subs {
    max-height: min(70dvh, 28rem);
  }

  .player-menu-root .player-downloads-list {
    max-height: min(45dvh, 18rem);
  }

  .player-menu-root .player-torrents-body {
    max-height: min(55dvh, 22rem);
  }
}

@media (min-width: 768px) {
  .player-control-bar__mobile-more {
    display: none;
  }

  .player-control-bar__desktop-more {
    display: block;
  }

}

@media (max-width: 767px) and (orientation: landscape) {
  .player-control-bar--below {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
  }

  .player-resume-prompt {
    bottom: calc(3.5rem + var(--safe-bottom));
  }
}

.player-video--upscale-webgl-source {
  /* Keep the element in layout for texture sampling; canvas paints the result. */
  visibility: visible;
}

.player-anime4k-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
  image-rendering: auto;
}

.video-player-shell .plyr__controls .player-enhance-control,
.video-player-shell .plyr__controls .player-external-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.video-player-shell .plyr__controls .player-enhance-control svg,
.video-player-shell .plyr__controls .player-external-control svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}

.video-player-shell .plyr__controls .player-enhance-control--active svg {
  color: var(--color-primary-soft, #9dd4ff);
}

.video-player-shell .plyr__controls .player-external-control--disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.video-player-shell .plyr__video-wrapper {
  position: relative;
}

/* Episode playback menus --------------------------------------------------- */
.watch-player-shell .player-popover,
.watch-player-shell .player-router-panel {
  --player-menu-line: rgb(var(--player-fg-rgb) / 0.1);
  --player-menu-muted: rgb(var(--player-fg-rgb) / 0.52);
  border-radius: 1rem;
  border-color: rgb(var(--player-fg-rgb) / 0.12);
  background:
    radial-gradient(circle at 12% 0%, rgb(var(--color-primary-rgb) / 0.13), transparent 35%),
    linear-gradient(145deg, var(--player-panel-strong), var(--player-panel));
  box-shadow:
    0 24px 70px rgb(0 0 0 / 0.42),
    inset 0 1px 0 rgb(var(--player-fg-rgb) / 0.07);
  backdrop-filter: blur(24px) saturate(135%);
}

.watch-player-shell .player-popover {
  padding: 0.875rem;
  animation: player-menu-in 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
  transform-origin: bottom right;
}

.watch-player-shell .player-control-bar:not(.player-control-bar--below) .player-popover {
  transform-origin: top right;
}

@keyframes player-menu-in {
  from {
    opacity: 0;
    transform: translateY(0.4rem) scale(0.975);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.player-menu-header {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  margin: -0.2rem -0.2rem 0.8rem;
  padding: 0.2rem 0.2rem 0.75rem;
  border-bottom: 1px solid var(--player-menu-line, rgb(var(--player-fg-rgb) / 0.1));
}

.player-menu-header-icon,
.player-trigger-icon,
.player-download-section-icon,
.player-menu-empty-icon,
.player-option-item-icon,
.player-torrent-leading-icon {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  color: var(--player-accent-fg-strong);
  background: linear-gradient(145deg, rgb(var(--color-primary-rgb) / 0.2), rgb(var(--color-primary-rgb) / 0.08));
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.2);
}

.player-menu-header-icon {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 0.72rem;
}

.player-menu-header-icon--danger,
.player-option-item-icon--danger {
  color: var(--color-danger);
  background: rgb(var(--color-danger-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--color-danger-rgb) / 0.2);
}

.player-menu-header-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.player-menu-title {
  margin: 0;
  overflow: hidden;
  font-family: 'Outfit Variable', Outfit, ui-sans-serif, system-ui, sans-serif;
  font-size: 0.88rem;
  font-weight: 720;
  line-height: 1.2;
  color: rgb(var(--player-fg-rgb) / 0.96);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-menu-subtitle {
  margin: 0.16rem 0 0;
  overflow: hidden;
  font-size: 0.66rem;
  line-height: 1.25;
  color: var(--player-menu-muted, rgb(var(--player-fg-rgb) / 0.52));
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-menu-status-badge,
.player-menu-section-count,
.player-download-count {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  min-width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.25);
  background: rgb(var(--color-primary-rgb) / 0.12);
  padding: 0 0.34rem;
  font-size: 0.6rem;
  font-weight: 750;
  color: var(--player-accent-fg-strong);
}

.player-menu-close {
  display: inline-grid;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: 0.65rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.09);
  background: rgb(var(--player-fg-rgb) / 0.04);
  color: rgb(var(--player-fg-rgb) / 0.55);
  transition: 150ms ease;
}

.player-menu-close:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.16);
  background: rgb(var(--player-fg-rgb) / 0.08);
  color: rgb(var(--player-fg-rgb) / 0.95);
}

.player-trigger-icon {
  width: 1.55rem;
  height: 1.55rem;
  margin-left: -0.2rem;
  border-radius: 0.5rem;
}

.player-menu-trigger-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.05;
}

.player-menu-trigger-kicker {
  margin-bottom: 0.14rem;
  font-size: 0.5rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.42);
}

.watch-player-shell .player-menu-trigger,
.watch-player-shell .player-download-trigger,
.watch-player-shell .player-source-trigger--bar {
  min-height: 2.35rem;
  border-radius: 0.78rem;
  border-color: rgb(var(--player-fg-rgb) / 0.09);
  background: linear-gradient(180deg, rgb(var(--player-fg-rgb) / 0.065), rgb(var(--player-fg-rgb) / 0.035));
  box-shadow: inset 0 1px 0 rgb(var(--player-fg-rgb) / 0.04);
}

.watch-player-shell .player-download-trigger {
  border-color: rgb(var(--color-primary-rgb) / 0.2);
  background: linear-gradient(180deg, rgb(var(--color-primary-rgb) / 0.12), rgb(var(--color-primary-rgb) / 0.07));
}

.watch-player-shell :is(.player-menu-trigger, .player-download-trigger, .player-source-trigger--bar):hover,
.watch-player-shell :is(.player-menu-trigger--open, .player-download-trigger--open, .player-source-trigger--open) {
  transform: translateY(-1px);
  border-color: rgb(var(--color-primary-rgb) / 0.38);
  background: rgb(var(--color-primary-rgb) / 0.13);
  box-shadow:
    0 7px 18px rgb(0 0 0 / 0.16),
    inset 0 1px 0 rgb(var(--player-fg-rgb) / 0.06);
}

.player-download-trigger-meta {
  border-left: 1px solid rgb(var(--color-primary-rgb) / 0.24);
  margin-left: 0.05rem;
  padding-left: 0.42rem;
  color: rgb(var(--player-fg-rgb) / 0.58);
}

.watch-player-shell .player-popover--source {
  width: min(26rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--torrents {
  width: min(29rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--audio-subs {
  width: min(21rem, calc(100vw - 2rem));
  max-height: min(76vh, 31rem);
}

.watch-player-shell .player-popover--auto {
  width: min(21rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--more {
  width: min(20rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--report {
  width: min(22rem, calc(100vw - 2rem));
}

/* Download menu */
.player-downloads-list {
  display: flex;
  max-height: min(39vh, 15rem);
  flex-direction: column;
  gap: 0.8rem;
  margin: 0 -0.2rem;
  padding: 0 0.2rem 0.1rem;
}

.player-download-section + .player-download-section {
  border-top: 1px solid var(--player-menu-line);
  padding-top: 0.8rem;
}

.player-download-section-header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.55rem;
  padding: 0 0.1rem;
}

.player-download-section-icon,
.player-menu-empty-icon {
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 0.58rem;
  color: rgb(var(--player-fg-rgb) / 0.66);
  background: rgb(var(--player-fg-rgb) / 0.045);
  box-shadow: inset 0 0 0 1px rgb(var(--player-fg-rgb) / 0.08);
}

.player-download-section-icon--accent {
  color: var(--player-accent-fg-strong);
  background: rgb(var(--color-primary-rgb) / 0.11);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.2);
}

.player-download-section-title-row,
.player-download-card-title-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.4rem;
}

.player-download-section-title {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 720;
  line-height: 1.2;
  color: rgb(var(--player-fg-rgb) / 0.88);
}

.player-download-section-copy {
  margin: 0.12rem 0 0;
  font-size: 0.61rem;
  color: var(--player-menu-muted);
}

.player-download-count {
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.27rem;
  font-size: 0.52rem;
}

.player-download-card-list {
  display: grid;
  gap: 0.42rem;
}

.player-download-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.65rem;
  border-radius: 0.78rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.085);
  background: linear-gradient(125deg, rgb(var(--player-fg-rgb) / 0.048), rgb(var(--player-fg-rgb) / 0.022));
  padding: 0.62rem;
  transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
}

.player-download-card:hover {
  transform: translateY(-1px);
  border-color: rgb(var(--color-primary-rgb) / 0.24);
  background: linear-gradient(125deg, rgb(var(--color-primary-rgb) / 0.075), rgb(var(--player-fg-rgb) / 0.03));
}

.player-download-card--refresh {
  border-color: rgb(var(--color-warning-rgb) / 0.18);
}

.player-download-card-main {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.55rem;
}

.player-download-file-icon {
  display: inline-grid;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: 0.62rem;
  color: var(--player-accent-fg);
  background: rgb(var(--color-primary-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.16);
}

.player-download-card-content {
  min-width: 0;
  flex: 1 1 auto;
}

.player-download-card-title {
  display: block;
  min-width: 0;
  overflow: hidden;
  font-size: 0.72rem;
  font-weight: 680;
  line-height: 1.3;
  color: rgb(var(--player-fg-rgb) / 0.92);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-download-format {
  display: inline-flex;
  flex: 0 0 auto;
  border-radius: 0.32rem;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.18);
  background: rgb(var(--color-primary-rgb) / 0.08);
  padding: 0.06rem 0.3rem;
  font-size: 0.5rem;
  font-weight: 760;
  letter-spacing: 0.06em;
  color: var(--player-accent-fg);
}

.player-download-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.22rem;
  margin-top: 0.28rem;
}

.player-download-tags > span {
  border-radius: 0.28rem;
  background: rgb(var(--player-fg-rgb) / 0.055);
  padding: 0.08rem 0.27rem;
  font-size: 0.5rem;
  font-weight: 650;
  letter-spacing: 0.025em;
  color: rgb(var(--player-fg-rgb) / 0.48);
}

.player-download-tags > .player-download-tag--warning {
  color: var(--color-warning);
  background: rgb(var(--color-warning-rgb) / 0.09);
}

.player-download-card-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.28rem;
}

.player-download-primary-action,
.player-download-secondary-action,
.player-torrent-action {
  display: inline-flex;
  min-height: 1.75rem;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  border-radius: 0.52rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.11);
  padding: 0.3rem 0.55rem;
  font-size: 0.58rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  transition: 150ms ease;
}

.player-download-primary-action {
  border-color: rgb(var(--color-primary-rgb) / 0.28);
  background: rgb(var(--color-primary-rgb) / 0.14);
  color: var(--player-accent-fg-strong);
}

.player-download-primary-action:hover:not(:disabled) {
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  background: rgb(var(--color-primary-rgb) / 0.22);
}

.player-download-secondary-action {
  background: rgb(var(--player-fg-rgb) / 0.04);
  color: rgb(var(--player-fg-rgb) / 0.65);
}

.player-download-secondary-action:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.2);
  background: rgb(var(--player-fg-rgb) / 0.08);
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-download-primary-action:disabled {
  cursor: wait;
  opacity: 0.6;
}

.player-download-file-only {
  align-self: center;
  padding: 0.25rem;
  font-size: 0.55rem;
  color: rgb(var(--player-fg-rgb) / 0.36);
  text-align: center;
}

.player-menu-state,
.player-menu-empty {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 3.75rem;
  border-radius: 0.78rem;
  border: 1px dashed rgb(var(--player-fg-rgb) / 0.12);
  background: rgb(var(--player-fg-rgb) / 0.025);
  padding: 0.75rem;
  color: rgb(var(--player-fg-rgb) / 0.52);
}

.player-menu-state {
  justify-content: center;
  font-size: 0.67rem;
}

.player-menu-empty--compact {
  min-height: 3rem;
  padding: 0.6rem;
}

.player-menu-empty-title {
  margin: 0;
  font-size: 0.69rem;
  font-weight: 680;
  color: rgb(var(--player-fg-rgb) / 0.78);
}

.player-menu-empty-copy {
  margin: 0.14rem 0 0;
  font-size: 0.6rem;
  line-height: 1.35;
  color: rgb(var(--player-fg-rgb) / 0.44);
}

.player-menu-spinner {
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 999px;
  border: 2px solid rgb(var(--player-fg-rgb) / 0.13);
  border-top-color: var(--player-accent-fg);
  animation: player-menu-spin 0.8s linear infinite;
}

@keyframes player-menu-spin {
  to { transform: rotate(360deg); }
}

/* Audio, subtitle, and automation menus */
.player-menu-notice {
  border-radius: 0.72rem;
  border: 1px solid rgb(var(--color-warning-rgb) / 0.2);
  background: rgb(var(--color-warning-rgb) / 0.065);
  padding: 0.62rem 0.7rem;
  font-size: 0.61rem;
  color: rgb(var(--player-fg-rgb) / 0.58);
}

.player-menu-notice-title {
  margin: 0 0 0.35rem;
  font-size: 0.67rem;
  font-weight: 700;
  color: var(--color-warning);
}

.player-menu-notice > p:not(.player-menu-notice-title, .player-menu-notice-detail) {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin: 0.15rem 0;
}

.player-menu-notice strong {
  color: rgb(var(--player-fg-rgb) / 0.82);
}

.player-menu-notice-detail {
  margin: 0.35rem 0 0;
  line-height: 1.35;
}

.player-menu-section-heading {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  color: rgb(var(--player-fg-rgb) / 0.42);
}

.player-menu-section-count {
  min-width: 1rem;
  height: 1rem;
  margin-left: auto;
  padding: 0 0.25rem;
  font-size: 0.5rem;
}

.player-audio-subs-section-label {
  font-size: 0.59rem;
  letter-spacing: 0.09em;
}

.player-audio-subs-divider {
  background: var(--player-menu-line);
}

.watch-player-shell .player-segment-group {
  gap: 0.2rem;
  border-radius: 0.68rem;
  padding: 0.18rem;
}

.watch-player-shell .player-segment {
  min-height: 1.8rem;
  justify-content: center;
  border-radius: 0.52rem;
}

.watch-player-shell .player-segment--active {
  background: linear-gradient(145deg, rgb(var(--color-primary-rgb) / 0.24), rgb(var(--color-primary-rgb) / 0.13));
  box-shadow:
    inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.16),
    0 3px 10px rgb(0 0 0 / 0.12);
}

.watch-player-shell .player-audio-subs-option {
  min-height: 2.2rem;
  border-radius: 0.62rem;
}

.watch-player-shell .player-audio-subs-option:hover {
  background: rgb(var(--player-fg-rgb) / 0.065);
}

.watch-player-shell .player-popover-option--active {
  border-color: rgb(var(--color-primary-rgb) / 0.25);
  background: linear-gradient(110deg, rgb(var(--color-primary-rgb) / 0.13), rgb(var(--color-primary-rgb) / 0.045));
}

.player-toggle-settings {
  display: grid;
  gap: 0.4rem;
}

.player-toggle-setting {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.58rem;
  width: 100%;
  border-radius: 0.72rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.03);
  padding: 0.55rem;
  text-align: left;
  transition: 150ms ease;
}

.player-toggle-setting:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.16);
  background: rgb(var(--player-fg-rgb) / 0.055);
}

.player-toggle-setting--active {
  border-color: rgb(var(--color-primary-rgb) / 0.24);
  background: linear-gradient(110deg, rgb(var(--color-primary-rgb) / 0.11), rgb(var(--color-primary-rgb) / 0.035));
}

.player-toggle-setting-icon {
  display: inline-grid;
  width: 1.9rem;
  height: 1.9rem;
  place-items: center;
  border-radius: 0.58rem;
  background: rgb(var(--player-fg-rgb) / 0.055);
  color: rgb(var(--player-fg-rgb) / 0.52);
}

.player-toggle-setting--active .player-toggle-setting-icon {
  background: rgb(var(--color-primary-rgb) / 0.13);
  color: var(--player-accent-fg);
}

.player-toggle-setting-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.player-toggle-setting-copy strong {
  font-size: 0.68rem;
  font-weight: 680;
  color: rgb(var(--player-fg-rgb) / 0.86);
}

.player-toggle-setting-copy small {
  margin-top: 0.12rem;
  overflow: hidden;
  font-size: 0.56rem;
  color: rgb(var(--player-fg-rgb) / 0.42);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-switch {
  position: relative;
  display: inline-flex;
  width: 1.9rem;
  height: 1.05rem;
  flex: 0 0 auto;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.12);
  background: rgb(var(--player-fg-rgb) / 0.08);
  padding: 0.1rem;
  transition: 160ms ease;
}

.player-switch > span {
  width: 0.72rem;
  height: 0.72rem;
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.55);
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.3);
  transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1), background 160ms ease;
}

.player-toggle-setting--active .player-switch {
  border-color: rgb(var(--color-primary-rgb) / 0.4);
  background: rgb(var(--color-primary-rgb) / 0.33);
}

.player-toggle-setting--active .player-switch > span {
  transform: translateX(0.78rem);
  background: var(--player-accent-fg-strong);
}

/* More menu */
.player-popover-menu-list {
  gap: 0.38rem;
}

.watch-player-shell .player-popover-menu-item,
.watch-player-shell .player-more-sheet-item,
.player-mobile-options-sheet .player-more-sheet-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.6rem;
  border-radius: 0.72rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  background: rgb(var(--player-fg-rgb) / 0.03);
  padding: 0.58rem;
}

.watch-player-shell .player-popover-menu-item:hover,
.watch-player-shell .player-more-sheet-item:hover,
.player-mobile-options-sheet .player-more-sheet-item:hover {
  transform: translateX(2px);
  border-color: rgb(var(--color-primary-rgb) / 0.2);
  background: rgb(var(--color-primary-rgb) / 0.07);
}

.player-option-item-icon {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 0.55rem;
}

.player-option-item-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.player-option-item-copy strong {
  font-size: 0.67rem;
  font-weight: 680;
  color: rgb(var(--player-fg-rgb) / 0.86);
}

.player-option-item-copy small {
  margin-top: 0.13rem;
  font-size: 0.56rem;
  color: rgb(var(--player-fg-rgb) / 0.4);
}

.player-option-item-chevron {
  color: rgb(var(--player-fg-rgb) / 0.28);
}

.player-mobile-options-sheet {
  --player-fg-rgb: var(--fg-rgb);
  border-color: rgb(var(--fg-rgb) / 0.12);
  background:
    radial-gradient(circle at 12% 0%, rgb(var(--color-primary-rgb) / 0.14), transparent 34%),
    color-mix(in srgb, var(--surface) 95%, var(--surface-overlay));
  box-shadow:
    0 -24px 70px rgb(0 0 0 / 0.42),
    inset 0 1px 0 rgb(var(--fg-rgb) / 0.06);
}

.player-mobile-options-sheet .mobile-sheet-header h3 {
  font-size: 1rem;
}

.player-mobile-download-actions {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgb(var(--fg-rgb) / 0.08);
}

/* Torrent menu */
.player-torrents-tabs {
  margin: 0 0 0.55rem;
  padding: 0;
  border: 0;
  background: transparent;
}

.player-torrent-list {
  display: grid;
  gap: 0.42rem;
  margin-bottom: 0;
  padding: 0;
  list-style: none;
}

.player-torrent-row {
  border-radius: 0.78rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.085);
  background: linear-gradient(125deg, rgb(var(--player-fg-rgb) / 0.045), rgb(var(--player-fg-rgb) / 0.02));
  transition: 150ms ease;
}

.player-torrent-row:hover {
  transform: translateY(-1px);
  border-color: rgb(var(--color-primary-rgb) / 0.22);
  background: linear-gradient(125deg, rgb(var(--color-primary-rgb) / 0.07), rgb(var(--player-fg-rgb) / 0.025));
}

.player-torrent-row--detailed {
  padding: 0.65rem;
}

.player-torrent-row--compact {
  padding: 0.5rem 0.62rem;
}

.player-torrent-row-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.player-torrent-leading-icon {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 0.55rem;
}

.player-torrent-row-title {
  padding-top: 0.08rem;
  font-size: 0.67rem;
  line-height: 1.35;
}

.player-torrent-row-badges {
  gap: 0.2rem;
}

.player-torrent-badge {
  gap: 0.16rem;
  border-radius: 0.36rem;
  padding: 0.08rem 0.32rem;
  font-size: 0.48rem;
}

.player-torrent-badge--trusted {
  border-color: rgb(var(--color-success-rgb) / 0.22);
  background: rgb(var(--color-success-rgb) / 0.08);
  color: var(--color-success);
  text-transform: none;
}

.player-torrent-row-meta {
  align-items: center;
  margin: 0.42rem 0 0 2.25rem;
  color: rgb(var(--player-fg-rgb) / 0.44);
}

.player-torrent-row-meta-item + .player-torrent-row-meta-item::before {
  content: '';
  width: 0.18rem;
  height: 0.18rem;
  margin-right: 0.12rem;
  border-radius: 999px;
  background: rgb(var(--player-fg-rgb) / 0.2);
}

.player-torrent-row-size {
  color: rgb(var(--player-fg-rgb) / 0.62);
  font-weight: 650;
}

.player-torrent-row-actions {
  margin: 0.52rem 0 0 2.25rem;
}

.player-torrent-action {
  background: rgb(var(--player-fg-rgb) / 0.04);
  color: rgb(var(--player-fg-rgb) / 0.64);
}

.player-torrent-action:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.3);
  background: rgb(var(--color-primary-rgb) / 0.1);
  color: var(--player-accent-fg);
}

.player-torrent-action--primary {
  border-color: rgb(var(--color-primary-rgb) / 0.25);
  background: rgb(var(--color-primary-rgb) / 0.11);
  color: var(--player-accent-fg);
}

/* Source menu and its preferences submenu */
.player-router-panel {
  width: min(27rem, calc(100vw - 2rem));
}

.player-router-panel-header {
  align-items: center;
  padding: 0.85rem;
  border-bottom: 1px solid var(--player-menu-line);
}

.player-router-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.65rem;
}

.player-router-title {
  font-size: 0.82rem;
  letter-spacing: 0;
  text-transform: none;
}

.player-router-subtitle {
  font-size: 0.6rem;
}

.player-router-header-actions {
  gap: 0.42rem;
}

.player-router-prefs-toggle,
.player-router-mode-toggle {
  min-height: 1.9rem;
  border-radius: 0.58rem;
}

.player-router-prefs-toggle {
  display: inline-flex;
  width: auto;
  gap: 0.3rem;
  padding: 0 0.48rem;
  font-size: 0.56rem;
  font-weight: 650;
}

.player-router-prefs {
  gap: 0.5rem;
  margin: 0.7rem 0.75rem;
  border-radius: 0.78rem;
  border-color: rgb(var(--color-primary-rgb) / 0.16);
  background:
    linear-gradient(140deg, rgb(var(--color-primary-rgb) / 0.075), transparent 55%),
    rgb(var(--player-fg-rgb) / 0.025);
  padding: 0.65rem;
}

.player-router-prefs-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  margin: -0.05rem 0 0.1rem;
  padding: 0 0 0.5rem;
}

.player-router-prefs-heading p {
  margin: 0;
  font-size: 0.68rem;
  font-weight: 680;
  color: rgb(var(--player-fg-rgb) / 0.83);
}

.player-router-prefs-heading span {
  display: block;
  margin-top: 0.1rem;
  font-size: 0.55rem;
  color: rgb(var(--player-fg-rgb) / 0.4);
}

.player-router-codecs {
  margin: 0.7rem 0.75rem 0;
  border-radius: 0.72rem;
  padding: 0.55rem 0.6rem;
}

.player-router-prefs-row {
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: 0.55rem;
}

.player-router-prefs-label {
  font-size: 0.57rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.player-router-seg {
  gap: 0.16rem;
  overflow: visible;
  border: 0;
  background: transparent;
}

.player-router-seg-btn {
  min-height: 1.65rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.09) !important;
  border-radius: 0.44rem;
  background: rgb(var(--player-fg-rgb) / 0.035);
  padding: 0.28rem 0.24rem;
}

.player-router-seg-btn--active {
  border-color: rgb(var(--color-primary-rgb) / 0.3) !important;
  background: rgb(var(--color-primary-rgb) / 0.16);
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.08);
}

.player-router-toggle {
  min-height: 1.75rem;
  border-radius: 0.46rem;
}

.player-router-list {
  gap: 0.35rem;
  padding: 0 0.6rem 0.6rem;
}

.player-router-tier-heading {
  margin: 0 -0.1rem;
  padding: 0.52rem 0.48rem 0.25rem;
  border: 0;
  background: transparent;
  font-size: 0.55rem;
  letter-spacing: 0.1em;
}

.player-router-row {
  border: 1px solid rgb(var(--player-fg-rgb) / 0.075);
  border-radius: 0.72rem;
  background: rgb(var(--player-fg-rgb) / 0.025);
  padding: 0.58rem 0.62rem;
}

.player-router-row:hover {
  transform: translateY(-1px);
  border-color: rgb(var(--player-fg-rgb) / 0.15);
  background: rgb(var(--player-fg-rgb) / 0.055);
}

.player-router-row--active {
  border-color: rgb(var(--color-primary-rgb) / 0.28);
  background: linear-gradient(110deg, rgb(var(--color-primary-rgb) / 0.13), rgb(var(--color-primary-rgb) / 0.04));
  box-shadow: none;
}

.player-router-row--active::before {
  left: -1px;
  top: 0.58rem;
  bottom: 0.58rem;
  width: 0.18rem;
}

.player-router-unavailable-toggle {
  border: 1px dashed rgb(var(--player-fg-rgb) / 0.1);
  border-radius: 0.62rem;
  padding: 0.45rem;
}

@media (prefers-reduced-motion: reduce) {
  .watch-player-shell .player-popover,
  .player-menu-spinner {
    animation: none;
  }

  .watch-player-shell :is(.player-menu-trigger, .player-download-trigger, .player-source-trigger--bar):hover,
  .player-download-card:hover,
  .player-torrent-row:hover,
  .player-router-row:hover {
    transform: none;
  }
}

@media (min-width: 768px) {
  .watch-player-shell .player-control-bar--below .player-popover {
    max-height: min(46vh, 20rem);
  }

  .watch-player-shell .player-popover--audio-subs {
    max-height: min(46vh, 20rem);
  }

  .watch-player-shell .player-torrents-body {
    max-height: min(34vh, 14rem);
  }
}

@media (max-width: 767px) {
  .player-control-bar--below {
    gap: 0.3rem;
  }

  .player-control-bar--below .player-control-bar__start {
    gap: 0.25rem;
  }

  .player-control-bar--below .player-control-bar__start > .player-menu-root,
  .player-control-bar--below .player-control-bar__start > .player-source-trigger {
    min-width: 0;
    flex: 1 1 0;
  }

  .player-control-bar--below .player-control-bar__start > .player-menu-root > .player-menu-trigger,
  .player-control-bar--below .player-control-bar__start > .player-source-trigger {
    width: 100%;
    min-width: 0;
    padding-inline: 0.38rem;
  }

  .player-control-bar--below .player-control-bar__start .player-menu-trigger-copy,
  .player-control-bar--below .player-control-bar__start .player-audio-subs-trigger-label,
  .player-control-bar--below .player-control-bar__start .player-source-trigger-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .player-control-bar--below .player-control-bar__start .player-menu-trigger-chevron,
  .player-control-bar--below .player-source-trigger--bar > svg:not(.player-source-trigger-chevron) {
    display: none;
  }

  .player-control-bar__mobile-more {
    justify-content: center;
    width: 2.75rem;
    padding-inline: 0;
  }

  .player-control-bar__mobile-more .player-more-label {
    display: none;
  }

  .player-menu-trigger-kicker {
    display: none;
  }

  .player-menu-trigger-copy {
    flex-direction: row;
    align-items: center;
  }

  .player-trigger-icon {
    width: 1.65rem;
    height: 1.65rem;
  }

  .watch-player-shell .player-menu-root .player-popover {
    z-index: 72;
    max-height: min(84dvh, 38rem);
    border-radius: 1.25rem 1.25rem 0 0;
    padding: 0.95rem max(1rem, var(--safe-right)) max(1rem, var(--safe-bottom)) max(1rem, var(--safe-left));
    box-shadow:
      0 -100vh 0 100vh rgb(0 0 0 / 0.48),
      0 -24px 70px rgb(0 0 0 / 0.48),
      inset 0 1px 0 rgb(var(--player-fg-rgb) / 0.08);
    transform-origin: bottom center;
  }

  .watch-player-shell .player-menu-root .player-popover::before,
  .player-router-panel::before {
    content: '';
    display: block;
    width: 2.4rem;
    height: 0.25rem;
    margin: -0.42rem auto 0.65rem;
    border-radius: 999px;
    background: rgb(var(--player-fg-rgb) / 0.18);
  }

  .watch-player-shell .player-popover--audio-subs,
  .watch-player-shell .player-popover--auto,
  .watch-player-shell .player-popover--source,
  .watch-player-shell .player-popover--torrents,
  .watch-player-shell .player-popover--more,
  .watch-player-shell .player-popover--report {
    width: 100%;
    max-width: none;
  }

  .player-downloads-list {
    max-height: min(62dvh, 31rem) !important;
  }

  .player-download-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .player-download-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-left: 2.55rem;
  }

  .player-download-card-actions > :only-child {
    grid-column: 1 / -1;
  }

  .player-download-primary-action,
  .player-download-secondary-action {
    min-height: 2.15rem;
  }

  .player-router-panel {
    position: fixed;
    inset: auto 0 0;
    z-index: 72;
    width: 100%;
    max-height: min(84dvh, 38rem) !important;
    margin: 0;
    border-radius: 1.25rem 1.25rem 0 0;
    border-bottom: 0;
    padding-top: 0.42rem;
    box-shadow:
      0 -100vh 0 100vh rgb(0 0 0 / 0.48),
      0 -24px 70px rgb(0 0 0 / 0.48),
      inset 0 1px 0 rgb(var(--player-fg-rgb) / 0.08);
    animation: mobile-sheet-in 240ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .player-router-panel-header {
    padding: 0.5rem max(1rem, var(--safe-right)) 0.75rem max(1rem, var(--safe-left));
  }

  .player-router-list {
    max-height: min(44dvh, 21rem);
    padding: 0 1rem max(1rem, var(--safe-bottom));
  }

  .player-router-prefs,
  .player-router-codecs {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .player-router-unavailable-toggle {
    width: calc(100% - 2rem);
    margin: 0 1rem max(1rem, var(--safe-bottom));
  }

  .player-torrent-row-meta,
  .player-torrent-row-actions {
    margin-left: 0;
  }
}

@media (max-width: 430px) {
  .player-menu-header-icon {
    width: 2rem;
    height: 2rem;
  }

  .player-menu-subtitle {
    max-width: 15rem;
  }

  .player-router-prefs-toggle span {
    display: none;
  }

  .player-router-prefs-toggle {
    width: 1.9rem;
    padding: 0;
    justify-content: center;
  }

  .player-router-prefs-row {
    grid-template-columns: 1fr;
    gap: 0.3rem;
  }

  .player-router-prefs-label {
    padding-left: 0.05rem;
  }
}

/* Quiet playback menu refinement ---------------------------------------- */
.watch-player-shell .player-popover,
.watch-player-shell .player-router-panel {
  --player-menu-line: rgb(var(--player-fg-rgb) / 0.09);
  border: 1px solid rgb(var(--player-fg-rgb) / 0.11);
  border-radius: 0.7rem;
  background: var(--player-panel-strong);
  box-shadow: 0 12px 32px rgb(0 0 0 / 0.3);
  backdrop-filter: blur(16px);
}

.watch-player-shell .player-popover {
  padding: 0.65rem;
  animation-duration: 120ms;
}

.player-menu-header {
  gap: 0.5rem;
  margin: 0 0 0.45rem;
  padding: 0 0 0.45rem;
}

.player-menu-title {
  flex: 1 1 auto;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 650;
}

.player-menu-count,
.player-menu-status-badge {
  display: inline-flex;
  min-width: auto;
  height: auto;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  font-size: 0.6rem;
  font-weight: 600;
  color: rgb(var(--player-fg-rgb) / 0.42);
}

.player-menu-close {
  width: 1.75rem;
  height: 1.75rem;
  border: 0;
  border-radius: 0.4rem;
  background: transparent;
}

.watch-player-shell .player-menu-trigger,
.watch-player-shell .player-download-trigger,
.watch-player-shell .player-source-trigger--bar {
  min-height: 2rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.08);
  border-radius: 0.5rem;
  background: rgb(var(--player-fg-rgb) / 0.035);
  box-shadow: none;
  color: rgb(var(--player-fg-rgb) / 0.72);
}

.watch-player-shell :is(.player-menu-trigger, .player-download-trigger, .player-source-trigger--bar):hover,
.watch-player-shell :is(.player-menu-trigger--open, .player-download-trigger--open, .player-source-trigger--open) {
  transform: none;
  border-color: rgb(var(--player-fg-rgb) / 0.15);
  background: rgb(var(--player-fg-rgb) / 0.07);
  box-shadow: none;
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.player-download-trigger-meta {
  border: 0;
  margin: 0;
  padding: 0;
  color: rgb(var(--player-fg-rgb) / 0.42);
}

.watch-player-shell .player-popover--source {
  width: min(22rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--torrents {
  width: min(26rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--audio-subs {
  width: min(18rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--auto {
  width: min(16rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--more {
  width: min(14rem, calc(100vw - 2rem));
}

.watch-player-shell .player-popover--report {
  width: min(18rem, calc(100vw - 2rem));
}

/* Downloads */
.player-downloads-list {
  max-height: min(42vh, 16rem);
  gap: 0.6rem;
  margin: 0;
  padding: 0;
}

.player-download-section + .player-download-section {
  padding-top: 0.55rem;
}

.player-download-simple-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.15rem;
  padding: 0 0.15rem;
}

.player-download-simple-heading h3 {
  margin: 0;
  font-size: 0.58rem;
  font-weight: 650;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-download-simple-heading span {
  font-size: 0.56rem;
  color: rgb(var(--player-fg-rgb) / 0.35);
}

.player-download-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.6rem;
  min-width: 0;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.065);
  padding: 0.5rem 0.15rem;
}

.player-download-row:last-child {
  border-bottom: 0;
}

.player-download-row-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.12rem;
}

.player-download-row-copy strong {
  overflow: hidden;
  font-size: 0.69rem;
  font-weight: 620;
  color: rgb(var(--player-fg-rgb) / 0.86);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-download-row-copy span {
  overflow: hidden;
  font-size: 0.56rem;
  color: rgb(var(--player-fg-rgb) / 0.42);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-download-row-actions {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.player-download-action,
.player-torrent-action {
  display: inline-flex;
  min-height: 1.65rem;
  align-items: center;
  justify-content: center;
  gap: 0.28rem;
  border: 1px solid rgb(var(--player-fg-rgb) / 0.1);
  border-radius: 0.4rem;
  background: transparent;
  padding: 0.25rem 0.45rem;
  font-size: 0.57rem;
  font-weight: 600;
  line-height: 1;
  color: rgb(var(--player-fg-rgb) / 0.62);
  white-space: nowrap;
}

.player-download-action:hover,
.player-torrent-action:hover {
  border-color: rgb(var(--player-fg-rgb) / 0.2);
  background: rgb(var(--player-fg-rgb) / 0.05);
  color: rgb(var(--player-fg-rgb) / 0.9);
}

.player-download-action--primary,
.player-torrent-action--primary {
  border-color: rgb(var(--color-primary-rgb) / 0.24);
  background: rgb(var(--color-primary-rgb) / 0.08);
  color: var(--player-accent-fg);
}

.player-download-action:disabled {
  cursor: wait;
  opacity: 0.55;
}

.player-menu-message {
  display: flex;
  min-height: 3rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.16rem;
  padding: 0.55rem 0.2rem;
  font-size: 0.62rem;
  color: rgb(var(--player-fg-rgb) / 0.45);
}

.player-menu-message:has(.player-menu-spinner) {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.45rem;
}

.player-menu-message strong {
  font-size: 0.68rem;
  font-weight: 620;
  color: rgb(var(--player-fg-rgb) / 0.72);
}

/* Audio and automation */
.watch-player-shell .player-segment-group {
  gap: 0;
  border-radius: 0.45rem;
  padding: 0.12rem;
}

.watch-player-shell .player-segment {
  min-height: 1.7rem;
  border-radius: 0.34rem;
}

.watch-player-shell .player-segment--active {
  border-color: rgb(var(--player-fg-rgb) / 0.1);
  background: rgb(var(--player-fg-rgb) / 0.09);
  box-shadow: none;
  color: rgb(var(--player-fg-rgb) / 0.92);
}

.watch-player-shell .player-audio-subs-option {
  min-height: 2rem;
  border-radius: 0.4rem;
  padding: 0.4rem 0.5rem;
}

.watch-player-shell .player-popover-option--active {
  border-color: transparent;
  background: rgb(var(--player-fg-rgb) / 0.07);
}

.player-toggle-settings {
  gap: 0;
}

.player-toggle-setting {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.5rem;
  border: 0;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.065);
  border-radius: 0;
  background: transparent;
  padding: 0.55rem 0.15rem;
}

.player-toggle-setting:last-child {
  border-bottom: 0;
}

.player-toggle-setting:hover,
.player-toggle-setting--active {
  border-color: rgb(var(--player-fg-rgb) / 0.065);
  background: transparent;
}

.player-toggle-setting-copy strong {
  font-size: 0.68rem;
  font-weight: 600;
}

.player-switch {
  width: 1.7rem;
  height: 0.95rem;
}

.player-switch > span {
  width: 0.62rem;
  height: 0.62rem;
}

.player-toggle-setting--active .player-switch > span {
  transform: translateX(0.7rem);
}

/* More and torrent menus */
.player-popover-menu-list {
  gap: 0;
}

.watch-player-shell .player-popover-menu-item,
.watch-player-shell .player-more-sheet-item,
.player-mobile-options-sheet .player-more-sheet-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.55rem;
  border: 0;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.065);
  border-radius: 0;
  background: transparent;
  padding: 0.58rem 0.25rem;
  font-size: 0.7rem;
  font-weight: 600;
}

.watch-player-shell .player-popover-menu-item:last-child,
.watch-player-shell .player-more-sheet-item:last-child,
.player-mobile-options-sheet .player-more-sheet-item:last-child {
  border-bottom: 0;
}

.watch-player-shell .player-popover-menu-item:hover,
.watch-player-shell .player-more-sheet-item:hover,
.player-mobile-options-sheet .player-more-sheet-item:hover {
  transform: none;
  border-color: rgb(var(--player-fg-rgb) / 0.065);
  background: rgb(var(--player-fg-rgb) / 0.04);
}

.player-more-sheet-item small {
  font-size: 0.6rem;
  color: rgb(var(--player-fg-rgb) / 0.4);
}

.player-mobile-options-sheet {
  background: var(--surface);
  box-shadow: 0 -16px 42px rgb(0 0 0 / 0.32);
}

.player-mobile-download-actions {
  gap: 0;
}

.player-torrent-list {
  gap: 0;
}

.player-torrent-row {
  border: 0;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.065);
  border-radius: 0;
  background: transparent;
}

.player-torrent-row:last-child {
  border-bottom: 0;
}

.player-torrent-row:hover {
  transform: none;
  border-color: rgb(var(--player-fg-rgb) / 0.065);
  background: rgb(var(--player-fg-rgb) / 0.025);
}

.player-torrent-row--detailed,
.player-torrent-row--compact {
  padding: 0.58rem 0.2rem;
}

.player-torrent-row-title {
  display: -webkit-box;
  padding: 0;
  font-size: 0.67rem;
  font-weight: 620;
  color: rgb(var(--player-fg-rgb) / 0.84);
}

.player-torrent-row-meta {
  gap: 0.3rem;
  margin: 0.28rem 0 0;
  font-size: 0.56rem;
}

.player-torrent-row-actions {
  gap: 0.3rem;
  margin: 0.42rem 0 0;
}

/* Source menu */
.player-router-panel {
  width: min(24rem, calc(100vw - 2rem));
}

.player-router-panel-header {
  padding: 0.65rem;
}

.player-router-title {
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 650;
}

.player-router-prefs-toggle,
.player-router-mode-toggle {
  min-height: 1.75rem;
  border-radius: 0.4rem;
  background: transparent;
  box-shadow: none;
}

.player-router-prefs,
.player-router-codecs {
  margin: 0.55rem 0.6rem;
  border-color: rgb(var(--player-fg-rgb) / 0.08);
  border-radius: 0.5rem;
  background: transparent;
  padding: 0.5rem;
}

.player-router-prefs-heading {
  padding-bottom: 0.4rem;
}

.player-router-prefs-heading p {
  font-size: 0.65rem;
  font-weight: 620;
}

.player-router-seg-btn {
  min-height: 1.55rem;
  border-radius: 0.34rem;
  background: transparent;
}

.player-router-seg-btn--active,
.player-router-toggle--active {
  border-color: rgb(var(--player-fg-rgb) / 0.13) !important;
  background: rgb(var(--player-fg-rgb) / 0.08);
  box-shadow: none;
  color: rgb(var(--player-fg-rgb) / 0.9);
}

.player-router-list {
  gap: 0;
  padding: 0 0.5rem 0.5rem;
}

.player-router-tier-heading {
  margin: 0;
  padding: 0.48rem 0.4rem 0.2rem;
  font-size: 0.53rem;
}

.player-router-row {
  border: 0;
  border-bottom: 1px solid rgb(var(--player-fg-rgb) / 0.06);
  border-radius: 0;
  background: transparent;
  padding: 0.52rem 0.4rem;
}

.player-router-row:hover {
  transform: none;
  border-color: rgb(var(--player-fg-rgb) / 0.06);
  background: rgb(var(--player-fg-rgb) / 0.035);
}

.player-router-row--active {
  border-color: rgb(var(--player-fg-rgb) / 0.06);
  background: rgb(var(--player-fg-rgb) / 0.055);
}

.player-router-row--active::before {
  top: 0.52rem;
  bottom: 0.52rem;
  left: 0;
  width: 0.12rem;
}

@media (min-width: 768px) {
  .player-router--expanded .player-router-panel {
    position: fixed;
    top: calc(var(--sticky-offset) + 1rem);
    left: max(2rem, calc((100vw - 100rem) / 2 + 2rem));
    max-height: calc(100dvh - var(--sticky-offset) - 2rem);
    overflow-y: auto;
  }

  .watch-player-shell:fullscreen .player-router--expanded .player-router-panel {
    top: max(1rem, var(--safe-top));
    left: max(1rem, var(--safe-left));
  }
}

@media (max-width: 767px), (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  .watch-player-shell .player-menu-root .player-popover,
  .watch-player-shell .player-router-panel {
    border-radius: 0.8rem 0.8rem 0 0;
    box-shadow:
      0 -100vh 0 100vh rgb(0 0 0 / 0.45),
      0 -14px 36px rgb(0 0 0 / 0.34);
  }

  .watch-player-shell .player-menu-root .player-popover {
    padding: 0.8rem max(0.85rem, var(--safe-right)) max(0.85rem, var(--safe-bottom)) max(0.85rem, var(--safe-left));
  }

  .player-download-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.4rem;
    padding-block: 0.62rem;
  }

  .player-download-row-actions {
    justify-content: flex-start;
  }

  .player-download-action {
    min-height: 1.85rem;
  }

  .player-router-panel {
    width: 100%;
  }
}

/* Final mobile player contract: four equal, reachable controls below the media. */
@media (max-width: 767px), (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  .watch-player-shell .player-control-bar--below {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.25rem;
    width: 100%;
    min-width: 0;
    padding: 0.35rem max(0.35rem, var(--safe-right)) max(0.35rem, var(--safe-bottom)) max(0.35rem, var(--safe-left));
    z-index: var(--layer-player-controls);
  }

  .watch-player-shell .player-control-bar__start,
  .watch-player-shell .player-control-bar__end {
    display: contents !important;
  }

  .watch-player-shell .player-control-bar--below > *,
  .watch-player-shell .player-control-bar--below .player-menu-root {
    min-width: 0;
  }

  .watch-player-shell .player-control-bar--below :is(.player-menu-trigger, .player-source-trigger--bar, .player-control-bar__mobile-more) {
    width: 100% !important;
    min-width: 0 !important;
    height: 2.5rem !important;
    min-height: 2.5rem !important;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.35rem 0.4rem;
    border-radius: 0.55rem;
    font-size: 0.6875rem;
  }

  .watch-player-shell .player-control-bar--below :is(.player-audio-subs-trigger-label, .player-source-trigger-label, .player-more-label) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .watch-player-shell .player-control-bar__desktop-more,
  .watch-player-shell .player-bar-control--desktop,
  .watch-player-shell .player-control-divider {
    display: none !important;
  }

  .watch-player-shell .player-control-bar__end > :not(.player-control-bar__mobile-more) {
    display: none !important;
  }

  .watch-player-shell .player-control-bar__mobile-more {
    display: flex !important;
  }

  .video-player-shell .plyr__controls {
    gap: 0.15rem;
    padding-right: max(0.35rem, var(--safe-right));
    padding-left: max(0.35rem, var(--safe-left));
  }

  .video-player-shell .plyr__controls > .plyr__control {
    width: 2.5rem;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0.6rem;
  }

  .video-player-shell .plyr__progress__container {
    min-width: 0;
    flex: 1 1 auto;
    margin-inline: 0.15rem;
  }

  .video-player-shell .plyr__time {
    min-width: 2.5rem;
    padding-inline: 0.15rem;
    font-size: 0.6875rem;
    text-align: center;
  }

  .video-player-shell .plyr__controls :is(
    [data-plyr='mute'],
    [data-plyr='settings'],
    [data-plyr='pip'],
    .plyr__volume,
    .player-enhance-control,
    .player-external-control,
    .player-volume-boost-control
  ),
  .video-player-shell .plyr__time--duration {
    display: none !important;
  }

  .player-mobile-panel-sheet {
    max-height: min(82dvh, 38rem);
    border-color: var(--player-border);
    background: var(--player-panel-strong);
    color: rgb(var(--player-fg-rgb));
  }

  .player-mobile-panel-sheet .mobile-sheet-header {
    flex: 0 0 auto;
    border-bottom: 1px solid var(--player-border);
    background: var(--player-panel-strong);
  }

  .player-mobile-panel-sheet .mobile-sheet-header h3,
  .player-mobile-panel-sheet .mobile-sheet-back,
  .player-mobile-panel-sheet .mobile-sheet-header .btn-ghost {
    color: rgb(var(--player-fg-rgb));
  }

  .player-mobile-panel-sheet .mobile-sheet-body {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0.75rem max(0.85rem, var(--safe-right)) max(1rem, var(--safe-bottom)) max(0.85rem, var(--safe-left));
    -webkit-overflow-scrolling: touch;
  }

  .player-menu-root--inline,
  .player-inline-panel,
  .player-router--inline {
    position: static !important;
    width: 100%;
    min-width: 0;
  }

  .player-inline-panel {
    border: 0;
    background: transparent;
    padding: 0;
    box-shadow: none;
  }

  .player-inline-panel .player-menu-header {
    display: none;
  }

  .player-inline-panel--audio-subs .player-audio-subs-content {
    overflow: visible;
    margin: 0;
    padding: 0;
  }

  .player-inline-panel :is(.player-audio-subs-list, .player-toggle-settings) {
    max-height: none;
    overflow: visible;
  }

  .player-router--inline .player-router-panel--inline {
    position: static !important;
    inset: auto !important;
    width: 100%;
    max-width: none;
    max-height: none !important;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    box-shadow: none;
    animation: none;
  }

  .player-router--inline .player-router-panel--inline::before {
    display: none;
  }

  .player-router--inline .player-router-heading {
    display: none;
  }

  .player-router--inline :is(.player-router-list, .player-router-prefs) {
    max-height: none;
    overflow: visible;
  }

  .player-router--inline .player-router-list {
    padding-right: 0;
    padding-left: 0;
  }

  .player-mobile-secondary-actions,
  .player-mobile-options-list {
    display: grid;
    gap: 0.5rem;
  }

  .player-mobile-secondary-actions {
    margin-bottom: 0.5rem;
  }

  .player-mobile-panel-sheet .player-more-sheet-item:disabled {
    cursor: not-allowed;
    opacity: 0.42;
  }
}

@media (max-width: 359px), (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  .watch-player-shell .player-control-bar--below :is(.player-source-trigger-dot, .player-menu-trigger-chevron, .player-source-trigger-chevron) {
    display: none;
  }

  .watch-player-shell .player-control-bar--below :is(.player-menu-trigger, .player-source-trigger--bar, .player-control-bar__mobile-more) {
    font-size: 0.625rem;
    padding-inline: 0.25rem;
  }
}

/* Season-download torrents are an alternate path, so make them readable at a glance. */
.season-download-torrent-trigger {
  display: flex;
  width: 100%;
  min-height: 3.4rem;
  align-items: center;
  gap: 0.75rem;
  border: 1px solid rgb(var(--color-secondary-rgb) / 0.38);
  border-radius: 0.75rem;
  background:
    linear-gradient(115deg, rgb(var(--color-secondary-rgb) / 0.18), rgb(var(--color-secondary-rgb) / 0.075)),
    rgb(var(--fg-rgb) / 0.035);
  padding: 0.65rem 0.75rem;
  color: rgb(var(--fg-rgb));
  text-align: left;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06);
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.season-download-torrent-trigger:hover,
.season-download-torrent-trigger[aria-expanded='true'] {
  border-color: rgb(var(--color-secondary-rgb) / 0.68);
  background:
    linear-gradient(115deg, rgb(var(--color-secondary-rgb) / 0.26), rgb(var(--color-secondary-rgb) / 0.11)),
    rgb(var(--fg-rgb) / 0.055);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.1), 0 10px 22px -18px rgb(var(--color-secondary-rgb) / 0.78);
}

.season-download-torrent-trigger-action {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.35rem;
  color: var(--color-secondary);
  font-size: 0.75rem;
  font-weight: 750;
}

.season-download-torrent-source {
  border: 1px solid rgb(var(--color-secondary-rgb) / 0.34);
  border-radius: 999px;
  background: rgb(var(--color-secondary-rgb) / 0.16);
  padding: 0.12rem 0.36rem;
  color: rgb(var(--fg-rgb) / 0.86);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.season-download-torrents {
  border: 1px solid rgb(var(--color-secondary-rgb) / 0.26);
  border-radius: 0.75rem;
  background: linear-gradient(130deg, rgb(var(--color-secondary-rgb) / 0.095), rgb(var(--fg-rgb) / 0.035));
  padding: 0.8rem;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.045);
}

.season-download-torrents-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.7rem;
}

.season-download-torrents-heading p {
  margin: 0;
  color: rgb(var(--fg-rgb) / 0.94);
  font-size: 0.8125rem;
  font-weight: 750;
}

.season-download-torrents-heading div > span {
  display: block;
  margin-top: 0.16rem;
  color: rgb(var(--fg-rgb) / 0.58);
  font-size: 0.6875rem;
}

.season-download-torrents-heading > span {
  flex-shrink: 0;
  border: 1px solid rgb(var(--color-secondary-rgb) / 0.3);
  border-radius: 999px;
  background: rgb(var(--color-secondary-rgb) / 0.14);
  padding: 0.2rem 0.46rem;
  color: rgb(var(--fg-rgb) / 0.88);
  font-size: 0.6875rem;
  font-weight: 700;
}

.season-download-torrents .player-torrent-list--prominent {
  gap: 0.55rem;
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-row {
  border: 1px solid rgb(var(--color-secondary-rgb) / 0.26);
  border-radius: 0.625rem;
  background: rgb(var(--fg-rgb) / 0.055);
  padding: 0.8rem;
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-row:hover {
  border-color: rgb(var(--color-secondary-rgb) / 0.52);
  background: rgb(var(--color-secondary-rgb) / 0.1);
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-row-title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.45;
  color: rgb(var(--fg-rgb) / 0.94);
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-row-meta {
  margin-top: 0.5rem;
  margin-left: 0;
  font-size: 0.75rem;
  color: rgb(var(--fg-rgb) / 0.64);
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-row-actions {
  margin-top: 0.7rem;
  margin-left: 0;
  gap: 0.4rem;
}

.season-download-torrents .player-torrent-list--prominent .player-torrent-action {
  min-height: 2.3rem;
  padding-inline: 0.75rem;
  font-size: 0.75rem;
}

@media (max-width: 479px) {
  .season-download-torrent-trigger {
    align-items: flex-start;
  }

  .season-download-torrent-trigger-action {
    margin-top: 0.15rem;
  }

  .season-download-torrent-source {
    display: none;
  }
}

/* Title page editorial treatment. */
.title-editorial-hero {
  isolation: isolate;
  min-height: 31rem;
  background:
    radial-gradient(ellipse 70% 90% at 76% 52%, color-mix(in srgb, var(--title-accent-alt, var(--color-secondary)) 17%, transparent), transparent 72%),
    radial-gradient(ellipse 56% 72% at 30% 8%, color-mix(in srgb, var(--title-accent, var(--color-primary)) 12%, transparent), transparent 74%),
    linear-gradient(120deg, #050811 0%, #070b16 48%, #080916 100%);
}

.title-editorial-hero::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: '';
  pointer-events: none;
  background:
    linear-gradient(90deg, rgb(3 6 14 / 0.42), transparent 36%, rgb(3 6 14 / 0.16) 100%),
    radial-gradient(circle at 72% 18%, color-mix(in srgb, var(--title-accent) 26%, transparent), transparent 34%);
  mix-blend-mode: screen;
}

.title-editorial-hero .title-hero-art {
  z-index: 0;
  opacity: 0.42;
  filter: saturate(0.9) contrast(0.96) brightness(0.78);
  transform: scale(1.025);
  transform-origin: 72% center;
}

.title-editorial-hero .title-editorial-scrim {
  z-index: 2;
  background: linear-gradient(90deg, rgb(3 6 14 / 0.98) 0%, rgb(3 6 14 / 0.91) 26%, rgb(3 6 14 / 0.67) 49%, rgb(3 6 14 / 0.28) 77%, rgb(3 6 14 / 0.12) 100%);
}

.title-editorial-hero .title-editorial-scrim-bottom {
  z-index: 2;
  height: 11rem;
  background: linear-gradient(to top, #050811 0%, rgb(5 8 17 / 0.82) 35%, transparent 100%);
}

.title-editorial-hero .title-editorial-layout {
  z-index: 3;
  min-height: 31rem;
  align-items: end;
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.title-editorial-hero .title-poster-frame {
  border: 1px solid color-mix(in srgb, var(--title-accent, var(--color-primary)) 52%, rgb(var(--media-fg-rgb) / 0.32));
  box-shadow:
    0 24px 54px -28px rgb(0 0 0 / 0.9),
    0 0 0 1px rgb(255 255 255 / 0.045),
    0 16px 42px -28px color-mix(in srgb, var(--title-accent) 80%, transparent);
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), border-color 220ms ease, box-shadow 260ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .title-editorial-hero .title-hero-poster:hover .title-poster-frame {
    border-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 78%, rgb(var(--media-fg-rgb) / 0.5));
    box-shadow:
      0 30px 66px -30px rgb(0 0 0 / 0.92),
      0 0 0 1px rgb(255 255 255 / 0.07),
      0 18px 48px -28px color-mix(in srgb, var(--title-accent) 90%, transparent);
    transform: translateY(-4px);
  }
}

.title-editorial-hero .title-hero-factline {
  min-height: 1rem;
  color: rgb(var(--media-fg-rgb) / 0.64);
  font-size: 0.6875rem;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.title-editorial-hero .title-hero-factline > :first-child {
  color: var(--color-primary-soft);
}

.title-editorial-hero .title-hero-native {
  color: var(--color-primary-soft);
  font-size: 0.76rem;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.title-editorial-hero .title-hero-title {
  max-width: 15ch;
  color: rgb(var(--media-fg-rgb));
  font-size: clamp(2.45rem, 4.4vw, 4.6rem);
  letter-spacing: -0.055em;
  text-wrap: balance;
  text-shadow: 0 2px 20px rgb(0 0 0 / 0.46);
}

.title-editorial-hero .title-hero-romaji {
  color: rgb(var(--media-fg-rgb) / 0.56);
}

.title-editorial-hero .title-hero-synopsis {
  max-width: 46rem;
  color: rgb(var(--media-fg-rgb) / 0.78);
  font-size: 0.9rem;
  line-height: 1.75;
}

.title-editorial-hero .title-hero-genres {
  gap: 0.5rem 1rem;
}

.title-editorial-hero .title-hero-genres a {
  color: rgb(var(--media-fg-rgb) / 0.66);
  text-decoration-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 42%, transparent);
  text-underline-offset: 0.32rem;
  transition: color 160ms ease, text-decoration-color 160ms ease;
}

.title-editorial-hero .title-hero-genres a:hover {
  color: rgb(var(--media-fg-rgb));
  text-decoration-color: var(--title-accent, var(--color-primary));
}

.title-editorial-hero .title-hero-seasons > p {
  color: rgb(var(--media-fg-rgb) / 0.52);
}

.title-editorial-hero .title-hero-seasons .nav-active-strong {
  border: 1px solid color-mix(in srgb, var(--title-accent, var(--color-primary)) 54%, transparent);
  background: color-mix(in srgb, var(--title-accent, var(--color-primary)) 17%, transparent);
  color: rgb(var(--media-fg-rgb));
}

.title-hero .title-hero-actions {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.title-hero .title-action {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border: 1px solid transparent;
  border-radius: 0.7rem;
  padding: 0.7rem 1rem;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, color 180ms ease;
}

.title-hero .title-action:active {
  transform: translateY(1px) scale(0.985);
}

.title-hero .title-action--primary {
  border-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 68%, white 12%);
  background: linear-gradient(135deg, color-mix(in srgb, var(--title-accent, var(--color-primary)) 86%, black 14%), var(--title-accent, var(--color-primary)));
  color: #fff;
  box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--title-accent, var(--color-primary)) 80%, transparent);
}

.title-hero .title-action--primary:hover {
  color: #fff;
  box-shadow: 0 15px 30px -15px color-mix(in srgb, var(--title-accent, var(--color-primary)) 95%, transparent);
  transform: translateY(-1px);
}

.title-hero .title-action--secondary {
  border-color: rgb(var(--media-fg-rgb) / 0.16);
  background: rgb(var(--media-fg-rgb) / 0.055);
  color: rgb(var(--media-fg-rgb) / 0.9);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06);
}

.title-hero .title-action--secondary:hover {
  border-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 52%, rgb(var(--media-fg-rgb) / 0.26));
  background: color-mix(in srgb, var(--title-accent, var(--color-primary)) 11%, rgb(var(--media-fg-rgb) / 0.06));
  color: rgb(var(--media-fg-rgb));
}

.title-hero .title-action--secondary:disabled {
  cursor: wait;
  opacity: 0.62;
}

.title-hero .title-action-wrap {
  min-width: 0;
}

.title-hero .title-action-wrap .title-action {
  width: 100%;
}

.title-hero .title-action--tertiary {
  min-height: auto;
  grid-column: 1 / -1;
  justify-self: start;
  padding: 0.25rem 0.1rem;
  color: rgb(var(--media-fg-rgb) / 0.58);
  font-size: 0.75rem;
  font-weight: 650;
}

.title-hero .title-action--tertiary:hover {
  color: rgb(var(--media-fg-rgb));
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 72%, transparent);
  text-underline-offset: 0.25rem;
}

.title-hero-enter {
  animation: title-editorial-enter 520ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.title-hero-enter--poster {
  animation-delay: 25ms;
}

.title-hero-enter--facts {
  animation-delay: 70ms;
}

.title-hero-enter--eyebrow,
.title-hero-enter--title {
  animation-delay: 105ms;
}

.title-hero-enter--romaji,
.title-hero-enter--synopsis {
  animation-delay: 145ms;
}

.title-hero-enter--links {
  animation-delay: 180ms;
}

.title-hero-enter--actions {
  animation-delay: 220ms;
}

@keyframes title-editorial-enter {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.title-page-content {
  padding-top: 2rem;
  padding-bottom: 3rem;
}

.title-episodes-toolbar {
  margin-bottom: 1.25rem;
}

.title-episodes-marker {
  background: linear-gradient(to bottom, var(--title-accent, var(--color-primary)), var(--title-accent-alt, var(--color-secondary)));
  box-shadow: 0 0 16px -5px var(--title-accent, var(--color-primary));
}

.title-episode-density--active,
.title-episode-season--active {
  border-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 42%, transparent);
  background: color-mix(in srgb, var(--title-accent, var(--color-primary)) 16%, transparent);
  color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 58%, white);
}

.title-episode-card-grid {
  gap: 1rem;
}

.title-episode-card {
  border-color: rgb(var(--fg-rgb) / 0.09);
  box-shadow: none;
  transition: transform 210ms cubic-bezier(0.22, 1, 0.36, 1), border-color 190ms ease, box-shadow 210ms ease, background 190ms ease;
}

.title-episode-play,
.title-episode-progress__value {
  background: var(--title-accent, var(--color-primary));
}

@media (hover: hover) and (pointer: fine) {
  .title-episode-card:hover {
    border-color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 34%, rgb(var(--fg-rgb) / 0.14));
    background: color-mix(in srgb, var(--title-accent, var(--color-primary)) 4%, var(--surface-raised));
    box-shadow: 0 16px 30px -24px rgb(0 0 0 / 0.7);
    transform: translateY(-3px);
  }

  .title-episode-card:hover .title-episode-card-title {
    color: color-mix(in srgb, var(--title-accent, var(--color-primary)) 62%, rgb(var(--fg-rgb)));
  }
}

@media (max-width: 639px) {
  .title-editorial-hero {
    min-height: 0;
  }

  .title-editorial-hero .title-editorial-layout {
    min-height: 0;
    padding-top: 1.25rem;
    padding-bottom: 1.75rem;
  }

  .title-editorial-hero .title-hero-title {
    max-width: calc(100% - 7.5rem);
    font-size: clamp(2rem, 9vw, 2.85rem);
  }

  .title-editorial-hero .title-hero-synopsis {
    font-size: 0.875rem;
    line-height: 1.7;
  }

  .title-hero .title-hero-actions {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .title-hero .title-action--primary,
  .title-hero .title-action--tertiary {
    grid-column: 1 / -1;
  }

  .title-hero .title-hero-actions > .trailer-trigger,
  .title-hero .title-hero-actions > .title-action,
  .title-hero .title-action-wrap,
  .title-hero .title-action-wrap .title-action {
    width: 100%;
    min-width: 0;
  }

  .title-hero .title-action--tertiary {
    min-height: 2.5rem;
    justify-content: center;
  }

  .title-page-content {
    gap: 2rem;
    padding-top: 1.5rem;
    padding-bottom: 2rem;
  }

  .title-episode-card-grid {
    gap: 0.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .title-hero-enter {
    animation: none;
  }
}

/* Interactive title controls intentionally follow the user's theme, not the
   artwork palette. A light poster accent must never turn a CTA cream. */
.title-editorial-hero .title-hero-factline > :first-child,
.title-editorial-hero .title-hero-native {
  color: var(--color-primary-soft);
}

.title-editorial-hero .title-hero-genres a {
  text-decoration-color: rgb(var(--color-primary-rgb) / 0.42);
}

.title-editorial-hero .title-hero-genres a:hover {
  text-decoration-color: var(--color-primary);
}

.title-editorial-hero .title-hero-seasons .nav-active-strong {
  border-color: rgb(var(--color-primary-rgb) / 0.54);
  background: rgb(var(--color-primary-rgb) / 0.17);
}

.title-hero .title-action {
  min-height: 2.625rem;
  border-radius: 0.625rem;
  padding: 0.6rem 0.875rem;
  font-size: 0.75rem;
}

.title-hero .title-action--primary {
  border-color: rgb(var(--color-primary-rgb) / 0.68);
  background: linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 84%, #090d18), var(--color-secondary));
  box-shadow: 0 8px 18px -13px rgb(var(--color-primary-rgb) / 0.78);
}

.title-hero .title-action--primary:hover {
  box-shadow: 0 12px 24px -14px rgb(var(--color-primary-rgb) / 0.92);
}

.title-hero .title-action--secondary:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.52);
  background: rgb(var(--color-primary-rgb) / 0.11);
}

.title-hero .title-action--tertiary:hover {
  text-decoration-color: rgb(var(--color-primary-rgb) / 0.72);
}

.title-episode-density--active,
.title-episode-season--active {
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: rgb(var(--color-primary-rgb) / 0.16);
  color: var(--color-primary-soft);
}

.title-episode-play,
.title-episode-progress__value {
  background: var(--color-primary);
}

.title-episode-watched-overlay {
  position: absolute;
  inset: 0;
  background: rgb(var(--color-primary-rgb) / 0.34);
  backdrop-filter: blur(2px) saturate(1.15);
  -webkit-backdrop-filter: blur(2px) saturate(1.15);
  pointer-events: none;
}

.title-episode-watched-chip {
  background: rgb(var(--color-primary-rgb) / 0.9);
  color: #fff;
  backdrop-filter: blur(6px) saturate(1.2);
  -webkit-backdrop-filter: blur(6px) saturate(1.2);
}

.title-episode-grid [title='Watched'] > span:first-child {
  background-color: var(--color-primary);
}

.title-episodes-marker {
  background: linear-gradient(to bottom, var(--color-primary), var(--color-secondary));
  box-shadow: 0 0 16px -5px rgb(var(--color-primary-rgb) / 0.9);
}

@media (hover: hover) and (pointer: fine) {
  .title-episode-card:hover {
    border-color: rgb(var(--color-primary-rgb) / 0.34);
    background: rgb(var(--color-primary-rgb) / 0.04);
  }

  .title-episode-card:hover .title-episode-card-title {
    color: var(--color-primary-soft);
  }
}

/* Download source details keep their own line; action labels no longer steal the
   only available width from long provider names. */
.player-download-row {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 0.4rem;
}

.player-download-row-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
}

/* Direct and torrent entry points should remain easy to find without implying
   that either path has been verified. Both intentionally use the site accent. */
.watch-player-shell .player-download-trigger--direct,
.watch-player-shell .player-download-trigger--torrent {
  border-color: rgb(var(--color-primary-rgb) / 0.42);
  background: linear-gradient(180deg, rgb(var(--color-primary-rgb) / 0.23), rgb(var(--color-primary-rgb) / 0.13));
  color: var(--player-accent-fg);
}

.watch-player-shell :is(.player-download-trigger--direct, .player-download-trigger--torrent):hover,
.watch-player-shell :is(.player-download-trigger--direct, .player-download-trigger--torrent).player-download-trigger--open {
  border-color: rgb(var(--color-primary-rgb) / 0.64);
  background: linear-gradient(180deg, rgb(var(--color-primary-rgb) / 0.32), rgb(var(--color-primary-rgb) / 0.18));
  box-shadow: 0 7px 18px rgb(0 0 0 / 0.16), inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.18);
  color: var(--player-accent-fg);
}

.watch-player-shell .player-download-trigger--direct .player-download-trigger-meta,
.watch-player-shell .player-download-trigger--torrent .player-download-trigger-meta {
  border-left-color: rgb(var(--color-primary-rgb) / 0.38);
  color: var(--player-accent-fg);
}

.player-more-sheet-item--direct,
.player-more-sheet-item--torrent {
  border-color: rgb(var(--color-primary-rgb) / 0.32) !important;
  background: rgb(var(--color-primary-rgb) / 0.1) !important;
  color: var(--color-primary-soft) !important;
}

.player-more-sheet-item--direct:hover,
.player-more-sheet-item--torrent:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.54) !important;
  background: rgb(var(--color-primary-rgb) / 0.17) !important;
}

.player-download-row--unverified {
  border-left: 2px solid rgb(var(--color-primary-rgb) / 0.42);
  padding-left: 0.45rem;
}

@media (pointer: coarse) {
  .title-hero .title-action {
    min-height: 2.75rem;
  }
}

.marker\:content-none *::marker{
  --tw-content: none;
  content: var(--tw-content);
}

.marker\:content-none::marker{
  --tw-content: none;
  content: var(--tw-content);
}

.placeholder\:text-fg\/50::-moz-placeholder{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.5);
}

.placeholder\:text-fg\/50::placeholder{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.5);
}

.last\:border-b-0:last-child{
  border-bottom-width: 0px;
}

.first-of-type\:mt-0:first-of-type{
  margin-top: 0px;
}

.hover\:scale-105:hover{
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-\[1\.03\]:hover{
  --tw-scale-x: 1.03;
  --tw-scale-y: 1.03;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:border-aqua\/40:hover{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.4);
}

.hover\:border-aqua\/50:hover{
  border-color: rgb(var(--color-info-rgb, 34 211 238) / 0.5);
}

.hover\:border-fg\/10:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}

.hover\:border-fg\/20:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.2);
}

.hover\:border-fg\/25:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.25);
}

.hover\:border-fg\/30:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.3);
}

.hover\:border-fg\/60:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.6);
}

.hover\:border-fg\/\[0\.12\]:hover{
  border-color: rgb(var(--fg-rgb, 244 244 248) / 0.12);
}

.hover\:border-gold\/30:hover{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.3);
}

.hover\:border-gold\/50:hover{
  border-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.5);
}

.hover\:border-primary\/20:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.2);
}

.hover\:border-primary\/25:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.25);
}

.hover\:border-primary\/30:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.3);
}

.hover\:border-primary\/35:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.35);
}

.hover\:border-primary\/40:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
}

.hover\:border-primary\/45:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.45);
}

.hover\:border-primary\/50:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.5);
}

.hover\:border-primary\/60:hover{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.6);
}

.hover\:border-secondary\/40:hover{
  border-color: rgb(var(--color-secondary-rgb, 99 102 241) / 0.4);
}

.hover\:bg-black\/85:hover{
  background-color: rgb(0 0 0 / 0.85);
}

.hover\:bg-black\/90:hover{
  background-color: rgb(0 0 0 / 0.9);
}

.hover\:bg-danger:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / var(--tw-bg-opacity, 1));
}

.hover\:bg-danger\/10:hover{
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.1);
}

.hover\:bg-danger\/15:hover{
  background-color: rgb(var(--color-danger-rgb, 248 113 113) / 0.15);
}

.hover\:bg-fg\/10:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.1);
}

.hover\:bg-fg\/5:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
}

.hover\:bg-fg\/\[0\.035\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.035);
}

.hover\:bg-fg\/\[0\.03\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.03);
}

.hover\:bg-fg\/\[0\.045\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.045);
}

.hover\:bg-fg\/\[0\.05\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.05);
}

.hover\:bg-fg\/\[0\.06\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.06);
}

.hover\:bg-fg\/\[0\.07\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.07);
}

.hover\:bg-fg\/\[0\.08\]:hover{
  background-color: rgb(var(--fg-rgb, 244 244 248) / 0.08);
}

.hover\:bg-gold\/\[0\.08\]:hover{
  background-color: rgb(var(--color-warning-rgb, 251 191 36) / 0.08);
}

.hover\:bg-media-fg\/10:hover{
  background-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.1);
}

.hover\:bg-mint\/10:hover{
  background-color: rgb(var(--color-success-rgb, 94 234 212) / 0.1);
}

.hover\:bg-primary:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / var(--tw-bg-opacity, 1));
}

.hover\:bg-primary\/10:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.1);
}

.hover\:bg-primary\/15:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
}

.hover\:bg-primary\/20:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.2);
}

.hover\:bg-primary\/25:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.25);
}

.hover\:bg-primary\/30:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.3);
}

.hover\:bg-primary\/\[0\.04\]:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.04);
}

.hover\:bg-primary\/\[0\.05\]:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.05);
}

.hover\:bg-primary\/\[0\.06\]:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.06);
}

.hover\:bg-primary\/\[0\.08\]:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.08);
}

.hover\:bg-primary\/\[0\.13\]:hover{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.13);
}

.hover\:bg-red-500:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
}

.hover\:bg-white\/10:hover{
  background-color: rgb(255 255 255 / 0.1);
}

.hover\:bg-white\/15:hover{
  background-color: rgb(255 255 255 / 0.15);
}

.hover\:bg-white\/20:hover{
  background-color: rgb(255 255 255 / 0.2);
}

.hover\:bg-white\/90:hover{
  background-color: rgb(255 255 255 / 0.9);
}

.hover\:bg-white\/\[0\.12\]:hover{
  background-color: rgb(255 255 255 / 0.12);
}

.hover\:bg-white\/\[0\.1\]:hover{
  background-color: rgb(255 255 255 / 0.1);
}

.hover\:text-danger:hover{
  --tw-text-opacity: 1;
  color: rgb(var(--color-danger-rgb, 248 113 113) / var(--tw-text-opacity, 1));
}

.hover\:text-fg:hover{
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

.hover\:text-fg\/80:hover{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.8);
}

.hover\:text-gold:hover{
  --tw-text-opacity: 1;
  color: rgb(var(--color-warning-rgb, 251 191 36) / var(--tw-text-opacity, 1));
}

.hover\:text-media-fg:hover{
  --tw-text-opacity: 1;
  color: rgb(var(--media-fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

.hover\:text-primary-soft:hover{
  color: var(--color-primary-soft, #9ec5ff);
}

.hover\:text-white:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.hover\:underline:hover{
  text-decoration-line: underline;
}

.hover\:decoration-media-fg\/75:hover{
  text-decoration-color: rgb(var(--media-fg-rgb, 244 244 248) / 0.75);
}

.hover\:opacity-100:hover{
  opacity: 1;
}

.hover\:opacity-90:hover{
  opacity: 0.9;
}

.hover\:shadow-glow:hover{
  --tw-shadow: 0 0 0 1px rgb(var(--color-primary-rgb, 79 124 255) / 0.28), 0 8px 32px -6px rgb(var(--color-primary-rgb, 79 124 255) / 0.32);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 32px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-glow-soft:hover{
  --tw-shadow: 0 0 24px -4px rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
  --tw-shadow-colored: 0 0 24px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-lift:hover{
  --tw-shadow: var(--shadow-lift, 0 2px 4px rgba(0, 0, 0, 0.4), 0 16px 40px -16px rgba(0, 0, 0, 0.65));
  --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:ring-fg\/25:hover{
  --tw-ring-color: rgb(var(--fg-rgb, 244 244 248) / 0.25);
}

.focus\:scale-110:focus{
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.active\:cursor-grabbing:active{
  cursor: grabbing;
}

.disabled\:pointer-events-none:disabled{
  pointer-events: none;
}

.disabled\:cursor-not-allowed:disabled{
  cursor: not-allowed;
}

.disabled\:opacity-30:disabled{
  opacity: 0.3;
}

.disabled\:opacity-35:disabled{
  opacity: 0.35;
}

.disabled\:opacity-40:disabled{
  opacity: 0.4;
}

.disabled\:opacity-45:disabled{
  opacity: 0.45;
}

.disabled\:opacity-50:disabled{
  opacity: 0.5;
}

.group[open] .group-open\:rotate-180{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group[open] .group-open\:text-fg\/60{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.6);
}

.group:focus-within .group-focus-within\:opacity-100{
  opacity: 1;
}

.group:hover .group-hover\:-translate-x-0\.5{
  --tw-translate-x: -0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:translate-x-0\.5{
  --tw-translate-x: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:translate-y-0{
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:translate-y-1{
  --tw-translate-y: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:scale-100{
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:scale-\[1\.03\]{
  --tw-scale-x: 1.03;
  --tw-scale-y: 1.03;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:border-primary\/40{
  border-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.4);
}

.group:hover .group-hover\:border-transparent{
  border-color: transparent;
}

.group:hover .group-hover\:bg-primary\/15{
  background-color: rgb(var(--color-primary-rgb, 79 124 255) / 0.15);
}

.group:hover .group-hover\:bg-gradient-to-r{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.group:hover .group-hover\:from-primary-deep{
  --tw-gradient-from: var(--color-primary-deep, #1e3a8a) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.group:hover .group-hover\:to-secondary-deep{
  --tw-gradient-to: var(--color-secondary-deep, #4338ca) var(--tw-gradient-to-position);
}

.group:hover .group-hover\:text-aqua{
  --tw-text-opacity: 1;
  color: rgb(var(--color-info-rgb, 34 211 238) / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-fg{
  --tw-text-opacity: 1;
  color: rgb(var(--fg-rgb, 244 244 248) / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-fg\/75{
  color: rgb(var(--fg-rgb, 244 244 248) / 0.75);
}

.group:hover .group-hover\:text-primary-fg{
  color: var(--color-primary-fg, #4f7cff);
}

.group:hover .group-hover\:text-primary-soft{
  color: var(--color-primary-soft, #9ec5ff);
}

.group:hover .group-hover\:opacity-0{
  opacity: 0;
}

.group:hover .group-hover\:opacity-100{
  opacity: 1;
}

.group:hover .group-hover\:shadow-glow{
  --tw-shadow: 0 0 0 1px rgb(var(--color-primary-rgb, 79 124 255) / 0.28), 0 8px 32px -6px rgb(var(--color-primary-rgb, 79 124 255) / 0.32);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 8px 32px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px){
  .sm\:inset-x-auto{
    left: auto;
    right: auto;
  }
  .sm\:right-4{
    right: 1rem;
  }
  .sm\:right-\[max\(1rem\2c var\(--safe-right\)\)\]{
    right: max(1rem,var(--safe-right));
  }
  .sm\:top-4{
    top: 1rem;
  }
  .sm\:col-span-2{
    grid-column: span 2 / span 2;
  }
  .sm\:mx-0{
    margin-left: 0px;
    margin-right: 0px;
  }
  .sm\:-mt-24{
    margin-top: -6rem;
  }
  .sm\:ml-2{
    margin-left: 0.5rem;
  }
  .sm\:block{
    display: block;
  }
  .sm\:inline{
    display: inline;
  }
  .sm\:flex{
    display: flex;
  }
  .sm\:inline-flex{
    display: inline-flex;
  }
  .sm\:grid{
    display: grid;
  }
  .sm\:hidden{
    display: none;
  }
  .sm\:h-\[22rem\]{
    height: 22rem;
  }
  .sm\:max-h-\[min\(85vh\2c 42rem\)\]{
    max-height: min(85vh,42rem);
  }
  .sm\:min-h-\[26rem\]{
    min-height: 26rem;
  }
  .sm\:min-h-\[50vh\]{
    min-height: 50vh;
  }
  .sm\:w-16{
    width: 4rem;
  }
  .sm\:w-20{
    width: 5rem;
  }
  .sm\:w-52{
    width: 13rem;
  }
  .sm\:w-\[22rem\]{
    width: 22rem;
  }
  .sm\:w-auto{
    width: auto;
  }
  .sm\:max-w-md{
    max-width: 28rem;
  }
  .sm\:max-w-xs{
    max-width: 20rem;
  }
  .sm\:flex-none{
    flex: none;
  }
  .sm\:basis-56{
    flex-basis: 14rem;
  }
  .sm\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sm\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sm\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .sm\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .sm\:grid-cols-\[12rem_1fr\]{
    grid-template-columns: 12rem 1fr;
  }
  .sm\:flex-row{
    flex-direction: row;
  }
  .sm\:place-items-center{
    place-items: center;
  }
  .sm\:items-end{
    align-items: flex-end;
  }
  .sm\:items-center{
    align-items: center;
  }
  .sm\:justify-start{
    justify-content: flex-start;
  }
  .sm\:justify-between{
    justify-content: space-between;
  }
  .sm\:gap-1{
    gap: 0.25rem;
  }
  .sm\:gap-3{
    gap: 0.75rem;
  }
  .sm\:gap-4{
    gap: 1rem;
  }
  .sm\:rounded-2xl{
    border-radius: 1rem;
  }
  .sm\:rounded-3xl{
    border-radius: 1.5rem;
  }
  .sm\:rounded-xl{
    border-radius: 0.75rem;
  }
  .sm\:border{
    border-width: 1px;
  }
  .sm\:p-10{
    padding: 2.5rem;
  }
  .sm\:p-4{
    padding: 1rem;
  }
  .sm\:p-5{
    padding: 1.25rem;
  }
  .sm\:p-6{
    padding: 1.5rem;
  }
  .sm\:p-7{
    padding: 1.75rem;
  }
  .sm\:p-8{
    padding: 2rem;
  }
  .sm\:px-4{
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .sm\:px-7{
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
  .sm\:py-10{
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
  .sm\:py-12{
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .sm\:py-4{
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .sm\:py-6{
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
  .sm\:pb-12{
    padding-bottom: 3rem;
  }
  .sm\:pb-4{
    padding-bottom: 1rem;
  }
  .sm\:pt-20{
    padding-top: 5rem;
  }
  .sm\:text-left{
    text-align: left;
  }
  .sm\:text-2xl{
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .sm\:text-3xl{
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
  .sm\:text-4xl{
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
  .sm\:text-5xl{
    font-size: 3rem;
    line-height: 1;
  }
  .sm\:text-\[10rem\]{
    font-size: 10rem;
  }
  .sm\:text-sm{
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  .sm\:text-xl{
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

@media (min-width: 768px){
  .md\:block{
    display: block;
  }
  .md\:flex{
    display: flex;
  }
  .md\:inline-flex{
    display: inline-flex;
  }
  .md\:hidden{
    display: none;
  }
  .md\:max-h-\[34rem\]{
    max-height: 34rem;
  }
  .md\:max-h-none{
    max-height: none;
  }
  .md\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .md\:grid-cols-\[minmax\(15rem\2c \.8fr\)_minmax\(20rem\2c 1\.2fr\)\]{
    grid-template-columns: minmax(15rem,.8fr) minmax(20rem,1.2fr);
  }
}

@media (min-width: 1024px){
  .lg\:sticky{
    position: sticky;
  }
  .lg\:bottom-4{
    bottom: 1rem;
  }
  .lg\:top-20{
    top: 5rem;
  }
  .lg\:order-none{
    order: 0;
  }
  .lg\:col-start-1{
    grid-column-start: 1;
  }
  .lg\:col-start-2{
    grid-column-start: 2;
  }
  .lg\:row-start-1{
    grid-row-start: 1;
  }
  .lg\:block{
    display: block;
  }
  .lg\:flex{
    display: flex;
  }
  .lg\:inline-flex{
    display: inline-flex;
  }
  .lg\:hidden{
    display: none;
  }
  .lg\:h-\[26rem\]{
    height: 26rem;
  }
  .lg\:min-h-0{
    min-height: 0px;
  }
  .lg\:max-w-sm{
    max-width: 24rem;
  }
  .lg\:max-w-xl{
    max-width: 36rem;
  }
  .lg\:grid-cols-1{
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .lg\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lg\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .lg\:grid-cols-6{
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg\:grid-cols-\[1\.1fr_1fr\]{
    grid-template-columns: 1.1fr 1fr;
  }
  .lg\:grid-cols-\[15rem_1fr\]{
    grid-template-columns: 15rem 1fr;
  }
  .lg\:grid-cols-\[19rem_1fr\]{
    grid-template-columns: 19rem 1fr;
  }
  .lg\:grid-cols-\[1fr_auto\]{
    grid-template-columns: 1fr auto;
  }
  .lg\:grid-cols-\[minmax\(0\2c 1\.4fr\)_minmax\(20rem\2c \.8fr\)\]{
    grid-template-columns: minmax(0,1.4fr) minmax(20rem,.8fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_19rem\]{
    grid-template-columns: minmax(0,1fr) 19rem;
  }
  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_22rem\]{
    grid-template-columns: minmax(0,1fr) 22rem;
  }
  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_minmax\(22rem\2c 32rem\)\]{
    grid-template-columns: minmax(0,1fr) minmax(22rem,32rem);
  }
  .lg\:items-end{
    align-items: flex-end;
  }
  .lg\:items-center{
    align-items: center;
  }
  .lg\:gap-5{
    gap: 1.25rem;
  }
  .lg\:self-start{
    align-self: flex-start;
  }
  .lg\:text-6xl{
    font-size: 3.75rem;
    line-height: 1;
  }
}

@media (min-width: 1280px){
  .xl\:sticky{
    position: sticky;
  }
  .xl\:top-3{
    top: 0.75rem;
  }
  .xl\:z-auto{
    z-index: auto;
  }
  .xl\:h-\[calc\(100dvh-1\.5rem\)\]{
    height: calc(100dvh - 1.5rem);
  }
  .xl\:max-h-\[54rem\]{
    max-height: 54rem;
  }
  .xl\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl\:grid-cols-6{
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl\:grid-cols-7{
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl\:grid-cols-8{
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl\:grid-cols-\[minmax\(0\2c 1\.05fr\)_minmax\(22rem\2c \.95fr\)\]{
    grid-template-columns: minmax(0,1.05fr) minmax(22rem,.95fr);
  }
  .xl\:grid-cols-\[minmax\(0\2c 1fr\)_22rem\]{
    grid-template-columns: minmax(0,1fr) 22rem;
  }
  .xl\:text-4xl{
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

@media (min-width: 1536px){
  .\32xl\:grid-cols-4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .\32xl\:grid-cols-8{
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker{
  display: none;
}

  .tv-controller-dock.svelte-1h9cm6e {
    bottom: max(0.5rem, env(safe-area-inset-bottom));
  }

  .tv-dock-control.svelte-1h9cm6e {
    display: grid;
    min-height: 2.6rem;
    place-items: center;
    border-radius: 0.75rem;
    background: rgb(var(--fg-rgb) / 0.055);
    color: rgb(var(--fg-rgb) / 0.72);
    transition: background 150ms ease, color 150ms ease, opacity 150ms ease;
  }

  .tv-dock-control.svelte-1h9cm6e:hover {
    background: rgb(var(--fg-rgb) / 0.1);
    color: var(--color-foreground, currentColor);
  }

  .tv-dock-control.svelte-1h9cm6e:disabled {
    cursor: not-allowed;
    opacity: 0.3;
  }

  .tv-dock-control--primary.svelte-1h9cm6e {
    background: var(--color-primary);
    color: var(--color-on-accent);
  }

  .tv-dock-control--primary.svelte-1h9cm6e:hover {
    background: var(--color-primary-deep);
    color: var(--color-on-accent);
  }

  .tv-dock-seek.svelte-1h9cm6e {
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: -0.02em;
  }

  @media (max-width: 639px) {
    .tv-controller-dock.svelte-1h9cm6e {
      padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
    }
  }
