@font-face { font-family: Baloo; src: url('../assets/fonts/baloo_2.ttf'); }

:root { --ink:#121017; --bone:#f5efdf; --cream:#fff9ed; --pink:#ff3da7; --purple:#8d4dff; --lime:#c8f04b; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; }
body { margin:0; background-color:#000; background-image:radial-gradient(ellipse at 12% 33%,rgba(141,77,255,.2),transparent 25%),radial-gradient(ellipse at 88% 52%,rgba(255,61,167,.14),transparent 23%),radial-gradient(circle at 21% 78%,rgba(200,240,75,.11) 0 2px,transparent 3px),radial-gradient(circle at 79% 16%,rgba(255,61,167,.18) 0 2px,transparent 3px),linear-gradient(117deg,transparent 0 43%,rgba(141,77,255,.09) 43.15% 43.35%,transparent 43.5% 100%); background-size:auto,auto,97px 113px,137px 149px,100% 100%; background-attachment:fixed; color:var(--bone); font-family:Baloo,Arial,sans-serif; font-size:16px; overflow-x:hidden; }
.grain { opacity:.22; pointer-events:none; position:fixed; inset:0; z-index:20; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E"); }
.shell { width:min(1150px, calc(100% - 56px)); margin:0 auto; }
.nav { height:106px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:3; }
.wordmark { color:var(--ink); text-decoration:none; display:grid; grid-template-columns:auto auto; column-gap:7px; align-items:center; font-weight:900; font-size:20px; line-height:.72; letter-spacing:-1.4px; transform:rotate(-3deg); }.wordmark-star { font-size:34px; color:var(--pink); grid-row:span 2; }.wordmark em { grid-column:2; font-style:normal; font-size:7px; letter-spacing:3.2px; text-align:center; margin-top:8px; }
nav { display:flex; gap:29px; margin-left:90px; } a { transition:transform .18s ease, color .18s ease; } nav a,.footer>a { color:var(--ink); text-decoration:none; font-size:14px; font-weight:900; } nav a:hover,.footer>a:hover { color:var(--pink); }
.nav-pill { text-decoration:none; color:var(--ink); border:2px solid var(--ink); border-radius:40% 53% 45% 56%; padding:10px 16px 8px; font-size:13px; font-weight:900; transform:rotate(-1deg); }.nav-pill:hover,.button:hover { transform:translate(-2px,-2px) rotate(-1deg); }.nav-pill span { color:var(--pink); font-size:17px; padding-left:5px; }
.hero-banner { position:relative; background:#000; line-height:0; overflow:hidden; }.hero-banner img { display:block; width:100%; min-height:490px; object-fit:cover; object-position:center; background:#000; }.hero-banner-nav a,.hero-banner-link { position:absolute; z-index:2; opacity:0; }.hero-banner-nav a:focus-visible,.hero-banner-link:focus-visible { opacity:1; outline:4px solid var(--lime); outline-offset:3px; background:rgba(255,61,167,.65); color:var(--bone); line-height:1; padding:6px; }.hero-nav-home { left:36.5%; top:4%; width:5%; height:9%; }.hero-nav-games { left:43%; top:4%; width:5%; height:9%; }.hero-nav-about { left:49.5%; top:4%; width:5%; height:9%; }.hero-nav-news { left:56%; top:4%; width:4%; height:9%; }.hero-nav-contact { left:62%; top:4%; width:6%; height:9%; }.hero-nav-privacy { left:70%; top:4%; width:11%; height:9%; }.hero-banner-link { left:7%; bottom:13%; width:29%; height:14%; }
.hero { padding:71px 0 105px; min-height:615px; display:grid; grid-template-columns:1.03fr .97fr; align-items:center; }.eyebrow { text-transform:uppercase; font-size:11px; letter-spacing:1.6px; font-weight:900; margin:0 0 17px; }.eyebrow span { display:inline-block; width:8px; height:8px; background:var(--pink); transform:rotate(45deg); margin-right:7px; }
h1,h2 { margin:0; font-family:Baloo,Arial,sans-serif; font-weight:900; text-transform:uppercase; letter-spacing:-.065em; line-height:.79; transform:rotate(-1deg); text-shadow:1px 1px 0 var(--ink); } h1 { font-size:clamp(63px,7.1vw,105px); max-width:650px; } h1 i,h2 i { color:var(--pink); font-style:normal; }.hero-text { font-size:18px; line-height:1.35; max-width:450px; margin:28px 0 30px; }.hero-actions { display:flex; align-items:center; gap:26px; }
.button { display:inline-flex; align-items:center; gap:18px; border:2px solid var(--ink); border-radius:5px 2px 6px 3px; padding:13px 17px 11px; text-decoration:none; font-weight:900; font-size:14px; transform:rotate(-1deg); }.button b { font-size:19px; line-height:0; }.button-coral { background:var(--pink); color:var(--ink); }.button-dark { background:var(--purple); color:var(--bone); }.text-link { color:var(--ink); font-size:14px; font-weight:900; text-decoration:none; border-bottom:2px solid currentColor; padding-bottom:2px; }.text-link span { color:var(--pink); margin-left:5px; font-size:19px; }
.hero-art { height:422px; position:relative; display:grid; place-items:center; }.hero-art img { width:100%; max-width:460px; max-height:420px; object-fit:contain; position:relative; z-index:1; filter:drop-shadow(7px 9px 0 rgba(18,16,23,.85)); transform:rotate(2deg); }.burst { position:absolute; z-index:2; font-size:84px; color:var(--lime); line-height:1; text-shadow:2px 2px 0 var(--ink); }.burst-one { left:5%; top:10%; transform:rotate(-17deg); }.burst-two { color:var(--purple); font-size:56px; right:0; bottom:1%; }.scribble { position:absolute; border:3px solid var(--ink); border-radius:50%; width:54px; height:19px; right:17%; top:3%; transform:rotate(21deg); }.scribble:after { content:""; position:absolute; width:46px; height:14px; border:3px solid var(--ink); border-radius:50%; left:8px; top:9px; }.hero-sticker { position:absolute; z-index:3; right:1%; top:16%; background:var(--lime); border:2px solid var(--ink); border-radius:48% 52% 47% 53%; width:86px; height:86px; display:grid; place-content:center; text-align:center; font-size:12px; line-height:.8; transform:rotate(13deg); box-shadow:4px 4px 0 var(--ink); }.hero-sticker strong { font-weight:900; font-size:25px; }
.ticker { position:relative; z-index:3; margin-top:-20px; background:var(--lime); color:#000; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:rotate(-1deg) scale(1.02); white-space:nowrap; overflow:hidden; padding:13px 0 9px; font-weight:900; font-size:27px; letter-spacing:-.5px; }.ticker-track { display:flex; width:max-content; animation:marquee 22s linear infinite; }.ticker-set { display:block; flex:none; white-space:nowrap; }.ticker b { color:var(--pink); padding:0 16px; } @keyframes marquee { to { transform:translateX(-50%); } }
.games { padding:151px 0 126px; color:var(--bone); }.games h2 { text-shadow:1px 1px 0 var(--bone); }.section-heading { display:grid; grid-template-columns:1.1fr .9fr; column-gap:20px; margin-bottom:48px; }.section-heading .eyebrow { grid-column:1/-1; }.section-heading h2 { font-size:67px; }.section-sticker { align-self:end; margin:0 0 3px; max-width:290px; padding:17px 20px 15px; color:var(--ink); background:var(--bone); border:2px solid var(--bone); border-radius:5px 12px 7px 14px; line-height:1.28; font-size:15px; font-weight:900; transform:rotate(2deg); position:relative; }.section-sticker:before { content:""; position:absolute; top:-9px; left:25%; width:68px; height:17px; background:var(--pink); border:2px solid var(--ink); transform:rotate(-4deg); }.feature-game { width:min(100%,570px); border:2px solid var(--bone); background:var(--ink); }.game-image { min-height:0; position:relative; overflow:hidden; background:var(--ink); display:grid; place-items:center; }.game-poster-link { display:block; width:100%; line-height:0; }.game-poster-link:hover { transform:rotate(-.4deg) scale(1.012); }.game-poster-link:focus-visible { outline:4px solid var(--lime); outline-offset:5px; }.game-poster-link .game-poster { display:block; width:100%; height:auto; object-fit:contain; filter:saturate(1.1) contrast(1.04); }
.news { padding:0 0 126px; }.news>h2 { font-size:clamp(52px,6vw,82px); margin:0 0 43px; }.news>h2 i { color:var(--pink); }.news-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }.news-card { min-height:260px; padding:27px 29px; border:2px solid var(--bone); border-radius:8px 15px 5px 12px; color:var(--ink); transform:rotate(-.8deg); }.news-card:nth-child(even) { transform:rotate(.8deg); }.news-card:nth-child(3) { grid-row:span 2; }.news-card:nth-child(5) { grid-column:span 2; min-height:205px; }.news-card-pink { background:var(--pink); }.news-card-lime { background:var(--lime); }.news-card-purple { background:var(--purple); color:var(--bone); }.news-card-bone { background:var(--bone); }.news-card-dark { background:var(--ink); color:var(--bone); border-color:var(--pink); }.news-date { margin:0 0 11px; text-transform:uppercase; font-size:11px; font-weight:900; letter-spacing:1.4px; }.news-card h3 { margin:0 0 14px; font-size:31px; line-height:.98; text-transform:uppercase; letter-spacing:-1.4px; }.news-card strong { display:block; font-size:16px; line-height:1.22; margin-bottom:13px; }.news-card p { margin:0 0 12px; font-size:14px; line-height:1.35; font-weight:600; }.news-card-dark strong { color:var(--lime); }.news-card-dark>b { color:var(--pink); }
.manifesto { color:var(--bone); background-color:#09080d; background-image:radial-gradient(ellipse at 8% 90%,rgba(141,77,255,.38),transparent 37%),radial-gradient(ellipse at 94% 14%,rgba(255,61,167,.2),transparent 31%),radial-gradient(circle at 15% 23%,rgba(255,61,167,.46) 0 2px,transparent 3px),radial-gradient(circle at 82% 47%,rgba(200,240,75,.34) 0 2px,transparent 3px),repeating-linear-gradient(108deg,transparent 0 113px,rgba(141,77,255,.19) 114px 117px,transparent 118px 244px),repeating-linear-gradient(18deg,transparent 0 176px,rgba(255,61,167,.15) 177px 179px,transparent 180px 318px); background-size:auto,auto,121px 149px,163px 137px,100% 100%,100% 100%; padding:111px 0 105px; position:relative; overflow:hidden; }.manifesto:before { content:"✦   ✕    ✦    ♛"; position:absolute; right:6%; bottom:15%; color:rgba(141,77,255,.23); font-size:110px; letter-spacing:30px; transform:rotate(-12deg); pointer-events:none; }.manifesto-grid { display:grid; grid-template-columns:1.2fr .8fr; position:relative; }.light span { background:var(--lime); }.manifesto h2 { font-size:clamp(55px,7.15vw,100px); }.manifesto h2 i { color:var(--lime); }.manifesto-copy { max-width:380px; padding-top:52px; font-size:15px; font-weight:600; line-height:1.55; }.manifesto-copy p { margin:0 0 18px; }.light-link { color:var(--bone); display:inline-block; margin-top:14px; }.light-link span { color:var(--lime); }.manifesto-sticker { position:absolute; right:-115px; top:8px; width:142px; height:142px; background:var(--pink); border:3px solid var(--bone); border-radius:48% 52% 50% 47%; display:grid; place-content:center; text-align:center; color:#fff; line-height:.92; letter-spacing:.4px; transform:rotate(14deg); font-size:16px; font-weight:900; text-shadow:1px 1px 0 var(--ink); }.manifesto-sticker strong { color:#fff; font-weight:900; font-size:33px; letter-spacing:-1.5px; transform:translateY(5px); }
.contact { text-align:center; padding:132px 0 126px; position:relative; }.contact .eyebrow { margin-bottom:20px; }.contact h2 { font-size:clamp(63px,7vw,101px); text-shadow:1px 1px 0 var(--bone); }.contact>p:not(.eyebrow) { font-size:18px; max-width:470px; margin:29px auto 30px; line-height:1.35; }.contact-star { position:absolute; font-size:72px; color:var(--purple); left:8%; top:24%; transform:rotate(14deg); text-shadow:2px 2px var(--ink); }.footer { border-top:2px solid var(--bone); min-height:112px; display:flex; align-items:center; justify-content:space-between; }.footer p { font-size:12px; }.footer>a,.footer .wordmark { color:var(--bone); }.footer-mark { transform:rotate(-3deg) scale(.78); transform-origin:left center; }
@media (max-width:760px) { .shell { width:min(100% - 36px,520px); }.hero-banner img { min-height:0; height:415px; object-position:58% center; }.hero-banner-nav { display:none; }.hero-banner-link { left:7%; bottom:12%; width:42%; height:16%; }.nav { height:84px; }.nav nav,.nav-pill { display:none; }.hero { padding:45px 0 75px; grid-template-columns:1fr; }.hero-art { height:330px; margin-top:22px; }.hero-art img { max-height:310px; }.hero-sticker { right:4%; }.hero-text { font-size:16px; }.section-heading { grid-template-columns:1fr; }.section-heading h2 { font-size:58px; margin-bottom:21px; }.feature-game { grid-template-columns:1fr; }.game-image { min-height:270px; border-right:0; border-bottom:2px solid var(--ink); }.news-grid { grid-template-columns:1fr; }.news-card:nth-child(3),.news-card:nth-child(5) { grid-column:auto; grid-row:auto; }.news-card { min-height:0; }.manifesto { padding:77px 0; }.manifesto-grid { grid-template-columns:1fr; }.manifesto-copy { padding-top:30px; }.manifesto-sticker { right:3%; top:-43px; transform:rotate(14deg) scale(.78); }.contact { padding:100px 0 89px; }.contact-star { left:5%; top:13%; }.footer { padding:20px 0; flex-wrap:wrap; gap:12px; }.footer p { order:3; width:100%; margin:0; } }

.policy-page { background:var(--bone); }.policy-header { min-height:116px; display:flex; justify-content:space-between; align-items:center; border-bottom:2px solid var(--ink); }.policy { max-width:850px; padding:84px 0 110px; }.policy h1 { font-size:clamp(64px,9vw,118px); margin-bottom:29px; }.policy-dates { display:inline-block; margin:0 0 58px; background:var(--lime); border:2px solid var(--ink); box-shadow:4px 4px 0 var(--purple); padding:12px 17px 10px; font-weight:900; line-height:1.35; transform:rotate(-1deg); }.policy-copy { max-width:760px; font-size:17px; line-height:1.56; }.policy-copy h2 { font-size:29px; line-height:1; letter-spacing:-.04em; margin:50px 0 14px; transform:none; }.policy-copy p { margin:0 0 16px; }.policy-copy ul { margin:0 0 16px; padding-left:25px; }.policy-copy li::marker { color:var(--pink); }.policy-copy address { font-style:normal; background:var(--ink); color:var(--bone); border:2px solid var(--ink); box-shadow:5px 5px 0 var(--pink); padding:22px; line-height:1.65; }.policy-copy address a { color:var(--lime); }.policy-footer { background:var(--ink); color:var(--bone); padding:27px max(28px,calc((100% - 1150px)/2)); display:flex; justify-content:space-between; gap:20px; }.policy-footer strong { color:var(--pink); }.policy-footer span { font-size:14px; }
@media (max-width:760px) { .policy-header { min-height:85px; }.policy-header .button { font-size:11px; gap:8px; padding:10px; }.policy { padding:56px 0 80px; }.policy-copy { font-size:16px; }.policy-copy h2 { font-size:26px; margin-top:42px; }.policy-footer { flex-direction:column; gap:5px; } }

.game-page-hero { position:relative; line-height:0; background:var(--ink); border-bottom:3px solid var(--ink); padding:0; }.game-page-hero img { display:block; width:100%; height:auto; min-height:0; max-height:none; object-fit:contain; margin:0 auto; }.hero-play-link { position:absolute; z-index:2; left:3.4%; top:71.5%; width:44%; height:14.2%; opacity:0; }.hero-play-link:focus-visible { opacity:1; outline:4px solid var(--lime); outline-offset:-4px; background:rgba(255,61,167,.6); color:var(--bone); line-height:1; padding:12px; }.game-rules { background:var(--ink); color:var(--bone); padding:105px 0; }.rule-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.rule-grid article { min-height:295px; padding:25px; background:var(--purple); border:2px solid var(--bone); box-shadow:5px 5px 0 var(--pink); transform:rotate(-1deg); }.rule-grid article:nth-child(2) { background:var(--pink); transform:rotate(1deg); }.rule-grid article:nth-child(3) { background:var(--lime); color:var(--ink); transform:rotate(-.5deg); }.rule-grid span { font-weight:900; font-size:13px; }.rule-grid h2 { font-size:46px; margin:42px 0 15px; }.rule-grid h2 i { color:var(--lime); }.rule-grid article:nth-child(2) h2 i { color:var(--bone); }.rule-grid article:nth-child(3) h2 i { color:var(--purple); }.rule-grid p { line-height:1.35; }.game-page-cta { padding:110px 0; }.game-page-cta h2 { font-size:clamp(60px,8vw,105px); margin:0 0 20px; }.game-page-cta h2 i { color:var(--purple); }.game-build-note { max-width:400px; font-size:17px; line-height:1.4; margin:0 0 27px; }
/* Keep the game artwork punchy without overwhelming the studio site. */
.game-page-hero { padding:0; height:auto; overflow:hidden; display:block; }
.game-page-hero img { width:min(1370px,90vw); height:auto; object-fit:contain; object-position:center; margin:0 auto; }
@media (max-width:760px) { .rule-grid { grid-template-columns:1fr; }.rule-grid article { min-height:0; }.game-rules { padding:75px 0; }.game-page-cta { padding:75px 0; } }

/* Phone-first polish: keep the loud art, but make every route easy to read and tap. */
.mobile-site-nav { display:none; }
@media (max-width:760px) {
  .mobile-site-nav { display:flex; gap:0; overflow-x:auto; overscroll-behavior-x:contain; white-space:nowrap; background:var(--ink); border-bottom:2px solid var(--lime); -webkit-overflow-scrolling:touch; }
  .mobile-site-nav a { flex:0 0 auto; color:var(--bone); text-decoration:none; font-size:12px; font-weight:900; padding:13px 15px 11px; text-transform:uppercase; letter-spacing:.04em; }
  .mobile-site-nav a:focus-visible,.mobile-site-nav a:hover { background:var(--pink); color:var(--ink); outline:none; }
  .hero-banner img { height:clamp(280px,76vw,415px); object-position:57% center; }
  .ticker { margin-top:-10px; padding:10px 0 8px; font-size:19px; }
  .games { padding:82px 0 76px; }
  .section-heading { margin-bottom:30px; }
  .section-heading h2 { font-size:clamp(48px,14vw,58px); }
  .section-sticker { max-width:100%; font-size:14px; }
  .feature-game { width:100%; }
  .news { padding-bottom:78px; }
  .news>h2 { font-size:clamp(48px,14vw,64px); margin-bottom:31px; }
  .news-card { padding:24px 22px; }
  .news-card h3 { font-size:29px; }
  .manifesto { padding:76px 0 70px; }
  .manifesto h2 { font-size:clamp(49px,15vw,70px); }
  .manifesto-copy { max-width:none; font-size:15px; padding-top:34px; }
  .manifesto-sticker { right:-7px; top:-50px; }
  .contact { padding:82px 0 75px; }
  .contact h2 { font-size:clamp(49px,15vw,70px); }
  .contact>p:not(.eyebrow) { font-size:16px; }
  .game-page-hero { border-bottom-width:2px; }
  .game-page-hero img { width:100%; max-width:none; }
  .hero-play-link { left:3%; width:46%; min-height:48px; }
  .game-rules { padding:65px 0; }
  .rule-grid { gap:18px; }
  .rule-grid article { min-height:0; padding:24px 22px; }
  .rule-grid h2 { font-size:42px; margin:31px 0 13px; }
  .game-page-cta { padding:72px 0; }
  .game-page-cta h2 { font-size:clamp(52px,15vw,76px); }
}
@media (max-width:390px) {
  .shell { width:calc(100% - 28px); }
  .mobile-site-nav a { padding-inline:12px; font-size:11px; }
  .hero-banner img { height:280px; }
  .manifesto-sticker { transform:rotate(14deg) scale(.67); right:-16px; top:-58px; }
  .policy-dates { font-size:13px; }
  .policy-copy { font-size:15px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.ticker-track { animation:none; } }
