/* ============================================================
   theriemannhypothesis.com — security engraving
   A document of record should look like one. The idiom is the
   certificate: engine-turned bands, rosette seals, an engraved
   frame, and the perforated counterfoil edge the project is
   named for. Every ornament is generated from a parametric rule
   (guilloche.py), not drawn — which is what makes engraving hard
   to counterfeit and, here, what lets the ornament carry the
   paper's own reading groups.
   ============================================================ */

:root{
  --paper:#e9e3d6;
  --paper-deep:#e0d8c7;
  --ink:#1c1913;
  --ink-soft:#3a352c;
  --dim:#5d564a;
  --sec:#1f4535;          /* intaglio green — the security ink */
  --gold:#a8873c;         /* illumination */
  --oxblood:#7b2230;
  --rule:rgba(28,25,19,.55);
  --hair:rgba(31,69,53,.30);
  --serif:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;
}

*{box-sizing:border-box;}

body{
  margin:0;
  color:var(--ink);
  font-family:var(--serif);
  line-height:1.62;
  background-color:var(--paper);
  /* laid-paper tooth: two crossed hairline sets, barely visible */
  background-image:
    repeating-linear-gradient(0deg, rgba(28,25,19,.030) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(28,25,19,.022) 0 1px, transparent 1px 4px),
    radial-gradient(120% 80% at 50% 0%, rgba(168,135,60,.07), transparent 60%);
}

a{color:var(--ink);text-underline-offset:2px;text-decoration-thickness:.5px;}
a:hover{color:var(--sec);}

/* ---------- the engraved sheet ---------- */
.sheet{
  max-width:1180px;margin:0 auto;position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,.10));
  border:1px solid var(--rule);
  box-shadow:0 0 0 1px rgba(233,227,214,.9) inset,
             0 0 0 4px rgba(31,69,53,.10) inset,
             0 1px 0 rgba(255,255,255,.6) inset,
             0 14px 40px -28px rgba(28,25,19,.55);
}
.sheet::before{      /* inner hairline rule, the second engraved frame */
  content:"";position:absolute;inset:9px;border:.5px solid var(--hair);pointer-events:none;
}
.sheet-corner{position:absolute;width:54px;height:54px;opacity:.85;pointer-events:none;}
.sheet-corner.tl{top:4px;left:4px;}
.sheet-corner.tr{top:4px;right:4px;transform:scaleX(-1);}
.sheet-corner.bl{bottom:4px;left:4px;transform:scaleY(-1);}
.sheet-corner.br{bottom:4px;right:4px;transform:scale(-1,-1);}

/* ---------- guilloche bands ---------- */
.band{line-height:0;opacity:.75;}
.band svg{display:block;width:100%;}
.band-gold{opacity:.6;}
.perf{line-height:0;opacity:.9;margin:0;}
.perf svg{display:block;width:100%;}

/* ---------- masthead ---------- */
.masthead{padding:40px 40px 26px;text-align:center;position:relative;}
.masthead .seal{
  width:104px;height:104px;margin:0 auto 14px;opacity:.92;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.5));
}
/* the engraved SVGs carry their own pixel dimensions; scale them to the
   container instead of letting a 140px rosette overflow a 104px box */
.seal svg, .seal-sm svg, header.doc .seal svg{
  width:100%;height:100%;display:block;overflow:visible;
}
.masthead h1{
  font-size:2.35rem;margin:0 0 .18em;letter-spacing:.045em;
  font-weight:400;font-variant:small-caps;
}
.masthead .rule-pair{display:flex;align-items:center;gap:12px;justify-content:center;margin:.5em auto 1em;max-width:520px;}
.masthead .rule-pair span{flex:1;height:0;border-top:.5px solid var(--rule);box-shadow:0 3px 0 -2.5px var(--rule);}
.masthead .rule-pair em{font-style:normal;color:var(--sec);font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;}
.masthead .sub{margin:0;color:var(--dim);font-size:1.02rem;font-style:italic;}

