/* 微观馆 · Cells & Molecules v1.0 — homepage section (football / OiOi theme: turf stripe, jersey number, scoreboard) */
.micro .mh-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:26px}
.micro .mh-top h2{margin-bottom:.15em}
.micro .mh-top h2 em{font-style:normal;color:var(--orange)}
.micro .mh-top .sub{max-width:720px;margin:0}
.micro .mh-top .sub .en{display:block;font-size:.9em;color:var(--muted);opacity:.85;margin-top:4px}
.micro .stats{flex:none}
.mh-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.mh-card{grid-column:span 2;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-top:5px solid var(--mc);border-radius:22px;overflow:hidden;
  text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .45s var(--ease),box-shadow .3s}
a.mh-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(31,42,68,.16)}
a.mh-card:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.mh-pic{position:relative;aspect-ratio:16/10;background:radial-gradient(120% 90% at 50% 40%,#13224a 0%,#060b1d 70%);overflow:hidden}
.mh-pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
a.mh-card:hover .mh-pic img{transform:scale(1.05)}
.mh-badge{position:absolute;left:12px;top:12px;font:800 .66rem/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.12em;color:#fff;background:rgba(6,11,29,.72);
  border:1px solid color-mix(in srgb,var(--mc) 60%,transparent);padding:6px 9px;border-radius:999px}
.mh-txt{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.mh-kind{font-size:.7rem;letter-spacing:.14em;font-weight:800;color:color-mix(in srgb,var(--mc) 70%,#1f2a44)}
.mh-kind i{font-style:normal;font-weight:600;letter-spacing:.06em;margin-left:8px;opacity:.75;text-transform:uppercase}
.mh-card h3{margin:2px 0 2px;font-size:1.28rem;line-height:1.2}
.mh-card h3 small{display:block;font-size:.8rem;font-weight:600;color:var(--muted);letter-spacing:.02em;margin-top:3px}
.mh-card p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.6}
.mh-card p.mh-en{font-size:.82rem;opacity:.85;line-height:1.5}
.mh-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.mh-tags i{font-style:normal;font-size:.76rem;font-weight:600;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--mc) 14%,#fff);color:var(--ink)}
.mh-go{margin-top:auto;padding-top:12px;display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:.9rem;color:var(--ink)}
.mh-go b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;transition:background .2s,transform .3s var(--ease)}
a.mh-card:hover .mh-go b{background:var(--orange);transform:translateX(3px)}
/* coming soon */
.mh-card.soon{grid-column:span 3;flex-direction:row;border:1.5px dashed var(--line);border-left:5px solid var(--mc);background:color-mix(in srgb,var(--card) 70%,transparent)}
.mh-card.soon .mh-pic{flex:0 0 34%;aspect-ratio:auto;min-height:190px;display:grid;place-items:center}
.mh-helix{width:70%;max-width:150px;height:auto;animation:mhSpin 7s ease-in-out infinite alternate;opacity:.9}
@keyframes mhSpin{from{transform:scaleX(1)}to{transform:scaleX(-1)}}
.mh-card.soon .mh-badge{top:auto;bottom:12px;left:50%;transform:translateX(-50%);white-space:nowrap}
.mh-card.soon .mh-go{color:var(--muted);font-weight:700}
.mh-jump{display:inline-flex;align-items:center;gap:8px;margin:4px 0 18px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);
  font-weight:700;font-size:.9rem;color:var(--ink);text-decoration:none;box-shadow:var(--shadow)}
.mh-jump:hover{border-color:var(--orange);color:var(--orange)}
.mh-jump i{font-style:normal;color:var(--orange)}
@media (max-width:1080px){.mh-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mh-card,.mh-card.soon{grid-column:span 1}.mh-card.soon{flex-direction:column}.mh-card.soon .mh-pic{flex:none;min-height:150px}}
@media (max-width:640px){.mh-grid{grid-template-columns:1fr}.micro .stats{display:flex!important;flex-wrap:nowrap;width:100%;justify-content:space-between;padding:8px}.micro .stats li{flex:1;padding:6px 4px;font-size:.6rem;letter-spacing:.06em;border-right:1px solid #2c2c2c}.micro .stats li:last-child{border-right:0}.micro .stats b{font-size:1.45rem;padding:2px 6px}}
@media (prefers-reduced-motion:reduce){.mh-helix{animation:none}.mh-card,.mh-pic img{transition:none}}
