@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=Noto+Sans+TC:wght@400;500;700&display=swap');
:root{--void:#0b0d1a;--panel:#121528;--ink:#f0f4ff;--muted:#8b95b8;--acid:#d4ff00;--pink:#ff2d95;--cyan:#00e8ff;--line:#2a3050}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--ink);font-family:"Space Grotesk","Noto Sans TC",sans-serif;line-height:1.55;
  background-image:radial-gradient(circle at 20% 20%,rgba(255,45,149,.12),transparent 40%),radial-gradient(circle at 80% 0%,rgba(0,232,255,.1),transparent 35%)}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.wrap{width:min(1180px,92vw);margin:0 auto}
.hyper-hdr{padding:16px 0;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;background:rgba(11,13,26,.9);backdrop-filter:blur(10px)}
.hyper-nav{display:flex;align-items:center;gap:20px}
.hyper-logo img{height:44px}
.hyper-menu{display:flex;gap:24px;margin-left:auto;font-size:12px;font-weight:700;letter-spacing:.12em}
.hyper-menu a:hover{color:var(--acid)}
.hyper-hero{padding:50px 0 30px;position:relative}
.hyper-hero h1{font-size:clamp(40px,7vw,88px);font-weight:700;line-height:.95;margin:0 0 16px;text-transform:uppercase}
.hyper-hero h1 span{color:var(--acid);-webkit-text-stroke:1px var(--acid)}
.hyper-sub{color:var(--muted);max-width:480px;font-size:15px;margin-bottom:32px}
.hyper-stats{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.hyper-stats div{background:var(--panel);border:1px solid var(--line);padding:14px 20px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.hyper-stats b{display:block;font-size:22px;color:var(--cyan)}
.hyper-stats span{font-size:10px;color:var(--muted);letter-spacing:.1em}
.hyper-hero-img{margin-top:-20px;transform:rotate(-2deg);border:2px solid var(--acid);clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%)}
.drops-sec{padding:40px 0 60px}
.drops-h{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px;flex-wrap:wrap;gap:12px}
.drops-h h2{font-size:clamp(28px,4vw,44px);margin:0;font-weight:700}
.drops-h p{color:var(--muted);margin:0;font-size:13px}
.drops-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.drop-card{background:var(--panel);border:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:10px;transition:transform .2s,border-color .2s;position:relative}
.drop-card:hover{transform:translateY(-3px);border-color:var(--pink)}
.drop-card.hot{border-color:var(--acid);box-shadow:0 0 30px rgba(212,255,0,.08)}
.drop-tier{font-size:10px;font-weight:700;color:var(--pink);letter-spacing:.16em}
.drop-card.hot .drop-tier{color:var(--acid)}
.drop-card h3{font-size:18px;margin:0;font-weight:700}
.drop-price{font-size:28px;font-weight:700;color:var(--cyan);margin:0}
.drop-meta{font-size:11px;color:var(--muted);line-height:1.6}
.drop-act{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.hyper-btn{border:2px solid var(--ink);background:transparent;color:var(--ink);padding:9px 14px;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;letter-spacing:.06em}
.hyper-btn-acid{background:var(--acid);border-color:var(--acid);color:var(--void)}
.hyper-btn:hover{filter:brightness(1.1)}
.hyper-psy{padding:40px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.hyper-psy div{background:linear-gradient(135deg,var(--panel),#1a1f38);border:1px solid var(--line);padding:20px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.hyper-psy b{display:block;font-size:11px;color:var(--acid);margin-bottom:8px}
.hyper-psy p{margin:0;font-size:12px;color:var(--muted)}
.log-sec{padding:40px 0}
.log-scroll{display:flex;gap:16px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory}
.log-card{flex:0 0 280px;scroll-snap-align:start;background:var(--panel);border:1px solid var(--line);overflow:hidden}
/* superseded */
.log-card div{padding:16px}
.log-card h3{font-size:15px;margin:0 0 6px}
.log-card p{font-size:12px;color:var(--muted);margin:0}
.hyper-page{padding:40px 0 64px}
.hyper-page h1{font-size:clamp(32px,5vw,52px);margin:0 0 16px;font-weight:700}
.hyper-prose{max-width:760px;margin-left:auto;margin-right:auto}
.hyper-prose p,.hyper-prose li{color:var(--muted);font-size:14px;line-height:1.75}
.hyper-prose h2{font-size:20px;color:var(--ink);margin:28px 0 10px}
.hyper-prose h3{font-size:16px;color:var(--ink);margin:20px 0 8px;font-weight:600}
.hyper-prose ul,.hyper-prose ol{padding-left:1.25em;margin:0 0 16px}
.hyper-prose a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.table-wrap{overflow-x:auto;margin:16px 0 24px}
.hyper-prose table{width:100%;border-collapse:collapse;font-size:13px;color:var(--ink)}
.hyper-prose th,.hyper-prose td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.hyper-prose th{background:#f6f4f1;font-weight:600}
.hyper-buy{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.hyper-buy img{border:2px solid var(--cyan);clip-path:polygon(0 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%)}
.hyper-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.hyper-facts div{border:1px solid var(--line);padding:12px;font-size:12px;background:var(--panel)}
.hyper-facts b{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}
.hyper-foot{padding:32px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.hyper-foot-links{display:flex;gap:16px;margin-top:12px;flex-wrap:wrap}
.hyper-cart{position:fixed;bottom:16px;right:16px;background:var(--acid);color:var(--void);padding:10px 16px;font-weight:700;font-size:12px;z-index:60;display:flex;gap:12px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.bmi{margin:20px 0;padding:18px;border:1px solid var(--line);background:var(--panel)}
.bmi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.bmi input{background:var(--void);border:1px solid var(--line);color:var(--ink);padding:10px;width:100%;font:inherit}
.bmi button{background:var(--pink);border:0;color:#fff;padding:10px 16px;font-weight:700;cursor:pointer}
.related{margin-top:32px;padding-top:20px;border-top:1px solid var(--line)}
@media(max-width:900px){
  .drops-grid,.hyper-psy,.hyper-buy{grid-template-columns:1fr}
  .hyper-menu{display:none}
}
/* Sticky footer v4 — margin-top:auto 推页脚到底 */
html{height:100%}
body{
  min-height:100vh!important;
  min-height:100dvh!important;
  display:flex!important;
  flex-direction:column!important;
}
body>header,body>.top,body>.hdr,body>.hyper-hdr,body>.wl-top,body>.ap-top,body>.ticker,body>.announce{flex-shrink:0}
body>main{flex:1 0 auto!important;width:100%}
footer.foot,body>footer,body>.foot,body>.hyper-foot,body>.wl-foot,body>.ap-foot{
  flex-shrink:0!important;
  width:100%;
  margin-top:auto!important;
}

/* Article page: center reading column (detail pages only) */
.hyper-page .cover,
.hyper-page .hyper-prose,
.hyper-page .prose{
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
}
.hyper-page:has(.hyper-prose) h1,
.hyper-page:has(.prose) h1,
.hyper-page:has(.hyper-prose) .wrap > p:first-child{
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
}
.hyper-page h1{margin-bottom:16px}

/* Article images: fit container, crop instead of full show */
.hyper-page .cover{
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:4px;
  margin:16px auto;
}
.hyper-page .cover img{
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center;
  display:block;
  margin:0!important;
}
.log-card img{
  height:140px;
  width:100%;
  object-fit:cover;
  object-position:center;
}
/* article-detail-fix */
.prose section.related{margin-top:32px;padding-top:20px;border-top:1px solid var(--line)}
.prose section.related h2{font-size:17px;margin:0 0 12px;color:var(--pink)}
.prose section.related>a{display:block;padding:14px;border:1px solid var(--line);background:var(--panel);margin-bottom:10px;text-decoration:none}
.prose section.related>a strong{display:block;font-size:14px;margin-bottom:6px;color:var(--ink)}
.prose section.related>a span{font-size:12px;color:var(--muted)}
/* article-layout-wide */
main:has(.prose) .wrap > p,
main:has(.prose) h1,
main:has(.prose) .cover,
main:has(.prose) .prose {
  max-width: min(960px, 94vw);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
main:has(.prose) .cover {
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 4px;
  margin: 16px auto;
}
main:has(.prose) .cover img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center;
  display: block;
  margin: 0 !important;
}

/* article-no-mid-cover */
.page-content [class$="-cover"],
.page-content .article-cover,
.content [class$="-cover"],
.content .article-cover,
.prose [class$="-cover"],
.prose .article-cover,
.hyper-prose [class$="-cover"],
.tk-prose [class$="-cover"],
.tk-prose .article-cover,
.body [class$="-cover"],
.body .article-cover,
.bl-prose [class$="-cover"],
.bl-prose .article-cover,
.hz-prose [class$="-cover"],
.vx-prose [class$="-cover"],
.sf-prose [class$="-cover"],
.np-prose [class$="-cover"],
.ap-prose [class$="-cover"],
.wl-prose [class$="-cover"] {
  display: none !important;
}