nav.reg{
  border-top:.5px solid var(--rule);border-bottom:.5px solid var(--rule);
  padding:9px 40px;text-align:center;font-size:.78rem;
  letter-spacing:.19em;text-transform:uppercase;
}
nav.reg a{margin:0 14px;text-decoration:none;color:var(--ink-soft);}
nav.reg a:hover{color:var(--sec);}
nav.reg{line-height:2.1;}
nav.reg .sep{display:inline-block;width:1px;height:.95em;background:var(--rule);opacity:.55;margin:0 10px;vertical-align:-.12em;}
nav.reg a[aria-current="page"]{color:var(--sec);border-bottom:.5px solid var(--sec);}
/* --- Counterfoil: fine gold lettering, hairline-edged, with an iridescent glimmer across the text --- */
nav.reg a.cf{
  color:#a8842a;
  -webkit-text-stroke:.35px rgba(112,86,20,.55);
  text-shadow:0 0 .5px rgba(255,240,190,.35);
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  nav.reg a.cf{
    background-image:linear-gradient(100deg,
      #8a6d1f 0%, #b8933a 16%, #e8cd6e 30%, #f9ecc0 38%,
      #dfe9f6 41.5%, #f6ddec 44%, #f9ecc0 47%,
      #e8cd6e 56%, #b8933a 72%, #8a6d1f 100%);
    background-size:280% 100%;
    background-position:100% 0;
    -webkit-background-clip:text; background-clip:text;
    color:transparent; -webkit-text-fill-color:transparent;
    animation:cf-glimmer 7s ease-in-out infinite;
  }
}
@keyframes cf-glimmer{
  0%{background-position:120% 0;}
  55%{background-position:120% 0;}
  85%{background-position:-20% 0;}
  100%{background-position:-20% 0;}
}
nav.reg a.cf:hover{-webkit-text-stroke-color:rgba(112,86,20,.8);}
nav.reg a.cf[aria-current="page"]{border-bottom:.5px solid #a8842a;}
@media (prefers-reduced-motion: reduce){nav.reg a.cf{animation:none;background-position:50% 0;}}

/* ---------- the two counterfoils ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;}
.stub{padding:38px 34px 44px;position:relative;}
.stub + .stub{border-left:.5px solid var(--rule);}
.stub + .stub::before{      /* the tear line between the two stubs */
  content:"";position:absolute;left:-3px;top:24px;bottom:24px;width:5px;
  background-image:radial-gradient(circle at 2.5px 3px, rgba(28,25,19,.42) .9px, transparent 1px);
  background-size:5px 12px;
}
.eyebrow{
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--sec);
  margin:0 0 .9em;display:flex;align-items:center;gap:10px;
}
.eyebrow::after{content:"";flex:1;height:0;border-top:.5px solid var(--hair);}
.stub h2{font-size:1.5rem;line-height:1.26;margin:0 0 .3em;font-weight:400;}
.stub .byline{color:var(--dim);font-size:.94rem;font-style:italic;margin:0 0 1.2em;}
.stub h3{font-size:.95rem;letter-spacing:.03em;font-variant:small-caps;margin:1.7em 0 .35em;color:var(--sec);}

/* illuminated opening capital */
.illum::first-letter{
  float:left;font-size:3.5rem;line-height:.86;padding:.06em .10em 0 0;
  color:var(--oxblood);font-family:var(--serif);
  text-shadow:0 1px 0 rgba(168,135,60,.45);
}

.formula{
  text-align:center;margin:1.2em 0;font-size:1.06rem;color:var(--ink);
  padding:.55em 0;border-top:.5px solid var(--hair);border-bottom:.5px solid var(--hair);
  background:linear-gradient(90deg,transparent,rgba(168,135,60,.07),transparent);
}

.cta{
  display:inline-block;margin:.55em .5em .55em 0;padding:11px 24px;
  background:var(--ink);color:var(--paper);text-decoration:none;
  font-variant:small-caps;letter-spacing:.09em;font-size:1rem;
  border:1px solid var(--ink);
  box-shadow:0 0 0 2px var(--paper) inset, 0 0 0 3px rgba(28,25,19,.35) inset;
}
.cta:hover{background:var(--sec);border-color:var(--sec);color:var(--paper);}
.cta.alt{background:transparent;color:var(--ink);box-shadow:0 0 0 2px var(--paper) inset,0 0 0 3px var(--hair) inset;}
.cta.alt:hover{background:rgba(31,69,53,.09);color:var(--ink);}

