@font-face { font-family:'EB Garamond'; font-style:normal; font-weight:400; font-display:swap; src:url(fonts/eb-garamond-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family:'EB Garamond'; font-style:italic; font-weight:400; font-display:swap; src:url(fonts/eb-garamond-latin-400-italic.woff2) format('woff2'); }
@font-face { font-family:'EB Garamond'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/eb-garamond-latin-600-normal.woff2) format('woff2'); }
/* EB Garamond, SIL Open Font License, served from this site */
:root { --paper:#fbf6ea; --ink:#1d1a2e; --soft:#4f4a62; --rule:#1d1a2e;
  --proven-ink:#00733f; --proven-bg:#d9f7e6; --measured-ink:#3a3000; --measured-bg:#ffe94d; --measured-line:#c9a800;
  --reasoned-ink:#5a1f00; --reasoned-bg:#ffc2a3; --reasoned-line:#ff7a52; --guess-ink:#c4001d; --guess-bg:#ffe0e4; }
* { box-sizing:border-box; margin:0; padding:0; }
html { background:var(--paper); }
body { background:var(--paper); color:var(--ink); font-family:'EB Garamond', Garamond, Georgia, serif; font-size:20px; line-height:1.5; }
.page { max-width:820px; margin:0 auto; padding:64px 24px 48px; }
h1 { font-weight:600; line-height:1.1; }
h2 { font-weight:600; font-size:16px; letter-spacing:.16em; text-transform:uppercase; }
.num { margin-right:10px; }
section { margin-top:44px; }
.steps { list-style:none; display:grid; gap:10px; }
.row { display:grid; grid-template-columns:132px 1fr; column-gap:18px; align-items:baseline; padding:9px 0; border-top:1px solid color-mix(in srgb, var(--rule) 22%, transparent); }
h2 + .row { border-top:0; }
.tag { justify-self:start; font-size:13px; font-weight:600; letter-spacing:.1em; padding:2px 8px 1px; border-radius:2px; border:1px solid; white-space:nowrap; }
.proven { color:var(--proven-ink); background:var(--proven-bg); border-color:var(--proven-ink); }
.measured { color:var(--measured-ink); background:var(--measured-bg); border-color:var(--measured-line); }
.reasoned { color:var(--reasoned-ink); background:var(--reasoned-bg); border-color:var(--reasoned-line); }
.guess { color:var(--guess-ink); background:var(--guess-bg); border-color:var(--guess-ink); }
.note { font-size:17px; color:var(--soft); margin-top:14px; font-style:italic; }
.note s { color:var(--guess-ink); }
.join fieldset { display:contents; border:0; }
.join { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; align-items:end; margin-top:8px; }
.join label { display:grid; gap:6px; font-size:16px; color:var(--soft); }
.join input, .join select { background:#fffdf7; color:var(--ink); border:1px solid var(--rule); border-radius:2px; font:inherit; font-size:18px; padding:10px 12px; }
.join button { justify-self:start; background:var(--ink); color:var(--paper); border:1px solid var(--ink); border-radius:2px; font:inherit; font-size:18px; padding:10px 24px; text-align:left; }
.join button small { display:block; font-size:14px; font-style:italic; }
.join .closed label, .join .closed input, .join .closed select { opacity:.5; }
.join .closed button { background:transparent; color:var(--soft); border:1px dashed var(--soft); cursor:not-allowed; }
.privacy { font-size:16px; color:var(--soft); margin-top:14px; }
.foot { margin-top:56px; padding-top:12px; font-size:15px; letter-spacing:.12em; text-transform:uppercase; color:var(--soft); text-align:center; }
@media (max-width:560px) { body { font-size:18px; } .row { grid-template-columns:1fr; row-gap:6px; } .page { padding:40px 16px; } }

/* C: broadsheet. A newspaper masthead with thick and thin rules, the body in two columns, crimson ink. */
:root { --accent:#b0002a; }
.page { max-width:1040px; display:grid; grid-template-columns:1fr 1fr; column-gap:48px; }
.mast { grid-column:1 / -1; text-align:center; border-top:6px double var(--ink); border-bottom:1px solid var(--ink); padding:14px 0 28px; }
.kicker { font-size:clamp(26px, 4vw, 40px); font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding-bottom:10px; border-bottom:1px solid var(--ink); }
h1 { font-size:clamp(32px, 4.6vw, 52px); margin:22px auto 12px; max-width:880px; font-style:italic; font-weight:400; }
.sub { font-size:21px; max-width:740px; margin:0 auto; }
.meta { font-size:15px; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin-top:14px; }
section { margin-top:30px; }
h2 { color:var(--accent); border-bottom:2px solid var(--ink); padding-bottom:4px; margin-bottom:12px; }
.what, .labels, .join-wrap, .foot { grid-column:1 / -1; }
.steps { grid-template-columns:repeat(3, 1fr); column-gap:32px; }
.steps li + li { border-left:1px solid var(--ink); padding-left:32px; }
@media (max-width:760px) { .steps { grid-template-columns:1fr; } .steps li + li { border-left:0; padding-left:0; } }
.foot { border-top:6px double var(--ink); }
.foot a { color:var(--ink); text-underline-offset:3px; }
@media (max-width:760px) { .page { grid-template-columns:1fr; } }

/* the Check box (ORD-1028-CF): the thing the site is for, so it comes first and full width */
.check { grid-column:1 / -1; }
/* the library leads the page (ORD-1029-CJ B): the count big, the newest facts, the way in to all of them */
.library { grid-column:1 / -1; }
.library .count { font-size:22px; margin:0; }
.library .count b { font-size:clamp(44px, 6vw, 64px); font-weight:600; color:var(--accent); margin-right:10px; }
.ticker { font-size:18px; margin:6px 0 0; }
.ticker .name { font-size:15px; letter-spacing:.14em; text-transform:uppercase; margin-right:10px; }
.ticker .up { font-weight:600; }
.ticker .green { color:#0a7a3b; } .ticker .red { color:var(--accent); }
.ticker .why { display:block; font-size:15px; color:var(--soft); }
.newest-head { font-size:15px; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin:14px 0 4px; }
.newest { list-style:none; padding:0; margin:0; }
.newest li { display:grid; grid-template-columns:92px 1fr; column-gap:18px; align-items:baseline; padding:8px 0; border-top:1px solid color-mix(in srgb, var(--rule) 22%, transparent); }
.browse { margin:12px 0 0; font-size:20px; }
.browse a { color:var(--ink); text-underline-offset:3px; }
.mast .meta a, .founders a { color:var(--ink); text-underline-offset:3px; }
/* the charter and the founders (ORD-1029-CL): one column, articles numbered like a printed charter, a signature to close */
.charter, .signed, .founders { grid-column:1 / -1; max-width:760px; margin-left:auto; margin-right:auto; width:100%; }
.articles { padding-left:1.6em; margin:0; }
.articles li { padding:10px 0; border-top:1px solid color-mix(in srgb, var(--rule) 22%, transparent); }
.articles li::marker { color:var(--accent); font-weight:600; }
.signed { text-align:center; margin-top:36px; }
.sig { font-size:clamp(34px, 5vw, 46px); font-style:italic; margin:0; border-bottom:1px solid var(--ink); display:inline-block; padding:0 24px 4px; }
.circle { list-style:none; padding:0; margin:0; }
.circle li { display:grid; grid-template-columns:76px 1fr; column-gap:14px; align-items:baseline; padding:10px 0; border-top:1px solid color-mix(in srgb, var(--rule) 22%, transparent); }
.circle .seat { color:var(--accent); font-weight:600; }
.circle .name { font-size:24px; font-style:italic; }
.circle .open { color:var(--soft); }
.circle .work { display:block; font-size:17px; }
.check h2 .num { color:var(--ink); }
.paste { display:grid; gap:8px; font-size:17px; color:var(--soft); }
.paste textarea { background:#fffdf7; color:var(--ink); border:1px solid var(--ink); border-radius:2px; font:inherit; font-size:19px; line-height:1.45; padding:12px 14px; resize:vertical; min-height:170px; }
.link { all:unset; cursor:pointer; font-size:16px; color:var(--soft); text-decoration:underline; text-underline-offset:3px; margin-top:8px; }
.link:hover { color:var(--accent); }
.tiers { border:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-top:20px; }
.tiers legend { font-size:15px; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin-bottom:8px; }
.tier { display:grid; grid-template-columns:auto 1fr; column-gap:10px; align-items:baseline; padding:12px 14px; border:1px solid var(--ink); border-radius:2px; cursor:pointer; background:#fffdf7; }
.tier input { accent-color:var(--accent); }
.tier b { font-weight:600; font-size:19px; }
.tier span { grid-column:2; font-size:16px; color:var(--soft); line-height:1.35; }
.tier:has(input:checked) { border-width:2px; border-color:var(--accent); padding:11px 13px; }
.tier.soon { cursor:not-allowed; border-style:dashed; color:var(--soft); background:transparent; }
.builtin, .own { margin-top:14px; font-size:17px; }
.builtin input { accent-color:var(--accent); margin-right:8px; }
.warn { font-size:16px; color:var(--soft); font-style:italic; }
.own-row { display:grid; grid-template-columns:1.1fr 1fr 1.4fr; gap:12px; margin-top:10px; }
.own-row label { display:grid; gap:6px; font-size:16px; color:var(--soft); }
.own-row input, .own-row select { background:#fffdf7; color:var(--ink); border:1px solid var(--ink); border-radius:2px; font:inherit; font-size:17px; padding:8px 10px; min-width:0; }
.go { margin-top:18px; background:var(--ink); color:var(--paper); border:1px solid var(--ink); border-radius:2px; font:inherit; font-size:21px; padding:10px 30px; text-align:left; cursor:pointer; transition:transform .1s ease; }
.go small { display:block; font-size:14px; font-style:italic; }
.go:hover { transform:translateY(-1px); } .go:active { transform:translateY(1px); } .go:disabled { opacity:.6; cursor:wait; }
.status { margin-top:14px; font-size:18px; min-height:1.5em; }
.status b { font-weight:600; }
.results { list-style:none; }
.results li { display:grid; grid-template-columns:132px 1fr; column-gap:18px; align-items:baseline; padding:10px 0; border-top:1px solid color-mix(in srgb, var(--ink) 22%, transparent); }
.results .said { font-size:19px; }
.results s { color:var(--guess-ink); }
.results .fix { display:block; font-size:17px; margin-top:2px; }
.results .whyguess { display:block; font-size:16px; color:var(--soft); font-style:italic; margin-top:2px; }
.results details { grid-column:2; margin-top:4px; }
.results summary { cursor:pointer; font-size:15px; color:var(--soft); text-decoration:underline; text-underline-offset:3px; list-style:none; }
.results summary::-webkit-details-marker { display:none; }
.results .how { font-size:15px; color:var(--soft); margin-top:4px; }
.results code { font-family:Consolas, 'Courier New', monospace; font-size:14px; color:var(--ink); }
.falsified { color:#fff; background:var(--guess-ink); border-color:var(--guess-ink); }
/* every feature's built label (Daniel 2026-10-29: built only when proven to work and brick tested) */
.state { display:block; grid-column:2; font-style:normal; font-size:14px; letter-spacing:.02em; margin-top:6px; }
.state::before { content:''; display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; vertical-align:1px; background:currentColor; }
.state.built { color:var(--proven-ink); } .state.unbuilt { color:var(--guess-ink); }
.builtin .state, .join-wrap .state { margin-top:8px; }
.north { grid-column:2; margin-top:4px; font-size:14px; color:var(--soft); }
.north summary { cursor:pointer; text-decoration:underline; text-underline-offset:3px; list-style:none; }
.north summary::-webkit-details-marker { display:none; }
.north-body { margin-top:4px; line-height:1.4; }
.mini { font-size:11px; font-weight:600; letter-spacing:.08em; padding:0 5px; border:1px solid; border-radius:2px; white-space:nowrap; }
.mini.measured { color:var(--measured-ink); background:var(--measured-bg); border-color:var(--measured-line); }
.mini.reasoned { color:var(--reasoned-ink); background:var(--reasoned-bg); border-color:var(--reasoned-line); }
.atlas-link { display:inline-block; margin-top:10px; font-size:18px; color:var(--ink); }
.theorem { border-left:3px solid var(--accent); padding:4px 0 4px 16px; font-style:italic; }
.theorem b { font-style:normal; }
.cite { font-size:16px; color:var(--soft); margin:8px 0 10px; }
@media (max-width:760px) { .tiers, .own-row { grid-template-columns:1fr; } .results li { grid-template-columns:1fr; row-gap:6px; } .results details { grid-column:1; } }
