/* 拾灯剧志 — 月白青瓷配色，单页追剧工具站 */
*,*::before,*::after{box-sizing:border-box}
:root{
  --paper:#eef2ee;
  --paper-2:#f7faf6;
  --paper-3:#e2e9e3;
  --ink:#1c2a27;
  --ink-2:#445852;
  --ink-3:#6c817a;
  --celadon:#6f9b8e;
  --celadon-deep:#2f5349;
  --cinnabar:#b23a2b;
  --amberlight:#c79b4c;
  --line:#c9d6ce;
  --line-2:#aebfb5;
  --shadow:0 1px 0 #ffffff inset,0 2px 10px rgba(47,83,73,.07);
  --radius:14px;
  --font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --font-num:"SF Mono",Menlo,Consolas,monospace;
}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:var(--paper);
  background-image:
    radial-gradient(circle at 12% 8%,rgba(111,155,142,.14),transparent 42%),
    radial-gradient(circle at 92% 0%,rgba(199,155,76,.12),transparent 38%);
  background-attachment:fixed;
  line-height:1.8;
  font-size:16px;
  overflow-wrap:break-word;
}
img,svg{max-width:100%;height:auto}
a{color:var(--celadon-deep);text-underline-offset:3px}
a:hover{color:var(--cinnabar)}
:focus-visible{outline:2px solid var(--cinnabar);outline-offset:2px;border-radius:4px}

.wrap{width:100%;max-width:1040px;margin:0 auto;padding:0 18px}

/* 顶栏 */
.topbar{
  position:sticky;top:0;z-index:30;
  background:rgba(238,242,238,.93);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.topbar .wrap{display:flex;align-items:center;gap:14px;min-height:58px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.brand{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:.04em;white-space:nowrap;text-decoration:none;color:var(--ink)}
.brand .mark{width:26px;height:26px;flex:0 0 26px}
.brand small{display:block;font-weight:400;font-size:11px;color:var(--ink-3);letter-spacing:.08em;line-height:1.2}
.navlinks{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;min-width:0}
.navlinks a{
  font-size:12.5px;text-decoration:none;color:var(--ink-2);
  padding:4px 9px;border-radius:999px;border:1px solid transparent;line-height:1.6;
}
.navlinks a:hover{background:var(--paper-2);border-color:var(--line);color:var(--celadon-deep)}

/* 头图 */
.hero{padding:34px 0 10px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:center}
h1{margin:0 0 14px;line-height:1.28;font-weight:800;letter-spacing:.01em}
.h1-kw{display:block;font-size:clamp(1.5rem,6.1vw,2.9rem);color:var(--celadon-deep)}
.h1-sub{display:block;font-size:clamp(.95rem,3.3vw,1.3rem);color:var(--ink-2);font-weight:600;margin-top:6px}
.lede{margin:0 0 16px;color:var(--ink-2);font-size:clamp(.94rem,2.9vw,1.02rem);max-width:60ch}
.notice{
  border-left:3px solid var(--cinnabar);
  background:var(--paper-2);
  padding:11px 14px;border-radius:0 10px 10px 0;
  font-size:.88rem;color:var(--ink-2);margin:0 0 18px;
}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;margin:0 0 6px;padding:0;list-style:none}
.facts li{
  background:var(--paper-2);border:1px solid var(--line);border-radius:12px;
  padding:10px 12px;box-shadow:var(--shadow);min-width:0;
}
.facts b{display:block;font-family:var(--font-num);font-size:1.32rem;color:var(--cinnabar);line-height:1.3}
.facts span{display:block;font-size:.76rem;color:var(--ink-3);letter-spacing:.06em}
.heroart{justify-self:center;width:min(300px,78%)}

@media(min-width:860px){
  .hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  .heroart{width:100%}
}

/* 区块 */
section{padding:30px 0 6px;scroll-margin-top:112px}
@media(min-width:700px){section{scroll-margin-top:70px}}
.sec-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px}
h2{
  margin:0;font-size:clamp(1.18rem,4.2vw,1.55rem);font-weight:800;letter-spacing:.01em;
  color:var(--celadon-deep);
}
.sec-head .tag{font-size:.74rem;color:var(--ink-3);border:1px solid var(--line);border-radius:999px;padding:2px 9px;letter-spacing:.08em}
.sec-intro{color:var(--ink-2);margin:8px 0 18px;max-width:66ch;font-size:.95rem}

