:root{--portal-ink:#1d2340;--portal-sub:#5f6788;--portal-line:#e4e8f3;--portal-night:#141a36;--portal-gold:#e7b660}
body.home{background:#fbfaf7;color:var(--portal-ink);font-size:17px;line-height:1.65}.home .wrap{width:min(1192px,calc(100% - 48px));margin-inline:auto}.home .site-header{background:var(--portal-night);color:#fff}.home .header-row{height:64px}.home .brand{font:400 21px 'Black Han Sans','Noto Sans KR',sans-serif;letter-spacing:.02em}.home .brand small{color:#bbc4df}.home .brand-mark{color:#e7b660}.home .site-header nav a{font-size:15px;color:#c9cfe8}.home .site-header nav a:hover,.home .site-header nav a[aria-current=page]{color:#fff}.home .site-footer{background:var(--portal-night);color:#aab2d4}.home .footer-inner strong{color:#fff}
.home h1,.home .portal h2,.home .section-title h2{font-family:'Black Han Sans','Noto Sans KR',sans-serif;font-weight:400}.theme-silver{--c:#c6d2ee}.theme-sword{--c:#3da4e0}.theme-pro{--c:#a995e3}.theme-sugar{--c:#f08a5d}.theme-dok{--c:#e0b25a}.home .lobby{background:linear-gradient(#141a36,#1d2547 70%,#2a2f5c);color:#fff;padding:34px 0 0}.lobby-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.home .lobby .eyebrow{font:600 12px/1 sans-serif;letter-spacing:.3em;color:var(--portal-gold)}.home .lobby h1{font-size:clamp(32px,4.4vw,52px);line-height:1.15;margin:12px 0 0}.lobby-intro{font-size:14px;color:#c6cce3}.portals{display:flex;gap:12px;height:560px}.portal{position:relative;flex:1;min-width:0;border-radius:26px 26px 0 0;overflow:hidden;background:#222;transition:flex .55s cubic-bezier(.2,.8,.2,1);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}.portal::before{content:'';position:absolute;inset:0;background:var(--art) var(--pos,center)/cover;transition:transform .8s;z-index:-2}.portal::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(10,14,34,.94) 6%,rgba(10,14,34,.35) 48%,rgba(10,14,34,.05));z-index:-1}.portal-default,.portals .portal:hover,.portals .portal:focus-visible{flex:2.4}.portals:hover .portal-default:not(:hover),.portals:focus-within .portal-default:not(:focus-visible){flex:1}.portal:hover::before{transform:scale(1.05)}.portal-inner{padding:26px 26px 30px}.portal-tag{display:inline-flex;align-items:center;font:700 11px/1 sans-serif;letter-spacing:.15em;padding:6px 10px;border-radius:999px;background:var(--c);color:#171b33;margin-bottom:12px}.portal-tag img{width:22px;height:22px;object-fit:contain;margin:-5px 6px -5px -4px}.portal h2{font-size:30px;line-height:1.15;margin:0 0 8px}.portal p{margin:0 0 14px;color:#dfe3f5;font-size:15px;max-width:34ch}.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}.chips span{font-size:13px;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.16)}.portal-go{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:999px;background:var(--c);color:#171b33;font-weight:700}.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-inner{padding:22px 18px 26px}.portal:not(.portal-default):not(:hover):not(:focus-visible) h2{font-size:21px}.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-tag,.portal:not(.portal-default):not(:hover):not(:focus-visible) p,.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-more{display:none}.portals:hover .portal-default:not(:hover) .portal-tag,.portals:hover .portal-default:not(:hover) p,.portals:hover .portal-default:not(:hover) .portal-more,.portals:focus-within .portal-default:not(:focus-visible) .portal-tag,.portals:focus-within .portal-default:not(:focus-visible) p,.portals:focus-within .portal-default:not(:focus-visible) .portal-more{display:none}.portals:hover .portal-default:not(:hover) h2,.portals:focus-within .portal-default:not(:focus-visible) h2{font-size:21px}.portal:focus-visible{outline:3px solid #fff;outline-offset:-5px}
.portal-content{padding-bottom:0}.portal-section{padding:56px 0 8px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-title h2,.coupon-title h2{display:flex;align-items:center;gap:10px;margin:0;font-size:28px}.section-title h2 img,.coupon-title h2 img{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 2px 4px #1e285940)}.portal-feed{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}.feed-card{background:#fff;border:1px solid var(--portal-line);border-radius:22px;padding:6px 8px}.feed-row{display:flex;gap:12px;align-items:center;padding:14px;border-radius:14px;color:var(--portal-ink)}.feed-row+.feed-row{border-top:1px solid var(--portal-line)}.feed-row:hover{background:#f6f7fc}.feed-row b{font-size:15px;flex:1;min-width:0}.feed-row time{color:var(--portal-sub);white-space:nowrap;font-size:13px}.feed-game{flex:none;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:#edf0f8;color:#343d66}.feed-placeholder{color:var(--portal-sub);font-size:14px;padding:12px 14px}.feed-links{display:flex;gap:8px;flex-wrap:wrap;padding:10px 14px 14px}.feed-links a{color:#54678c;font-size:13px;text-decoration:underline}.coupon-title{padding:14px 18px 0}.coupon-title h2{font-size:20px}.coupon-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px}.coupon-link{border:1px dashed #cfd6ea;border-radius:16px;padding:14px;display:flex;align-items:center;gap:10px;background:#fbfcff}.coupon-link:hover{background:#f3f6ff}.coupon-link img{width:34px;height:34px;object-fit:contain}.coupon-link span:nth-child(2){flex:1;min-width:0}.coupon-link b,.coupon-link small{display:block}.coupon-link b{font-size:15px}.coupon-link small{font-size:13px;color:var(--portal-sub)}.coupon-arrow{font-size:22px;color:#526782}.tools-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.tool-card{background:#fff;border:1px solid var(--portal-line);border-left:5px solid var(--c);border-radius:20px;padding:20px;transition:transform .2s,box-shadow .2s}.tool-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px #28326e1f}.tool-card img{width:34px;height:34px;object-fit:contain;float:right;margin-left:8px}.tool-card small{color:var(--portal-sub);font-size:13px}.tool-card b{display:block;font-size:18px;margin:2px 0 4px}.tool-card span{font-size:14px;color:var(--portal-sub)}.home .site-footer{margin-top:60px}.home a:focus-visible{outline:3px solid #3985b5;outline-offset:3px}.home .portal:focus-visible{outline-color:#fff;outline-offset:-5px}
@media(max-width:980px){.portals{flex-direction:column;height:auto;gap:10px}.portals .portal,.portals .portal:hover,.portals .portal:focus-visible,.portals .portal-default{flex:none;height:200px;border-radius:22px}.portal-inner,.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-inner{padding:18px 20px}.portal h2,.portal:not(.portal-default):not(:hover):not(:focus-visible) h2,.portals:hover .portal-default:not(:hover) h2,.portals:focus-within .portal-default:not(:focus-visible) h2{font-size:24px;margin-bottom:10px}.portal .portal-tag,.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-tag,.portals:hover .portal-default:not(:hover) .portal-tag,.portals:focus-within .portal-default:not(:focus-visible) .portal-tag{display:inline-flex}.portal .portal-more,.portal:not(.portal-default):not(:hover):not(:focus-visible) .portal-more,.portals:hover .portal-default:not(:hover) .portal-more,.portals:focus-within .portal-default:not(:focus-visible) .portal-more{display:block}.portal p,.chips{display:none!important}.portal-go{padding:9px 18px;font-size:15px}.home .lobby{padding-bottom:26px}.portal-feed{grid-template-columns:1fr}.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lobby-intro{display:none}}
@media(max-width:560px){.home .wrap{width:calc(100% - 32px)}.home .header-row{height:64px}.home .brand small{display:none}.home .site-header nav{gap:14px}.home .lobby{padding-top:26px}.home .lobby h1{font-size:32px}.coupon-grid{grid-template-columns:1fr}.tools-grid{grid-template-columns:1fr}.feed-row time{display:none}.section-title h2{font-size:25px}.portal-section{padding-top:42px}}
@media(prefers-reduced-motion:reduce){.portal,.portal::before,.tool-card{transition:none}.portal:hover::before,.tool-card:hover{transform:none}}

.home .brand-mark{font-size:0;background:transparent url("portal/icons/logo.svg") center/contain no-repeat;border:0}.home .brand small{display:none}
@media(max-width:420px){.home .brand{font-size:18px}.home .site-header nav{gap:9px}.home .site-header nav a{font-size:13px}}
@media(max-width:420px){.home .header-row{gap:8px}.home .brand{gap:5px}.home .brand-mark{width:32px;height:32px}.home .site-header nav{gap:7px}.home .site-header nav a{font-size:12px}}

/* MetaHub identity: a portal-shaped M, legible at tab and header sizes. */
.home .brand-mark{background:none;border:0;border-radius:10px;overflow:hidden;flex:none}.home .brand-mark img{display:block;width:100%;height:100%}.home .brand{font:800 22px/1.15 'Noto Sans KR',sans-serif;letter-spacing:-.04em}.home .brand-wordmark>span{color:#f0c66f}.home .footer-brand{display:inline-flex;align-items:center;gap:8px}.home .footer-brand img{display:block;border-radius:6px}
@media(max-width:420px){.home .brand{font-size:18px}}

/* Release calendar entry shares the portal's restrained navy and gold identity. */
.home .release-promo{display:flex;align-items:center;gap:17px;margin:38px 0 0;padding:18px 22px;color:#f8f8ff;background:linear-gradient(110deg,#1b2344,#303959);border:1px solid #414a68;border-radius:18px;text-decoration:none;box-shadow:0 10px 24px #20284116}
.home .release-promo:hover{background:linear-gradient(110deg,#242d51,#394465)}
.release-promo-icon{flex:none;display:grid;place-items:center;width:54px;height:54px;color:#e7bd6a;border:1px solid #e7bd6a70;border-radius:14px;background:#e7bd6a12}.release-promo-icon svg{width:30px;height:30px}
.release-promo>span:nth-child(2){min-width:0;flex:1}.release-promo small,.release-promo strong,.release-promo>span:nth-child(2)>span{display:block}.release-promo small{font:700 10px/1.4 sans-serif;letter-spacing:.18em;color:#e7bd6a}.release-promo strong{font-size:20px}.release-promo>span:nth-child(2)>span{font-size:13px;color:#d3d8eb}.release-promo>b{font-size:23px;color:#e7bd6a}
@media(max-width:420px){.home .release-promo{gap:12px;padding:15px;margin-top:26px}.release-promo-icon{width:44px;height:44px}.release-promo strong{font-size:17px}.release-promo>span:nth-child(2)>span{font-size:12px}}
