:root{--space:#091529;--panel:#101f37;--panel-raised:#172944;--paper:#f3f1e9;--muted:#aebbd0;--line:#32435e;--lilac:#a9a6ff;--mint:#87f5ff;--yellow:#ffd85a;--coral:#e39a84;--font-ui:Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{background:var(--space)}body{background:var(--space);color:var(--paper);font-family:var(--font-ui);margin:0}a{color:inherit;text-decoration:none}.hub-shell{background:var(--space);min-height:100vh;padding:28px clamp(20px,5vw,72px) 36px;position:relative;overflow:hidden}.hub-shell:before,.hub-shell:after{background:var(--yellow);content:"";border-radius:50%;width:6px;height:6px;position:absolute}.hub-shell:before{box-shadow:28vw 4vh 0 var(--mint), 74vw -5vh 0 var(--lilac), 83vw 30vh 0 var(--yellow), 5vw 65vh 0 var(--lilac);top:17%;left:7%}.hub-shell:after{box-shadow:-23vw -4vh 0 var(--mint), -68vw 2vh 0 var(--yellow);bottom:9%;right:9%}.orbit{border:1px solid var(--line);pointer-events:none;border-radius:50%;position:absolute}.orbit-a{width:260px;height:260px;top:-155px;right:12%}.orbit-b{width:180px;height:180px;bottom:-120px;left:9%}.hub-header{z-index:1;justify-content:space-between;align-items:center;gap:20px;max-width:1240px;margin:0 auto;display:flex;position:relative}.hub-header p{color:var(--muted);margin:0;font-size:14px}.hub-brand{letter-spacing:-.02em;align-items:center;gap:10px;font-weight:800;display:inline-flex}.brand-mark{background:var(--yellow);width:34px;height:34px;color:var(--space);border-radius:50%;place-items:center;display:grid}.hub-intro{z-index:1;max-width:1240px;margin:clamp(64px,11vh,112px) auto 38px;position:relative}.hub-kicker{color:var(--mint);letter-spacing:.17em;margin:0 0 14px;font-size:12px;font-weight:900}.hub-intro h1{letter-spacing:-.065em;max-width:720px;margin:0;font-size:clamp(42px,7vw,82px);line-height:.98}.hub-lede{max-width:560px;color:var(--muted);margin:24px 0 0;font-size:clamp(15px,2vw,18px);line-height:1.7}.game-grid{z-index:1;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;max-width:1240px;margin:0 auto;display:grid;position:relative}.game-card{border:1px solid var(--line);background:var(--panel);border-radius:26px;transition:transform .18s,border-color .18s;overflow:hidden}.game-card:hover{border-color:var(--card-accent);transform:translateY(-5px)}.game-card:focus-visible{outline:3px solid var(--card-accent);outline-offset:4px}.game-card-lilac{--card-accent:var(--lilac)}.game-card-mint{--card-accent:var(--mint)}.game-card-yellow{--card-accent:var(--yellow)}.game-card-coral{--card-accent:var(--coral)}.game-art-wrap{background:var(--panel-raised);place-items:center;height:210px;display:grid;position:relative;overflow:hidden}.game-art{object-fit:contain;width:100%;height:100%;padding:18px}.player-pill{border:1px solid var(--line);background:var(--space);color:var(--paper);border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800;position:absolute;top:14px;right:14px}.game-copy{padding:24px}.game-eyebrow{letter-spacing:.13em;font-weight:900;color:var(--card-accent)!important;margin:0 0 8px!important;font-size:11px!important}.game-copy h2{letter-spacing:-.035em;margin:0;font-size:27px}.game-copy>p{min-height:73px;color:var(--muted);margin:14px 0 20px;font-size:14px;line-height:1.7}.play-link{border-top:1px solid var(--line);color:var(--card-accent);justify-content:space-between;align-items:center;padding-top:17px;font-size:14px;font-weight:900;display:flex}.hub-footer{z-index:1;max-width:1240px;color:var(--muted);text-align:center;justify-content:center;align-items:center;gap:12px;margin:34px auto 0;font-size:13px;display:flex;position:relative}.hub-footer p{margin:0}.hub-footer span{color:var(--yellow)}@media (width<=1080px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=760px){.game-grid{grid-template-columns:1fr}.game-card{grid-template-columns:minmax(180px,38%) 1fr;display:grid}.game-art-wrap{height:100%;min-height:230px}}@media (width<=560px){.hub-shell{padding:22px 16px 30px}.hub-header p{display:none}.hub-intro{margin-top:60px}.hub-intro h1{font-size:46px}.game-card{border-radius:22px;display:block}.game-art-wrap{height:190px;min-height:0}.game-copy{padding:21px}.game-copy>p{min-height:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