/* 卡片 */
.card{
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;box-shadow:var(--shadow);
}

/* 资料表 */
.spec{width:100%;border-collapse:collapse;font-size:.93rem}
.spec th,.spec td{padding:9px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.spec th{width:34%;color:var(--ink-3);font-weight:600;white-space:nowrap}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}

/* 进度表 */
.tracker-top{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.bar{flex:1 1 200px;min-width:160px;height:12px;background:var(--paper-3);border-radius:999px;overflow:hidden;border:1px solid var(--line)}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--celadon),var(--celadon-deep));transition:width .22s ease}
.tracker-stat{font-family:var(--font-num);font-size:.95rem;color:var(--celadon-deep);white-space:nowrap}
.grid-ep{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:7px;margin:0 0 12px}
.ep-cell{
  appearance:none;font:inherit;cursor:pointer;
  aspect-ratio:1/1;min-height:40px;
  border:1px solid var(--line-2);border-radius:9px;
  background:var(--paper-2);color:var(--ink-2);
  font-family:var(--font-num);font-size:.86rem;
  display:flex;align-items:center;justify-content:center;
  transition:transform .12s ease,background .15s ease,color .15s ease;
}
.ep-cell:hover{transform:translateY(-2px);border-color:var(--celadon)}
.ep-cell[aria-pressed="true"]{background:var(--celadon-deep);color:#f4f8f4;border-color:var(--celadon-deep);font-weight:700}
.ep-cell.is-flag{box-shadow:0 0 0 2px var(--amberlight)}
.tracker-next{margin:0 0 12px;font-size:.92rem;color:var(--ink-2)}
.tracker-next b{color:var(--cinnabar);font-family:var(--font-num)}
.btnrow{display:flex;gap:9px;flex-wrap:wrap}
.btn{
  appearance:none;font:inherit;font-size:.86rem;cursor:pointer;
  border:1px solid var(--line-2);background:var(--paper);color:var(--ink-2);
  padding:7px 14px;border-radius:999px;
}
.btn:hover{border-color:var(--celadon);color:var(--celadon-deep);background:var(--paper-2)}
.btn.danger[data-armed="1"]{border-color:var(--cinnabar);color:var(--cinnabar);background:#fbeeec}
.storage-note{font-size:.82rem;color:var(--ink-3);margin:12px 0 0;border-top:1px dashed var(--line);padding-top:10px}

/* 案件检索 */
.filterbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.chip{
  appearance:none;font:inherit;font-size:.84rem;cursor:pointer;
  border:1px solid var(--line-2);background:var(--paper-2);color:var(--ink-2);
  padding:6px 13px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;
}
.chip svg{width:14px;height:14px;flex:0 0 14px}
.chip[aria-pressed="true"]{background:var(--celadon-deep);border-color:var(--celadon-deep);color:#f4f8f4}
.searchbox{flex:1 1 180px;min-width:140px;display:flex;align-items:center;gap:7px;border:1px solid var(--line-2);background:var(--paper-2);border-radius:999px;padding:5px 13px}
.searchbox svg{width:15px;height:15px;flex:0 0 15px;color:var(--ink-3)}
.searchbox input{flex:1 1 auto;min-width:0;border:0;background:transparent;font:inherit;font-size:.88rem;color:var(--ink);outline:none}
.hitline{font-size:.84rem;color:var(--ink-3);margin:0 0 12px}
.arcs{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:0;padding:0;list-style:none}
@media(min-width:720px){.arcs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.arc{
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 15px;box-shadow:var(--shadow);min-width:0;
  border-left:4px solid var(--celadon);
}
.arc[hidden]{display:none}
.arc h3{margin:0 0 4px;font-size:1.02rem;letter-spacing:.01em}
.arc .range{font-family:var(--font-num);font-size:.84rem;color:var(--cinnabar);margin:0 0 8px}
.arc p.why{margin:0 0 10px;font-size:.9rem;color:var(--ink-2)}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px;padding:0;list-style:none}
.tags li{font-size:.74rem;color:var(--celadon-deep);background:var(--paper-3);border-radius:999px;padding:2px 9px;letter-spacing:.05em}
.empty{padding:18px;text-align:center;color:var(--ink-3);font-size:.9rem;border:1px dashed var(--line-2);border-radius:var(--radius)}

/* 起看点 */
.starter-opts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.starter-out{border:1px solid var(--line);border-left:4px solid var(--amberlight);background:var(--paper-2);border-radius:0 12px 12px 0;padding:14px 16px}
.starter-out h3{margin:0 0 6px;font-size:1rem;color:var(--celadon-deep)}
.starter-out p{margin:0;font-size:.92rem;color:var(--ink-2)}
.starter-out .pick{font-family:var(--font-num);color:var(--cinnabar);font-weight:700}

/* 分集速览 */
.ep-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0}
@media(min-width:760px){.ep-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:26px}}
.ep-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;padding:9px 0;border-bottom:1px solid var(--line);min-width:0}
.ep-no{font-family:var(--font-num);font-size:.8rem;color:#fff;background:var(--celadon);border-radius:6px;padding:1px 7px;height:fit-content;white-space:nowrap}
.ep-list p{margin:0;font-size:.9rem;color:var(--ink-2)}
details.fold{margin-top:4px}
details.fold>summary{cursor:pointer;font-size:.9rem;color:var(--celadon-deep);padding:8px 0;list-style:none;font-weight:600}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary::before{content:"▸";display:inline-block;margin-right:7px;transition:transform .15s}
details.fold[open]>summary::before{transform:rotate(90deg)}

/* 文章段落 */
.prose p{margin:0 0 13px;font-size:.95rem;color:var(--ink-2)}
.prose h3{margin:18px 0 7px;font-size:1rem;color:var(--ink)}
.prose ul{margin:0 0 13px;padding-left:1.1em;font-size:.93rem;color:var(--ink-2)}
.prose li{margin-bottom:6px}
.two-col{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media(min-width:800px){.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 页脚 */
footer{margin-top:40px;border-top:1px solid var(--line);background:var(--paper-2)}
footer .wrap{padding-top:22px;padding-bottom:28px}
footer p{margin:0 0 8px;font-size:.84rem;color:var(--ink-3)}
footer .foot-brand{font-weight:700;color:var(--ink-2);font-size:.95rem}

/* 404 */
.nf{min-height:62vh;display:flex;align-items:center;padding:40px 0}
.nf-art{width:min(190px,52%);margin:0 auto 20px;display:block}
.nf h1{text-align:center}
.nf .h1-kw{color:var(--cinnabar)}
.nf p{text-align:center;color:var(--ink-2);max-width:54ch;margin:0 auto 16px;font-size:.95rem}
.nf .btnrow{justify-content:center}
.nf .btn{background:var(--celadon-deep);color:#f4f8f4;border-color:var(--celadon-deep);text-decoration:none}
.nf .btn:hover{background:var(--cinnabar);border-color:var(--cinnabar);color:#fff}
.nf .btn.ghost{background:transparent;color:var(--ink-2);border-color:var(--line-2)}
.nf .btn.ghost:hover{color:var(--celadon-deep);background:var(--paper-2)}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}