body{min-height:100vh;display:flex;align-items:center;justify-content:center}
.pk{width:min(1100px,94vw);display:grid;grid-template-columns:1fr 1.1fr;gap:5vw;align-items:center;padding:4vh 0}
.brand{text-align:center}.brand img.logo{width:min(200px,22vh);border-radius:50%;background:#fff;box-shadow:0 0 0 5px var(--gold),0 0 0 10px #1d3567,0 0 60px rgba(98,195,255,.5)}
.brand .t{font-family:var(--fh);font-weight:800;font-size:clamp(34px,6vh,64px);line-height:1.05;margin-top:3vh}
.brand .s{color:var(--mut);margin-top:1.6vh;font-size:clamp(14px,2.2vh,20px)}
.brand .hop{width:min(150px,18vh);margin-top:2vh;animation:floaty 4s ease-in-out infinite}
.panel{padding:clamp(18px,4vh,40px)}
.panel h2{margin:0 0 1.6vh;font-family:var(--fh);font-size:clamp(20px,3.4vh,32px)}
.field{width:100%;height:clamp(52px,7vh,70px);border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.06);padding:0 20px;font-size:clamp(18px,3vh,28px);letter-spacing:2px;text-transform:uppercase;outline:0;text-align:center;font-family:var(--fh)}
.field:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(230,201,119,.2)}
.dots{display:flex;gap:2.2vw;justify-content:center;margin:2.4vh 0}
.dots i{width:clamp(18px,3vh,28px);height:clamp(18px,3vh,28px);border-radius:50%;border:2px solid var(--gold);transition:all .15s}
.dots i.on{background:var(--gold);box-shadow:0 0 18px rgba(230,201,119,.8)}
.dots.shake{animation:shk .4s}@keyframes shk{20%,60%{transform:translateX(-10px)}40%,80%{transform:translateX(10px)}}
.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4vh}
.pad button{height:clamp(56px,9vh,92px);border-radius:18px;background:var(--card2);border:1px solid var(--line);font-family:var(--fh);font-size:clamp(24px,4.2vh,42px);font-weight:700;transition:transform .1s,background .2s}
.pad button:active,.pad button:focus-visible{background:rgba(230,201,119,.22);outline:0;transform:scale(.96);box-shadow:0 0 0 3px var(--gold)}
.rooms{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2vh}
.room{padding:3vh 2vw;border-radius:22px;text-align:center;background:linear-gradient(160deg,rgba(76,141,255,.28),rgba(29,53,103,.4));border:1px solid var(--line);transition:transform .15s}
.room:focus-visible,.room:hover{transform:translateY(-4px);box-shadow:0 0 0 3px var(--gold),0 20px 40px rgba(76,141,255,.4);outline:0}
.room .n{font-family:var(--fh);font-size:clamp(40px,8vh,80px);font-weight:800;line-height:1}
.room .l{margin-top:1vh;font-size:clamp(14px,2.2vh,20px)}
.msg{min-height:3vh;margin-top:1.4vh;text-align:center;color:#ffb3b8;font-weight:600}
.small{font-size:13px;color:var(--mut);text-align:center;margin-top:2vh}
.linkb{color:var(--gold2);text-decoration:underline;font-size:14px}
@media (max-width:760px){.pk{grid-template-columns:1fr}.brand .hop{display:none}}