.helper-page{min-height:100vh;padding:100px 25px 80px;background:transparent}
.helper-shell{max-width:1250px;margin:0 auto}
.helper-kicker{display:inline-block;padding:7px 13px;border:1px solid rgba(210,33,55,.5);border-radius:100px;background:rgba(179,0,24,.17);font:700 13px Oswald,Arial,sans-serif;letter-spacing:2px;text-transform:uppercase}
.helper-hero{margin-bottom:34px}
.helper-hero h1{font:700 clamp(2.8rem,7vw,5.8rem)/.95 Oswald,Arial,sans-serif;text-transform:uppercase;letter-spacing:3px;margin:18px 0 14px}
.helper-hero p{max-width:760px;color:rgba(255,255,255,.9);line-height:1.8;font-size:1.1rem}
.helper-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:24px;margin-top:32px}
.helper-panel{background:#141414;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:30px;min-width:0}
.helper-panel h2{font:700 clamp(1.5rem,3vw,2rem) Oswald,Arial,sans-serif;text-transform:uppercase;letter-spacing:1px;margin:0 0 18px}
.helper-panel p{line-height:1.65;color:#d0d0d0;margin:0 0 18px}
.helper-panel .note{color:#adb2bb;font-size:.95rem}
.helper-panel .btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
.helper-panel .btn:focus-visible,.helper-back:focus-visible{outline:3px solid #fff;outline-offset:4px}
.helper-panel .btn:hover{filter:brightness(1.1)}
.helper-panel #state{min-height:1.5em}
.helper-panel #games:empty{min-height:20px}
.helper-game{padding:20px;margin:14px 0;background:#1b1b1b;border:1px solid rgba(255,255,255,.12);border-left:4px solid #b30018;border-radius:12px}
.helper-game h3{font:600 1.3rem Oswald,Arial,sans-serif;margin:0 0 12px}
.helper-game p{margin:5px 0}
.helper-back{display:inline-block;color:#e5e5e5;text-decoration:none;margin-bottom:10px}
.helper-back:hover{color:#fff;text-decoration:underline}
@media(max-width:950px){.helper-page{padding-top:110px}}@media(max-width:760px){.helper-page{padding:100px 18px 48px}.helper-grid{grid-template-columns:minmax(0,1fr);gap:16px}.helper-panel{padding:22px}.helper-hero{padding:20px 0 28px}.helper-panel .btn{width:100%;padding:15px}}
@media(max-width:430px){
    body:has(.helper-page){overflow-x:hidden}
    .helper-page{padding-left:12px;padding-right:12px}
    .helper-hero h1{font-size:clamp(2.35rem,12vw,3.2rem);letter-spacing:1px;overflow-wrap:anywhere}
    .helper-hero p{font-size:1rem;overflow-wrap:anywhere}
    .helper-panel{padding:18px}
    .helper-game{padding:16px;overflow-wrap:anywhere}
    .helper-game h3{font-size:1.15rem;overflow-wrap:anywhere}
}
