:root{
  --bg:#08080d; --txt:#ececf2; --txt2:#9a9ab0; --txt3:#6b6b82;
  --card:rgba(255,255,255,.045); --card-border:rgba(255,255,255,.09);
  --grad:linear-gradient(135deg,#6d5efc,#2f6df6);
  --gold1:#f4d98b; --gold2:#caa45a; --plan:#d8b370;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,"Segoe UI",system-ui,"Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--txt);line-height:1.6;
  background-image:
    radial-gradient(1000px 600px at 78% -8%, rgba(109,94,252,.20), transparent 60%),
    radial-gradient(800px 600px at 5% 16%, rgba(47,109,246,.13), transparent 55%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}

nav{position:sticky;top:0;z-index:30;backdrop-filter:blur(14px);
  background:rgba(8,8,13,.7);border-bottom:1px solid var(--card-border)}
nav .inner{max-width:1080px;margin:0 auto;padding:13px 28px;display:flex;align-items:center;gap:14px}
.wordmark{font-size:20px;font-weight:800;letter-spacing:.5px;
  background:linear-gradient(135deg,var(--gold1),var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
nav .spacer{flex:1}
.navtag{padding:4px 11px}
.btn{font-size:13px;font-weight:600;padding:8px 16px;border-radius:10px;background:var(--grad);color:#fff;
  box-shadow:0 6px 18px rgba(109,94,252,.35);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(109,94,252,.5)}
.btn.ghost{background:transparent;border:1px solid var(--card-border);box-shadow:none;color:var(--txt2)}

.hero{max-width:1080px;margin:0 auto;padding:74px 28px 30px;text-align:center}
.hero .big{font-size:54px;font-weight:850;letter-spacing:1px;line-height:1.1;
  background:linear-gradient(135deg,var(--gold1),var(--gold2) 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .tag{margin-top:16px;font-size:17px;color:var(--txt2);max-width:600px;margin-left:auto;margin-right:auto}
.pills{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.pill{font-size:12.5px;padding:6px 13px;border-radius:999px;border:1px solid var(--card-border);color:var(--txt2);background:rgba(255,255,255,.03)}
.pill.cur{color:#fff;background:var(--grad);border:none;box-shadow:0 4px 14px rgba(109,94,252,.4)}
.hero .cta{margin-top:28px;display:flex;gap:12px;justify-content:center}
.hero .meta{margin-top:26px;font-size:13px;color:var(--txt3)}

.tl{position:relative;max-width:1080px;margin:18px auto 0;padding:20px 28px 10px}
.tl::before{content:"";position:absolute;left:50%;top:0;bottom:40px;width:2px;transform:translateX(-50%);
  background:linear-gradient(180deg,
    rgba(216,179,112,.5) 0,rgba(216,179,112,.5) 130px,
    #6d5efc 230px,#2f6df6 92%,rgba(47,109,246,.15));}
.topcap{position:relative;text-align:center;margin-bottom:8px;color:var(--plan);font-size:11.5px;letter-spacing:3px}
.row{position:relative;display:flex;margin-bottom:32px;min-height:66px}
.row .dot{position:absolute;left:50%;top:18px;width:16px;height:16px;border-radius:50%;transform:translateX(-50%);
  background:var(--grad);box-shadow:0 0 0 5px rgba(109,94,252,.16),0 0 18px rgba(109,94,252,.55);z-index:2}
.row.cur .dot{width:20px;height:20px;top:16px;box-shadow:0 0 0 6px rgba(109,94,252,.22),0 0 26px rgba(109,94,252,.85)}
.row.plan .dot{background:transparent;border:2px solid var(--plan);box-shadow:0 0 0 5px rgba(216,179,112,.1),0 0 14px rgba(216,179,112,.4)}
.cardwrap{width:50%}
.row.left .cardwrap{padding-right:46px}
.row.right{justify-content:flex-end}
.row.right .cardwrap{padding-left:46px}

.card{background:var(--card);border:1px solid var(--card-border);border-radius:18px;padding:20px 22px;
  backdrop-filter:blur(8px);box-shadow:0 14px 36px rgba(0,0,0,.3);transition:transform .18s,border-color .18s}
.card:hover{transform:translateY(-3px);border-color:rgba(109,94,252,.4)}
.card.curcard{border-color:rgba(109,94,252,.5);box-shadow:0 14px 40px rgba(109,94,252,.18)}
.vrow{display:flex;align-items:center;gap:11px;margin-bottom:9px;flex-wrap:wrap}
.vpill{font-weight:800;font-size:14px;padding:4px 13px;border-radius:999px;color:#fff;background:var(--grad);box-shadow:0 4px 14px rgba(109,94,252,.35)}
.latest{font-size:10.5px;letter-spacing:1px;color:#b9aef9;border:1px solid rgba(109,94,252,.45);padding:2px 8px;border-radius:999px}
.date{color:var(--txt3);font-size:12.5px;font-variant-numeric:tabular-nums;margin-left:auto}
.card h3{font-size:18px;font-weight:750;margin-bottom:11px}
.card ul{list-style:none;display:flex;flex-direction:column;gap:7px;margin:2px 0 13px}
.card li{font-size:13.6px;color:var(--txt2);padding-left:18px;position:relative}
.card li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--grad)}
.tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:4px}
.tag{font-size:11px;padding:3px 10px;border-radius:7px;background:rgba(109,94,252,.12);border:1px solid rgba(109,94,252,.25);color:#b9aef9}
.patch{margin-top:12px;font-size:12px;color:var(--txt2);background:rgba(255,255,255,.035);border:1px dashed var(--card-border);
  padding:7px 12px;border-radius:9px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.patch b{color:var(--txt);font-weight:600}
.patch .pp{font-size:11px;padding:1px 7px;border-radius:6px;background:rgba(255,255,255,.05);color:var(--txt2);font-variant-numeric:tabular-nums}
.full{display:inline-block;margin-top:13px;font-size:12.5px;color:#8f9bff}
.full:hover{text-decoration:underline}

.card.plan{background:rgba(216,179,112,.05);border:1.5px dashed rgba(216,179,112,.42)}
.card.plan .vpill{background:transparent;color:var(--plan);border:1px solid rgba(216,179,112,.55);box-shadow:none}
.card.plan li::before{background:var(--plan)}
.card.plan .tag{background:rgba(216,179,112,.1);border-color:rgba(216,179,112,.3);color:var(--plan)}
.plabel{font-size:10.5px;letter-spacing:1px;color:var(--plan);border:1px solid rgba(216,179,112,.45);padding:2px 8px;border-radius:999px}
.plabel.start{color:var(--gold2);border-color:rgba(202,164,90,.45)}

.loaderr{max-width:560px;margin:60px auto;text-align:center;color:var(--txt2);
  background:var(--card);border:1px solid var(--card-border);border-radius:16px;padding:28px}
.loaderr small{color:var(--txt3)}

footer{max-width:1080px;margin:50px auto 0;padding:30px 28px 60px;border-top:1px solid var(--card-border);
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;color:var(--txt3);font-size:13px}
footer a{color:var(--txt2)} footer a:hover{color:#8f9bff}
footer .spacer{flex:1}

@media(max-width:760px){
  .hero .big{font-size:38px}
  .tl::before{left:9px}
  .row{display:block}
  .cardwrap{width:100%}
  .row.left .cardwrap,.row.right .cardwrap{padding:0 0 0 34px}
  .row .dot{left:9px}
  .date{margin-left:0}
  .topcap{text-align:left;padding-left:2px}
}
