:root {
  color-scheme: light;
  --paper: #f8f3e8;
  --ink: #282620;
  --muted: #615747;
  --rule: #d9cbb5;
  --red: #922f24;
  --surface: #fffdf8;
  font: 16px/1.65 "Microsoft YaHei", "PingFang SC", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); }
a { color: var(--red); text-underline-offset: .22em; }
a:hover { text-decoration-thickness: .14em; }
.mast, main { max-width: 62rem; margin: auto; padding-inline: clamp(1.1rem, 4vw, 3.25rem); }
.mast { min-height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--rule); }
.mast a:first-child { font-weight: 750; letter-spacing: .06em; color: var(--ink); text-decoration: none; }
.hero, .guide { padding-block: clamp(2.5rem, 7vw, 5.5rem) 2.2rem; }
.kicker { color: var(--red); font-size: .82rem; font-weight: 700; letter-spacing: .16em; }
h1, h2, blockquote { font-family: "Songti SC", "SimSun", serif; }
h1 { font-size: clamp(2.7rem, 9vw, 5.6rem); margin: 0; line-height: 1.14; }
h1 span { color: var(--red); }
.intro { color: var(--muted); margin-bottom: 1.8rem; }
label { display: block; font-size: .9rem; font-weight: 700; margin-bottom: .4rem; }
.searchbox { display: flex; max-width: 42rem; gap: .5rem; }
input, button, textarea { font: inherit; }
input, textarea { color: var(--ink); background: var(--surface); border: 1px solid var(--rule); border-radius: .25rem; padding: .65rem .8rem; }
input { min-width: 0; flex: 1; }
textarea { width: 100%; resize: vertical; }
button { cursor: pointer; border: 1px solid var(--red); border-radius: .25rem; padding: .65rem 1.05rem; background: var(--red); color: white; }
button.secondary { color: var(--red); background: transparent; }
button:disabled { opacity: .65; cursor: wait; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.examples, .actions { display: flex; gap: .55rem 1rem; flex-wrap: wrap; align-items: center; margin-top: .9rem; }
.examples a { font-size: .88rem; text-decoration: none; padding: .2rem .6rem; border: 1px solid var(--rule); border-radius: 1rem; }
.results, .guide section, footer { border-top: 1px solid var(--rule); }
.results h2, .guide h2 { font-size: 1.45rem; }
.results p, footer { color: var(--muted); }
article { background: var(--surface); border-left: 3px solid var(--red); padding: 1rem 1.25rem; margin-block: .8rem; }
article h3 { margin-block: 0 .2rem; font-size: 1.05rem; }
article p { margin-block: .35rem; }
blockquote { margin: .65rem 0; font-size: clamp(1.15rem, 4vw, 1.5rem); }
footer { margin-top: 2rem; padding-block: 1rem 2rem; font-size: .85rem; }
.guide h1 { font-size: clamp(2.1rem, 7vw, 4rem); }
.guide section { margin-top: 1.4rem; }
pre { padding: .9rem; overflow: auto; background: var(--surface); border: 1px solid var(--rule); }
code { overflow-wrap: anywhere; }
