/* Ásó, kapa, milliárd — launch oldal */
body.launch{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
main{flex:1}
.wrap{width:min(560px,100% - 40px);margin:0 auto}

.hero{position:relative;padding:calc(30px + env(safe-area-inset-top)) 0 30px;
  background:radial-gradient(110% 55% at 100% 0,#EFE7D2 0,transparent 62%),
    repeating-radial-gradient(ellipse 140% 90% at -10% 110%,transparent 0 46px,rgba(186,163,118,.13) 46px 47.5px),var(--ivory)}
.hero h1{font-size:clamp(46px,14.5vw,84px);line-height:.96;margin-top:10px;color:var(--ink)}
.hero h1 em{font-style:normal;color:var(--gold);display:block}
.by{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-size:13.5px;color:var(--ink3);text-decoration:none}
.by img{height:24px;width:auto;display:block}
.scene{display:block;width:calc(100% + 40px);margin:8px -20px 0;height:auto;max-height:230px}
.scene .shovel{transform:translate(112px,58px) rotate(18deg);transform-origin:0 86px;animation:lean 3.2s ease-in-out infinite}
@keyframes lean{0%,100%{transform:translate(112px,58px) rotate(18deg)}50%{transform:translate(112px,58px) rotate(14deg)}}
.scene .note{animation:float 2.6s ease-in-out infinite}
.scene .n2{animation-delay:-.9s}.scene .n3{animation-delay:-1.7s}
@keyframes float{50%{transform:translateY(-7px)}}
.lede{font-size:17px;color:var(--ink2);margin-top:10px;max-width:34em}
.lede b{color:var(--ink)}
.actions{margin-top:18px;display:grid;gap:10px}
.ioshint{font-size:13px;color:var(--ink3);text-align:center}
.career{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
.career span{font-size:12.5px;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--ink2)}
.career span b{color:var(--ink)}
.career span.rank{background:#FBF4E3;border-color:var(--gold);color:#7A5A1C;font-weight:700}

.rise{animation:rise .7s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--i) * 80ms)}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}

.band{padding:44px 0}
.band.alt{background:var(--sandw);border-block:1px solid var(--line)}
.band h2{font-size:clamp(25px,7vw,34px);line-height:1.08;margin-top:8px;color:var(--ink)}
.band h2.h2b{margin-top:38px}
.band h2 .count{font-family:var(--sans);font-size:14px;font-weight:700;color:var(--ink3);margin-left:6px;white-space:nowrap}
.sub{color:var(--ink2);margin-top:8px;font-size:15px}

.steps{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.steps li{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px}
.steps b{font-size:38px;line-height:1;color:var(--moss);text-align:center}
.steps h3{font-size:16.5px;font-weight:700}
.steps p{font-size:14.5px;color:var(--ink2);margin-top:3px}

.cast{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}
.cast li{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:20px;padding:13px 16px}
.cast .tk{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;font-family:var(--slab);font-size:20px;border:3px solid #fff;box-shadow:0 0 0 1px var(--line)}
.cast h3{font-size:16px;font-weight:700}
.cast p{font-size:14px;color:var(--ink2);margin-top:1px}

.album{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:9px}
.album li{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 8px 10px;text-align:center;min-height:104px;display:flex;flex-direction:column;align-items:center;gap:5px}
.album .em{font-size:30px;line-height:1.1}
.album .nm{font-size:11.5px;font-weight:700;line-height:1.2;color:var(--ink)}
.album .tx{font-size:10.5px;line-height:1.25;color:var(--ink3)}
.album .x{position:absolute;top:6px;right:8px;font-size:10px;font-weight:700;color:var(--ink3)}
.album li.locked{background:transparent;border-style:dashed}
.album li.locked .em{filter:grayscale(1);opacity:.22}
.album li.locked .nm{color:var(--ink3);font-weight:500}
.album li.r3:not(.locked){border-color:var(--gold);background:#FBF4E3}
.badgelist{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:8px}
.badgelist li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:center;padding:11px 14px;border-radius:14px;border:1px dashed var(--line);color:var(--ink3);font-size:13.5px}
.badgelist li b{display:block;font-size:14.5px;color:var(--ink3)}
.badgelist li .mk{width:28px;height:28px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center}
.badgelist li.got{border:1px solid var(--gold);background:#FBF4E3;color:#6b5527}
.badgelist li.got b{color:var(--ink)}
.badgelist li.got .mk{border-color:var(--gold);background:var(--gold3)}
.badgelist li.got .mk::after{content:"";width:9px;height:5px;border-left:2.4px solid #5A4212;border-bottom:2.4px solid #5A4212;transform:rotate(-45deg) translate(1px,-1px)}

.facts{display:grid;gap:10px;margin-top:20px}
.facts>div{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px}
.facts b{display:block;font-size:20px;color:var(--ink)}
.facts span{display:block;font-size:14px;color:var(--ink2);margin-top:3px}
.note{font-size:13.5px;color:var(--ink2);margin-top:16px}
.src{font-size:13px;color:var(--ink3);margin-top:10px}
.satire{font-size:13.5px;color:var(--ink2);margin-top:16px;padding:12px 14px;border-left:3px solid var(--ochre);background:#fff;border-radius:0 12px 12px 0}
.cta.wide{margin-top:24px}

@media (min-width:760px){
  .wrap{width:min(880px,100% - 64px)}
  .hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;column-gap:40px;align-items:center}
  .hero .wrap>*{grid-column:1}
  .hero .scene{grid-column:2;grid-row:1 / span 6;width:100%;margin:0;max-height:none}
  .hero{padding:64px 0 56px}
  .steps{grid-template-columns:repeat(3,1fr)}
  .steps li{grid-template-columns:1fr}
  .steps b{text-align:left}
  .cast{grid-template-columns:repeat(2,1fr)}
  .facts{grid-template-columns:repeat(3,1fr)}
  .badgelist{grid-template-columns:repeat(2,1fr)}
  .actions{max-width:380px}
  .cta.wide{max-width:380px}
}
