:root { --bg: #F1F0EC; --ink: #1B1B1E; --mut: #5E5E64; --line: rgba(27,27,30,.14); --card: #fff; --acc: #C8402A; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bg: #161719; --ink: #ECEBE6; --mut: #A3A3A9; --line: rgba(236,235,230,.14); --card: #1F2023; --acc: #F08A6E; } }
:root[data-theme="dark"] { --bg: #161719; --ink: #ECEBE6; --mut: #A3A3A9; --line: rgba(236,235,230,.14); --card: #1F2023; --acc: #F08A6E; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 1.0625rem/1.6 "Archivo", system-ui, sans-serif; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--acc); outline-offset: 3px; }
.wrap { max-width: 920px; margin: 0 auto; padding: 0 16px 80px; }
.back { display: inline-block; margin: 24px 0 0; font-size: .9rem; }
h1 { font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.04; font-stretch: 118%; font-weight: 800; letter-spacing: -0.03em; margin: 28px 0 12px; }
h2 { font-size: 1.5rem; font-stretch: 112%; margin: 48px 0 12px; }
h3 { font-size: 1.1rem; margin: 0 0 6px; }
.lede { color: var(--mut); font-size: 1.15rem; max-width: 42rem; }
.card { background: var(--card); border: 1px solid var(--line); padding: 20px 22px; margin: 14px 0; }
.card p { margin: .4rem 0; }
.tag { display: inline-block; font-size: .78rem; font-weight: 700; padding: .1rem .5rem; border: 1px solid var(--line); margin-right: .4rem; }
.prompt { position: relative; background: var(--bg); border: 1px solid var(--line); padding: 14px 16px; font: 400 .95rem/1.55 ui-monospace, "Cascadia Mono", Consolas, monospace; white-space: pre-wrap; margin: 10px 0 0; }
.copy { font: 700 .85rem "Archivo", sans-serif; border: 1px solid var(--ink); background: var(--ink); color: var(--bg); padding: .45rem .9rem; min-height: 36px; cursor: pointer; margin-top: 10px; }
table { border-collapse: collapse; width: 100%; font-size: .95rem; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { font-weight: 700; }
.tbl { overflow-x: auto; }
ul { padding-left: 1.1rem; } li { margin: .3rem 0; }
.mut { color: var(--mut); }