ul{padding-left:1.1em;}
li{margin:.42em 0;}
li::marker{color:var(--sec);}
.small{font-size:.88rem;color:var(--dim);}

/* ---------- the review panel ---------- */
.panel{
  position:relative;padding:36px 40px 40px;text-align:center;
  border-top:.5px solid var(--rule);
  background:linear-gradient(180deg, rgba(31,69,53,.05), transparent 70%);
}
.panel .seal-sm{width:74px;height:74px;margin:0 auto 12px;opacity:.85;}
.masthead{overflow:visible;}
.panel h2{font-size:1.35rem;font-variant:small-caps;letter-spacing:.05em;margin:0 0 .5em;font-weight:400;}
.panel p{max-width:640px;margin:.6em auto;}
.panel .addr{
  display:inline-block;margin-top:.7em;padding:9px 20px;
  border:.5px solid var(--sec);color:var(--sec);text-decoration:none;
  font-variant:small-caps;letter-spacing:.08em;
  box-shadow:0 0 0 2px var(--paper) inset,0 0 0 2.5px rgba(31,69,53,.25) inset;
}
.panel .addr:hover{background:rgba(31,69,53,.08);}

/* ---------- colophon ---------- */
footer.colophon{padding:22px 40px 34px;font-size:.84rem;color:var(--dim);text-align:center;}
footer.colophon a{color:var(--dim);}
.serial{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:.72rem;
  letter-spacing:.16em;color:var(--sec);opacity:.85;
}
.motto{font-style:italic;color:var(--ink-soft);margin-top:.5em;}

/* ---------- microtext: the fine line a scan cannot hold ---------- */
.microtext{
  font-size:3.4px;letter-spacing:.44px;color:var(--sec);opacity:.5;
  white-space:nowrap;overflow:hidden;text-align:center;line-height:1.9;
  user-select:none;padding:2px 0;
}

@media(max-width:880px){
  .split{grid-template-columns:1fr;}
  .stub + .stub{border-left:none;border-top:.5px solid var(--rule);}
  .stub + .stub::before{display:none;}
  .masthead{padding:28px 16px 18px;}
  .masthead h1{font-size:1.55rem;letter-spacing:.03em;}
  .masthead .sub{font-size:.92rem;}
  .masthead .seal svg{width:96px;height:96px;}
  .masthead,.panel,footer.colophon{padding-left:18px;padding-right:18px;}
  .stub{padding:30px 22px 34px;}
  /* the register bar on a phone: one row, swipeable, current page in view; centred when it fits */
  nav.reg{display:flex;flex-wrap:nowrap;align-items:center;overflow-x:auto;overflow-y:hidden;
    padding:0 10px;line-height:1;font-size:.72rem;letter-spacing:.13em;white-space:nowrap;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);}
  nav.reg::-webkit-scrollbar{display:none;}
  nav.reg > :first-child{margin-left:auto;} nav.reg > :last-child{margin-right:auto;}
  nav.reg a{flex:0 0 auto;margin:0;padding:13px 9px;scroll-snap-align:center;min-height:44px;display:inline-flex;align-items:center;border-bottom:2px solid transparent;}
  nav.reg a[aria-current="page"]{border-bottom:2px solid var(--sec);}
  nav.reg .sep{flex:0 0 auto;height:1em;margin:0 4px;}
}


/* ============================================================
   Additions after an aesthetic and accessibility pass
   ============================================================ */

/* --- keyboard navigation: the engraved buttons had no visible focus --- */
a:focus-visible, button:focus-visible, .cta:focus-visible, .addr:focus-visible{
  outline:2px solid var(--sec); outline-offset:3px; border-radius:1px;
}

/* --- motion: the companion page animates a 1.15s reflection. Anyone who has
       asked their system for less motion gets the result without the sweep. --- */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;}
}

/* --- the split: balance the two stubs and let the tear line span the taller one --- */
.split{align-items:stretch;}
.stub{display:flex; flex-direction:column;}
.stub .small:last-of-type{margin-top:auto; padding-top:1.1em;}

