[data-home-music-slot]{margin:0 auto 28px;width:100%;max-width:1100px;box-sizing:border-box}
.home-music{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);align-items:center;column-gap:28px;row-gap:8px;padding:18px 28px 18px 14px;border:2px solid #d7b9e9;border-radius:24px;background:linear-gradient(110deg,#f2e5ff,#fff6d9);color:#43215f;box-shadow:0 5px 0 #eee1ee;box-sizing:border-box;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif}
.home-music *{box-sizing:border-box}.home-music-art{grid-row:1/3;min-width:0}.home-music-art img{display:block;width:100%;height:auto;max-height:280px;object-fit:contain}
.home-music h2{margin:0;font-size:clamp(22px,2.5vw,30px);line-height:1.2;color:#43215f;letter-spacing:normal;text-transform:none}
.home-music p{margin:6px 0 0;line-height:1.4}.home-music-invite{font-size:16px;color:#593473}.home-music-track{font-size:15px;color:#745582}
.home-music-copy{align-self:end;min-width:0}.home-music-action{display:grid;justify-items:start;gap:6px;min-width:0;align-self:start}.home-music button{min-width:156px;min-height:48px;max-width:100%;padding:12px 22px;border:2px solid #7040ab;border-radius:99px;background:#7040ab;color:#fff;font:800 16px/1.25 ui-rounded,'Trebuchet MS',system-ui,sans-serif;cursor:pointer;box-shadow:none;white-space:normal}
.home-music button:hover{background:#583080}.home-music button:focus-visible{outline:4px solid #c87200;outline-offset:4px}.home-music button[aria-pressed=true]{background:#fffaf1;color:#583080}
.home-music .home-music-status{margin:0;text-align:left;font-size:12px;color:#644873;min-height:1.4em}
.home-music audio[hidden]{display:none}
@media(max-width:640px){.home-music{grid-template-columns:minmax(0,1fr);gap:10px;padding:12px 16px 10px;border-radius:20px;text-align:center}.home-music-art{grid-row:auto}.home-music-art img{max-height:220px}.home-music-copy{align-self:auto}.home-music h2{font-size:22px}.home-music-invite{font-size:15px}.home-music-track{font-size:14px}.home-music-action{justify-items:stretch;gap:6px}.home-music button{width:100%;min-height:48px}.home-music .home-music-status{text-align:center}}

.home-music-art{position:relative;isolation:isolate}.home-music-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;visibility:hidden}.home-music-art[data-motion-ready=true] img{visibility:hidden}.home-music-art[data-motion-ready=true] .home-music-motion{visibility:visible}
@media(prefers-reduced-motion:reduce){.home-music-art img{visibility:visible!important}.home-music-art .home-music-motion{visibility:hidden!important}}

.home-music-art{width:100%;max-width:400px;aspect-ratio:3/2;justify-self:center}.home-music-art img{height:100%;max-height:none}.home-music-motion{height:100%}@media(max-width:640px){.home-music-art{max-width:330px}.home-music-art img{max-height:none}}

:root{--intro-ease:cubic-bezier(.22,1,.36,1)}
body.home-intro-active{overflow:hidden}
.home-intro{position:fixed;inset:0;z-index:9000;background:transparent;display:flex;flex-direction:column;align-items:center;isolation:isolate;transition:background-color 1.45s var(--intro-ease),opacity 1.45s var(--intro-ease)}
.home-intro:before,.home-intro:after{content:'';position:absolute;width:12px;height:12px;border:3px solid #bc91d0;border-radius:50%;opacity:.35;top:31%;left:12%}
.home-intro:after{width:18px;height:18px;top:66%;left:83%;border-color:#c89d28}
.intro-logo{position:absolute;top:max(30px,env(safe-area-inset-top));width:220px;height:auto}
.home-intro h1{position:absolute;top:16%;margin:0;font:800 clamp(28px,4.8vw,54px)/1.15 ui-rounded,'Trebuchet MS',system-ui,sans-serif;color:#45235e;letter-spacing:-.04em;text-align:center;padding:0 20px}
.home-intro-stage{position:fixed;z-index:1;pointer-events:none;will-change:transform;transform-origin:top left}
.home-intro-stage .home-music-art{width:100%;height:100%;max-width:none;aspect-ratio:3/2;margin:0;position:relative}
.home-intro-stage img{display:block;width:100%;height:100%;object-fit:contain}
.home-intro-stage .home-music-motion{inset:0}
.home-intro-stage.intro-shrinking{transition:transform 1.45s var(--intro-ease)}
.intro-controls{position:absolute;bottom:max(8%,calc(20px + env(safe-area-inset-bottom)));display:flex;align-items:center;flex-direction:column;gap:14px;z-index:2;width:calc(100% - 40px)}
.intro-controls button{font:800 17px/1.3 ui-rounded,'Trebuchet MS',system-ui,sans-serif;border-radius:99px;min-height:48px;cursor:pointer}
.intro-start{padding:16px 44px;background:#7141a4;color:white;border:0;box-shadow:0 7px 24px #7240a42b;min-width:210px}
.intro-start:disabled{opacity:.7;cursor:progress}
.intro-skip{padding:10px 23px;color:#624575;background:transparent;border:1px solid #b89ec3}
.intro-controls button:focus-visible{outline:4px solid #c37b00;outline-offset:5px}
.intro-status{font:14px/1.4 system-ui,sans-serif;text-align:center;color:#5c3d71;margin:0;min-height:20px}
.home-intro[data-phase=playing] .intro-skip{background:#fffaf3a8}
.home-intro[data-phase=shrinking]{background:transparent;pointer-events:none}
.home-intro[data-phase=shrinking]:before,.home-intro[data-phase=shrinking]:after,.home-intro[data-phase=shrinking] .intro-logo,.home-intro[data-phase=shrinking] h1,.home-intro[data-phase=shrinking] .intro-controls{opacity:0;transition:opacity .45s ease}
.intro-art-target{width:100%;max-width:180px;aspect-ratio:3/2;grid-row:1/3;justify-self:center}
/* The landing spot remains a useful, compact music control above the games. */
[data-home-music-slot] .home-music{grid-template-columns:minmax(0,180px) minmax(0,1fr);padding:10px 24px 10px 10px;column-gap:20px}
[data-home-music-slot] .home-music-art{max-width:180px}
[data-home-music-slot] .home-music h2{font-size:22px}
[data-home-music-slot] .home-music-invite{display:none}
[data-home-music-slot] .home-music-track{font-size:13px;margin-top:3px}
[data-home-music-slot] .home-music button{padding:9px 20px;min-height:44px;font-size:14px;min-width:144px}
[data-home-music-slot] .home-music-status:empty{display:none}
body[data-home-intro] :is(.home-card:not(.catalogue-skeleton),.games>.game){opacity:0;transition:opacity .85s ease var(--intro-delay,0ms)}
body[data-home-intro] :is(.home-card,.game).intro-revealed{opacity:1}
body[data-home-intro=ready] .age-strip,body[data-home-intro=loading] .age-strip,body[data-home-intro=playing] .age-strip,body[data-home-intro=error] .age-strip{opacity:0}
body[data-home-intro=shrinking] .age-strip{animation:intro-dissolve .9s ease .3s both}
@keyframes intro-dissolve{from{opacity:0}to{opacity:1}}
@media(max-width:640px){
 .intro-logo{width:190px;top:max(26px,env(safe-area-inset-top))}
 .home-intro h1{top:19%;font-size:clamp(28px,8vw,40px)}
 .intro-controls{bottom:max(10%,calc(18px + env(safe-area-inset-bottom)))}
 [data-home-music-slot] .home-music{grid-template-columns:108px minmax(0,1fr);text-align:left;padding:8px 12px 8px 4px;gap:5px 8px;border-radius:20px}
 .intro-art-target,[data-home-music-slot] .home-music-art{width:108px;max-width:108px;grid-row:1/3}
 [data-home-music-slot] .home-music h2{font-size:clamp(16px,4.3vw,20px)}
 [data-home-music-slot] .home-music-track{font-size:11px}
 [data-home-music-slot] .home-music button{width:auto;min-width:0;font-size:13px;padding:8px 15px;min-height:44px}
 [data-home-music-slot] .home-music-action{justify-items:start;grid-column:2}
 [data-home-music-slot] .home-music-status{text-align:left}
}
@media(max-height:500px){.intro-logo{width:145px;top:14px;left:20px}.home-intro h1{top:10%;font-size:28px}.intro-controls{right:20px;bottom:18px;width:auto;gap:5px;align-items:flex-end}.intro-start{min-width:0;padding:12px 24px}.intro-skip{padding:8px 18px}.intro-status{max-width:160px}}
@media(prefers-reduced-motion:reduce){.home-intro-stage.intro-shrinking,.home-intro,body[data-home-intro] .home-card{transition:none!important}.home-intro .home-music-motion{visibility:hidden!important}.home-intro .home-music-art img{visibility:visible!important}.age-strip{animation:none!important}}

.intro-backdrop{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 17% 32%,#eadbff 0,transparent 62%),radial-gradient(ellipse at 85% 70%,#fff0ba 0,transparent 62%),#fffaf3;transition:opacity 1.45s var(--intro-ease)}
.home-intro[data-phase=shrinking] .intro-backdrop{opacity:0}
/* The camera opens directly onto the complete catalogue, without a duplicate featured shelf. */
body[data-home-intro] #hity{display:none}
body[data-home-intro] #wszystkie-gry{margin-top:0}
body[data-home-intro] #wszystkie-gry>h2,body[data-home-intro] #available-count{display:none}
body[data-home-intro] .age-strip{padding-bottom:22px}
body[data-home-intro] #pending:has(#pending-games:empty){display:none}
body[data-home-intro] [data-home-music-slot]{margin-bottom:8px}

/* Guest entry uses the same intro and only its already-authorised game cards. */
body[data-home-intro]:not([data-kd-catalogue]) main{display:flex;flex-direction:column}
body[data-home-intro]:not([data-kd-catalogue]) main>header{order:0;margin-bottom:18px}
body[data-home-intro]:not([data-kd-catalogue]) [data-home-music-slot]{order:1}
body[data-home-intro]:not([data-kd-catalogue]) main>.intro{order:2;margin:18px 0}
body[data-home-intro]:not([data-kd-catalogue]) main>.intro h1{font-size:28px}
body[data-home-intro]:not([data-kd-catalogue]) main>.intro p{font-size:14px}
body[data-home-intro]:not([data-kd-catalogue]) .games{order:3}
body[data-home-intro]:not([data-kd-catalogue]) .save{order:4}
body[data-home-intro]:not([data-kd-catalogue]) footer{order:5}
@media(max-width:600px){
 body[data-home-intro]:not([data-kd-catalogue]) .games{grid-template-columns:1fr 1fr;gap:16px 12px}
 body[data-home-intro]:not([data-kd-catalogue]) .game.daily{grid-column:auto;display:flex}
 body[data-home-intro]:not([data-kd-catalogue]) .game .poster{height:auto;max-height:none}
 body[data-home-intro]:not([data-kd-catalogue]) .game .copy{padding:12px 10px;gap:8px}
 body[data-home-intro]:not([data-kd-catalogue]) .game h2{font-size:17px}
 body[data-home-intro]:not([data-kd-catalogue]) .game .copy p{font-size:12px;line-height:1.35}
 body[data-home-intro]:not([data-kd-catalogue]) .game .play{font-size:13px;padding:10px 12px;min-height:44px}
 body[data-home-intro]:not([data-kd-catalogue]) .daily-badge{font-size:10px;letter-spacing:0}
}

.karaoke-caption{grid-column:1/-1;box-sizing:border-box;text-align:center;width:100%;padding:12px 8px 6px;color:#42205c;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif}
.karaoke-caption[hidden]{display:none!important}
.karaoke-current{font-size:clamp(22px,4vw,34px);font-weight:800;line-height:1.4;letter-spacing:-.025em;margin:0!important;text-wrap:balance}
.karaoke-current span{padding:1px 2px;border-radius:5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.karaoke-current .karaoke-active{color:#3f185d;background:linear-gradient(90deg,#ffdd6f var(--word-progress,0%),#ffefbe var(--word-progress,0%));text-decoration:underline;text-underline-offset:4px}
.karaoke-current .karaoke-sung{color:#7040ab}
.karaoke-next{font-size:clamp(16px,2.7vw,21px);line-height:1.45;color:#725a81;margin:8px 0 0!important;min-height:1.45em;text-wrap:balance}
.home-music-action .karaoke-open{background:transparent!important;color:#5b2b83!important;border:1px solid #bda6cb!important;padding:8px 16px!important;min-height:44px!important}
.home-music-action{display:flex!important;flex-wrap:wrap;align-items:center;gap:8px!important}
.home-music-action .home-music-status{flex-basis:100%;order:3}
.karaoke-intro-caption{position:absolute;bottom:15%;left:16px;width:calc(100% - 32px);padding:8px;z-index:2}
.home-intro[data-phase=playing] .intro-controls{top:max(18px,env(safe-area-inset-top));right:18px;bottom:auto;left:auto;width:auto;gap:0}
.home-intro[data-phase=playing] .intro-status{display:none}
.home-intro[data-phase=shrinking] .karaoke-intro-caption{opacity:0;transition:opacity .4s ease}
.karaoke-dialog{position:fixed;inset:0;margin:0;padding:20px max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;border:0;color:#43215f;background:radial-gradient(ellipse at 10% 10%,#eadbff,transparent 65%),radial-gradient(ellipse at 90% 80%,#fff0bc,transparent 65%),#fffaf3;box-sizing:border-box;overflow:auto;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif}
.karaoke-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:14px}
.karaoke-dialog::backdrop{background:#fffaf3}
.karaoke-dialog header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0;font-size:20px;font-weight:800}
.karaoke-dialog button{font:800 15px/1.2 ui-rounded,'Trebuchet MS',system-ui,sans-serif;cursor:pointer;min-height:46px;border:1px solid #bda6cb;border-radius:99px;padding:11px 18px;background:#fffaf3;color:#542574}
.karaoke-dialog button:focus-visible,.karaoke-dialog input:focus-visible{outline:4px solid #c67800;outline-offset:4px}
.karaoke-dialog .karaoke-pause{background:#7040ab;color:white;border-color:#7040ab;min-width:128px}
.karaoke-stage{min-height:0;display:grid;place-items:center;overflow:hidden}
.karaoke-stage .home-music-art{width:100%;height:100%;max-width:700px;max-height:440px;aspect-ratio:3/2;grid-row:auto;position:relative}
.karaoke-stage .home-music-art img{width:100%;height:100%;max-height:none;object-fit:contain;display:block}
.karaoke-stage .home-music-motion{inset:0;width:100%;height:100%}
.karaoke-full-caption{align-self:center;padding:0;max-width:1000px;margin:auto}
.karaoke-full-caption .karaoke-current{font-size:clamp(25px,4vw,46px)}
.karaoke-full-caption .karaoke-next{font-size:clamp(17px,2.4vw,24px)}
.karaoke-transport{width:100%;max-width:650px;justify-self:center;display:grid;gap:12px}
.karaoke-buttons{display:flex;justify-content:center;gap:10px}
.karaoke-transport label{display:grid;gap:6px;position:relative;font-size:13px;color:#604472;text-align:center}
.karaoke-transport input{width:100%;min-height:30px;accent-color:#7040ab;cursor:pointer}
@media(max-width:640px){.home-music-action .karaoke-open{font-size:12px!important;padding:8px 11px!important}.karaoke-dialog header{font-size:16px}.karaoke-dialog header button{font-size:12px;padding:10px 13px}.karaoke-current{font-size:clamp(21px,5.8vw,29px)}.karaoke-next{font-size:16px}.karaoke-intro-caption{bottom:16%;}.home-intro h1{top:14%}}
@media(max-height:500px){.karaoke-intro-caption{bottom:8%;left:18px;width:56%;padding:4px}.karaoke-intro-caption .karaoke-current{font-size:24px}.karaoke-intro-caption .karaoke-next{font-size:16px}.karaoke-dialog[open]{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto 1fr auto;gap:8px 18px;padding-top:12px}.karaoke-dialog header{grid-column:1/-1;font-size:17px}.karaoke-stage{grid-column:1;grid-row:2/4}.karaoke-full-caption{grid-column:2;grid-row:2}.karaoke-full-caption .karaoke-current{font-size:clamp(22px,4vw,32px)}.karaoke-full-caption .karaoke-next{font-size:17px}.karaoke-transport{grid-column:2;grid-row:3;gap:4px}.karaoke-dialog button{font-size:13px;min-height:44px;padding:9px 13px}.karaoke-transport label{gap:0}.karaoke-transport input{min-height:24px}}
@media(prefers-reduced-motion:reduce){.karaoke-caption *{transition:none!important;animation:none!important}}
.home-intro[data-phase=playing] .intro-logo{left:18px;top:max(29px,env(safe-area-inset-top));width:min(36vw,145px)}
.karaoke-full-caption{min-height:clamp(104px,17vh,150px);display:flex;flex-direction:column;justify-content:center}
@media(max-height:500px){.karaoke-full-caption{min-height:80px}}
body.home-karaoke-active{overflow:hidden}.karaoke-dialog{overscroll-behavior:contain}
.karaoke-stage .home-music-art{max-height:none}