/* cemc-pages.css — component library from approved design-mockup.html (2026-08-20) */

/* highlighter system */
.hl{background:linear-gradient(100deg,rgba(175,199,47,.38),rgba(0,165,181,.26));padding:1px 5px 2px;border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hl-gold{background:linear-gradient(100deg,rgba(242,199,68,.5),rgba(242,199,68,.2));padding:1px 5px 2px;border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.u-red{border-bottom:2px solid var(--red);padding-bottom:1px}

/* icon system — one stroke family */
.ico{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ico.lg{width:22px;height:22px}
.ico.sm{width:15px;height:15px}

/* reveal on load */
@keyframes settle{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.rv{animation:settle .6s cubic-bezier(.2,.6,.2,1) both}
.rv-1{animation-delay:.05s}.rv-2{animation-delay:.14s}.rv-3{animation-delay:.23s}.rv-4{animation-delay:.32s}
@media(prefers-reduced-motion:reduce){.rv{animation:none}}

/* ================= MODULE FURNITURE ================= */
.mod-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.mchip{font:600 10.5px/1 "Spline Sans Mono",monospace;letter-spacing:.14em;padding:7px 10px;border-radius:2px;white-space:nowrap}
.mchip.t{background:var(--teal-ink);color:#EAF4F2}
.mchip.g{background:var(--gold);color:var(--ink)}
.mchip.l{background:var(--lime);color:var(--ink)}
.mchip.r{background:var(--red-ink);color:#F7E9E2}
.mlab{font:500 11px/1.7 "Spline Sans Mono",monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--teal-ink)}
.mrule{flex:1;height:3px;background:var(--grad);opacity:.45;border-radius:2px}
.mqed{color:var(--faint);font-size:13px}
.sec{padding:84px 0 72px}
.sec h2{font:400 clamp(28px,2.8vw,38px)/1.12 "Instrument Serif",Georgia,serif;margin-bottom:34px}
.sec h2 em{font-style:italic;color:var(--teal-ink)}
.close-line{display:flex;align-items:center;gap:16px;margin-top:54px}
.close-line::before{content:"";flex:1;height:1px;background:var(--line)}
.close-line .qed{font-size:19px;color:var(--ink);line-height:1}
.close-line .cap{font:italic 400 13.5px/1.4 "STIX Two Text",Georgia,serif;color:var(--faint)}

/* figure plates */
.fig{border:1px solid var(--line);background:var(--raised);padding:10px 10px 0;box-shadow:0 1px 0 rgba(20,32,29,.05)}
.fig .ph{position:relative;overflow:hidden;background:var(--sunken)}
.fig .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(.22) saturate(.86) contrast(1.02)}
.fig .ph::after{content:"";position:absolute;inset:0;background:rgba(11,90,99,.15);mix-blend-mode:color;pointer-events:none}
.fig .ph::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(14,37,35,.16));z-index:1;pointer-events:none}
.fig figcaption{display:flex;align-items:baseline;gap:12px;padding:10px 4px 12px}
.fig figcaption b{font:600 10px/1.6 "Spline Sans Mono",monospace;letter-spacing:.16em;color:var(--teal-ink);white-space:nowrap}
.fig figcaption span{font:italic 400 12.5px/1.5 "STIX Two Text",Georgia,serif;color:var(--soft);flex:1}
.fig figcaption i{font:400 8.5px/1.8 "Spline Sans Mono",monospace;letter-spacing:.12em;color:var(--faint);white-space:nowrap;font-style:normal}

/* ================= HERO ================= */
.hero{padding:66px 0 0}
.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:start}
.kicker{font:500 11px/1.7 "Spline Sans Mono",monospace;letter-spacing:.28em;text-transform:uppercase;color:var(--teal-ink);display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:9px;height:9px;background:var(--teal);transform:rotate(45deg)}
.hero h1{font:400 clamp(38px,4.1vw,58px)/1.08 "Instrument Serif",Georgia,serif;letter-spacing:-.008em;margin:20px 0 24px}
.hero h1 em{font-style:italic;color:var(--teal-ink)}
.hero .lede{font-size:18px;color:var(--soft);max-width:540px;margin-bottom:30px}
.cta-row{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.btn-main{background:var(--ink);color:#F2F6F3;font:500 13px/1 "Spline Sans Mono",monospace;letter-spacing:.14em;text-transform:uppercase;padding:17px 26px;border-radius:2px;transition:.16s;display:inline-flex;align-items:center;gap:12px;border:1px solid var(--ink)}
.btn-main::after{content:"∎";font-size:10px;color:var(--gold)}
.btn-main:hover{background:var(--teal-ink);border-color:var(--teal-ink);transform:translateY(-1px)}
.alt-link{font:italic 400 17px/1.4 "STIX Two Text",Georgia,serif;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;transition:.16s}
.alt-link:hover{color:var(--teal-ink);border-color:var(--teal)}
.axiom{margin-top:34px;font:500 10px/1.8 "Spline Sans Mono",monospace;letter-spacing:.22em;color:var(--faint);text-transform:uppercase;display:flex;align-items:center;gap:12px}
.axiom .sq{width:8px;height:8px;background:var(--lime);transform:rotate(45deg);flex:none}
.hero-fig .ph{aspect-ratio:4/3.05}

/* notation strip */
.notation{margin-top:58px;border-top:3px double var(--line);border-bottom:3px double var(--line);padding:19px 24px;display:flex;justify-content:center;align-items:baseline;gap:15px;row-gap:10px;flex-wrap:wrap;background:var(--raised);position:relative}
.notation::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--grad);opacity:.8}
.notation .item{font:500 14px/1.5 "Spline Sans Mono",monospace;letter-spacing:.04em;color:var(--ink)}
.notation .item b{color:var(--teal-ink);font-weight:600}
.notation .item.gold b{color:var(--gold-ink)}
.notation .item.red b{color:var(--red-ink)}
.notation .tomb{color:var(--faint);font-size:11px}
.notation .tomb.edge{color:var(--teal)}

/* ================= DEFINITIONS MODULE ================= */
.defgrid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-top:3px solid var(--teal);background:var(--raised)}
.dcell{padding:24px 26px 26px;border-left:1px solid var(--hair)}
.dcell:first-child{border-left:none}
.dcell .dic{color:var(--teal-ink);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}
.dcell .dic .ord{font:400 22px/1 "Instrument Serif",Georgia,serif;color:var(--teal);font-style:italic}
.dcell .dn{font:600 10.5px/1.6 "Spline Sans Mono",monospace;letter-spacing:.18em;color:var(--teal-ink);margin-bottom:9px;display:block;text-transform:uppercase}
.dcell p{font-size:14.5px;line-height:1.62;color:var(--soft)}
.dcell p b{color:var(--ink);font-weight:600}
.dcell.hot{background:linear-gradient(180deg,rgba(188,67,39,.06),rgba(188,67,39,0) 70%);box-shadow:inset 0 3px 0 var(--red)}
.dcell.hot .dic,.dcell.hot .dn,.dcell.hot .dic .ord{color:var(--red-ink)}
.dcell.hot p b{color:var(--red-ink)}

