*,*:before,*:after{box-sizing:border-box}html{color-scheme:light}html,body,#root{min-height:100%}body{margin:0}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}img,svg,video,iframe{display:block;max-width:100%}@font-face{font-family:Stopbuck;src:url(/DubMania/assets/Stopbuck-D647bVQ_.woff2) format("woff2");font-display:swap}@font-face{font-family:Alte Haas Grotesk;src:url(/DubMania/assets/AlteHaasGroteskRegular-ccLGwnk6.woff2) format("woff2");font-display:swap}:root{--color-primary: #8858cf;--color-secondary: #94b5c2;--color-dark: #1f081c;--color-light: #f2edda;--color-muted: #8d98b4;--player-1: #ff3131;--player-2: #00bf63;--player-3: #004aad;--player-4: #ffbd59;--color-success: #00bf63;--color-warning: #ffbd59;--color-danger: #ff3131;--color-white: #ffffff;--font-display: "Stopbuck", system-ui, sans-serif;--font-body: "Alte Haas Grotesk", Arial, Helvetica, sans-serif;--radius-sm: .65rem;--radius-md: 1rem;--radius-lg: 1.6rem;--shadow-card: 0 18px 45px rgb(31 8 28 / 18%);--focus-ring: 0 0 0 4px rgb(148 181 194 / 55%)}body{min-width:320px;min-height:100dvh;background-color:var(--color-dark);color:var(--color-dark);font-family:var(--font-body);line-height:1.5}body:before{position:fixed;z-index:-2;inset:0;background:linear-gradient(135deg,#1f081cb8,#1f081c61),url(../assets/images/dubmania-background.webp) center / cover no-repeat;content:"";transform:scale(1.015)}body:after{position:fixed;z-index:-1;inset:0;background:radial-gradient(circle at 10% 10%,rgb(136 88 207 / 43%),transparent 36rem),radial-gradient(circle at 90% 80%,rgb(148 181 194 / 30%),transparent 34rem),linear-gradient(to bottom,#1f081c1a,#1f081c7a);content:"";pointer-events:none}a{color:inherit}button,a,input{outline:none}button:focus-visible,a:focus-visible,input:focus-visible{box-shadow:var(--focus-ring)}h1,h2,h3{margin-top:0}.centered-page,.home-page{min-height:100dvh;display:grid;place-items:center;padding:1.25rem}.panel{border:3px solid var(--color-dark);border-radius:var(--radius-lg);background:linear-gradient(145deg,#ffffffe8,#f2eddae8);box-shadow:0 1.15rem 3.5rem #00000052,0 0 0 1px #ffffff57 inset;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.app-logo{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;color:var(--color-primary);line-height:1;text-align:center}.app-logo__symbol{width:clamp(7.5rem,18vw,12.5rem);height:clamp(7.5rem,18vw,12.5rem);display:block;object-fit:contain;filter:drop-shadow(.14rem .18rem 0 rgb(31 8 28 / 75%)) drop-shadow(0 .3rem .55rem rgb(0 0 0 / 20%))}.app-logo__text{display:block;color:var(--color-primary);font-family:var(--font-display);font-size:clamp(3rem,10vw,7rem);letter-spacing:.015em;line-height:.82;text-shadow:.055em .055em 0 var(--color-dark),0 0 .45em rgb(255 255 255 / 32%)}.app-logo--compact{gap:.25rem}.app-logo--compact .app-logo__symbol{width:clamp(3.25rem,8vw,5.5rem);height:clamp(3.25rem,8vw,5.5rem);filter:drop-shadow(.09rem .11rem 0 rgb(31 8 28 / 72%)) drop-shadow(0 .2rem .35rem rgb(0 0 0 / 18%))}.app-logo--compact .app-logo__text{font-size:clamp(2.3rem,6vw,4rem)}.app-logo--compact .app-logo__fallback-text{font-size:clamp(2.5rem,7vw,4.5rem)}.app-logo--symbol-only,.app-logo--text-only{gap:0}.app-logo--symbol-only .app-logo__symbol,.app-logo--text-only .app-logo__text{margin:0}.hero__actions{display:grid;gap:1rem}.hero__note{margin:1.5rem 0 0;color:#5f5360}.home-page__content{width:min(47rem,100%)}.button{min-height:3.75rem;display:inline-flex;align-items:center;justify-content:center;border:3px solid var(--color-dark);border-radius:var(--radius-md);padding:.8rem 1.4rem;font-family:var(--font-display);font-size:1.25rem;letter-spacing:.035em;text-decoration:none;text-transform:uppercase;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}.button:hover{transform:translateY(-3px);box-shadow:0 7px 0 var(--color-dark)}.button:active{transform:translateY(1px);box-shadow:0 2px 0 var(--color-dark)}.button--primary{background:var(--color-primary);color:var(--color-white)}.button--secondary{background:var(--color-secondary);color:var(--color-dark)}.loader-wrap{min-height:100dvh;display:flex;align-items:center;justify-content:center;gap:.9rem;padding:1rem;font-size:1.1rem}.loader{width:1.9rem;height:1.9rem;border:4px solid rgb(136 88 207 / 25%);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}.app-page{min-height:100dvh;padding:clamp(1rem,3vw,2.5rem)}.app-container{width:min(70rem,100%);margin:0 auto}.app-header{margin-bottom:2rem;text-align:center}.app-header__logo-link{display:inline-block;color:inherit;text-decoration:none;transition:transform .15s ease,filter .15s ease}.app-header__logo-link:hover{transform:translateY(-2px) scale(1.01);filter:brightness(1.04)}.app-header__logo-link:active{transform:translateY(0) scale(.99)}.app-header__logo-link--compact{width:min(18rem,72vw)}.app-header__logo-link--compact .app-logo{width:100%}.app-header__actions{margin-top:1rem}.page-title{margin:1.5rem 0 .5rem;color:var(--color-dark);font-family:var(--font-display);font-size:clamp(2rem,6vw,3.5rem);letter-spacing:.025em;line-height:1;text-transform:uppercase}.page-description{max-width:42rem;margin:0 auto;color:#5f5360;font-size:1.1rem}.app-content{width:100%}.form-card{width:min(34rem,100%);margin:0 auto;border:3px solid var(--color-dark);border-radius:var(--radius-lg);padding:clamp(1.25rem,4vw,2.25rem);background:#ffffffb8;box-shadow:var(--shadow-card)}.game-form{display:grid;gap:1.25rem}.field{display:grid;gap:.5rem;text-align:left}.field__label{font-family:var(--font-display);font-size:1.2rem;letter-spacing:.035em;text-transform:uppercase}.field__input{width:100%;min-height:3.5rem;border:3px solid var(--color-dark);border-radius:var(--radius-md);padding:.75rem 1rem;background:var(--color-white);color:var(--color-dark);font-size:1.1rem}.field__input::placeholder{color:#897f89}.field__input--code{font-family:var(--font-display);font-size:2rem;letter-spacing:.25em;text-align:center;text-transform:uppercase}.field__hint{color:#695e69;font-size:.9rem;text-align:right}.form-message{margin:0;border-left:5px solid var(--color-secondary);border-radius:var(--radius-sm);padding:.85rem 1rem;background:#94b5c240;text-align:left}.button--full{width:100%}.button--ghost{background:transparent;color:var(--color-dark)}.lobby-placeholder,.empty-state{width:min(42rem,100%);margin:0 auto;padding:clamp(1.5rem,5vw,3rem);text-align:center}.eyebrow{margin:0;color:#695e69;font-family:var(--font-display);font-size:1rem;letter-spacing:.08em;text-transform:uppercase}.lobby-code{display:block;margin:.4rem 0 1.5rem;color:var(--color-primary);font-family:var(--font-display);font-size:clamp(3.5rem,12vw,7rem);letter-spacing:.12em;line-height:1;text-shadow:.045em .045em 0 var(--color-dark)}.empty-state__code{color:var(--color-primary);font-family:var(--font-display);font-size:clamp(4rem,15vw,8rem);line-height:1}.connection-error{width:min(38rem,100%);padding:clamp(1.5rem,5vw,3rem);text-align:center}.connection-error h1{font-family:var(--font-display);font-size:clamp(2rem,7vw,3.5rem);text-transform:uppercase}.button:disabled{cursor:not-allowed;filter:grayscale(.45);opacity:.62;transform:none;box-shadow:none}.button--danger{background:var(--color-danger);color:var(--color-white)}.lobby-layout{width:min(48rem,100%);margin:0 auto}.lobby-main{display:grid;gap:1.5rem;padding:clamp(1.25rem,4vw,2.25rem)}.lobby-code-block{text-align:center}.lobby-code-block .lobby-code{margin-bottom:.5rem}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.section-heading h2{display:flex;align-items:center;gap:.6rem;margin:0;font-family:var(--font-display);font-size:1.75rem;text-transform:uppercase}.section-heading>span{border:2px solid var(--color-dark);border-radius:999px;padding:.3rem .75rem;background:var(--color-secondary);font-weight:700}.player-list{display:grid;gap:.75rem;margin:0;padding:0;list-style:none}.player-card{--player-color: var(--color-primary);position:relative;min-height:5.2rem;display:grid;grid-template-columns:.65rem auto 1fr auto;align-items:center;overflow:hidden;border:2px solid var(--color-dark);border-radius:var(--radius-md);background:linear-gradient(100deg,color-mix(in srgb,var(--player-color) 12%,white),#ffffffd6);box-shadow:0 .35rem #1f081c1f;transition:transform .15s ease,box-shadow .15s ease}.player-card:hover{transform:translateY(-2px);box-shadow:0 .55rem #1f081c26}.player-card--current{outline:3px solid color-mix(in srgb,var(--player-color) 66%,transparent);outline-offset:2px}.player-card--disconnected{filter:grayscale(.6);opacity:.58}.player-card__color{align-self:stretch;display:block;background:var(--player-color)}.player-card__avatar{position:relative;width:2.9rem;height:2.9rem;display:grid;place-items:center;margin-left:.8rem;border:2px solid var(--color-dark);border-radius:50%;background:var(--player-color);color:var(--color-white)}.player-card__slot{position:absolute;right:-.35rem;bottom:-.35rem;width:1.25rem;height:1.25rem;display:grid;place-items:center;border:2px solid var(--color-dark);border-radius:50%;background:var(--color-light);color:var(--color-dark);font-size:.7rem;font-weight:800}.player-card__identity{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.7rem .9rem}.player-card__identity strong{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;overflow-wrap:anywhere;font-size:1.08rem}.player-card__you{border-radius:999px;padding:.12rem .42rem;background:var(--color-dark);color:var(--color-light);font-size:.67rem;letter-spacing:.04em;text-transform:uppercase}.player-card__status{color:#695e69;font-size:.88rem}.player-card__badges{display:flex;align-items:center;gap:.55rem;padding:.65rem .9rem}.microphone-icon{width:2.35rem;height:2.35rem;display:grid;place-items:center;border:2px solid var(--color-dark);border-radius:50%;background:var(--color-light)}.microphone-icon--available{background:#00bf6340;color:#006b38}.microphone-icon--unavailable{background:#ff313133;color:#a11212}.status-badge{display:inline-flex;align-items:center;gap:.35rem;border:2px solid var(--color-dark);border-radius:999px;padding:.25rem .55rem;font-size:.78rem;font-weight:700;text-transform:uppercase}.status-badge--host{background:var(--color-warning)}.waiting-message{margin:0;border:2px dashed var(--color-muted);border-radius:var(--radius-md);padding:1rem;text-align:center}.lobby-code-panel{position:relative;display:grid;gap:1rem;overflow:hidden;border:3px solid var(--color-dark);border-radius:var(--radius-lg);padding:clamp(1.25rem,4vw,2rem);background:radial-gradient(circle at 100% 0,rgb(148 181 194 / 38%),transparent 14rem),linear-gradient(140deg,#8858cf26,#ffffffb3);text-align:center}.lobby-code-panel:before{position:absolute;width:7rem;height:7rem;border:1.3rem solid rgb(136 88 207 / 10%);border-radius:50%;content:"";right:-2.5rem;bottom:-3rem;pointer-events:none}.lobby-code-display{position:relative;min-height:7rem;display:grid;place-items:center;overflow:hidden;border:3px solid var(--color-dark);border-radius:var(--radius-md);background:var(--color-dark);transition:background .18s ease,transform .18s ease}.lobby-code-display--revealed{background:linear-gradient(135deg,var(--color-primary),#7041b8)}.lobby-code-display--hidden{background:repeating-linear-gradient(-45deg,#1f081c,#1f081c 12px,#32102d 12px 24px)}.lobby-code-display .lobby-code{position:relative;z-index:1;margin:0;color:var(--color-light);font-size:clamp(3rem,10vw,5.5rem);letter-spacing:.16em;line-height:1;text-shadow:.055em .055em 0 rgb(0 0 0 / 45%)}.lobby-code-display--hidden .lobby-code{letter-spacing:.25em;filter:blur(1px)}.lobby-code-display__mask{position:absolute;right:.75rem;bottom:.55rem;z-index:2;border:1px solid rgb(255 255 255 / 35%);border-radius:999px;padding:.2rem .55rem;background:#0000004d;color:#ffffffc7;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}.lobby-code-panel__hint{max-width:35rem;margin:0 auto;color:#5f5360}.lobby-code-panel__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}.button--compact{min-height:3rem;padding:.55rem 1rem;font-size:1rem}.button--success{background:var(--color-success);color:var(--color-dark)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}.lobby-status-banner{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.9rem;border:2px solid var(--color-dark);border-radius:var(--radius-md);padding:.9rem 1rem}.lobby-status-banner--host{background:linear-gradient(110deg,#ffbd5994,#ffffffad)}.lobby-status-banner--guest{background:linear-gradient(110deg,#94b5c299,#ffffffad)}.lobby-status-banner__icon{width:2.75rem;height:2.75rem;display:grid;place-items:center;border:2px solid var(--color-dark);border-radius:50%;background:var(--color-white);color:var(--color-primary);font-size:1.4rem;font-weight:800}.lobby-status-banner strong,.lobby-status-banner span{display:block}.lobby-status-banner strong{margin-bottom:.15rem;font-family:var(--font-display);font-size:1.15rem;letter-spacing:.025em;text-transform:uppercase}.lobby-status-banner span{color:#5f5360;font-size:.92rem}.hero,.form-card,.lobby-main,.empty-state{animation:panel-arrival .35s ease-out both}.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 0 100%,rgb(136 88 207 / 20%),transparent 18rem),linear-gradient(145deg,#fffffff0,#f2eddae5)}.hero:after{position:absolute;z-index:-1;width:12rem;height:12rem;border:2rem solid rgb(148 181 194 / 14%);border-radius:50%;content:"";right:-5rem;top:-5rem}.field__input{transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}.field__input:hover{border-color:var(--color-primary)}.field__input:focus{border-color:var(--color-primary);box-shadow:var(--focus-ring),0 .4rem #1f081c1a;transform:translateY(-1px)}.home-page__content{width:min(47rem,100%);display:grid;gap:clamp(1.2rem,3vw,2rem)}.home-page__content{width:min(47rem,100%);display:grid;gap:clamp(.75rem,2vw,1.25rem)}.home-page__symbol{position:relative;z-index:1;display:flex;justify-content:center;animation:branding-arrival .4s ease-out both}.home-page__symbol .app-logo__symbol{width:clamp(8rem,20vw,14rem);height:clamp(8rem,20vw,14rem);filter:drop-shadow(.14rem .18rem 0 rgb(31 8 28 / 85%)) drop-shadow(0 .35rem .6rem rgb(0 0 0 / 35%))}.hero{width:100%;padding:clamp(2rem,5vw,4rem);text-align:center}.hero .app-logo--text-only{display:flex;justify-content:center;margin-bottom:1.35rem}.hero .app-logo__text{font-size:clamp(3.25rem,10vw,6.25rem)}.hero__tagline{margin:0 0 2.25rem;color:var(--color-dark);font-size:clamp(1.15rem,3vw,1.65rem)}.microphone-panel{display:grid;gap:1rem;border:2px solid var(--color-dark);border-radius:var(--radius-md);padding:1rem;background:linear-gradient(135deg,#94b5c242,#ffffffb3)}.microphone-status{display:flex;align-items:center;gap:.65rem;border:2px solid var(--color-dark);border-radius:var(--radius-sm);padding:.75rem;background:#8d98b438}.microphone-status--available{background:#00bf6333;color:#005f32}.microphone-status--unavailable{background:#ff313129;color:#8e1515}.microphone-meter{display:grid;gap:.45rem}.microphone-meter__heading{display:flex;justify-content:space-between;gap:1rem;font-weight:700}.microphone-meter__track{height:1.25rem;overflow:hidden;border:2px solid var(--color-dark);border-radius:999px;background:#1f081c1f}.microphone-meter__value{width:100%;height:100%;background:linear-gradient(90deg,var(--color-secondary),var(--color-success),var(--color-warning));transform:scaleX(0);transform-origin:left;transition:transform 65ms linear}.microphone-warning,.microphone-error{margin:0;border-radius:var(--radius-sm);padding:.8rem}.microphone-warning{border-left:5px solid var(--color-warning);background:#ffbd5938}.microphone-error{border-left:5px solid var(--color-danger);background:#ff313121;color:#851111}.field__label--small{font-family:var(--font-body);font-size:.9rem;font-weight:700;text-transform:none}.video-catalog{display:grid;gap:1rem;border-top:3px solid rgb(31 8 28 / 15%);padding-top:1.5rem}.manual-video-form{display:grid;gap:.65rem;border:2px dashed var(--color-muted);border-radius:var(--radius-md);padding:1rem;background:#ffffff7f}.manual-video-form__row{display:grid;grid-template-columns:1fr auto;gap:.65rem}.video-filters{display:flex;flex-wrap:wrap;gap:.5rem}.video-filters button{border:2px solid var(--color-dark);border-radius:999px;padding:.45rem .75rem;background:var(--color-light);color:var(--color-dark);cursor:pointer}.video-filters button.is-active{background:var(--color-primary);color:var(--color-white)}.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1rem}.video-grid>div{min-width:0}.video-catalog__scroll .video-card{scroll-margin:4rem 1rem 1rem}.video-card{height:100%;overflow:hidden;border:2px solid var(--color-dark);border-radius:var(--radius-md);background:#fffc;box-shadow:0 .35rem #1f081c1f}.video-card--selected{outline:4px solid var(--color-success);outline-offset:2px}.video-card__thumbnail{width:100%;aspect-ratio:16 / 9;object-fit:cover;border-bottom:2px solid var(--color-dark);background:var(--color-dark)}.video-card__body{display:grid;gap:.75rem;padding:.9rem}.video-card__body h3{margin:0;font-family:var(--font-display);font-size:1.35rem;line-height:1.05}.video-card__body p{margin:0;color:#5f5360}.video-card__meta{display:flex;flex-wrap:wrap;gap:.5rem}.video-card__meta span{display:inline-flex;align-items:center;gap:.3rem;border:1px solid rgb(31 8 28 / 35%);border-radius:999px;padding:.25rem .5rem;background:#94b5c240;font-size:.82rem}.selected-video-summary{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr;gap:1rem;overflow:hidden;border:2px solid var(--color-dark);border-radius:var(--radius-md);background:#ffffffb8}.selected-video-summary img{width:100%;height:100%;min-height:7rem;object-fit:cover}.selected-video-summary>div{align-self:center;padding:.8rem 1rem .8rem 0}.selected-video-summary strong{display:block;font-family:var(--font-display);font-size:1.35rem}.selected-video-summary p{margin:.3rem 0 0}.preparing-stage{position:relative;display:grid;gap:1rem;border-top:3px solid rgb(31 8 28 / 15%);padding-top:1.5rem}.game-stage-heading{text-align:center}.game-stage-heading h2{margin:.25rem 0;font-family:var(--font-display);font-size:clamp(1.8rem,5vw,3rem)}.game-stage-heading p{margin:0;color:#5f5360}.youtube-player-shell{display:grid;gap:.55rem}.youtube-player-frame{width:100%;overflow:hidden;border:3px solid var(--color-dark);border-radius:var(--radius-md);background:#000;aspect-ratio:16 / 9;box-shadow:0 .5rem #1f081c2e}.youtube-player-target,.youtube-player-target iframe{width:100%;height:100%}.youtube-status{border-radius:var(--radius-sm);padding:.55rem .75rem;background:#94b5c247;text-align:center;font-weight:700}.youtube-status--ready{background:#00bf6333;color:#005f32}.youtube-status--error{background:#ff313126;color:#8e1515}.ready-list{display:grid;gap:.55rem}.ready-player{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;border:2px solid rgb(31 8 28 / 25%);border-radius:var(--radius-sm);padding:.65rem .75rem;background:#fff9}.ready-player strong{font-size:.82rem;text-transform:uppercase}.countdown-overlay{position:fixed;z-index:100;inset:0;display:grid;place-items:center;background:#1f081cc7;pointer-events:none;backdrop-filter:blur(8px)}.countdown-overlay strong{color:var(--color-warning);font-family:var(--font-display);font-size:clamp(8rem,35vw,22rem);line-height:1;text-shadow:.055em .055em 0 var(--color-primary),0 0 .35em rgb(255 255 255 / 22%);animation:countdown-pop .7s ease-out both}.video-catalog__scroll{position:relative;max-height:min(62dvh,42rem);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:3px solid var(--color-dark);border-radius:var(--radius-md);padding:0;background:linear-gradient(145deg,#ffffffb3,#94b5c22e);box-shadow:0 .4rem #1f081c21,inset 0 .4rem 1rem #1f081c0d}.video-catalog__scroll:focus-visible{box-shadow:var(--focus-ring),0 .4rem #1f081c21}.video-catalog__scroll-header{position:sticky;z-index:3;top:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:2px solid var(--color-dark);padding:.65rem .85rem;background:#f2eddaf0;color:#5f5360;font-size:.82rem;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.video-catalog__scroll-header span:first-child{color:var(--color-dark);font-weight:700}.video-catalog__scroll .video-grid{padding:1rem}.video-catalog__scroll{scrollbar-color:var(--color-primary) rgb(31 8 28 / 12%);scrollbar-width:thin}.video-catalog__scroll::-webkit-scrollbar{width:.8rem}.video-catalog__scroll::-webkit-scrollbar-track{border-left:1px solid rgb(31 8 28 / 15%);background:#1f081c14}.video-catalog__scroll::-webkit-scrollbar-thumb{border:.18rem solid transparent;border-radius:999px;background:linear-gradient(var(--color-primary),#7041b8);background-clip:padding-box}.video-catalog__scroll::-webkit-scrollbar-thumb:hover{background:linear-gradient(#986cda,var(--color-primary));background-clip:padding-box}.video-catalog__selection{display:grid;grid-template-columns:8rem minmax(0,1fr);align-items:stretch;overflow:hidden;border:3px solid var(--color-success);border-radius:var(--radius-md);background:linear-gradient(120deg,#00bf632e,#ffffffc7);box-shadow:0 .35rem #1f081c1f}.video-catalog__selection img{width:100%;height:100%;min-height:5.5rem;object-fit:cover;border-right:2px solid var(--color-dark)}.video-catalog__selection>div{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.75rem 1rem}.video-catalog__selection strong{overflow:hidden;font-family:var(--font-display);font-size:1.25rem;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}.video-catalog__selection>div>span:last-child{margin-top:.2rem;color:#5f5360;font-size:.85rem}.recording-indicator{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;border:3px solid var(--color-danger);border-radius:var(--radius-md);padding:.85rem 1rem;background:#ff31311f}.recording-indicator__dot{width:1.1rem;height:1.1rem;border-radius:50%;background:var(--color-danger);box-shadow:0 0 .8rem #ff3131b3;animation:pulse-recording .9s ease-in-out infinite}.recording-indicator strong,.recording-indicator span{display:block}.recording-indicator strong{color:#a11212;font-family:var(--font-display);font-size:1.2rem;text-transform:uppercase}.recording-indicator time{font-family:var(--font-display);font-size:1.35rem}.recording-review{display:grid;gap:1rem;border:3px solid var(--color-primary);border-radius:var(--radius-md);padding:1rem;background:linear-gradient(135deg,#8858cf26,#ffffffc2)}.recording-review h3{margin:.2rem 0 0;font-family:var(--font-display);font-size:1.6rem}.recording-review__audio{width:100%}.validation-message{margin:0;border:3px solid var(--color-success);border-radius:var(--radius-md);padding:1rem;background:#00bf6329;color:#005f32;font-weight:700;text-align:center}.active-recording{display:grid;gap:.8rem}.active-recording__actions{display:grid;gap:.45rem}.active-recording__hint{margin:0;color:#695e69;font-size:.88rem;text-align:center}.recording-stop-message{margin:0;border-left:5px solid var(--color-secondary);border-radius:var(--radius-sm);padding:.7rem .85rem;background:#94b5c238;color:#514751;text-align:center}.recording-review__actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.recording-review__final-attempt{margin:0;color:#695e69;font-size:.9rem;text-align:center}.final-playback-stage{display:grid;gap:1rem;border-top:3px solid rgb(31 8 28 / 15%);padding-top:1.5rem}.final-volume-list{display:grid;gap:.65rem}.volume-strip{--player-color: var(--color-primary);display:grid;grid-template-columns:.55rem minmax(6rem,1fr) auto minmax(8rem,2fr) 3.5rem;align-items:center;gap:.7rem;overflow:hidden;border:2px solid var(--color-dark);border-radius:var(--radius-sm);padding-right:.75rem;background:#ffffffb8}.volume-strip__color{align-self:stretch;background:var(--player-color)}.volume-strip input[type=range]{width:100%;accent-color:var(--player-color);cursor:pointer}.volume-strip>span:last-child{font-size:.82rem;font-weight:700;text-align:right}.missing-voice{display:grid;grid-template-columns:.55rem 1fr auto;align-items:center;gap:.7rem;overflow:hidden;border:2px dashed rgb(31 8 28 / 35%);border-radius:var(--radius-sm);padding-right:.75rem;background:#ffffff73;opacity:.72}.missing-voice>span{align-self:stretch;min-height:3rem}.missing-voice em{font-size:.85rem}.final-playback-actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.video-card{position:relative}.video-card--played:not(.video-card--selected){opacity:.82}.video-card__played{position:absolute;z-index:2;top:.65rem;right:.65rem;display:inline-flex;align-items:center;gap:.3rem;border:2px solid var(--color-dark);border-radius:999px;padding:.25rem .55rem;background:var(--color-success);color:var(--color-dark);font-size:.75rem;font-weight:800;text-transform:uppercase;box-shadow:0 .2rem #1f081c40}.resume-lobby-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem;margin-bottom:1.25rem;border:2px solid var(--color-dark);border-radius:var(--radius-md);padding:.9rem 1rem;background:linear-gradient(115deg,#94b5c261,#ffffffbf);text-align:left}.resume-lobby-card strong{display:block;font-family:var(--font-display);font-size:1.25rem;text-transform:uppercase}.resume-lobby-card p{margin:.2rem 0 0;color:#5f5360;font-size:.9rem}.resume-lobby-card__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}.connection-banner{position:fixed;z-index:200;top:.75rem;left:50%;display:flex;align-items:center;gap:.55rem;border:2px solid var(--color-dark);border-radius:999px;padding:.65rem 1rem;background:var(--color-warning);color:var(--color-dark);font-weight:800;box-shadow:var(--shadow-card);transform:translate(-50%)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-recording{50%{opacity:.48;transform:scale(.92)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes panel-arrival{0%{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes branding-arrival{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes countdown-pop{0%{opacity:0;transform:scale(1.4) rotate(-3deg)}25%{opacity:1}to{opacity:1;transform:scale(1) rotate(0)}}@media(max-width:540px){.centered-page,.home-page{padding:.75rem}.hero{padding:2rem 1rem}.button{min-height:3.4rem;font-size:1.05rem}}@media(max-width:620px){.lobby-main{gap:1.15rem;padding:1rem}.lobby-code-panel{padding:1rem}.lobby-code-display{min-height:5.8rem}.lobby-code-display .lobby-code{font-size:clamp(2.8rem,17vw,4.5rem)}.lobby-code-panel__actions{display:grid;grid-template-columns:1fr}.lobby-code-panel__actions .button{width:100%}.player-card{grid-template-columns:.5rem auto 1fr}.player-card__badges{grid-column:2 / -1;justify-content:flex-end;border-top:1px solid rgb(31 8 28 / 16%);padding-top:.45rem}.lobby-status-banner{align-items:start}.section-heading h2{font-size:1.45rem}}@media(max-width:390px){.player-card__avatar{width:2.55rem;height:2.55rem;margin-left:.55rem}.player-card__identity{padding-right:.55rem}.status-badge{font-size:.7rem}}@media(max-width:540px){.app-logo__symbol{width:3rem;height:3rem}.app-logo__text{font-size:clamp(2.9rem,16vw,5rem)}.app-logo--compact .app-logo__symbol{width:1.8rem;height:1.8rem}.app-logo--compact .app-logo__text{font-size:clamp(2rem,11vw,3.1rem)}}@media(max-width:540px){.home-page__content{gap:1rem}.home-page__branding{padding-inline:.5rem}.hero{padding:1.75rem 1rem}}@media(max-width:540px){.home-page__content{gap:.7rem}.home-page__symbol .app-logo__symbol{width:3rem;height:3rem}.hero{padding:1.75rem 1rem}.hero .app-logo__text{font-size:clamp(3rem,17vw,4.75rem)}}@media(max-width:620px){.manual-video-form__row{grid-template-columns:1fr}.manual-video-form__row .button{width:100%}.selected-video-summary{grid-template-columns:1fr}.selected-video-summary img{aspect-ratio:16 / 9}.selected-video-summary>div{padding:0 1rem 1rem}}@media(max-width:620px){.video-catalog__scroll{max-height:min(58dvh,34rem)}.video-catalog__scroll-header{align-items:flex-start;flex-direction:column;gap:.1rem}.video-catalog__scroll .video-grid{padding:.75rem}}@media(max-height:700px){.video-catalog__scroll{max-height:52dvh}}@media(max-width:480px){.video-catalog__selection{grid-template-columns:6.5rem minmax(0,1fr)}.video-catalog__selection>div{padding:.65rem .75rem}.video-catalog__selection strong{font-size:1.05rem}}@media(max-width:620px){.recording-review__actions{grid-template-columns:1fr}}@media(max-width:620px){.volume-strip{grid-template-columns:.45rem minmax(0,1fr) auto 3.2rem;padding-bottom:.65rem}.volume-strip input[type=range]{grid-column:2 / -1}.final-playback-actions{grid-template-columns:1fr}}@media(max-width:620px){.resume-lobby-card{grid-template-columns:1fr}.resume-lobby-card__actions{display:grid;grid-template-columns:1fr}.resume-lobby-card__actions .button{width:100%}}