/* Revolving identity 04: three colored tiles, small .com and gaming signature. */
.revolving-logo{display:inline-flex;flex-direction:column;align-items:flex-start;gap:7px;color:#fff;text-decoration:none;white-space:nowrap;font-family:Arial,Helvetica,sans-serif}
.revolving-word{font-size:32px;font-weight:800;letter-spacing:-1.4px;line-height:1.1;color:#fff}
.revolving-dots{display:inline-flex;gap:3px;margin-inline:3px;vertical-align:baseline}
.revolving-dots i{display:block;width:6px;height:6px;background:#c4fa72;border-radius:2px}
.revolving-dots i:nth-child(2){background:#56c8f2}.revolving-dots i:nth-child(3){background:#ff8275}
.revolving-com{font-size:.48em;letter-spacing:-.4px}
.revolving-tag{font-size:8px;letter-spacing:2px;font-weight:700;line-height:1.2;color:#b6c5e8}
footer .revolving-word{font-size:24px}footer .revolving-tag{font-size:7px;letter-spacing:1.4px}
footer .footer-brand-line{display:flex;align-items:center;flex-wrap:nowrap;gap:18px;max-width:100%}
footer .holding-endorsement{white-space:nowrap;flex-wrap:nowrap;gap:10px}
footer .holding-horizontal{font-size:14px;letter-spacing:.6px}
footer .holding-horizontal i{width:15px;height:15px;background-size:auto 15px;flex-shrink:0}
@media(max-width:600px){
 header .revolving-word{font-size:27px}header .revolving-tag{font-size:7px;letter-spacing:1.5px}
 footer .footer-brand-line{gap:10px}footer .footer-brand-line .revolving-word{font-size:clamp(13px,3.7vw,22px)}
 footer .footer-brand-line .revolving-tag{font-size:5px;letter-spacing:.6px}
 footer .footer-brand-line .revolving-dots{gap:2px;margin-inline:2px}footer .footer-brand-line .revolving-dots i{width:3px;height:3px;border-radius:1px}
 footer .holding-endorsement{gap:6px}footer .holding-endorsement>span:first-child{font-size:9px}
 footer .holding-horizontal{font-size:clamp(9px,2.5vw,13px);gap:4px;letter-spacing:0}
 footer .holding-horizontal i{width:12px;height:12px;background-size:auto 12px}
}

/* Center the parent endorsement independently of either side. */
footer:has(.footer-parent){display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
footer .footer-parent{justify-self:center}footer:has(.footer-parent)>small{justify-self:end;text-align:right}
@media(max-width:1000px){footer:has(.footer-parent){grid-template-columns:1fr;justify-items:center;gap:20px}footer:has(.footer-parent)>small{justify-self:center;text-align:center}footer:has(.footer-parent) .footer-brand-line{justify-self:center}}

/* Compact desktop homepage: one centered invitation to play. */
@media(min-width:851px){
 body[data-page="index"]>header{max-width:1120px;height:86px;padding:14px 32px}
 body[data-page="index"]>main{max-width:1120px;padding:18px 32px 32px}
 body[data-page="index"] .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;min-height:0;max-width:1056px;margin:0 auto 30px;padding:36px 42px;border:1px solid #29334f;border-radius:28px;background:radial-gradient(ellipse at 85% 50%,#7655bf1f,transparent 65%),linear-gradient(125deg,#151d36,#10162c);align-items:center}
 body[data-page="index"] .hero>div:first-child{min-width:0}
 body[data-page="index"] .hero .eyebrow{font-size:10px;letter-spacing:1.8px}
 body[data-page="index"] .hero h1{font-size:clamp(54px,5.2vw,74px);letter-spacing:-3.5px;line-height:1;margin:18px 0}
 body[data-page="index"] .hero p{max-width:340px;font-size:14px;line-height:1.65;margin:14px 0}
 body[data-page="index"] .hero .cta{min-height:54px;margin-top:10px;padding:14px 22px;gap:34px;font-size:15px;border-radius:12px}
 body[data-page="index"] .hero .micro{font-size:10px!important;line-height:1.5;margin:16px 0 0}
 body[data-page="index"] .hero .art{width:100%;max-width:420px;justify-self:center;padding:12px 8px 18px;transform:rotate(-4deg)}
 body[data-page="index"] .hero .tile-board{padding:13px;gap:6px;border-radius:22px;box-shadow:0 16px 35px #0004}
 body[data-page="index"] .hero .sticker{bottom:0;right:-4px;padding:10px 16px;font-size:16px;border-radius:10px;box-shadow:0 4px 0 #a57b2c;transform:rotate(7deg)}
 body[data-page="index"] .section-title{margin:16px 0}
 body[data-page="index"] .section-title h2{font-size:22px}
}

/* A self-contained game card: ambient tiles and its own live ranking. */
body[data-page="index"] .hero{position:relative;isolation:isolate;overflow:hidden}
body[data-page="index"] .hero>.hero-blocks{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
.ambient-piece{position:absolute;display:grid;grid-template-columns:repeat(2,25px);gap:4px;opacity:.075;transform:rotate(var(--tilt));animation:ambient-drift var(--duration,18s) ease-in-out infinite alternate}
.ambient-piece i{height:25px;border:1px solid #ffffff99;border-radius:6px;background:var(--tint,#ac91fb);box-shadow:inset 0 3px #fff3}
.ambient-piece.piece-0{left:5%;top:9%;--tilt:12deg;--duration:22s}
.ambient-piece.piece-1{left:42%;top:18%;--tilt:-18deg;--duration:19s;--tint:#51d4ba}
.ambient-piece.piece-2{left:83%;top:6%;--tilt:22deg;--duration:24s;--tint:#ffd35b}
.ambient-piece.piece-3{left:17%;top:61%;--tilt:-9deg;--duration:17s;--tint:#ff8275}
.ambient-piece.piece-4{left:53%;top:52%;--tilt:15deg;--duration:23s}
.ambient-piece.piece-5{left:90%;top:72%;--tilt:-20deg;--duration:20s;--tint:#51d4ba}
.ambient-piece:nth-child(2n) i:nth-child(2){visibility:hidden}
@keyframes ambient-drift{from{transform:translate3d(0,12px,0) rotate(var(--tilt))}to{transform:translate3d(18px,-34px,0) rotate(calc(var(--tilt) + 18deg))}}
body[data-page="index"] .hero .hero-live-rank{grid-column:1/-1;min-width:0;margin:0;padding:20px 0 0;border:0;border-top:1px solid #35415e;border-radius:0;background:transparent;box-shadow:none}
.hero .hero-live-rank .world-rank-top{gap:12px;align-items:center}
.hero .hero-live-rank .world-rank-top>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hero .hero-live-rank h2{font-size:15px;letter-spacing:-.2px;margin:0}
.hero .hero-live-rank .world-rank-top p{display:none}
.hero .hero-live-rank .rank-kind{font-size:9px;padding:5px 8px;background:#c4fa7212;border-color:#c4fa7240;letter-spacing:.6px}
.hero .hero-live-rank .rank-mode-label{font-size:0;gap:0}
.hero .hero-live-rank .rank-mode-label select{font-size:11px;padding:7px 9px;min-height:36px;border-color:#3c4e70;background:#182642;border-radius:9px}
.hero .hero-live-rank .home-ranks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0 10px;min-height:0}
.hero .hero-live-rank .home-ranks:empty{display:none}
.hero .hero-live-rank .home-ranks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:6px;padding:11px 10px;border:1px solid #35415e;border-radius:12px;background:#142039bb}
.hero .hero-live-rank .home-ranks .rank-place{grid-column:1;grid-row:1;font-size:10px}
.hero .hero-live-rank .home-ranks .rank-name{grid-column:2;grid-row:1;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hero .hero-live-rank .home-ranks strong{grid-column:2;grid-row:2;font-size:18px}
.hero .hero-live-rank .home-ranks small{display:none}
.hero .hero-live-rank .home-ranks[data-demo="true"] small{display:block;grid-column:1/-1;grid-row:3;justify-self:start;font-size:8px}
.hero .hero-live-rank .world-rank-bottom p{font-size:10px;line-height:1.5;margin:0;max-width:none;color:#aabbd5}
.hero .hero-live-rank .world-rank-bottom .cta{display:none}
@media(min-width:851px){body[data-page="index"] .hero{gap:20px 36px;padding:28px 36px}body[data-page="index"] .hero .art{max-width:350px}body[data-page="index"] .hero h1{font-size:clamp(54px,5vw,68px)}}
@media(max-width:850px){body[data-page="index"] .hero{border:1px solid #29334f;border-radius:22px;background:#11182f;padding:24px 18px;grid-template-columns:1fr;gap:16px}.hero .hero-live-rank .home-ranks{grid-template-columns:repeat(2,minmax(0,1fr))}.hero .hero-live-rank .world-rank-top{align-items:flex-start}.hero .hero-live-rank h2{font-size:14px}.hero .hero-live-rank .rank-name{font-size:12px}}
@media(prefers-reduced-motion:reduce){.ambient-piece{animation:none}}

/* Language selection belongs in the menu and the homepage footer. */
body[data-page="index"] header .current-language{display:none}
.footer-languages{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 12px;flex-basis:100%;grid-column:1/-1;width:100%;padding-top:16px;border-top:1px solid #2b3351;font:12px/1.5 Arial,sans-serif}
.footer-languages a{padding:6px 8px;border-radius:8px;color:#b6c5e8;text-decoration:none}
.footer-languages a:hover,.footer-languages a[aria-current="true"]{background:#243451;color:#c4fa72}
.footer-languages a:focus-visible{outline:2px solid #c4fa72;outline-offset:2px}

/* Mobile invitation: centered copy and a larger, vivid coral play button. */
@media(max-width:850px){
 body[data-page="index"] .hero>.hero-blocks+div{text-align:center;min-width:0;width:100%}
 body[data-page="index"] .hero>.hero-blocks+div .eyebrow{color:#ffd35b}
 body[data-page="index"] .hero>.hero-blocks+div h1{font-size:clamp(44px,13vw,72px);letter-spacing:-2.5px;line-height:1.02;margin:18px 0 22px}
 body[data-page="index"] .hero>.hero-blocks+div p{margin-inline:auto;max-width:360px}
 body[data-page="index"] .hero>.hero-blocks+div .cta{display:flex;width:100%;max-width:340px;min-height:66px;margin:28px auto 0;padding:18px 24px;justify-content:center;gap:20px;font-size:20px;color:#10162c;background:linear-gradient(120deg,#ffb452,#ff756c);border:1px solid #ffc38c;border-radius:18px;box-shadow:0 6px 0 #b84453,0 10px 26px #ff756c24}
 body[data-page="index"] .hero>.hero-blocks+div .cta:hover{background:linear-gradient(120deg,#ffc46b,#ff8b80)}
 body[data-page="index"] .hero>.hero-blocks+div .cta:active{transform:translateY(3px);box-shadow:0 3px 0 #b84453}
 body[data-page="index"] .hero>.hero-blocks+div .micro{margin-top:22px;line-height:1.6}
}

/* Keep the shared language bar on its own row on every page. */
footer:has(.footer-languages){flex-wrap:wrap}