/* ================= PROPOSITIONS MODULE ================= */
.propgrid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-top:none;background:var(--raised)}
.pcell{padding:30px 32px 84px;border-left:1px solid var(--hair);position:relative;transition:.16s}
.pcell:first-child{border-left:none}
.pcell::before{content:"";position:absolute;top:0;left:0;right:0;height:3px}
.pcell.c1::before{background:var(--teal)}
.pcell.c2::before{background:var(--lime)}
.pcell.c3::before{background:var(--gold)}
.pcell:hover{background:#FDFEFC}
.pcell .phead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.pcell .pn{font:600 10px/1 "Spline Sans Mono",monospace;letter-spacing:.2em;padding:6px 10px;border-radius:2px}
.pcell.c1 .pn{background:var(--teal-tint);color:var(--teal-ink)}
.pcell.c2 .pn{background:var(--lime-tint);color:var(--lime-ink)}
.pcell.c3 .pn{background:var(--gold-tint);color:var(--gold-ink)}
.pcell .phead .ico{color:var(--teal-ink)}
.pcell.c2 .phead .ico{color:var(--lime-ink)}
.pcell.c3 .phead .ico{color:var(--gold-ink)}
.pcell .num{font:400 46px/1 "Instrument Serif",Georgia,serif;color:var(--teal-ink);margin-bottom:12px}
.pcell.c2 .num{color:var(--lime-ink)}
.pcell.c3 .num{color:var(--gold-ink)}
.pcell h3{font:500 12.5px/1.5 "Spline Sans Mono",monospace;letter-spacing:.2em;text-transform:uppercase;margin-bottom:13px}
.pcell p{font-size:15px;line-height:1.66;color:var(--soft)}
.pcell .fact{display:inline-block;margin-top:15px;padding:7px 12px;font:italic 400 13.5px/1.55 "STIX Two Text",Georgia,serif;border-radius:2px;border-left:3px solid}
.pcell .fact.red{color:var(--red-ink);background:var(--red-tint);border-color:var(--red)}
.pcell .fact.green{color:var(--lime-ink);background:var(--lime-tint);border-color:var(--lime)}
.pcell .fact.gold{color:var(--gold-ink);background:var(--gold-tint);border-color:var(--gold)}
.pcell .pread{position:absolute;left:32px;bottom:28px;font:500 11px/1 "Spline Sans Mono",monospace;letter-spacing:.18em;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:4px;transition:.16s;text-transform:uppercase}
.pcell:hover .pread{color:var(--teal-ink);border-color:var(--teal)}
.pcell .endt{position:absolute;right:28px;bottom:26px;color:var(--faint);font-size:14px}

/* ================= SYLLABUS — THE SEVEN BOOKS ================= */
.corpus{background:
  repeating-linear-gradient(0deg,rgba(20,32,29,.03) 0 1px,transparent 1px 30px),
  var(--surface);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.corpus-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:80px;align-items:start}
.corpus-left p{color:var(--soft);font-size:16px;margin:20px 0 24px;max-width:400px}
.corpus-left .note{font:500 10px/1.8 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--faint);text-transform:uppercase;border-top:1px solid var(--hair);padding-top:16px;max-width:400px}
.corpus-left .alt-link{display:inline-block;margin-top:24px}
.toc{border:1px solid var(--line);border-top:3px solid var(--lime);background:var(--raised)}
.toc-row{display:grid;grid-template-columns:24px 76px 1fr auto;gap:16px;align-items:center;padding:15px 20px;border-top:1px solid var(--hair);transition:.16s;position:relative}
.toc-row:first-child{border-top:none}
.toc-row::before{content:"";position:absolute;left:0;top:-1px;bottom:0;width:3px;background:var(--grad);opacity:0;transition:.16s}
.toc-row:hover{background:#FDFEFC;padding-left:26px}
.toc-row:hover::before{opacity:1}
.toc-row .ico{color:var(--teal-ink);width:17px;height:17px}
.toc-row .bk{font:600 10px/1.5 "Spline Sans Mono",monospace;letter-spacing:.14em;color:var(--teal-ink);background:var(--teal-tint);padding:5px 8px;border-radius:2px;text-align:center}
.toc-row .tt{font:400 21px/1.25 "Instrument Serif",Georgia,serif;display:flex;align-items:baseline;gap:14px;min-width:0}
.toc-row .tt::after{content:"";flex:1;border-bottom:1px dotted var(--line);transform:translateY(-4px)}
.toc-row:hover .tt{color:var(--teal-ink)}
.toc-row .gloss{font:italic 400 13px/1.5 "STIX Two Text",Georgia,serif;color:var(--faint);text-align:right}
.toc-row:hover .gloss{color:var(--soft)}

/* ================= SEASON MODULE ================= */
.seasongrid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:var(--raised);margin-top:8px}
.seasongrid::before{content:"";position:absolute;top:-1px;left:0;right:0;height:3px;background:var(--grad)}
.stop{position:relative;padding:34px 26px 30px;border-left:1px solid var(--hair)}
.stop:first-child{border-left:none}
.stop .dot{position:absolute;top:-7px;left:26px;width:12px;height:12px;transform:rotate(45deg);background:var(--teal);box-shadow:0 0 0 4px var(--raised)}
.stop.deadline .dot{background:var(--red)}
.stop.sitting .dot{background:var(--ink);box-shadow:0 0 0 2px var(--teal),0 0 0 6px var(--raised)}
.stop.after .dot{background:var(--gold)}
.stop .when{font:600 12px/1.5 "Spline Sans Mono",monospace;letter-spacing:.14em;color:var(--teal-ink);text-transform:uppercase}
.stop.deadline .when{color:var(--red-ink)}
.stop.after .when{color:var(--gold-ink)}
.stop .trow{display:flex;align-items:center;gap:11px;margin:12px 0 8px;color:var(--ink)}
.stop .trow .ico{color:var(--teal-ink)}
.stop.deadline .trow .ico{color:var(--red-ink)}
.stop.after .trow .ico{color:var(--gold-ink)}
.stop h3{font:400 22.5px/1.15 "Instrument Serif",Georgia,serif}
.stop p{font-size:14px;line-height:1.6;color:var(--soft)}
.stop .chip{display:inline-block;margin-top:12px;font:600 9.5px/1 "Spline Sans Mono",monospace;letter-spacing:.18em;text-transform:uppercase;padding:6px 10px;border-radius:2px;color:#F7E9E2;background:var(--red-ink)}
.stop.deadline{background:linear-gradient(180deg,rgba(188,67,39,.05),rgba(188,67,39,0) 75%)}

/* ================= COROLLARY ================= */
.coro{background:var(--sunken);border-top:3px solid var(--gold);border-bottom:1px solid var(--line)}
.coro-grid{display:grid;grid-template-columns:1.25fr .85fr;gap:70px;align-items:center;padding:74px 0 68px}
.coro .seal-mark{margin-bottom:20px}
.coro .seal-mark svg{width:46px;height:42px}
.coro .k{font:500 10.5px/1.7 "Spline Sans Mono",monospace;letter-spacing:.26em;color:var(--gold-ink);text-transform:uppercase}
.coro .stmt{font:400 clamp(24px,2.6vw,34px)/1.32 "Instrument Serif",Georgia,serif;margin:16px 0 30px;max-width:640px}
.coro .stmt em{font-style:italic;color:var(--teal-ink)}
.coro-notes{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);max-width:640px}
.coro-note{padding:18px 26px 0 0}
.coro-note + .coro-note{border-left:1px solid var(--line);padding-left:26px;padding-right:0}
.coro-note .n{font:600 10.5px/1.6 "Spline Sans Mono",monospace;letter-spacing:.18em;color:var(--teal-ink);text-transform:uppercase;display:block;margin-bottom:8px}
.coro-note p{font-size:14.5px;line-height:1.62;color:var(--soft)}
.coro-fig .ph{aspect-ratio:3/2}

