/* skin-0011 「聚合 · 左栏经典」—— 现代基底:圆角/留白/柔影,WebStack 左树 + 卡片网格。
   本皮肤兼任 0012~0020 现代系拷贝源:token 与公共件在此定稿。 */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root { --theme: #f06595; --bg: #f5f7f9; --card: #fff; --fg: #303b46; --muted: #8a97a5; --line: #e6ebf0; --radius: 14px; --shadow: 0 8px 30px rgba(20,40,60,.07); }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { font-family: -apple-system, "Segoe UI", "Microsoft Yahei", sans-serif; background: var(--bg); color: var(--fg); line-height: 1.55; }
a { color: inherit; text-decoration: none; }

/* 顶栏(轻 hero):站名 + 搜索 + 提交 */
.mtop { position: sticky; top: 0; z-index: 30; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.mtop-inner { max-width: 1200px; margin: 0 auto; padding: 10px 20px; display: flex; align-items: center; gap: 18px; }
.mbrand { display: flex; align-items: center; gap: 10px; flex: none; }
.mbrand-logo { width: 34px; height: 34px; border-radius: 10px; object-fit: cover; }
.mbrand-ph { display: inline-flex; align-items: center; justify-content: center; background: var(--theme); color: #fff; font-weight: 800; font-size: 17px; }
.mbrand-name { font-size: 17px; font-weight: 800; letter-spacing: .5px; }
.msearch { flex: 1; max-width: 460px; }
.msearch input { width: 100%; height: 38px; padding: 0 16px; border: 1px solid var(--line); border-radius: 19px; background: var(--bg); font-size: 14px; color: var(--fg); outline: none; transition: border-color .15s, box-shadow .15s; }
.msearch input:focus { border-color: var(--theme); box-shadow: 0 0 0 3px rgba(24,160,94,.12); background: #fff; }
.mtoplinks { margin-left: auto; }
.mtoplinks a { font-size: 14px; color: var(--muted); padding: 8px 14px; border-radius: 10px; }
.mtoplinks a:hover { color: var(--theme); background: var(--bg); }

/* 低调公告行 */
.mnotice { border-bottom: 1px solid var(--line); background: #fff; }
.mnotice-inner { max-width: 1200px; margin: 0 auto; padding: 7px 20px; font-size: 12.5px; color: var(--muted); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mnotice-inner a { color: #5b8bd0; }
.mnotice-inner a:hover { text-decoration: underline; }
.mdot { color: #c8d2dc; }

/* 快链胶囊行 */
.mpills { max-width: 1200px; margin: 12px auto 0; padding: 0 20px; }
.mpills-inner { display: flex; flex-wrap: wrap; gap: 8px; }
.mpill { padding: 6px 16px; border-radius: 999px; background: #fff; box-shadow: 0 2px 10px rgba(20,40,60,.05); font-size: 13px; font-weight: 600; transition: transform .15s, box-shadow .15s; }
.mpill:hover { transform: translateY(-2px); box-shadow: var(--shadow); }

/* 横幅(圆角卡) */
.banner { max-width: 1200px; margin: 12px auto 0; padding: 0 20px; }
.banner-inner img { width: 100%; display: block; border-radius: var(--radius); box-shadow: var(--shadow); }
.mmain .banner { max-width: none; padding: 0; margin: 0 0 16px; }

/* 主体:左树 + 内容 */
.mwrap { max-width: 1200px; margin: 16px auto 0; padding: 0 20px; display: flex; gap: 18px; align-items: flex-start; }
.mtree { flex: 0 0 200px; position: sticky; top: 72px; max-height: calc(100vh - 90px); overflow: auto; scrollbar-width: none; }
.mtree::-webkit-scrollbar { display: none; }
.mtree-nav { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 10px 8px; display: flex; flex-direction: column; gap: 2px; }
.mtree-top { font-weight: 700; font-size: 14px; padding: 8px 12px; border-radius: 10px; }
.mtree-sub { font-size: 13px; color: var(--muted); padding: 6px 12px 6px 24px; border-radius: 10px; }
.mtree a:hover { background: var(--bg); color: var(--theme); }
.mtree a.active { background: rgba(24,160,94,.1); color: var(--theme); }
.mmain { flex: 1; min-width: 0; }

/* 分区卡 + 卡片网格 */
.cat { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); margin-bottom: 16px; overflow: hidden; scroll-margin-top: 72px; }
.mcat-hd { font-size: 15px; font-weight: 800; padding: 13px 18px 0; color: var(--fg); }
.mcat-hd::after { content: ""; display: block; width: 28px; height: 3px; border-radius: 2px; background: var(--theme); margin-top: 6px; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 12px; padding: 14px 18px 18px; }
.wcard { display: flex; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 12px; transition: transform .15s, box-shadow .15s, border-color .15s; min-width: 0; }
.wcard:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: transparent; }
.wcard-logo { width: 42px; height: 42px; border-radius: 10px; object-fit: cover; flex: none; background: #fff; border: 1px solid var(--line); }
.wcard-ph { display: inline-flex; align-items: center; justify-content: center; background: var(--theme); color: #fff; font-weight: 800; font-size: 18px; border: 0; }
.wcard-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.wcard-name { font-size: 14px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wcard-sum { font-size: 12px; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.45; }

/* 淡底描边徽标(8 类语义同前,视觉更轻) */
.gtag { display: inline-block; margin-left: 5px; padding: 0 5px; border-radius: 5px; font-size: 10px; font-style: normal; font-weight: 700; line-height: 1.6; vertical-align: 1px; border: 1px solid; background: transparent; }
.tag-rec { color: #e6482e; border-color: #f3b6ac; } .tag-hot { color: #d97706; border-color: #f3d1a3; }
.tag-new { color: #16a34a; border-color: #b2e3c3; } .tag-official { color: #2563eb; border-color: #b6ccf5; }
.tag-free { color: #0d9488; border-color: #a8dcd6; } .tag-vip { color: #b45309; border-color: #e5c793; }
.tag-exclusive { color: #7c3aed; border-color: #d4bdf5; } .tag-original { color: #db2777; border-color: #f2b8d4; }

.more-btn { display: block; width: calc(100% - 36px); margin: 0 18px 16px; padding: 8px; border: 1px dashed var(--line); border-radius: 10px; background: #fff; color: var(--theme); font-size: 13px; cursor: pointer; }
.more-btn:hover { background: var(--bg); }

/* 其它页(search/submit/404/article 复用) */
.msg { max-width: 720px; margin: 60px auto; text-align: center; color: var(--muted); }
.msg-404 { font-size: 64px; font-weight: 900; color: var(--theme); }
.formcard { max-width: 620px; margin: 24px auto; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.frm { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.frm label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: var(--muted); }
.frm input, .frm select { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; font-size: 14px; background: #fff; color: var(--fg); }
.frm .hp { display: none; }
.frm button { background: var(--theme); color: #fff; border: 0; padding: 12px; border-radius: 10px; font-weight: 700; font-size: 15px; cursor: pointer; }
.tip { margin: 14px 20px 0; padding: 9px 13px; border-radius: 10px; font-size: 14px; }
.tip-ok { background: #e7f8ec; color: #1a7f37; } .tip-err { background: #fdecec; color: #c0392b; }
.article { max-width: 780px; } .article-body { padding: 18px; line-height: 1.85; } .article-body img { max-width: 100%; border-radius: 10px; } .article-back { padding: 0 18px 18px; }
.cat-hd { font-size: 15px; font-weight: 800; padding: 13px 18px; } /* 旧类兜底(article 等页用) */

.mft { text-align: center; color: var(--muted); font-size: 12px; padding: 28px 16px; line-height: 1.9; }
.mft a { color: var(--muted); }
.gotop { position: fixed; right: 18px; bottom: 22px; z-index: 30; width: 42px; height: 42px; border-radius: 50%; background: #fff; color: var(--theme); text-align: center; line-height: 42px; font-size: 20px; box-shadow: var(--shadow); }

/* 汉堡 + 抽屉(移动端左树) */
.hd-menu { display: none; position: fixed; top: 10px; left: 10px; z-index: 70; width: 38px; height: 38px; border: 0; border-radius: 10px; background: #fff; box-shadow: var(--shadow); color: var(--fg); font-size: 18px; cursor: pointer; }
.drawer-mask { display: none; position: fixed; inset: 0; background: rgba(20,30,40,.4); z-index: 55; }
@media (max-width: 900px) {
  .mtop-inner { padding-left: 56px; }
  .hd-menu { display: inline-flex; align-items: center; justify-content: center; }
  .mwrap { display: block; }
  .mtree { position: fixed; top: 0; left: 0; width: 230px; height: 100vh; max-height: none; z-index: 60; transform: translateX(-110%); transition: transform .25s; background: #fff; padding: 56px 10px 10px; }
  .mtree-nav { box-shadow: none; }
  body.drawer-open .mtree { transform: translateX(0); }
  body.drawer-open .drawer-mask { display: block; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ===== skin-0014 胶囊覆盖:马卡龙 chip 流(粉调背景) ===== */
body { background: #fdf6f9; }
.chips { display: flex; flex-wrap: wrap; gap: 9px; padding: 14px 18px 18px; }
.chip { padding: 7px 16px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: #4b3a44; border: 1px solid transparent; transition: transform .15s, box-shadow .15s; }
.chip:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(150,80,120,.18); }
.chip-top { border-color: rgba(75,58,68,.4); font-weight: 800; }
.chip .gtag { background: rgba(255,255,255,.7); border-color: transparent; }
.mpill { background: #fff; }