/* --- an intermediate breakpoint: at 900-1050px the two columns were cramped
       into ~40 characters per line, below comfortable measure --- */
@media(max-width:1050px) and (min-width:881px){
  .stub{padding:32px 26px 38px;}
  .stub h2{font-size:1.36rem;}
}

footer .copyright{font-size:.72rem;color:var(--dim);letter-spacing:.02em;max-width:640px;margin:.9em auto 0;line-height:1.5;}

/* --- print: this is a document of record and someone will print it --- */
@media print{
  :root{--paper:#fff; --ink:#000; --sec:#1a3a2c; --dim:#444;}
  body{background:#fff !important; background-image:none !important;
       color:#000; font-size:10.5pt; line-height:1.45;}
  .band, .perf, .microtext, .sheet-corner, nav.reg, .seal, .seal-sm,
  .ctrl, .cta, .addr{display:none !important;}
  .sheet{border:none; box-shadow:none; max-width:none;}
  .sheet::before{display:none;}
  .split{display:block;}
  .stub + .stub{border-left:none; border-top:1px solid #999; margin-top:1.5em;}
  .stub + .stub::before{display:none;}
  a{color:#000; text-decoration:none;}
  /* a printed page loses its links, so print the destination */
  main a[href^="http"]::after, main a[href^="/"]::after{
    content:" <" attr(href) ">"; font-size:8.5pt; color:#555; word-break:break-all;
  }
  .reflinks a::after{content:none;}   /* these are already URLs */
  h2, h3{break-after:avoid;}
  figure, .thm, table{break-inside:avoid;}
  .toc{break-after:page;}
}

/* --- the paper ground is the design; a dark repaint would destroy the conceit.
       What a dark-preference reader gets is a slightly warmer, dimmer sheet
       rather than a glaring one. --- */
@media (prefers-color-scheme: dark){
  :root{--paper:#ded7c8; --paper-deep:#d4ccba;}
  body{filter:saturate(.96) brightness(.97);}
}

/* ---------- the verdict: the one formula the page exists for ---------- */
.formula.verdict{
  font-size:1.5rem;letter-spacing:.02em;color:var(--oxblood);
  padding:.9em 0 .8em;margin:1.6em 0;
  border-top:1px double var(--gold);border-bottom:1px double var(--gold);
  background:linear-gradient(90deg,transparent,rgba(168,135,60,.13),transparent);
  position:relative;
}
.formula.verdict .verdict-cap{
  position:absolute;top:-.62em;left:50%;transform:translateX(-50%);
  background:var(--paper);padding:0 .7em;font-size:.62rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold);
}

/* ---------- registers: the nav never breaks a label mid-phrase ---------- */
nav.reg a, .nav a{white-space:nowrap;}

/* ---------- keyboard focus in the house ink ---------- */
a:focus-visible, button:focus-visible{outline:2px solid var(--sec);outline-offset:3px;border-radius:1px;}

/* ---------- the lock cards of The Seven ---------- */
.lock{border:.5px solid var(--hair);border-left:2px solid var(--sec);padding:18px 22px 16px;margin:1.6em 0;position:relative;background:rgba(255,255,255,.18);}
.lock .lbl{font-variant:small-caps;letter-spacing:.03em;color:var(--sec);font-size:1.05rem;}
.lock .state{position:absolute;top:14px;right:16px;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--oxblood);border:.5px solid var(--oxblood);padding:3px 8px;}
.lock .state.auto{color:var(--sec);border-color:var(--sec);}
.lock dl{display:grid;grid-template-columns:11em 1fr;gap:.35em 1.2em;margin:.8em 0 .4em;}
.lock dt{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);padding-top:.35em;}
.lock dd{margin:0;}
.lock .prize{font-family:var(--serif);color:var(--oxblood);}
.lock .prize b{font-size:1.2rem;}
.till{border:1px double var(--gold);padding:18px 24px;margin:1.8em 0;background:linear-gradient(90deg,transparent,rgba(168,135,60,.10),transparent);text-align:center;}
.till .n{font-size:1.6rem;color:var(--oxblood);}
@media(max-width:880px){ .lock dl{grid-template-columns:1fr;gap:.1em;} .lock dt{padding-top:.8em;} }