/* 本站专属样式（A · 晨露）。通用组件的样式在 assets/engine/style.css，不要改那份。 */

/* ---------- 全站：柔和光斑背景 ---------- */
body{
  background-color:var(--paper);
  background-image:
    radial-gradient(640px 420px at 100% -4%, color-mix(in srgb,var(--chili) 14%,transparent), transparent 70%),
    radial-gradient(560px 380px at -6% 24%, color-mix(in srgb,var(--go) 16%,transparent), transparent 70%);
  background-repeat:no-repeat;
}
h1,h2{ letter-spacing:-.01em; font-weight:800; }
.topbar{ background:color-mix(in srgb,var(--paper) 82%,transparent); }
.brand-name{ font-weight:800; background:linear-gradient(90deg,var(--accent-ink),var(--accent) 60%,var(--chili)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.topnav-link.is-active{ box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 35%,transparent); }

/* ---------- 首页顶部 ---------- */
.hero{ overflow:hidden; background:none; }
.hero::before,.hero::after{ content:""; position:absolute; border-radius:50%; pointer-events:none; filter:blur(8px); }
.hero::before{ width:520px; height:520px; right:-120px; top:-160px; background:radial-gradient(circle at 40% 40%,color-mix(in srgb,var(--chili) 34%,transparent),transparent 68%); }
.hero::after{ width:560px; height:460px; left:-160px; bottom:-220px; background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--go) 38%,transparent),transparent 70%); }
.hero-inner{ position:relative; z-index:1; padding-top:34px; padding-bottom:64px; }
.hero h1{ font-size:clamp(2.3rem,5.4vw,4rem); line-height:1.2; font-weight:900; }
.hero h1 mark{ background:linear-gradient(transparent 72%,color-mix(in srgb,var(--gold) 60%,transparent) 72% 94%,transparent 94%); color:var(--chili); padding:0 .08em; }
.hero .eyebrow{ background:var(--card); border:1.5px solid var(--line); color:var(--accent-ink); box-shadow:var(--shadow); }
.hero-lead{ color:var(--ink-2); }
.hero-tips{ background:var(--card); border:1.5px solid var(--line); border-radius:28px; box-shadow:var(--shadow); padding:22px 24px 18px; max-width:420px; justify-self:end; width:100%; transform:rotate(1.2deg); }
.ht-head{ display:flex; justify-content:space-between; align-items:center; padding-bottom:12px; border-bottom:2px dashed var(--line); }
.ht-title{ font-family:var(--f-ms); font-weight:800; color:var(--ink); font-size:1.05rem; }
.ht-tag{ font-size:.78rem; font-weight:700; padding:3px 12px; border-radius:99px; background:var(--chili-soft); color:var(--chili); }
.ht-list{ list-style:none; margin:14px 0 6px; padding:0; display:flex; flex-direction:column; gap:10px; }
.ht-list li{ display:grid; grid-template-columns:30px 1fr; gap:10px; align-items:start; padding:11px 13px; border-radius:16px; background:var(--peach-soft); }
.ht-list li:nth-child(2){ background:var(--go-soft); }
.ht-list li:nth-child(3){ background:var(--lilac-soft); }
.ht-num{ width:28px; height:28px; border-radius:50%; background:var(--ink); color:var(--paper); font-weight:800; font-size:.85rem; display:grid; place-items:center; }
.ht-list b{ display:block; color:var(--ink); font-size:.95rem; }
.ht-list span{ color:var(--ink-2); font-size:.85rem; }