/* ================= RESULTS — THE DISTINCTION LINE ================= */
.results-panel{position:relative;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:2px;background:
  repeating-linear-gradient(0deg,rgba(11,90,99,.05) 0 1px,transparent 1px 26px),
  repeating-linear-gradient(90deg,rgba(11,90,99,.05) 0 1px,transparent 1px 26px),
  linear-gradient(135deg,#E9F2E4,#D8ECE9 62%,#D3EAE9);
  padding:50px 54px 46px;overflow:hidden}
.results-panel .corner-q{position:absolute;right:22px;bottom:16px;color:var(--teal-ink);font-size:16px}
.results-panel .mod-head{margin-bottom:10px}
.results-panel h2{margin-bottom:6px}
.results-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:52px}
.results-head .src{font:500 10px/1.8 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--teal-ink);text-transform:uppercase;text-align:right}
/* the scale */
.scale{position:relative;height:120px;margin:0 6px}
.scale .track{position:absolute;left:0;right:0;top:58px;height:8px;background:rgba(20,32,29,.22);border-radius:99px}
.scale .zone{position:absolute;left:66%;right:0;top:58px;height:8px;background:linear-gradient(90deg,var(--gold),#EDBB2E);border-radius:0 99px 99px 0}
.scale .end{position:absolute;top:76px;font:500 11px/1 "Spline Sans Mono",monospace;color:var(--faint);letter-spacing:.1em}
.scale .end.zero{left:0}.scale .end.hund{right:0}
.scale .mark{position:absolute;top:44px;width:2.5px;height:36px;background:var(--ink)}
.scale .mark.avg{left:52.2%}
.scale .mark.dist{left:66%;background:var(--gold-ink)}
.scale .flag{position:absolute;font:500 10.5px/1.5 "Spline Sans Mono",monospace;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.scale .flag.avg{left:52.2%;top:88px;transform:translateX(-50%);color:var(--ink);text-align:center}
.scale .flag.avg b{display:block;font-size:16px;letter-spacing:.02em}
.scale .flag.dist{left:66%;top:0;transform:translateX(-50%);text-align:center;color:var(--gold-ink)}
.scale .flag.dist b{display:block;font-size:16px;letter-spacing:.02em}
.scale .zone-cap{position:absolute;right:0;top:22px;font:italic 400 13.5px/1.4 "STIX Two Text",Georgia,serif;color:var(--gold-ink)}
/* awards row + medal plate */
.awards{display:grid;grid-template-columns:1fr 1fr 1fr 1.05fr;margin-top:48px;border:1px solid rgba(20,32,29,.16);background:rgba(250,252,250,.6)}
.award{padding:22px 26px 24px;border-left:1px solid rgba(20,32,29,.12)}
.award:first-child{border-left:none}
.award .an{font:600 10px/1.5 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--gold-ink);text-transform:uppercase;display:flex;align-items:center;gap:9px;margin-bottom:12px}
.award .an .ico{color:var(--gold-ink);width:17px;height:17px}
.award h3{font:400 21px/1.2 "Instrument Serif",Georgia,serif;margin-bottom:8px}
.award p{font-size:13.5px;line-height:1.6;color:var(--soft)}
.award.figcell{padding:10px 10px 0;display:flex;flex-direction:column}
.award.figcell .fig{border:none;background:transparent;box-shadow:none;padding:0;display:flex;flex-direction:column;height:100%}
.award.figcell .ph{aspect-ratio:auto;flex:1;min-height:150px}

/* ================= CHRONICLE ================= */
.chron{background:
  repeating-linear-gradient(0deg,rgba(20,32,29,.03) 0 1px,transparent 1px 30px),
  var(--surface);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.chron .head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.chron .all{font:italic 400 15px/1.4 "STIX Two Text",Georgia,serif;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;transition:.16s}
.chron .all:hover{color:var(--teal-ink);border-color:var(--teal)}
.chron-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:66px;align-items:start}
.feat{border:1px solid var(--line);border-top:3px solid var(--teal);background:var(--raised);padding:28px 32px 30px}
.feat .fdate{display:flex;align-items:baseline;gap:14px;margin-bottom:14px}
.feat .fdate .d1{font:600 40px/1 "Spline Sans Mono",monospace;letter-spacing:-.04em;color:var(--teal-ink)}
.feat .fdate .d2{font:500 11px/1.5 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--faint);text-transform:uppercase}
.feat h3{font:400 30px/1.16 "Instrument Serif",Georgia,serif;margin-bottom:13px;transition:.16s}
.feat a:hover h3{color:var(--teal-ink)}
.feat .dek{font:italic 400 16px/1.6 "STIX Two Text",Georgia,serif;color:var(--soft)}
.tagchip{display:inline-block;font:600 10px/1 "Spline Sans Mono",monospace;letter-spacing:.18em;border-radius:2px;padding:6px 10px;text-transform:uppercase}
.tagchip.teal{color:var(--teal-ink);background:var(--teal-tint)}
.tagchip.gold{color:var(--gold-ink);background:var(--gold-tint)}
.tagchip.lime{color:var(--lime-ink);background:var(--lime-tint)}
.tagchip.plain{color:var(--soft);background:var(--sunken)}
.feat .tagchip{margin-top:18px}
.chron-list{display:flex;flex-direction:column}
.crow{display:grid;grid-template-columns:76px 1fr;gap:18px;padding:19px 2px;border-bottom:1px solid var(--line);align-items:baseline;transition:.16s;position:relative}
.crow:first-child{padding-top:2px}
.crow::after{content:"→";position:absolute;right:2px;top:50%;transform:translateY(-50%);color:var(--teal-ink);opacity:0;transition:.16s;font:400 15px/1 "Spline Sans Mono",monospace}
.crow:hover{padding-left:10px}
.crow:hover::after{opacity:1}
.crow .cd{font:500 10.5px/1.6 "Spline Sans Mono",monospace;letter-spacing:.1em;color:var(--faint);text-transform:uppercase}
.crow h4{font:400 20px/1.32 "Instrument Serif",Georgia,serif;transition:.16s;padding-right:20px}
.crow:hover h4{color:var(--teal-ink)}
.crow .ct{font:italic 400 13px/1.5 "STIX Two Text",Georgia,serif;color:var(--faint);margin-top:5px}
.crow .ct b{font:600 9.5px/1 "Spline Sans Mono",monospace;letter-spacing:.14em;text-transform:uppercase;font-style:normal}
.crow .ct b.gold{color:var(--gold-ink)}
.crow .ct b.lime{color:var(--lime-ink)}
.crow .ct b.plain{color:var(--soft)}

/* ================= CONSULT ================= */
.consult-panel{display:grid;grid-template-columns:1.35fr auto;gap:66px;align-items:center;background:var(--raised);border:1px solid var(--line);border-radius:2px;padding:54px 60px;position:relative;overflow:hidden}
.consult-panel::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--grad)}
.consult-panel .watermark{position:absolute;right:-40px;bottom:-52px;width:280px;height:280px;color:rgba(0,165,181,.07);pointer-events:none}
.consult-panel .watermark svg{width:100%;height:100%;stroke-width:1}
.consult h2{font:400 clamp(28px,2.8vw,38px)/1.16 "Instrument Serif",Georgia,serif;margin:16px 0 16px}
.consult h2 em{font-style:italic;color:var(--teal-ink)}
.consult p{color:var(--soft);max-width:500px;margin-bottom:28px}
.consult .side-note{font:500 10px/1.8 "Spline Sans Mono",monospace;letter-spacing:.18em;color:var(--faint);text-transform:uppercase;margin:16px 0 0}
.qr-stand{text-align:center;position:relative;z-index:1}
.qr-frame{position:relative;width:168px;height:168px;margin:0 auto 14px;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center}
.qr-frame::before,.qr-frame::after{content:"";position:absolute;width:18px;height:18px;border:2px solid var(--teal)}
.qr-frame::before{top:-6px;left:-6px;border-right:none;border-bottom:none}
.qr-frame::after{bottom:-6px;right:-6px;border-left:none;border-top:none}
.qr-frame svg{width:118px;height:118px}
.qr-stand .cap{font:500 10px/1.7 "Spline Sans Mono",monospace;letter-spacing:.14em;color:var(--soft);text-transform:uppercase;max-width:200px;margin:0 auto}

