.pk{--pk-line: var(--g-line, rgba(255, 255, 255, .09));--pk-dim: var(--g-dim, rgba(255, 255, 255, .62));--pk-cyan: var(--g-cyan, #00d4ff);--pk-violet: var(--g-violet, #8b5cf6);--pk-pink: var(--g-pink, #ff3d81);display:flex;flex-direction:column;gap:16px;width:100%;max-width:980px;margin:0 auto;color:var(--g-text, #fff);container:pk / inline-size}.pk-title{font-family:Clash Display,system-ui,sans-serif;font-size:clamp(1.6rem,4.4vw,2.4rem);line-height:1.1;margin:8px 0 4px;text-align:center}.pk.is-secondary .pk-title{font-size:1rem;font-weight:500;color:var(--pk-dim);margin-top:12px}.pk-grid{display:grid;grid-template-columns:1fr;gap:14px}@container pk (min-width: 640px){.pk-grid-2{grid-template-columns:1fr 1fr}.pk-grid-3{grid-template-columns:repeat(3,1fr)}}@container pk (max-width: 639px){[data-step=modes] .pk-card{flex-direction:row;align-items:center}[data-step=modes] .pk-art-wrap{flex:none;width:38%;padding:10px 0 10px 10px;background:none}[data-step=modes] .pk-body{padding:14px 16px 14px 10px;min-width:0}[data-step=modes] .pk-name{font-size:1.15rem}}.pk-card{--tone: var(--pk-cyan);position:relative;display:flex;flex-direction:column;gap:0;padding:0;overflow:hidden;text-align:left;font:inherit;color:inherit;cursor:pointer;border-radius:var(--g-r-lg, 28px);border:1px solid var(--pk-line);background:linear-gradient(160deg,#ffffff12,#ffffff06);-webkit-tap-highlight-color:transparent;transition:transform .45s var(--g-spring, cubic-bezier(.34, 1.56, .64, 1)),border-color .3s ease,box-shadow .3s ease}.pk-tone-violet{--tone: var(--pk-violet)}.pk-tone-pink{--tone: var(--pk-pink)}.pk-tone-cyan{--tone: var(--pk-cyan)}.pk-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--tone) 70%,transparent);box-shadow:0 18px 50px -20px color-mix(in srgb,var(--tone) 60%,transparent)}.pk-card:active{transform:scale(.985)}.pk-card:focus-visible{outline:3px solid var(--pk-cyan);outline-offset:3px}.pk-card.is-last{border-color:color-mix(in srgb,var(--tone) 80%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--tone) 18%,transparent)}.pk-art-wrap{display:block;padding:14px 14px 0;background:radial-gradient(90% 100% at 50% 0%,color-mix(in srgb,var(--tone) 22%,transparent),transparent 75%)}.pk-art{display:block;width:100%;height:auto;max-height:150px;color:var(--tone)}.pk.is-secondary .pk-art-wrap{display:none}.pk-body{display:flex;flex-direction:column;gap:6px;padding:14px 18px 18px}.pk-name{font-family:Clash Display,system-ui,sans-serif;font-size:1.3rem;line-height:1.15}.pk-line{color:var(--pk-dim);font-size:.95rem;line-height:1.4}.pk-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.pk-tags:empty{display:none}.pk-tag{white-space:nowrap;font-size:.8rem;padding:4px 11px;border-radius:999px;border:1px solid var(--pk-line);color:var(--pk-dim);background:#00000040}.pk-tag-last{color:#04121a;font-weight:600;border-color:transparent;background:var(--tone)}.pk-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px}.pk-link{background:none;border:0;padding:10px 8px;min-height:44px;font:inherit;font-size:.95rem;color:var(--pk-cyan);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.pk-link:focus-visible{outline:3px solid var(--pk-cyan);outline-offset:2px;border-radius:8px}.pk-stroke{stroke:currentColor}.pk-solid,.pk-fill-solid{fill:currentColor}.pk-fill-soft{fill:color-mix(in srgb,currentColor 14%,transparent)}.pk-fill-a{fill:var(--pk-cyan)}.pk-fill-b{fill:var(--pk-pink)}.pk-fill-c{fill:#ffb020}.pk-year{fill:#fff;font-family:Clash Display,system-ui,sans-serif}.pk-years{fill:currentColor}.pk-d0{animation-delay:0s}.pk-d1{animation-delay:.45s}.pk-d2{animation-delay:.9s}.pk-d3{animation-delay:1.35s}.pk-art *{transform-box:fill-box;transform-origin:center}@media(prefers-reduced-motion:no-preference){.pk-pass{animation:pk-pass 3.2s ease-in-out infinite}.pk-blink{animation:pk-blink 2.4s ease-in-out infinite}.pk-tap{animation:pk-tap 2.4s ease-in-out infinite}.pk-drop{animation:pk-drop 3s var(--g-out, ease-out) infinite}.pk-bar{transform-origin:left center;animation:pk-bar 3s linear infinite}.pk-pop{animation:pk-pop 2.8s ease-in-out infinite}.pk-fall{animation:pk-fall 2.8s ease-in infinite}.pk-pulse{animation:pk-pulse 2.8s ease-in-out infinite}.pk-years{animation:pk-blink 1.6s steps(2,jump-none) infinite}}@keyframes pk-pass{0%,to{transform:translate(-46px) rotate(-12deg)}50%{transform:translate(46px) rotate(12deg)}}@keyframes pk-blink{0%,to{opacity:.35}50%{opacity:1}}@keyframes pk-tap{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-5px)}}@keyframes pk-drop{0%,15%{transform:translateY(-34px);opacity:0}45%,to{transform:translateY(0);opacity:1}}@keyframes pk-bar{0%{transform:scaleX(1)}to{transform:scaleX(.04)}}@keyframes pk-pop{0%,55%,to{transform:scale(.6);opacity:.35}70%{transform:scale(1.3);opacity:1}}@keyframes pk-fall{0%{transform:translateY(0);opacity:0}20%{opacity:1}to{transform:translateY(46px);opacity:.2}}@keyframes pk-pulse{0%,to{opacity:.55}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.pk-card{transition:none}}.pl-lobby{--pl-line: var(--g-line, rgba(255, 255, 255, .09));--pl-dim: var(--g-dim, rgba(255, 255, 255, .62));min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;gap:1em;padding:1em 1.2em 1.2em;color:var(--g-text, #fff)}.pl-top{display:flex;align-items:center;justify-content:space-between;gap:1em}.pl-deck{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:.9em;color:var(--pl-dim)}.pl-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);gap:1.2em;align-items:start;align-content:start}.pl-join{display:flex;flex-direction:column;align-items:center;gap:.5em;text-align:center}.pl-join .p-qr{width:min(100%,14em)}.pl-hint,.pl-url,.pl-fine,.pl-note,.pl-empty{margin:0;font-size:.85em;color:var(--pl-dim)}.pl-url{color:var(--g-text, #fff);font-size:.95em}.pl-panel,.pl-players,.pl-settings{display:flex;flex-direction:column;gap:.8em;min-width:0;padding:1em 1.1em;border-radius:1.2em;border:1px solid var(--pl-line);background:linear-gradient(160deg,#ffffff0f,#ffffff05)}.pl-h{margin:0;font-family:Clash Display,system-ui,sans-serif;font-size:1.2em;font-weight:600}.pl-h-sub{margin-top:.6em;padding-top:.9em;border-top:1px solid var(--pl-line)}.pl-list{list-style:none;margin:0;padding:0 .2em 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(11em,1fr));gap:.5em;max-height:22em;overflow-y:auto;scrollbar-width:thin}.pl-list.is-crowded{grid-template-columns:repeat(auto-fill,minmax(9em,1fr));gap:.35em;max-height:26em}.pl-player{position:relative;display:flex;align-items:center;gap:.55em;min-width:0;padding:.35em .4em .35em .35em;border-radius:999px;border:1px solid color-mix(in srgb,var(--pc, #00d4ff) 45%,transparent);background:color-mix(in srgb,var(--pc, #00d4ff) 12%,rgba(0,0,0,.3))}.pl-player.is-away{opacity:.5}.pl-avatar{flex:none;width:2em;height:2em;display:block;border-radius:50%;overflow:hidden}.pl-avatar svg{display:block;width:100%;height:100%}.pl-dot{flex:none;width:.6em;height:.6em;border-radius:50%;background:var(--pc, #00d4ff);box-shadow:0 0 .6em var(--pc, #00d4ff)}.pl-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:.95em}.pl-away{font-size:.7em;color:var(--pl-dim)}.pl-kick{flex:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:2em;height:2em;display:grid;place-items:center;border:0;border-radius:50%;color:var(--pl-dim);background:transparent;font:inherit;font-size:1.1em;line-height:1;cursor:pointer}.pl-kick:hover{color:#fff;background:#ff5a6e59}.pl-kick:focus-visible{outline:3px solid var(--g-cyan, #00d4ff);outline-offset:2px}@media(prefers-reduced-motion:no-preference){.pl-player{animation:pl-in .55s var(--g-spring, cubic-bezier(.34, 1.56, .64, 1)) both}}@keyframes pl-in{0%{transform:scale(.6) translateY(.6em);opacity:0}to{transform:none;opacity:1}}.pl-start{display:flex;flex-direction:column;align-items:center;gap:.4em}.pl-start .p-btn{width:100%}.pl-row{display:flex;align-items:center;justify-content:space-between;gap:.8em}.pl-row-col{flex-direction:column;align-items:stretch;gap:.5em}.pl-row-label{font-size:.95em}.pl-stepper{display:inline-flex;align-items:center;gap:.6em}.pl-stepper button{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:2.4em;height:2.4em;border-radius:50%;border:1px solid var(--pl-line);background:#ffffff14;color:inherit;font:inherit;font-size:1.1em;cursor:pointer}.pl-stepper button:disabled{opacity:.35;cursor:not-allowed}.pl-stepper b{min-width:1.8em;text-align:center;font-family:Clash Display,system-ui,sans-serif;font-size:1.3em}.pl-seg{display:flex;flex-wrap:wrap;gap:.4em}.pl-seg button{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:1 1 auto;min-width:2.8em;min-height:2.6em;padding:0 .9em;border-radius:999px;border:1px solid var(--pl-line);background:#ffffff0d;color:inherit;font:inherit;font-family:Clash Display,system-ui,sans-serif;font-weight:600;cursor:pointer}.pl-seg button.is-on{color:#031418;border-color:transparent;background:linear-gradient(100deg,var(--g-cyan, #00d4ff),#5ee7ff)}.pl-stepper button:focus-visible,.pl-seg button:focus-visible{outline:3px solid var(--g-cyan, #00d4ff);outline-offset:2px}.pl-switch{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.8em;min-height:2.6em;cursor:pointer}.pl-switch-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15em;font-size:.95em}.pl-switch-text small{color:var(--pl-dim);font-size:.8em}.pl-switch input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0}.pl-switch i{flex:none;position:relative;width:2.9em;height:1.6em;border-radius:999px;background:#ffffff29;transition:background .25s ease}.pl-switch i:after{content:"";position:absolute;top:.2em;left:.2em;width:1.2em;height:1.2em;border-radius:50%;background:#fff;transition:transform .35s var(--g-spring, cubic-bezier(.34, 1.56, .64, 1))}.pl-switch input:checked~i{background:var(--g-cyan, #00d4ff)}.pl-switch input:checked~i:after{transform:translate(1.3em);background:#031418}.pl-switch input:focus-visible~i{outline:3px solid var(--g-cyan, #00d4ff);outline-offset:3px}.pl-foot{display:flex;justify-content:center}@media(max-width:759px){.pl-start{position:sticky;bottom:0;z-index:5;margin:0 -.4em;padding:.8em .4em calc(.4em + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,rgba(5,5,5,.92) 35%)}.pl-list{max-height:18em}.pl-join .p-code{font-size:2.6em}}@media(min-width:760px){.pl-lobby{padding:1em 1.6em 1.4em}.pl-main{grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr)}.pl-settings{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fit,minmax(16em,1fr));-moz-column-gap:2em;column-gap:2em;align-items:start}.pl-settings>.pl-h,.pl-settings>.pl-fine{grid-column:1 / -1}.pl-settings>.pl-h-sub{margin-top:0}.pl-join .p-qr{width:min(100%,18em)}}@media(min-width:1200px){.pl-main{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,.95fr);align-items:stretch}.pl-settings{grid-column:auto;display:flex}.pl-settings>.pl-h-sub{margin-top:.6em}.pl-join{justify-content:center}.pl-join .p-qr{width:min(100%,20em,44vh)}.pl-list{max-height:none;flex:1;min-height:0;align-content:start}.pl-players,.pl-settings{min-height:0;max-height:calc(100dvh - 7em)}.pl-settings{overflow-y:auto;scrollbar-width:thin;font-size:.8em;gap:.6em;padding-bottom:2.2em;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 2em),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 2em),transparent)}.pl-settings .pl-seg button{min-height:2.2em}.pl-list{padding-bottom:1.8em;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 1.8em),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 1.8em),transparent)}}
