/* =================================================================
   fortpad home — a real launchpad dashboard, Fortnite-flavored
================================================================= */

/* ---------- live activity ticker ---------- */
.ticker-strip{position:relative;z-index:5;overflow:hidden;background:#050a28;border-bottom:1px solid var(--line);height:34px}
.ticker-track{display:flex;align-items:center;gap:36px;height:100%;width:max-content;white-space:nowrap;animation:tickerMove 34s linear infinite}
.ticker-strip:hover .ticker-track{animation-play-state:paused}
@keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk-item{display:inline-flex;align-items:center;gap:7px;font:600 12.5px/1 Inter;color:#aebbe8}
.tk-item b{color:#fff;font-weight:700}
.tk-item .vb{width:13px;height:13px}
.tk-dot{width:5px;height:5px;border-radius:50%;background:var(--y);flex-shrink:0}
.tk-empty{padding-left:20px;font:600 12.5px/1 Inter;color:#7a86bb}

/* ---------- hero ---------- */
.fh{position:relative;overflow:hidden;padding:44px 0 60px}
.fh-bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(720px 500px at 74% 40%,rgba(120,190,255,.46),transparent 70%),
    radial-gradient(920px 620px at 18% -4%,rgba(66,114,255,.55),transparent 70%),
    linear-gradient(180deg,#2452e0 0%,#173bbc 42%,#102a8c 78%,rgba(7,16,58,0) 100%)}
.fh-bg::before{content:"";position:absolute;inset:-20% -10% 0;
  background:repeating-conic-gradient(from 200deg at 74% 38%,rgba(255,255,255,.06) 0 4deg,transparent 4deg 13deg);
  mask-image:radial-gradient(closest-side at 74% 40%,#000 0%,transparent 100%);-webkit-mask-image:radial-gradient(closest-side at 74% 40%,#000 0%,transparent 100%)}
.fh-bg::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(180deg,rgba(7,16,58,0),var(--bg))}
.fh-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:44px;align-items:start;padding-top:8px}
.fh-live{display:inline-flex;align-items:center;gap:8px;font:600 12.5px/1 Inter;letter-spacing:.3px;color:#fff;background:rgba(7,16,58,.45);border:1px solid rgba(255,255,255,.18);padding:7px 12px}
.fh-live i{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.25);animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.35}}
.fh h1{font-family:var(--cond);font-weight:400;text-transform:uppercase;font-size:clamp(44px,5.6vw,80px);line-height:.94;letter-spacing:.5px;margin:16px 0 16px;color:#fff;
  text-shadow:0 4px 0 rgba(4,10,50,.35)}
.fh h1 em{font-style:normal;color:var(--y)}
.fh p{color:#d4ddff;font-size:16px;max-width:480px}
.fh-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

/* hero stat cards */
.stats-row{display:flex;gap:10px;margin-top:30px;flex-wrap:wrap}
.stat-card{display:flex;flex-direction:column;gap:4px;padding:14px 18px;background:rgba(10,20,64,.55);border:1px solid rgba(255,255,255,.15);border-radius:8px;min-width:132px;
  box-shadow:0 12px 26px -10px rgba(3,8,36,.55)}
.stat-n{font:400 26px/1 var(--cond);color:#fff;letter-spacing:.4px}
.stat-l{font:600 11px/1 Inter;letter-spacing:.6px;text-transform:uppercase;color:#9fb3f0}

/* ---------- live launch terminal (hero right panel) ---------- */
.term{position:relative;background:rgba(8,16,52,.74);border:1px solid rgba(255,255,255,.16);border-radius:12px;backdrop-filter:blur(8px);
  box-shadow:0 26px 60px -14px rgba(3,8,36,.65),0 1px 0 rgba(255,255,255,.06) inset}
.term::before{content:"";position:absolute;inset:12px -12px -12px 12px;z-index:-1;border-radius:12px;
  background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08)}
.term-head{border-radius:12px 12px 0 0}
.shop-pulse{border-radius:0 0 12px 12px;overflow:hidden}
.term-head{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
.term-dot{width:8px;height:8px;border-radius:50%;background:#ff4d4d;box-shadow:0 0 0 3px rgba(255,77,77,.22);animation:pulse 1.4s infinite}
.term-title{font:700 12.5px/1 Inter;letter-spacing:.6px;text-transform:uppercase;color:#fff}
.term-more{margin-left:auto;font:600 12px/1 Inter;color:var(--y)}
.term-more:hover{text-decoration:underline}
.term-list{display:flex;flex-direction:column;min-height:180px}
.term-empty{padding:36px 18px;text-align:center;color:#8fa0d8;font-size:13.5px;line-height:1.6}
.term-empty a{color:var(--y);font-weight:600}
.term-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.06);text-decoration:none;transition:background .12s}
.term-row:hover{background:rgba(255,255,255,.04)}
.term-img{width:34px;height:34px;border-radius:6px;object-fit:cover;background:#1a2f8f;flex-shrink:0}
.term-main{flex:1;min-width:0}
.term-name{font-weight:700;font-size:13.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.term-sub{font-size:11.5px;color:#8fa0d8;margin-top:1px}
.term-right{text-align:right;flex-shrink:0}
.term-mc{font:700 13px/1 Inter;color:#fff}
.term-bar{width:52px;height:4px;border-radius:3px;background:rgba(255,255,255,.14);margin-top:6px;overflow:hidden;margin-left:auto}
.term-bar span{display:block;height:100%;background:var(--y);border-radius:3px}
.term-bar.done span{background:var(--green)}

/* item-shop pulse — a small, secondary Fortnite touch inside the terminal */
.shop-pulse{border-top:1px solid rgba(255,255,255,.1);padding:12px 16px 14px;background:rgba(0,0,0,.14)}
.sp-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;flex-wrap:wrap}
.sp-title{font:700 12px/1 Inter;color:#fff}
.sp-count{font-size:11px;color:#7a86bb}
.sp-timer{margin-left:auto;font:600 11px/1 Inter;color:#9fb3f0}
.sp-timer b{color:#fff;font-variant-numeric:tabular-nums}
.sp-row{display:flex;gap:7px}
.sp-thumb{position:relative;flex:1;aspect-ratio:1;border-radius:6px;overflow:hidden;background:#1a2f8f;min-width:0}
.sp-thumb img{width:100%;height:100%;object-fit:cover}

/* ---------- sections ---------- */
.hsec{padding:52px 0 8px}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.sec-title{font:400 40px/1 var(--cond);text-transform:uppercase;letter-spacing:.6px;color:#fff}
.sec-sub{color:var(--muted);margin-top:8px;max-width:560px}
.sec-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sec-tools .search{width:300px;max-width:100%}
.seg-tabs{display:flex;background:rgba(255,255,255,.06);padding:3px;gap:2px}
.seg-tabs button{border:none;background:none;color:var(--muted);font:400 16px/1 var(--cond);text-transform:uppercase;letter-spacing:.6px;padding:10px 14px;cursor:pointer;white-space:nowrap}
.seg-tabs button:hover{color:#fff}
.seg-tabs button.on{background:var(--y);color:#0b0f33}
.center-row{display:flex;justify-content:center;margin-top:18px}

/* coins: first-coin empty state */
.first{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:26px;background:linear-gradient(100deg,#13256a,#0e1c56);border:1px solid var(--line-2)}
.first-mark{width:62px;height:62px;display:grid;place-items:center;background:var(--y);color:#0b0f33;font:400 34px/1 var(--cond);clip-path:polygon(12% 0,100% 0,88% 100%,0 100%)}
.first h3{font:400 28px/1 var(--cond);text-transform:uppercase;letter-spacing:.5px}
.first p{color:var(--muted);margin-top:6px}

/* ---------- quick launch (chip row, distinct from the shop-tile grids) ---------- */
.qp-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
.qp-row::-webkit-scrollbar{height:6px}
.qp-row::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.qp{display:flex;align-items:center;gap:10px;flex-shrink:0;min-width:210px;padding:10px 14px 10px 10px;background:var(--card);border:1px solid var(--line);border-radius:999px;text-decoration:none;transition:border-color .15s,transform .15s}
.qp:hover{border-color:var(--y);transform:translateY(-2px)}
.qp-img{width:38px;height:38px;border-radius:50%;object-fit:cover;background:#1a2f8f;flex-shrink:0;border:2px solid rgba(255,255,255,.85)}
.qp-body{min-width:0;flex:1}
.qp-name{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qp-sub{display:flex;align-items:center;gap:4px;font-size:11.5px;color:var(--muted);margin-top:1px}
.qp-sub .vb{width:12px;height:12px}
.qp-go{flex-shrink:0;font:400 11px/1 var(--cond);letter-spacing:.5px;text-transform:uppercase;background:var(--y);color:#0b0f33;padding:5px 8px;border-radius:999px;opacity:0;transition:opacity .15s}
.qp:hover .qp-go{opacity:1}

/* ---------- trust strip (replaces the old on-page how-it-works block; the
   full explanation now lives on /about) ---------- */
.trust-strip{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:14px;padding:14px 18px;background:rgba(74,222,128,.06);border:1px solid rgba(74,222,128,.22);border-radius:8px}
.ts-item{font-size:13px;font-weight:600;color:#c5f5d6}
.ts-link{margin-left:auto;font-size:13px;font-weight:700;color:var(--y)}
.ts-link:hover{text-decoration:underline}

/* ---------- overlay ---------- */
.ovl{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:28px;align-items:center}
.ovl > *{min-width:0}
.ovl-stage{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0b1030;border:1px solid var(--line-2)}
.ovl-scene{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.35)),
  radial-gradient(ellipse 60% 40% at 68% 100%,#3aa84a 0 60%,transparent 61%),
  radial-gradient(ellipse 55% 36% at 22% 102%,#2e8f3f 0 60%,transparent 61%),
  linear-gradient(180deg,#5bbcff 0%,#a6e0ff 58%,#b67dff 59%,#6b3fd0 100%)}
.ovl-live{position:absolute;top:12px;left:12px;background:#e91916;color:#fff;font:400 14px/1 var(--cond);letter-spacing:.8px;padding:5px 8px}
.ovl-stage iframe{position:absolute;left:3%;bottom:5%;width:460px;height:150px;border:0;background:transparent;transform-origin:left bottom}

/* ---------- victory royale ---------- */
.vr{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:64px 0 8px;padding:34px 36px;
  background:linear-gradient(105deg,#2a1b8f 0%,#3b1a9e 45%,#5a1faa 100%);border:1px solid rgba(255,255,255,.14)}
.vr-rays{position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 18% 50%,rgba(255,230,0,.07) 0 5deg,transparent 5deg 16deg);pointer-events:none}
.vr-copy{position:relative;max-width:620px}
.vr-top{font:400 22px/1 var(--cond);color:var(--y);letter-spacing:1px}
.vr-title{display:block;font:400 64px/.95 var(--cond);text-transform:uppercase;letter-spacing:1px;margin:4px 0 10px;
  background:linear-gradient(180deg,#fff7a8 0%,#ffe600 55%,#ffb300 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 0 rgba(40,10,90,.6))}
.vr p{color:#dcd4ff}
.vr .btn{position:relative}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .fh-in{grid-template-columns:1fr;gap:32px}
  .term{max-width:520px}
  .ovl{grid-template-columns:1fr}
  .ovl-stage iframe{transform:scale(.62)}
}
@media (max-width:760px){
  .fh{padding:28px 0 36px}
  .ticker-strip{height:30px}
  .stats-row{gap:8px}
  .stat-card{min-width:0;flex:1;padding:11px 12px}
  .stat-n{font-size:21px}
  .term{max-width:none}
  .sec-title{font-size:32px}
  .sec-tools{width:100%;min-width:0}
  .sec-tools .search{width:100%}
  .seg-tabs{max-width:100%;overflow-x:auto;scrollbar-width:none}
  .seg-tabs::-webkit-scrollbar{display:none}
  .seg-tabs button{padding:9px 11px;font-size:15px}
  .first{grid-template-columns:1fr;text-align:left}
  .ovl{grid-template-columns:1fr}
  .ovl-stage iframe{transform:scale(.62)}
  .vr{padding:26px 22px}
  .vr-title{font-size:48px}
  .trust-strip{flex-direction:column;align-items:flex-start;gap:8px}
  .ts-link{margin-left:0}
}

/* ---------- explore page ---------- */
.expl-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.trend-head{display:flex;align-items:baseline;gap:12px;margin:8px 0 12px}
.trend-head .h-cond{font-size:24px;font-style:normal}
.trend{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.trend::-webkit-scrollbar{height:6px}
.trend::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.tr{display:flex;align-items:center;gap:11px;min-width:262px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;transition:border-color .15s}
.tr:hover{border-color:var(--line-2)}
.tr-img{width:44px;height:44px;border-radius:8px;object-fit:cover;background:#1a2f8f;flex-shrink:0}
.tr-main{flex:1;min-width:0}
.tr-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-mc{text-align:right;flex-shrink:0}
.tr-mc b{font:400 18px/1 var(--cond)}
.expl-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:30px 0 16px}
.expl-bar .search{flex:1;min-width:200px;max-width:420px}
.tile-cr b{color:var(--text)}
.paid{color:var(--vb)!important}
.paid .vb{width:14px;height:14px;vertical-align:-2px}
@media (max-width:760px){ .expl-head{flex-direction:column;align-items:flex-start} .expl-bar .seg-tabs{order:3;width:100%;overflow-x:auto} }

/* ---------- the launchpad section (pick-a-path cards) ---------- */
.launchpad .lp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.lp-card{position:relative;display:block;padding:22px 20px 20px;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:linear-gradient(160deg,#1b2f8a,#122160);transition:transform .15s,border-color .15s,box-shadow .15s}
.lp-card:hover{transform:translateY(-4px);border-color:var(--y);box-shadow:0 20px 40px -14px rgba(3,8,36,.6)}
.lp-card::before{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;background-repeat:no-repeat;background-position:110% -20%;background-size:180px}
.lp-creator::before{background:radial-gradient(circle at 82% 12%,var(--vb) 0,transparent 42%)}
.lp-item::before{background:radial-gradient(circle at 82% 12%,#c66cff 0,transparent 42%)}
.lp-other::before{background:radial-gradient(circle at 82% 12%,var(--y) 0,transparent 42%)}
.lp-tag{display:inline-block;font:400 12px/1 var(--cond);letter-spacing:.8px;text-transform:uppercase;color:#0b0f33;background:var(--y);padding:5px 9px;margin-bottom:14px}
.lp-item .lp-tag{background:#c66cff;color:#fff}
.lp-creator .lp-tag{background:var(--vb);color:#04122b}
.lp-card h3{font:400 26px/1 var(--cond);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.lp-card p{color:var(--muted);font-size:14px;min-height:40px}
.lp-go{display:inline-block;margin-top:14px;color:var(--y);font-weight:700;font-size:14px}
@media (max-width:820px){ .launchpad .lp-grid{grid-template-columns:1fr} }