:root { color-scheme: light; --ink: #1c332f; --paper: #eee9dc; --red: #b83c2d; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 28px; color: var(--ink); background: radial-gradient(circle at 18% 12%, rgba(255,255,255,.85), transparent 26rem), repeating-linear-gradient(0deg, rgba(28,51,47,.025) 0 1px, transparent 1px 4px), var(--paper); font-family: "Songti SC", "STSong", serif; }
main { width: min(760px, 100%); padding: clamp(28px, 7vw, 74px); border: 1px solid rgba(28,51,47,.42); background: rgba(255,253,247,.62); box-shadow: 14px 17px 0 rgba(28,51,47,.08); }
.kicker { margin: 0 0 44px; font: 12px/1.4 "Courier New", monospace; letter-spacing: .14em; }
.mark { display: flex; gap: 12px; margin-bottom: 26px; }
.mark span { display: block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--ink); }
.mark span:first-child { background: var(--red); border-color: var(--red); }
h1 { margin: 0; font-size: clamp(54px, 11vw, 104px); font-weight: 400; line-height: .95; letter-spacing: -.06em; }
.lead { margin: 34px 0 42px; max-width: 650px; font-size: clamp(18px, 2.7vw, 23px); line-height: 1.85; }
.rules { border-top: 1px solid rgba(28,51,47,.38); }
.rules p { display: flex; justify-content: space-between; gap: 24px; margin: 0; padding: 14px 0; border-bottom: 1px dashed rgba(28,51,47,.32); }
.rules b { font-weight: 400; }
.rules span { color: var(--red); text-align: right; }
a { display: inline-flex; gap: 34px; margin-top: 42px; padding: 12px 17px; color: #fff; background: var(--ink); text-decoration: none; }
a:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
@media (max-width: 520px) { body { padding: 14px; } main { padding: 36px 22px; } .rules p { align-items: flex-start; flex-direction: column; gap: 5px; } .rules span { text-align: left; } }