/* ================= SPECIMEN A — ARCHIVE ================= */
.archive{padding:76px 0 84px}
.arch-head{display:flex;justify-content:space-between;align-items:flex-end;gap:26px;flex-wrap:wrap;margin-bottom:8px}
.arch-head h2{font:400 clamp(30px,3.2vw,42px)/1.08 "Instrument Serif",Georgia,serif;margin-bottom:0}
.arch-head h2 em{font-style:italic;color:var(--teal-ink)}
.arch-head .count{font:500 11px/1.8 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--faint);text-transform:uppercase;text-align:right}
.filters{display:flex;gap:10px;flex-wrap:wrap;border-top:3px double var(--line);border-bottom:1px solid var(--hair);padding:18px 0;margin:26px 0 40px}
.fchip{font:600 10.5px/1 "Spline Sans Mono",monospace;letter-spacing:.16em;text-transform:uppercase;padding:9px 16px;border-radius:2px;border:1px solid var(--line);color:var(--soft);transition:.16s}
.fchip:hover{border-color:var(--teal);color:var(--teal-ink);background:var(--teal-tint)}
.fchip.on{background:var(--teal-ink);color:#EAF4F2;border-color:var(--teal-ink)}
.month-head{display:flex;align-items:baseline;gap:16px;margin-bottom:0}
.month-head .sq{width:9px;height:9px;background:var(--teal);transform:rotate(45deg) translateY(-1px)}
.month-head .m{font:400 26px/1 "Instrument Serif",Georgia,serif}
.month-head .c{font:500 10px/1.6 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--faint);text-transform:uppercase}
.month-head::after{content:"";flex:1;height:3px;background:var(--grad);opacity:.4;border-radius:2px}
.alist{border:1px solid var(--line);border-top:3px solid var(--teal);background:var(--raised);margin-top:22px}
.arow{display:grid;grid-template-columns:86px 1fr auto 104px;gap:24px;align-items:baseline;padding:20px 22px;border-top:1px solid var(--hair);transition:.16s;position:relative}
.arow:first-child{border-top:none}
.arow::before{content:"";position:absolute;left:0;top:-1px;bottom:0;width:3px;background:var(--grad);opacity:0;transition:.16s}
.arow .no{font:600 11px/1.6 "Spline Sans Mono",monospace;letter-spacing:.12em;color:var(--faint)}
.arow h3{font:400 22px/1.28 "Instrument Serif",Georgia,serif;transition:.16s}
.arow .ad{font:500 11px/1.6 "Spline Sans Mono",monospace;letter-spacing:.1em;color:var(--faint);text-align:right}
.arow:hover{background:#FDFEFC;padding-left:34px}
.arow:hover::before{opacity:1}
.arow:hover h3{color:var(--teal-ink)}
.arow:hover .no{color:var(--teal-ink)}
.pager{display:flex;justify-content:space-between;align-items:baseline;padding-top:26px}
.pager .pg{font:500 11px/1.6 "Spline Sans Mono",monospace;letter-spacing:.2em;color:var(--faint);text-transform:uppercase}
.pager a{font:500 11px/1 "Spline Sans Mono",monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:4px;transition:.16s}
.pager a:hover{color:var(--teal-ink);border-color:var(--teal)}
.pager a.off{color:var(--faint);border-color:transparent;cursor:default}
.pager a.off:hover{color:var(--faint)}

/* ================= SPECIMEN B — ARTICLE ================= */
.article{padding:80px 0 90px}
.art-head{max-width:760px;margin:0 auto;text-align:center}
.art-head .anum{font:500 10px/1.8 "Spline Sans Mono",monospace;letter-spacing:.3em;color:var(--faint);text-transform:uppercase;margin-bottom:16px}
.art-head .kick{font:600 10.5px/1 "Spline Sans Mono",monospace;letter-spacing:.24em;color:var(--gold-ink);text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;background:var(--gold-tint);border-left:3px solid var(--gold);border-radius:2px;padding:9px 14px}
.art-head h1{font:400 clamp(30px,3.6vw,46px)/1.14 "Instrument Serif",Georgia,serif;margin:24px 0 16px;letter-spacing:-.005em}
.art-head .dek{font:italic 400 18.5px/1.55 "STIX Two Text",Georgia,serif;color:var(--soft);max-width:620px;margin:0 auto 24px}
.art-head .meta{display:flex;justify-content:center;align-items:baseline;gap:14px;font:500 11px/1.6 "Spline Sans Mono",monospace;letter-spacing:.14em;color:var(--faint);text-transform:uppercase;flex-wrap:wrap}
.art-head .meta .tomb{font-size:9px;color:var(--teal)}
.art-head .rule{width:88px;height:3px;background:var(--grad);margin:30px auto 0;border-radius:2px}
.art-body{max-width:680px;margin:42px auto 0}
.art-body p{font-size:17px;line-height:1.85;color:var(--soft);margin-bottom:26px}
.art-body p .opener{font:italic 500 17px/1.85 "STIX Two Text",Georgia,serif;color:var(--ink)}
.art-body p a{color:var(--teal-ink);border-bottom:1px solid var(--teal);transition:.16s}
.art-body p a:hover{color:var(--ink);border-bottom-width:2px}
.art-body h2{font:400 27px/1.2 "Instrument Serif",Georgia,serif;color:var(--ink);margin:44px 0 18px;display:flex;align-items:center;gap:14px}
.art-body h2 .hn{font:600 11px/1 "Spline Sans Mono",monospace;letter-spacing:.1em;color:var(--teal-ink);background:var(--teal-tint);padding:6px 9px;border-radius:2px;transform:translateY(-2px)}
.art-body .tbl-cap{font:500 10px/1.6 "Spline Sans Mono",monospace;letter-spacing:.22em;color:var(--faint);text-transform:uppercase;margin:32px 0 10px}
.art-body .tbl-cap b{color:var(--teal-ink);font-weight:600}
.art-body .tbl-scroll{overflow-x:auto;margin-bottom:30px}
.art-body table{width:100%;border-collapse:collapse;border:1px solid var(--line);border-top:3px solid var(--teal);background:var(--raised)}
.art-body th{font:600 10.5px/1.6 "Spline Sans Mono",monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-ink);text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);background:rgba(217,236,234,.4)}
.art-body td{font:400 15.5px/1.6 "STIX Two Text",Georgia,serif;padding:12px 16px;border-bottom:1px solid var(--hair);color:var(--ink)}
.art-body tr:last-child td{border-bottom:none}
.art-body td:first-child{color:var(--soft);font-style:italic}
.art-body td b{font-weight:600}
.art-body tr:hover td{background:var(--teal-tint)}
.art-body blockquote{border-left:4px solid var(--teal);background:var(--raised);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:24px 30px;margin:34px 0;font:italic 400 18.5px/1.6 "STIX Two Text",Georgia,serif;color:var(--ink);position:relative}
.art-body blockquote::after{content:"∎";position:absolute;right:16px;bottom:12px;font-size:12px;color:var(--teal);font-style:normal}
.art-body blockquote .src{display:block;margin-top:12px;font:600 10px/1 "Spline Sans Mono",monospace;letter-spacing:.22em;color:var(--teal-ink);text-transform:uppercase;font-style:normal}
.art-body ol{counter-reset:ri;margin:6px 0 30px;border:1px solid var(--hair);border-left:3px solid var(--lime);background:var(--raised)}
.art-body ol li{counter-increment:ri;position:relative;padding:15px 20px 15px 64px;border-top:1px solid var(--hair);font-size:15.5px;line-height:1.68;color:var(--soft)}
.art-body ol li:first-child{border-top:none}
.art-body ol li::before{content:counter(ri,lower-roman) ".";position:absolute;left:20px;top:15px;font:600 12.5px/1.75 "Spline Sans Mono",monospace;color:var(--lime-ink);letter-spacing:.06em}
.art-body ol li b{color:var(--ink);font-weight:600}

