/* ============================================================
   墨泓斋 · 新站页面样式（refresh/css/pages.css）
   内容类页面：首页 / 板块页 / 推送 / 通知 / 信箱 / 个人 / 社媒 / 协议 / 404
   ============================================================ */

/* ---------- 横幅主视觉 ---------- */
.mz-hero__rule { width: 76px; height: 2px; background: var(--mz-cinnabar); margin: 26px 0 0; }
.mz-hero__meta { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 30px; color: var(--mz-ink-4); font-size: .84rem; }
.mz-hero__meta span { display: inline-flex; align-items: center; gap: 8px; }

.mz-hero--compact { padding: clamp(40px, 6vw, 74px) 0 clamp(28px, 4vw, 48px); }
.mz-hero--huafans .mz-hero__ink { background: radial-gradient(circle, var(--mz-mineral-wash) 0%, transparent 66%); }
.mz-hero--engstudy .mz-hero__ink { background: radial-gradient(circle, rgba(154, 122, 58, .12), transparent 66%); }
.mz-hero--huafans .mz-kicker { color: var(--mz-mineral); }
.mz-hero--huafans .mz-hero__rule { background: var(--mz-mineral); }
.mz-hero--engstudy .mz-kicker { color: var(--mz-gold); }
.mz-hero--engstudy .mz-hero__rule { background: var(--mz-gold); }

/* 板块色带 */
.mz-ribbon { height: 3px; width: 100%; background: linear-gradient(90deg, var(--mz-cinnabar), transparent 72%); }
.mz-ribbon--mineral { background: linear-gradient(90deg, var(--mz-mineral), transparent 72%); }
.mz-ribbon--gold { background: linear-gradient(90deg, var(--mz-gold), transparent 72%); }

/* ---------- 文章推送：长条行 ----------
   组件样式已上收公共层（/common/css/mz_theme.css 17.32）：
   不引本站 css 的页面（例如 /home/pages/latest.html）也能拿到这套外观。 */

/* ---------- 文章推送：卡片 ---------- */

