/* Homepage comparison; keep the shared game and article styles unchanged. */
.all-games-callout{max-width:1035px;margin:12px auto 26px;padding:22px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;border:1px solid #ddc98d44;border-radius:14px;background:#dfcf9520}
.all-games-callout h2{font:28px Georgia,serif;text-align:left;margin:0 0 7px}.all-games-callout p{font-size:13px;color:#c9d2ba;margin:0}.all-games-callout>a{white-space:nowrap;font-size:13px;padding:12px 18px;border:1px solid #e8d29877;border-radius:24px;text-decoration:none}
@media(max-width:1150px){.all-games-callout{margin-left:5vw;margin-right:5vw}}@media(max-width:600px){.all-games-callout{flex-direction:column;align-items:flex-start;padding:20px}.all-games-callout>a{width:100%;text-align:center}}
.game-comparison { max-width: 1040px; }
.comparison-scroll { overflow-x: auto; margin: 22px 0; border: 1px solid rgba(255,255,255,.18); border-radius: 12px; }
.comparison-scroll:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.game-comparison table { width: 100%; border-collapse: collapse; text-align: left; font-size: .95rem; }
.game-comparison caption { text-align: left; padding: 16px; color: var(--gold); font-weight: 600; }
.game-comparison th, .game-comparison td { padding: 14px 16px; vertical-align: top; border-top: 1px solid rgba(255,255,255,.12); }
.game-comparison thead { background: rgba(0,0,0,.14); }
.game-comparison th[scope="row"] { width: 23%; }
.game-comparison tbody tr:nth-child(even) { background: rgba(255,255,255,.035); }
.home-faq h3 { margin-top: 24px; }
@media (max-width: 600px) {
  .game-comparison table { font-size: .85rem; }
  .game-comparison th, .game-comparison td { padding: 12px 9px; overflow-wrap: break-word; }
  .game-comparison th[scope="row"] { width: 27%; }
}
@media (max-width: 360px) {
  .site-header { flex-wrap: wrap; gap: 10px; }
  .site-header .nav-cta { margin-left: auto; }
}

/* Keep text links readable on the homepage, including visited links. */
body.homepage a:any-link:not(:where(.btn-primary, .nav-cta, .game-card, .guide-card, .share-btn, .brand)) {
  color: #fff;
  font-weight: 700;
  opacity: 1;
  text-underline-offset: .18em;
}

/* Fit the welcome area and complete community panel in the first screen. */
.homepage .home-intro{max-width:1200px;margin:0 auto;padding:0 24px 12px}
.homepage .hero{padding:20px 12px 16px}
.homepage .hero-cards{height:126px;margin-bottom:12px}
.homepage .hero-card{width:82px}
.homepage .hero h1{font-size:clamp(28px,4vw,44px);line-height:1.2;margin-bottom:10px}
.homepage .hero-sub{font-size:15px;line-height:1.5;max-width:530px;margin-bottom:16px}
.homepage .hero-actions{gap:12px}
.homepage .hero-actions a{font-size:14px;padding:11px 24px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.homepage .hero-perks{font-size:11px;gap:20px;margin-top:14px;line-height:1.5}
.homepage .community-home{max-width:none;margin:8px 0 0;padding:18px 22px;border-radius:16px;background:linear-gradient(120deg,#153f2ea8,#082d2180);box-shadow:inset 0 1px 0 #fff9d80a}
.homepage .community-home-top{gap:14px;flex-wrap:nowrap}
.homepage .community-home h2{text-align:left;font-size:25px;line-height:1.2;margin:0 0 5px}
.homepage .community-home-top p{font-size:12px;line-height:1.5;margin:0}
.homepage .community-home .btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex:none;min-height:44px;padding:10px 20px;font-size:13px;line-height:1.3;border-radius:10px;background:linear-gradient(#e7ce7d,#d4af37);box-shadow:inset 0 1px 0 #fff3b366,0 3px 0 #827029}
.homepage .community-home .btn-primary span{font-size:19px;line-height:1}
.homepage .presence-stats{gap:10px;margin:14px 0 10px}
.homepage .presence-stats>div{display:flex;align-items:center;justify-content:center;gap:12px;padding:9px 12px;min-height:48px;border-radius:9px}
.homepage .presence-stats strong{font-size:24px;line-height:1.15;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.homepage .presence-stats span{font-size:11px;line-height:1.4}
.homepage .community-home-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
.homepage .community-home-footer p{margin:0;font-size:11px;line-height:1.5}
.homepage .community-home-footer .community-note{font-size:10px;flex:none;color:#b3ceb8}
.homepage .community-note::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px}
@media(max-width:1000px){
  .homepage .site-header{padding:10px 24px}
  .homepage .hero{padding-top:14px}.homepage .hero-cards{height:112px}.homepage .hero-card{width:74px}
  .homepage .community-home{padding:16px 18px}.homepage .community-home h2{font-size:24px}
}
@media(max-width:700px){
  .homepage .site-header{padding:8px 14px;gap:10px}.homepage .brand{font-size:17px;letter-spacing:0}.homepage .brand-logo{height:32px;margin-right:7px}
  .homepage .nav-cta{font-size:12px;padding:7px 13px;margin-left:auto}
  .homepage .site-header .community-tools{font-size:11px;gap:8px}.homepage .community-tools [data-account-link]{padding:5px 12px;max-width:170px}
  .homepage .home-intro{padding:0 14px 12px}.homepage .hero{padding:12px 0}
  .homepage .hero-cards{height:94px;margin-bottom:8px}.homepage .hero-card{width:60px}
  .homepage .hero h1{font-size:29px;margin-bottom:8px}.homepage .hero-sub{font-size:13px;line-height:1.45;max-width:350px;margin-bottom:12px}
  .homepage .hero-actions{gap:8px;flex-wrap:nowrap}.homepage .hero-actions a{font-size:12px;padding:9px 15px}
  .homepage .hero-perks{font-size:9px;gap:10px;flex-wrap:nowrap;margin-top:10px}.homepage .hero-perks>span{white-space:nowrap}
  .homepage .community-home{margin-top:4px;padding:14px}.homepage .community-home-top{flex-wrap:wrap;gap:10px}
  .homepage .community-home h2{font-size:23px}.homepage .community-home-top p{font-size:11px}
  .homepage .community-home .btn-primary{width:100%;min-height:42px;font-size:12px;padding:8px 14px}
  .homepage .presence-stats{gap:6px;margin:12px 0 10px}.homepage .presence-stats>div{flex-direction:column;gap:2px;padding:7px 4px;min-height:54px}
  .homepage .presence-stats strong{font-size:22px}.homepage .presence-stats span{font-size:10px}
  .homepage .community-home-footer{flex-direction:column;gap:5px;align-items:flex-start}.homepage .community-home-footer p{font-size:10px}.homepage .community-home-footer .community-note{font-size:9px}
}
@media(max-width:700px) and (max-height:740px){
  .homepage .hero-cards{height:58px;margin-bottom:7px}.homepage .hero-card{width:39px}
  .homepage .hero-perks{display:none}.homepage .hero{padding-top:10px;padding-bottom:10px}
  .homepage .community-home{padding:12px}.homepage .community-home-footer p span{display:none}
}
@media(max-width:380px){
  .homepage .hero h1{font-size:27px}.homepage .hero-actions a{padding-left:11px;padding-right:11px}
  .homepage .hero-perks{gap:6px;font-size:8px}.homepage .community-home h2{font-size:22px}
}
@media(max-width:700px) and (max-height:600px){.homepage .hero-cards{display:none}.homepage .hero-sub{margin-bottom:10px}.homepage .community-home-top{gap:8px}.homepage .presence-stats{margin:10px 0 8px}}
@media(min-width:701px) and (max-height:600px){
  .homepage .home-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:20px;padding:12px 20px}
  .homepage .hero{padding:10px 0}.homepage .hero-cards{display:none}.homepage .hero h1{font-size:30px}
  .homepage .hero-sub{font-size:13px}.homepage .hero-actions{gap:8px}.homepage .hero-actions a{padding:9px 13px;font-size:12px}
  .homepage .hero-perks{display:none}.homepage .community-home{margin:0;padding:16px}
  .homepage .community-home-top{flex-wrap:wrap;gap:10px}.homepage .community-home h2{font-size:23px}.homepage .community-home .btn-primary{width:100%}
  .homepage .presence-stats>div{flex-direction:column;gap:3px;padding:7px 3px}.homepage .presence-stats strong{font-size:21px}.homepage .presence-stats span{font-size:10px}
  .homepage .community-home-footer{flex-direction:column;align-items:flex-start;gap:4px}.homepage .community-home-footer p span{display:none}
}

/* Share the game grid's outer width and gutters. */
.homepage .home-intro{max-width:1150px;padding-left:5vw;padding-right:5vw}
@media(min-width:701px) and (max-height:600px){
  .homepage .home-intro{display:block}
  .homepage .hero{display:grid;grid-template-columns:1fr auto;column-gap:16px;text-align:left;padding:4px 0 12px}
  .homepage .hero h1{grid-column:1;grid-row:1;font-size:26px;margin-bottom:4px}
  .homepage .hero-sub{grid-column:1;grid-row:2;margin:0;font-size:12px}
  .homepage .hero-actions{grid-column:2;grid-row:1/3;align-self:center}
  .homepage .community-home{padding:12px 16px}
  .homepage .community-home-top{flex-wrap:nowrap}
  .homepage .community-home .btn-primary{width:auto}
  .homepage .presence-stats{margin:10px 0 8px}
  .homepage .presence-stats>div{flex-direction:row;gap:10px;min-height:42px}
  .homepage .community-home-footer{flex-direction:row;align-items:center}
}

/* Original number-grid illustration for the Sudoku game listing. */
.sudoku-icon svg{display:block;width:100%;height:100%}