/* ================= PAGES RESPONSIVE ================= */
@media(max-width:1020px){
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .defgrid{grid-template-columns:1fr 1fr}
  .dcell{border-top:1px solid var(--hair)}
  .dcell:nth-child(1),.dcell:nth-child(2){border-top:none}
  .dcell:nth-child(odd){border-left:none}
  .propgrid{grid-template-columns:1fr}
  .pcell{border-left:none;border-top:1px solid var(--hair);padding:26px 24px 78px}
  .pcell::before{height:3px}
  .pcell .pread{left:24px}
  .corpus-grid{grid-template-columns:1fr;gap:40px}
  .seasongrid{grid-template-columns:1fr}
  .seasongrid::before{width:3px;height:auto;bottom:0;right:auto;background:linear-gradient(180deg,var(--lime),var(--teal))}
  .stop{border-left:none;border-top:1px solid var(--hair);padding:24px 24px 26px 34px}
  .stop:first-child{border-top:none}
  .stop .dot{top:26px;left:-5px}
  .coro-grid{grid-template-columns:1fr;gap:40px;padding:56px 0 52px}
  .results-panel{padding:40px 28px 38px}
  .awards{grid-template-columns:1fr}
  .award{border-left:none;border-top:1px solid rgba(20,32,29,.12)}
  .award:first-child{border-top:none}
  .award.figcell .ph{min-height:190px}
  .chron-grid{grid-template-columns:1fr;gap:40px}
  .consult-panel{grid-template-columns:1fr;gap:42px;padding:42px 28px}
  .spec-div{padding:26px 26px}
  .arow{grid-template-columns:64px 1fr;row-gap:8px;padding:18px 18px}
  .arow .ad{grid-column:2;text-align:left}
  .arow .tagchip{grid-column:2;justify-self:start}
  .arow:hover{padding-left:30px}
}
@media(max-width:560px){
  .results-head .src{text-align:left}
  .scale .flag.dist{transform:none;left:auto;right:0;text-align:right}
  .hero{padding-top:44px}
  .notation{gap:10px;padding:17px 14px}
  .defgrid{grid-template-columns:1fr}
  .dcell{border-left:none;border-top:1px solid var(--hair)}
  .dcell:nth-child(2){border-top:1px solid var(--hair)}
  .dcell:first-child{border-top:none}
  .toc-row{grid-template-columns:24px 1fr;row-gap:6px;padding:14px 16px}
  .toc-row .bk{display:none}
  .toc-row .gloss{grid-column:2;text-align:left}
  .toc-row .tt::after{display:none}
  .scale .flag.avg{transform:none;left:auto;right:47.8%}
  .scale .flag.avg b{text-align:right}
  .scale .zone-cap{display:none}
  .coro-notes{grid-template-columns:1fr}
  .coro-note + .coro-note{border-left:none;border-top:1px solid var(--line);padding:18px 0 0;margin-top:18px}
  .consult-panel{padding:36px 20px}
  .art-body h2{font-size:24px}
  .filters{gap:8px}
}
/* ================= HOME CHRONICLE — live core/query (li:first-child = featured plate) ================= */
.cemc-home-chron .cemc-chron-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1.15fr 1fr;column-gap:66px;align-items:start}
.cemc-home-chron li{margin:0}
.cemc-home-chron li:first-child{grid-column:1;grid-row:1/span 3;border:1px solid var(--line);border-top:3px solid var(--teal);background:var(--raised);padding:28px 32px 30px;transition:.16s}
.cemc-home-chron li:first-child:hover{background:#FDFEFC}
.cemc-home-chron .cemc-chron-date{font:500 11px/1.7 var(--f-mono);letter-spacing:.14em;color:var(--faint);text-transform:uppercase}
.cemc-home-chron li:first-child .cemc-chron-date{font-size:12px;color:var(--teal-ink)}
.cemc-home-chron .cemc-chron-title{font:400 20px/1.32 var(--f-display);margin:6px 0 0;font-weight:400}
.cemc-home-chron li:first-child .cemc-chron-title{font-size:30px;line-height:1.16;margin-top:10px}
.cemc-home-chron .cemc-chron-title a{color:var(--ink);text-decoration:none;transition:.16s}
.cemc-home-chron .cemc-chron-title a:hover{color:var(--teal-ink)}
.cemc-home-chron .cemc-chron-excerpt{display:none}
.cemc-home-chron li:first-child .cemc-chron-excerpt{display:block;font:italic 400 16px/1.6 var(--f-body);color:var(--soft);margin-top:13px}
.cemc-home-chron li:first-child .cemc-chron-excerpt p{margin:0;font:inherit;color:inherit}
.cemc-home-chron .cemc-chron-excerpt .wp-block-post-excerpt__more-text,.cemc-home-chron .cemc-chron-excerpt .wp-block-post-excerpt__more-link{display:none}
.cemc-home-chron .cemc-chron-cat{margin-top:14px}
.cemc-home-chron .cemc-chron-cat a{display:inline-block;font:600 10px/1 var(--f-mono);letter-spacing:.18em;border-radius:2px;padding:6px 10px;text-transform:uppercase;color:var(--teal-ink);background:var(--teal-tint);text-decoration:none;transition:.16s}
.cemc-home-chron .cemc-chron-cat a:hover{background:var(--teal-ink);color:#EAF4F2}
.cemc-home-chron li:not(:first-child){padding:19px 2px;border-bottom:1px solid var(--line);position:relative;transition:.16s}
.cemc-home-chron li:nth-child(2){padding-top:2px}
.cemc-home-chron li:not(:first-child):hover{padding-left:10px}
.cemc-home-chron li:not(:first-child) .cemc-chron-cat{margin-top:8px}
.cemc-home-chron li:not(:first-child) .cemc-chron-cat a{background:transparent;padding:0;color:var(--soft)}
@media(max-width:1020px){
.cemc-home-chron .cemc-chron-list{grid-template-columns:1fr}
.cemc-home-chron li:first-child{grid-row:auto;margin-bottom:26px}
}

/* ================= PHONE OVERRIDE — inline grid variants (user-reported mobile squeeze) =================
   Pages set per-section grid-template-columns as inline styles; inline beats media queries,
   so restate the phone collapse with !important. Exceptions keep icon/number lead columns. */
@media(max-width:600px){
.wrap [style*="grid-template-columns"]{grid-template-columns:1fr!important}
.wrap .toc-row[style*="grid-template-columns"]{grid-template-columns:24px 1fr!important}
.wrap .arow[style*="grid-template-columns"]{grid-template-columns:56px 1fr!important}
}

/* ================= CLAIM PANEL - strong funnel module (user request 2026-08-20) =================
   Deep-ink panel + gradient edge + gold action. Four standing offers configured per page. */
.cemc-claim{position:relative;background:var(--deep);color:#C3D0CA;border-radius:2px;border-top:4px solid transparent;border-image:var(--grad) 1;padding:46px 50px 42px;overflow:hidden}
.cemc-claim::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(240,244,240,.06) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.cemc-claim>*{position:relative}
.cemc-claim .ck{font:600 10.5px/1 var(--f-mono);letter-spacing:.26em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:10px;margin-bottom:16px}
.cemc-claim .ck::before{content:"";width:9px;height:9px;background:var(--gold);transform:rotate(45deg)}
.cemc-claim .chead{font:400 clamp(24px,2.4vw,32px)/1.2 var(--f-display);color:#F0F4F0;margin:0 0 8px}
.cemc-claim .chead em{font-style:italic;color:var(--gold)}
.cemc-claim .csub{font:italic 400 15.5px/1.6 var(--f-body);color:#8FA29A;max-width:620px;margin:0 0 24px}
.cemc-claim .cgrid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(195,208,202,.2);background:rgba(240,244,240,.03);margin:0 0 28px}
.cemc-claim .ccell{padding:18px 20px;border-left:1px solid rgba(195,208,202,.16)}
.cemc-claim .ccell:first-child{border-left:none}
.cemc-claim .ccell .cn{font:600 9.5px/1.5 var(--f-mono);letter-spacing:.2em;color:var(--gold);text-transform:uppercase;display:flex;align-items:center;gap:8px;margin-bottom:8px}
.cemc-claim .ccell .cn .ico{width:15px;height:15px;color:var(--gold)}
.cemc-claim .ccell p{font:400 14px/1.6 var(--f-body);color:#C3D0CA;margin:0}
.cemc-claim .ccell b{color:#F0F4F0;font-weight:600}
.cemc-claim .crow-cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.cemc-claim .cnote{font:500 9.5px/1.9 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:#8FA29A}
a.cemc-claim-btn.hl-cta-online-btn,a.cemc-claim-btn{display:inline-flex;align-items:center;gap:12px;background:var(--gold);color:#14201D;font:600 13px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;padding:19px 32px;border-radius:2px;transition:.16s;border:1px solid var(--gold);text-decoration:none}
a.cemc-claim-btn.hl-cta-online-btn::after,a.cemc-claim-btn::after{content:"→"}
a.cemc-claim-btn.hl-cta-online-btn:hover,a.cemc-claim-btn:hover{background:#F6D66A;border-color:#F6D66A;transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.4);color:#14201D;opacity:1}
@media(max-width:1020px){.cemc-claim .cgrid{grid-template-columns:1fr 1fr}.cemc-claim .ccell:nth-child(3){border-left:none}.cemc-claim .ccell:nth-child(n+3){border-top:1px solid rgba(195,208,202,.16)}}
@media(max-width:600px){.cemc-claim{padding:32px 22px 30px}.cemc-claim .cgrid{grid-template-columns:1fr}.cemc-claim .ccell{border-left:none}.cemc-claim .ccell:nth-child(n+2){border-top:1px solid rgba(195,208,202,.16)}}

/* claim panel: content + QR two-up (scan-to-WeChat is the core conversion - user directive) */
.cemc-claim{display:grid;grid-template-columns:1fr auto;gap:0 48px;align-items:center}
.cemc-claim .cmain{min-width:0}
.cemc-claim .cqr{text-align:center;border:1px solid rgba(242,199,68,.45);padding:18px 18px 14px;border-radius:2px;background:rgba(240,244,240,.04)}
.cemc-claim .cqr img,.cemc-claim .cqr .hl-site-qr{width:168px;height:168px;object-fit:contain;background:#F0F4F0;padding:8px;border-radius:2px;margin:0 auto;display:block}
.cemc-claim .cqr-cap{display:block;font:500 9.5px/1.7 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:10px;max-width:180px;margin-inline:auto}
.cemc-qr-mini img,.cemc-qr-mini .hl-site-qr{width:128px;height:128px;object-fit:contain;background:#fff;border:1px solid var(--line);padding:6px;border-radius:2px;display:block}
@media(max-width:1020px){.cemc-claim{grid-template-columns:1fr}.cemc-claim .cqr{margin-top:26px;justify-self:center;min-width:220px}}