/* ---------- 推送详情（原地展开 / 弹窗） ---------- */
.mz-article-head { border-bottom: 1px solid var(--mz-line); padding-bottom: 22px; margin-bottom: 26px; }
.mz-article-head__kicker { display: flex; align-items: center; gap: 10px; font-size: .78rem; color: var(--mz-cinnabar); letter-spacing: .16em; }
.mz-article-head h1 { font-family: var(--mz-serif); font-size: clamp(1.5rem, 3vw, 2.1rem); margin-top: 14px; line-height: 1.35; }
.mz-article-head__meta { margin-top: 16px; display: flex; gap: 16px; flex-wrap: wrap; font-size: .82rem; color: var(--mz-ink-4); }
.mz-article-src {
    margin-top: 26px; padding: 16px 18px; border: 1px solid var(--mz-line);
    border-radius: var(--mz-radius-l); font-size: .88rem; color: var(--mz-ink-3);
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.mz-article-actions { margin-top: 26px; display: flex; gap: 10px; flex-wrap: wrap; }

/* 推送线：单条铺开 */
.mz-pushline { max-width: var(--mz-read); margin: 0 auto; }
.mz-push-card { border-bottom: 1px solid var(--mz-line); padding: 30px 0; }
.mz-push-card:first-child { border-top: 1px solid var(--mz-line); }
.mz-push-card__head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.mz-push-card__date { font-family: var(--mz-mono); font-size: .78rem; color: var(--mz-ink-4); }
.mz-push-card__title { font-family: var(--mz-serif); font-size: 1.24rem; }
.mz-push-card__body { margin-top: 14px; }
.mz-push-card__body.is-clamped { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mz-push-card__foot { margin-top: 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }

/* ---------- 通知 ---------- */
.mz-notice-list { display: flex; flex-direction: column; }
.mz-notice {
    display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 16px;
    padding: 20px 8px; border-bottom: 1px solid var(--mz-line); cursor: pointer;
    transition: background-color .18s ease;
}
.mz-notice:hover { background: var(--mz-cinnabar-wash); }
.mz-notice.is-unread { background: var(--mz-cinnabar-wash); }
.mz-notice__mark {
    width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center;
    border: 1px solid var(--mz-line); color: var(--mz-ink-3); font-size: .9rem; background: var(--mz-paper-2);
}
.mz-notice.is-unread .mz-notice__mark { border-color: var(--mz-cinnabar); color: var(--mz-cinnabar); }
.mz-notice__title { font-family: var(--mz-serif); font-size: 1.04rem; }
.mz-notice__desc { margin-top: 6px; font-size: .88rem; color: var(--mz-ink-3); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mz-notice__meta { margin-top: 10px; display: flex; gap: 12px; align-items: center; font-size: .76rem; color: var(--mz-ink-4); flex-wrap: wrap; }
.mz-notice__ts { font-family: var(--mz-mono); white-space: nowrap; font-size: .76rem; color: var(--mz-ink-4); }

/* ---------- 信箱投递 ---------- */
.mz-mailbox { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 34px; align-items: start; }
.mz-mailbox__form { border: 1px solid var(--mz-line); border-radius: var(--mz-radius-l); background: var(--mz-paper-2); padding: 28px; }
.mz-mailbox__aside { font-size: .9rem; color: var(--mz-ink-3); }
.mz-mailbox__step { display: flex; gap: 12px; margin-bottom: 16px; }
.mz-mailbox__step b { font-family: var(--mz-serif); color: var(--mz-cinnabar); }
.mz-mailbox__done { text-align: center; padding: 36px 12px; }
.mz-mailbox__done .mz-seal { margin: 0 auto 18px; width: 58px; height: 58px; font-size: 1rem; }

/* ---------- 个人主页 / 社媒 ---------- */
.mz-profile { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 44px; align-items: start; }
.mz-profile__card { border: 1px solid var(--mz-line); border-radius: var(--mz-radius-l); padding: 26px; background: var(--mz-paper-2); text-align: center; }
.mz-profile__avatar { width: 116px; height: 116px; border-radius: 50%; object-fit: cover; margin: 0 auto 18px; border: 1px solid var(--mz-line); }
.mz-profile__name { font-family: var(--mz-serif); font-size: 1.5rem; letter-spacing: .1em; }
.mz-profile__tags { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
.mz-profile__facts { margin-top: 22px; text-align: left; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; font-size: .88rem; }
.mz-profile__fact { display: flex; flex-direction: column; gap: 3px; border-bottom: 0; padding-bottom: 0; min-width: 0; }

.mz-social-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
.mz-social {
    display: flex; gap: 16px; align-items: center; padding: 22px;
    transition: border-color .2s, transform .2s;
}
.mz-social:hover { border-color: var(--mz-cinnabar); transform: translateY(-2px); }
.mz-social__icon { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; }
.mz-social__name { font-family: var(--mz-serif); font-size: 1.06rem; }
.mz-social__desc { font-size: .82rem; color: var(--mz-ink-4); margin-top: 4px; }
.mz-qr { width: 190px; padding: 14px; }
.mz-qr img { border-radius: var(--mz-radius); }

/* ---------- 协议 ---------- */
.mz-doc { max-width: var(--mz-read); margin: 0 auto; }
.mz-doc__head { padding-bottom: 24px; border-bottom: 1px solid var(--mz-line); margin-bottom: 30px; }
.mz-doc__meta { margin-top: 12px; font-size: .82rem; color: var(--mz-ink-4); }
.mz-doc__toc {
    padding: 18px 22px; margin-bottom: 30px;
}
.mz-doc__toc a { display: block; padding: 6px 0; font-size: .9rem; color: var(--mz-ink-3); }
.mz-doc__toc a:hover { color: var(--mz-cinnabar); }

/* ---------- 404 ---------- */
.mz-404 { text-align: center; padding: clamp(60px, 12vw, 130px) 0; }
.mz-404__code {
    font-family: var(--mz-serif); font-size: clamp(5rem, 18vw, 11rem); line-height: .9;
    color: var(--mz-paper-3); letter-spacing: .08em;
}
html[data-theme="dark"] .mz-404__code { color: var(--mz-line); }
.mz-404__title { font-family: var(--mz-serif); font-size: clamp(1.4rem, 4vw, 2rem); margin-top: -18px; }
.mz-404__desc { margin-top: 16px; color: var(--mz-ink-3); }
.mz-404__links { margin-top: 34px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; max-width: 720px; margin-left: auto; margin-right: auto; text-align: left; }

/* ---------- 侧栏索引 ---------- */
.mz-side { display: flex; flex-direction: column; gap: 18px; }
.mz-side__block { padding: 20px; }
.mz-side__title { font-size: .74rem; letter-spacing: .22em; color: var(--mz-ink-4); text-transform: uppercase; margin-bottom: 14px; }
.mz-side__list { display: flex; flex-direction: column; gap: 2px; }
.mz-side__list a, .mz-side__list button {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 9px 10px; border-radius: var(--mz-radius); font-size: .9rem; color: var(--mz-ink-2); text-align: left; width: 100%;
}
.mz-side__list a:hover, .mz-side__list button:hover { background: var(--mz-cinnabar-wash); color: var(--mz-cinnabar); }
.mz-side__list [aria-current="page"], .mz-side__list .is-active { background: var(--mz-cinnabar-wash); color: var(--mz-cinnabar); font-weight: 700; }
.mz-side__count { font-family: var(--mz-mono); font-size: .76rem; color: var(--mz-ink-4); }

/* ---------- 筛选条 ---------- */
.mz-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.mz-filters__label { font-size: .78rem; letter-spacing: .16em; color: var(--mz-ink-4); }

/* ---------- 空态占位（页面骨架未接数据时） ---------- */
.mz-placeholder { border: 1px dashed var(--mz-line-strong); border-radius: var(--mz-radius-l); padding: 22px; color: var(--mz-ink-4); font-size: .88rem; text-align: center; }

@media (max-width: 980px) {
    .mz-profile { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .mz-mailbox { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 700px) {
    .mz-notice { grid-template-columns: 36px minmax(0, 1fr); }
    .mz-notice__ts { grid-column: 2; }
}

/* ═══════════════════════════════════════════════════════════
   261023-20：玻璃终端改版覆盖层（Glass Terminal）
   —— 公共主题层由 js/core.js 注入到 head 最末，色彩与通用组件
      已在 /common/css/mz_theme.css 里统一；这里只补主站自有的
      门面瓦片、宽卡片与跑马灯，让它们跟玻璃面板同一质感。
   ═══════════════════════════════════════════════════════════ */

/* 门面瓦片：卡片档（底色 / 描边 / 圆角 / 模糊来自 mz_theme.css 第五节） */
.mz-tile {
    position: relative;
    transition: border-color .22s, box-shadow .22s, transform .22s;
}

.mz-tile:hover {
    border-color: var(--mz-accent);
    box-shadow: var(--mz-shadow-lift);
    transform: translateY(-2px);
}

/* 主瓦片：一层更浓的冷光，仍保持通透 */
.mz-tile--accent {
    background:
        linear-gradient(155deg, var(--mz-accent-wash), rgba(255, 255, 255, 0) 62%),
        var(--mz-glass);
    border-color: var(--mz-accent-line);
}

/* 瓦片里的印章改为玻璃胶囊 */
.mz-seal,
.mz-seal--solid {
    border-radius: var(--mz-radius-pill);
    background: var(--mz-accent);
    color: var(--mz-btn-ink);
    font-family: var(--mz-mono);
    letter-spacing: .08em;
}

/* 宽卡片（花粉 / 教研两栏）：卡片档，变色由 .mz-widecard:hover 负责 */
.mz-widecard {
    transition: border-color .22s, box-shadow .22s;
}

.mz-widecard:hover { border-color: var(--mz-accent); box-shadow: var(--mz-shadow-lift); }
.mz-widecard__text b { font-family: var(--mz-display); letter-spacing: -.01em; }
.mz-widecard__go { color: var(--mz-accent); }

/* 跑马灯：等宽字 + 细线，压到不抢戏 */
.mz-marquee {
    border-top: 1px solid var(--mz-line);
    border-bottom: 1px solid var(--mz-line);
    background: var(--mz-glass-3);
    color: var(--mz-ink-4);
    font-family: var(--mz-mono);
    letter-spacing: .1em;
    font-size: .72rem;
}

/* 站头与抽屉交给公共层，这里只补一条分隔 */
.mz-topbar { border-bottom: 1px solid var(--mz-line); }