/* ---------- 分类卡片：每张一个颜色 ---------- */
.hub-group{ font-family:var(--f-ms); font-style:italic; font-weight:600; font-size:1.05rem; color:var(--chili); letter-spacing:.02em; }
.level-card{ --c:var(--accent); --cs:var(--accent-soft); position:relative; overflow:hidden; border:1.5px solid var(--line); border-radius:var(--r); padding:26px 24px 22px; background:linear-gradient(165deg,var(--cs) 0,var(--card) 46%); box-shadow:0 1px 2px rgba(14,59,44,.04); }
.level-card::after{ content:""; position:absolute; right:-46px; top:-46px; width:150px; height:150px; border-radius:50%; background:color-mix(in srgb,var(--c) 18%,transparent); transition:transform .3s ease; }
.level-card:hover{ transform:translateY(-4px); box-shadow:0 18px 36px color-mix(in srgb,var(--c) 22%,transparent); border-color:var(--c); }
.level-card:hover::after{ transform:scale(1.25); }
.level-card > *{ position:relative; z-index:1; }
@media (min-width:901px){
  .levels{ grid-template-columns:repeat(2,1fr); }
  .level-card:nth-of-type(5){ grid-column:1/-1; }
  .level-card:nth-of-type(5) .level-can{ columns:3; }
}
.level-foot{ justify-content:flex-start; gap:.3em; }
.level-foot .level-go{ margin-left:auto; }
.level-card:nth-of-type(1){ --c:var(--sky); --cs:var(--sky-soft); }
.level-card:nth-of-type(2){ --c:var(--lilac); --cs:var(--lilac-soft); }
.level-card:nth-of-type(3){ --c:var(--chili); --cs:var(--chili-soft); }
.level-card:nth-of-type(4){ --c:var(--peach); --cs:var(--peach-soft); }
.level-card:nth-of-type(5){ --c:var(--go); --cs:var(--go-soft); }
.level-code{ background:var(--c); color:#fff; font-weight:800; }
html[data-mode="dark"] .level-code{ color:#06261A; }
.level-name{ font-size:1.65rem; font-weight:800; }
.level-who{ color:var(--c); }
.level-can li::before{ background:var(--c); border-radius:50%; clip-path:none; width:.5em; height:.5em; top:.7em; }
.level-go{ color:var(--c); transition:transform .2s; }
.level-card:hover .level-go{ transform:translateX(5px); }

/* ---------- 路线格 ---------- */
.day{ border-radius:var(--r-sm); }
.day-no{ font-weight:800; }
.day.is-today{ box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 22%,transparent); }
.pbar{ height:12px; }
.pbar span{ background:linear-gradient(90deg,var(--accent),var(--go),var(--gold)); }

/* ---------- 列表页 ---------- */
.group-head{ border-bottom:3px solid var(--accent); }
.toc-row{ border-radius:var(--r-sm); transition:transform .15s,box-shadow .15s,border-color .15s; }
.toc-row:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }
.toc-no{ font-weight:800; }
.page-code{ background:linear-gradient(135deg,var(--accent),var(--chili)); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:900; }
.jump a.is-on{ box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 32%,transparent); }

/* ---------- 笔记页 ---------- */
.note-main{ border-radius:30px; padding:40px 48px 44px; box-shadow:var(--shadow); border-color:var(--line); }
.note-head{ border-bottom:2px dashed var(--line); }
.note-pos{ background:var(--chili-soft); color:var(--chili); }
.note-h1{ font-weight:900; letter-spacing:-.015em; }
.note-sub{ color:var(--chili); }
.note-body h2{ font-weight:800; padding-top:.2em; }
.note-body h2::before{ width:.5em; height:.5em; border-radius:50%; clip-path:none; background:linear-gradient(135deg,var(--chili),var(--gold)); box-shadow:0 0 0 .22em color-mix(in srgb,var(--chili) 18%,transparent); }
.note-body h3{ font-weight:800; }
.note-body blockquote{ background:var(--accent-soft); border-left-color:var(--accent); border-radius:0 var(--r-sm) var(--r-sm) 0; }
.note-body table{ border-radius:var(--r-sm); overflow:hidden; }
.note-nav-link{ border-radius:var(--r-sm); transition:transform .15s,box-shadow .15s,border-color .15s; }
.note-nav-link:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }
.note-body pre code{ font-family:ui-monospace,Menlo,Consolas,'PingFang SC','Microsoft YaHei',monospace; }

/* ---------- 分隔线：三色条 ---------- */
.rebung-rule{ height:6px; margin-top:0; background:linear-gradient(90deg,var(--accent) 0 34%,var(--chili) 34% 67%,var(--gold) 67% 100%); opacity:.85; -webkit-mask:none; mask:none; }

@media (max-width:900px){
  .hero-tips{ justify-self:stretch; max-width:none; margin-top:8px; transform:none; }
  .hero-inner{ padding-bottom:40px; }
  .note-main{ border-radius:22px; padding:26px 20px 30px; }
  .level-card::after{ width:110px; height:110px; right:-36px; top:-36px; }
}
@media (prefers-reduced-motion:reduce){
  .level-card,.level-card::after,.level-go,.toc-row,.note-nav-link{ transition:none; }
  .level-card:hover,.toc-row:hover,.note-nav-link:hover{ transform:none; }
}
