:root{color-scheme:dark;--bg:#07090d;--panel:#12161d;--muted:#a2aab5;--gold:#f0c77b;--border:#ffffff22;--white:#f8f8fa}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--white);font:15px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif;min-width:320px}
button,a{font:inherit}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer}
.skip{position:absolute;top:-100px;left:12px;background:#fff;color:#000;padding:12px;z-index:50}.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.topbar{height:70px;position:relative;z-index:2;border-bottom:1px solid #ffffff18;background:#080a0edf;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 30px;gap:18px}
.brand{width:max-content;font-size:42px;line-height:1;font-weight:1000;letter-spacing:-.13em;font-style:italic;text-shadow:0 2px 2px #000;white-space:nowrap}.brand span{display:block}.brand-i{color:var(--gold);display:inline!important}
.top-entry{display:flex;align-items:center;justify-content:center;gap:18px;border:2px solid #ffdf93;border-radius:14px;background:linear-gradient(180deg,#2c2514,#0b0b0b);box-shadow:0 0 12px #e8b86180,inset 0 0 14px #d5a85030;min-width:326px;height:52px;padding:0 20px;font-size:17px;font-weight:900;letter-spacing:.08em;white-space:nowrap;transition:transform .2s,box-shadow .2s}
.top-entry span:first-child{font-size:29px;line-height:1;font-weight:300}.top-entry span:last-child{font-size:27px;font-weight:300}
.top-entry:hover,.play-button:hover{box-shadow:0 0 20px #edba63a0,inset 0 0 20px #c6a25455;transform:translateY(-2px)}
.top-tools{display:flex;align-items:center;justify-self:end;gap:18px}.top-tools button{background:none;border:0}.top-tools #language{font-size:14px;color:#d4d5d7;letter-spacing:.06em;padding:10px 3px}.profile{width:43px;height:43px;border:1.5px solid #ddd!important;border-radius:50%;font-size:23px;display:grid;place-items:center;color:#aaa}
.launcher{width:100%;min-height:610px;display:grid;grid-template-columns:minmax(216px,20.5%) minmax(0,1fr) minmax(230px,18.2%);gap:12px;padding:13px 14px 14px;align-items:stretch}
.game-column,.app-column{display:flex;flex-direction:column;min-width:0;border:1px solid #ffffff20;border-radius:11px;background:linear-gradient(130deg,#151922,#090c12);overflow:hidden;padding:9px}
.column-title{height:40px;display:flex;align-items:center;gap:13px;margin:0 7px 7px;font-size:21px;font-weight:850;letter-spacing:.055em}.column-title>span:first-child{font-size:27px;color:#e8e9ee}
.tiles{display:grid;grid-template-rows:repeat(3,minmax(175px,1fr));gap:12px;min-height:0;flex:1}
.tile{position:relative;min-height:0;display:block;isolation:isolate;border-radius:8px;overflow:hidden;border:1px solid #eeeeee22;background-color:#18202b;transition:transform .18s,border-color .18s,filter .18s;text-align:left;width:100%;padding:0}
.tile:focus-visible,.tile:hover{border-color:#ffdb91;transform:translateY(-2px);filter:brightness(1.12)}
.tile::before{content:"";position:absolute;inset:0;z-index:-2;background-image:url('/assets/hub-concept.webp');background-repeat:no-repeat;background-size:550% 425%}
.tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,#0000 30%,#03050936 49%,#030509f0 74%,#030509 100%)}
.tile.flock::before{background-position:0% 20%}
.tile.zombie::before{background-position:0% 54%}
.tile.race::before{background-position:0% 89%}
.tile.music::before{background-position:100% 20%}
.tile.editor::before{background-position:100% 54%}
.tile.more::before{background-position:100% 89%}
.tile-bottom{position:absolute;left:15px;right:11px;bottom:14px;display:flex;flex-direction:column;gap:3px;z-index:1}
.tile-bottom strong{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;font-stretch:condensed;font-size:clamp(17px,1.6vw,28px);line-height:1.02;letter-spacing:.03em;text-shadow:0 2px 8px #000}
.tile-bottom small{font-size:9px;font-weight:800;letter-spacing:.13em;color:var(--gold);opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}
.tile:is(:hover,:focus-visible) .tile-bottom small{opacity:1;transform:none}
.app-icon{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:56px;height:56px;border-radius:50%;border:1px solid #ffffff9a;background:#11192877;backdrop-filter:blur(3px);font-size:34px;box-shadow:0 4px 24px #0008}
.featured{position:relative;min-width:0;border:1px solid #ffffff20;overflow:hidden;isolation:isolate;background:#15202b;min-height:600px}
.feature-art{position:absolute;inset:0;background-image:url('/assets/hub-concept.webp');background-size:auto 108%;background-position:center bottom;background-repeat:no-repeat;z-index:-3;filter:saturate(.94)}
.featured::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(to bottom,#00000000 0%,#02050b05 43%,#02050ba6 59%,#02050b 73%,#02050b 100%)}
.featured::after{content:"";position:absolute;inset:0;z-index:-1;box-shadow:inset 0 0 85px #0009;pointer-events:none}
.feature-copy{position:absolute;left:6%;right:5%;bottom:7%;display:flex;flex-direction:column;align-items:flex-start}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:850;letter-spacing:.19em;color:#ffdb91}.live-dot{width:7px;height:7px;display:inline-block;border-radius:50%;background:#ffd77f;box-shadow:0 0 12px #f3b862}
.feature-copy h1{font-weight:1000;font-size:clamp(52px,5.6vw,100px);line-height:.98;letter-spacing:-.065em;margin:12px 0 3px;text-shadow:0 3px 20px #000}
.feature-copy p{font-size:clamp(11px,1.3vw,20px);font-weight:850;letter-spacing:.23em;margin:2px 0 20px;text-shadow:0 2px 12px #000}
.play-button{display:flex;gap:17px;align-items:center;justify-content:space-between;min-width:min(370px,100%);height:64px;border:2px solid #ffe09b;border-radius:13px;background:linear-gradient(120deg,#89601dab,#171108ea);box-shadow:0 0 18px #ffc75a70,inset 0 0 15px #ffcd5455;font-weight:950;letter-spacing:.055em;padding:0 21px;transition:transform .2s,box-shadow .2s;text-align:center}
.play-icon{font-size:15px;color:#291a04;border-radius:50%;background:#ffdf94;width:35px;height:35px;display:grid;place-items:center;flex-shrink:0}.chevron{font-size:29px;font-weight:300}.status-badge{position:absolute;right:22px;top:18px;font-size:9px;font-weight:850;letter-spacing:.15em;color:#e8f2de;background:#101c20a1;padding:8px 12px;border:1px solid #ffffff35;border-radius:100px;display:flex;align-items:center;gap:8px}
.footer-bar{min-height:36px;padding:4px 18px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.12em;color:#929ba8}
.footer-bar a{color:#d1b88a}.footer-bar a:hover{text-decoration:underline}
dialog{border:1px solid #f1c98188;border-radius:14px;color:#fff;background:linear-gradient(130deg,#1b202a,#08090d);box-shadow:0 30px 100px #000b;max-width:min(470px,calc(100% - 36px));padding:0}dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}.dialog-inner{padding:38px;position:relative}.dialog-inner h2{font-size:34px;line-height:1;margin:20px 0 10px;letter-spacing:-.05em}.dialog-inner p{color:#c7ccd4}.dialog-close{position:absolute;right:15px;top:10px;border:0;background:none;font-size:28px}.dialog-contact{display:inline-block;color:#f2d394;margin-top:15px;text-decoration:underline}
@media (min-width:1000px){.launcher{height:calc(100vh - 108px);max-height:980px}.featured{min-height:0}}
@media (max-width:1050px){.launcher{grid-template-columns:23% minmax(0,1fr) 23%}.top-entry{min-width:260px;font-size:13px}.column-title{font-size:17px}.tile-bottom{left:10px}.feature-copy h1{font-size:clamp(48px,6vw,70px)}.app-icon{width:43px;height:43px;font-size:26px}}
@media (max-width:740px){
  .topbar{height:65px;padding:0 13px;grid-template-columns:auto 1fr auto;gap:10px}.brand{font-size:34px}.top-entry{min-width:0;width:100%;padding:0 9px;height:42px;font-size:10px;gap:5px;border-radius:9px}.top-entry span:first-child{font-size:19px}.top-entry span:last-child{font-size:20px}.top-tools{gap:4px}.top-tools #language{font-size:11px}.profile{display:none!important}
  .launcher{display:flex;flex-direction:column;gap:14px;padding:0 10px 22px}.featured{order:0;min-height:540px;border-radius:0 0 12px 12px}.feature-art{background-size:auto 102%;background-position:center bottom}.featured::before{background:linear-gradient(to bottom,#07090d22 0%,#07090d05 35%,#07090dbb 65%,#07090d 100%)}.feature-copy{left:20px;right:20px;bottom:32px}.feature-copy h1{font-size:clamp(42px,11vw,75px)}.feature-copy p{letter-spacing:.16em;font-size:12px}.play-button{height:54px;font-size:12px;min-width:100%;gap:8px}.status-badge{right:10px;top:12px;font-size:8px}
  .game-column{order:1}.app-column{order:2}.game-column,.app-column{background:none;border:0;padding:0;overflow:visible}.column-title{height:auto;margin:6px 7px 12px;font-size:21px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:10px}.tile{min-height:190px;aspect-ratio:1.05}.tile-bottom strong{font-size:21px}.tile-bottom small{opacity:1;transform:none}.tile.more{min-height:190px}.footer-bar{flex-wrap:wrap;justify-content:center;text-align:center;padding:16px 10px 24px}
}
@media (max-width:380px){.top-entry{font-size:9px}.top-tools #language{font-size:10px}.tile{min-height:160px}.tile-bottom strong{font-size:18px}.app-icon{top:38%}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
