/* Coin page, agreed design (23 Oct): one screen on desktop (coin stage left, white panel right with tabs; only a tab's
   own content scrolls), stacked on phones. Loaded after app.css and v2.css on coin pages only (body.cp). Light only. */
body.cp{--bg:#f7f7f7;--ink:#1a1a1a;--grey:#6b6b6b;--line:#dcdcdc;--soft:#ececec;--paper:#fff;--free:#2f6b3a;--paid:#7a4b10;
  --serif:"EB Garamond",Georgia,"Times New Roman",serif;--caps:"Jost","Helvetica Neue",Arial,sans-serif;
  background:var(--bg);color:var(--ink);font:17px/1.5 var(--serif);overflow:hidden;height:100%}
body.cp a{color:var(--ink)}
.cp .cpmain{position:fixed;top:var(--bar-h);left:0;right:0;bottom:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:24px;
  padding:0 max(32px,env(safe-area-inset-right,0px)) 24px max(32px,env(safe-area-inset-left,0px))}
/* stage: the coin floats on the page colour; caption and tools under it */
body.cp .stage{position:relative;inset:auto;margin:0;min-height:0;display:flex;flex-direction:column;align-items:center;gap:8px;background:transparent;padding-bottom:4px}
.cp .vwrap{position:relative;flex:1 1 auto;min-height:0;width:100%}
body.cp .stage .view{position:absolute;inset:0}
.cp .loadmsg{font:italic 16px var(--serif);color:var(--grey)}
.cp .cap{font:italic 15px/1.3 var(--serif);color:var(--grey);text-align:center;margin:0;max-width:62ch}
.cp .cap a{color:inherit}
.cp .cred{font:400 11.5px/1.35 var(--caps);color:var(--grey);text-align:center;margin:0;max-width:90ch}
.cp .cred a{color:inherit}
.cp .tools{display:flex;gap:4px 18px;flex-wrap:wrap;justify-content:center}
.cp .tools button,.cp .tabs button{all:unset;cursor:pointer;font:500 10.5px/1.8 var(--caps);letter-spacing:.16em;text-transform:uppercase;color:var(--grey);border-bottom:1px solid transparent}
.cp .tools button[aria-pressed="true"],.cp .tools button:hover,.cp .tabs button[aria-selected="true"],.cp .tabs button:hover{color:var(--ink);border-bottom-color:var(--ink)}
.cp .tools button[hidden]{display:none}
.cp button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* panel */
body.cp .panel{position:relative;inset:auto;width:auto;min-height:0;background:var(--paper);border:0;box-shadow:none;z-index:2;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto}
.cp .head{padding:26px 32px 0}
.cp .head h1{font:400 30px/1.1 var(--serif);margin:0;text-wrap:balance}
.cp .head .dn{font:italic 19px/1.3 var(--serif);margin:3px 0 0}
.cp .facts3{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.9fr) minmax(0,.95fr);margin-top:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cp .facts3.n2{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
.cp .facts3.n1{grid-template-columns:minmax(0,1fr)}
.cp .facts3 div{padding:12px 0 13px;display:grid;gap:5px;align-content:start;min-width:0}
.cp .facts3 div+div{padding-left:14px;border-left:1px solid var(--line)}
.cp .facts3 small{font:500 9.5px/1.4 var(--caps);letter-spacing:.16em;text-transform:uppercase;color:var(--grey);display:flex;align-items:center;height:16px}
.cp .facts3 strong{font:400 17px/1.25 var(--serif)}
.cp .i{all:unset;cursor:help;display:inline-grid;place-items:center;width:12px;height:12px;border:1px solid currentColor;border-radius:50%;font:500 8px/1 var(--caps);color:var(--grey);margin-left:5px;text-transform:none;letter-spacing:0}
.cp .tabs{display:flex;flex-wrap:wrap;gap:6px 18px;padding:14px 32px 12px;border-bottom:1px solid var(--line)}
.cp .tabs .pl{width:10px;height:11px;margin-left:5px;vertical-align:-1px}
.cp .pane{min-height:0;overflow:auto;overscroll-behavior:contain;padding:20px 32px 24px;display:grid;align-content:start;gap:14px}
.cp .pane[hidden]{display:none}
.cp .pane h2{font:400 22px/1.2 var(--serif);margin:0}
.cp .pane h3{font:400 18px/1.25 var(--serif);margin:6px 0 0}
.cp .pane p{margin:0}
.cp .sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cp .tag{font:500 9.5px/1 var(--caps);letter-spacing:.18em;text-transform:uppercase;padding:5px 8px;border:1px solid currentColor;white-space:nowrap;border-radius:0;vertical-align:0}
.cp .tag.free{color:var(--free)}.cp .tag.paid{color:var(--paid)}
.cp dl{display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);gap:7px 14px;margin:0;font-size:16px}
.cp dt{font:500 10px/2 var(--caps);letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.cp dd{margin:0;font-variant-numeric:tabular-nums}
.cp .src{font:13px/1.4 var(--caps);color:var(--grey)}
.cp .src a{color:inherit}
.cp .kick{font:500 10px/1.5 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--grey)}
/* glossary terms and source numbers: hover or tap */
.cp .term{all:unset;cursor:help;border-bottom:1px dotted currentColor}
.cp .term:focus-visible,.cp .i:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.cp sup{line-height:0;white-space:nowrap}
.cp .term.ref{border:0;font:500 10px/1 var(--caps);color:var(--grey);padding:0 1px}
.cp .term.ref:hover,.cp .term.ref:focus-visible{color:var(--ink)}
.tipbox{position:fixed;z-index:60;max-width:280px;background:#1a1a1a;color:#fff;font:15px/1.4 "EB Garamond",Georgia,serif;padding:10px 12px;pointer-events:none}
.tipbox[hidden]{display:none}
/* design accordion */
.cp .feat{display:grid;margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.cp .f{border-bottom:1px solid var(--line)}
.cp .fh{all:unset;cursor:pointer;display:flex;align-items:center;gap:12px;width:100%;box-sizing:border-box;padding:11px 4px;font:400 18px/1.3 var(--serif)}
.cp .fh b{font:500 11px/22px var(--caps);text-align:center;background:var(--ink);color:#fff;border-radius:50%;width:22px;height:22px;flex:none}
.cp .fh .side{font:500 9.5px/1 var(--caps);letter-spacing:.14em;text-transform:uppercase;color:var(--grey);margin-left:auto}
.cp .fh::after{content:"+";font:400 18px/1 var(--caps);color:var(--grey);width:12px;text-align:center}
.cp .f.open .fh::after{content:"–"}
.cp .fb{margin:0;padding:0 4px 16px 38px;font-size:16px;line-height:1.55;max-width:60ch}
.cp .conf{display:inline-block;margin-left:6px;font:500 9px/1.6 var(--caps);letter-spacing:.12em;text-transform:uppercase;color:var(--grey);border:1px solid var(--line);padding:0 5px;vertical-align:1px}
/* members teasers */
.cp .lock{background:var(--soft);padding:12px 14px;display:grid;gap:6px;font-size:15px;border:0;border-radius:0;margin:0}
.cp .lock .teaser{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline}
.cp .cta{display:block;text-align:center;background:var(--ink);color:#fff!important;padding:13px;font:500 11px/1 var(--caps);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;margin:0}
/* examples */
.cp .big{display:flex;gap:22px;flex-wrap:wrap}
.cp .big div{display:grid}.cp .big strong{font:400 30px/1 var(--serif);font-variant-numeric:tabular-nums}
.cp .big small{font:500 9.5px/1.8 var(--caps);letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.cp .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px 12px}
.cp .card{display:grid;gap:4px;font-size:14px;line-height:1.35;min-width:0;align-content:start}
.cp .thumb{position:relative;aspect-ratio:1;background:var(--soft);display:grid;place-items:center;overflow:hidden}
.cp .thumb img{width:100%;height:100%;object-fit:contain}
.cp .thumb.tall{aspect-ratio:3/4}
.cp .card.locked .thumb img{object-fit:cover;transform:scale(1.15);filter:grayscale(.3)}
.cp .lk{position:absolute;inset:auto 8px 8px auto;display:flex;align-items:center;gap:5px;background:var(--paper);color:var(--paid);font:500 9.5px/1 var(--caps);letter-spacing:.14em;text-transform:uppercase;padding:6px 8px}
.cp .pl{width:10px;height:11px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none}
.cp .badge{font:500 9px/1 var(--caps);letter-spacing:.14em;text-transform:uppercase;background:var(--ink);color:#fff;padding:4px 6px;justify-self:start}
.cp .card .m{color:var(--grey);font-size:13px}
.cp .lic{font:500 9.5px/1.4 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.cp .lic a{color:inherit}
.cp .links{margin:0;padding-left:18px;display:grid;gap:4px;font-size:15px}
.cp .exl{padding-left:0;list-style:none;gap:6px}
.cp .srcs{font-size:14px;color:var(--grey)}
/* references, ruler */
.cp .plate{display:grid;grid-template-columns:minmax(0,140px) minmax(0,1fr);gap:14px}
.cp .plate .pt{display:grid;gap:6px;min-width:0;align-content:start}
.cp blockquote{margin:0;font:italic 15px/1.5 var(--serif);border-left:2px solid var(--line);padding-left:12px}
.cp .tree{display:grid;gap:5px;font-size:16px}
.cp .tree .row{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.cp .tree .row.me span:first-child{font-weight:500}
.cp .tree .row:not(.me) span:first-child::before{content:"└ ";color:var(--grey)}
.cp .who b{font-weight:500}
.cp .legal{font:13px/1.4 var(--serif);color:var(--grey);padding:8px 32px 12px;margin:0;border-top:1px solid var(--line)}
.cp .legal a{color:inherit}
.cp .drag-hint{top:44%}
/* laptop heights: keep everything on one screen */
@media (max-height:860px) and (min-width:821px){
  .cp .head{padding-top:18px}.cp .head h1{font-size:26px}.cp .head .dn{font-size:17px}
  .cp .facts3{margin-top:12px}.cp .facts3 div{padding:9px 0 10px}
  .cp .tabs{padding-top:10px;padding-bottom:9px}
  .cp .pane{padding-top:16px}
  .cp .cred{display:none}
}
@media (max-width:1100px) and (min-width:821px){ .cp .cpmain{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:16px;padding-left:16px;padding-right:16px} .cp .head,.cp .tabs,.cp .pane{padding-left:24px;padding-right:24px} }
/* phones: coin on top, tabs and panel stacked under it; the page scrolls */
@media (max-width:820px){
  body.cp{overflow:auto;height:auto}
  .cp .cpmain{position:static;display:block;padding:var(--bar-h) 0 0}
  body.cp .stage{height:auto;padding:0 16px 10px}
  .cp .vwrap{flex:none;height:min(94vw,48vh)}
  .cp .cap{font-size:14px}.cp .cred{font-size:10.5px}
  body.cp .panel{display:block}
  .cp .head{padding:22px 18px 0}.cp .head h1{font-size:25px}
  .cp .facts3{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr) minmax(0,1fr)}
  .cp .facts3 div+div{padding-left:10px}
  .cp .facts3 strong{font-size:15.5px}
  .cp .tabs{position:sticky;top:var(--bar-h);z-index:5;background:var(--paper);padding:12px 18px 10px;gap:14px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .cp .tabs button{flex:none}
  .cp .pane{overflow:visible;padding:18px 18px 26px}
  .cp .legal{padding:10px 18px 28px}
}
@media (max-width:480px){ .cp dl,.cp .plate{grid-template-columns:minmax(0,1fr)} .cp dt{line-height:1.4} .cp .grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (prefers-reduced-motion:reduce){ .cp *{transition:none!important} }
/* gallery cards: not the home page's .card frame (app.css) */
.cp .card{border:0;border-radius:0;background:none;padding:0;box-shadow:none;text-decoration:none;color:inherit}
.cp .pane{scroll-margin-top:calc(var(--bar-h) + 52px)}
/* readings under a feature (research "readings"): one short line each */
.cp .fb p{margin:0}
.cp .rd{margin:8px 0 0;padding:0 0 0 14px;display:grid;gap:5px;font-size:15px;line-height:1.45;color:#333;list-style:none;border-left:2px solid var(--line)}
/* public-domain book: page text crops (entries can span two pages) */
.cp .pages{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.cp .pagecrop{display:block;background:var(--soft)}
.cp .pagecrop img{display:block;width:100%;height:auto}
.cp a.thumb{display:grid}
.cp a.thumb.tall{aspect-ratio:auto;align-self:start}
.cp a.thumb.tall img{height:auto}
.cp .card .cr{font-size:12px;line-height:1.3;overflow-wrap:anywhere}