/* Memecoinx1000 — pages styles (THE TIMES, MY DESK + /p/<name>, THE HOUSE, RULES, /t/<id>, admin). Loaded after style.css
   and css/frame.css. Only the PAGES owner edits this file. Every color is a theme token (light paper / the paper at night):
   the frame owns --paper --sheet --white --ink --ink2 --ink3 --blue --red --hi; the --pg-* tokens below are ours. */
:root {
  --pg-rule: var(--grid, rgba(70, 120, 190, .18));          /* ledger-paper rules on canvases */
  --pg-margin: rgba(226, 59, 42, .4);                         /* the red margin line */
  --pg-hi-ink: var(--on-hi, #1b1a17);                         /* text on the yellow highlighter */
  --pg-on: var(--snow, #fff);                                 /* text on solid blue / red */
  --pg-tint: var(--danger-wash, #ffe1da);                     /* a receipt warming up toward the shredder */
  --pg-shade: var(--shade, var(--ink));                       /* hard offset shadows (cream ink at night) */
  --pg-field: var(--field, var(--white));                     /* inputs */
}
:root[data-theme="dark"] { --pg-margin: rgba(255, 90, 70, .38); }

/* ---------------------------------------------------------------- shared bits */
.pg-p { display: inline-grid; place-items: center; width: 1.25em; height: 1.25em; margin-left: .3em; vertical-align: .1em; font: 700 .68em/1 var(--mono); font-style: normal; border: 1.5px solid var(--ink); color: var(--ink); background: var(--white); letter-spacing: 0; }
.pg-name, .pg-coin { text-decoration: none; }
a.pg-name:hover, a.pg-coin:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.pg-me { background: var(--hi); color: var(--pg-hi-ink); }
.pg-me .pg-p { color: var(--pg-hi-ink); border-color: var(--pg-hi-ink); background: transparent; }
.np-list li.pg-me { box-shadow: -6px 0 0 var(--hi), 6px 0 0 var(--hi); }
.pg-tabs { display: flex; flex-wrap: wrap; }
.pg-tabs button { border: 2px solid var(--ink); background: var(--sheet); color: var(--ink); padding: 6px 12px; min-height: 36px; font: 700 12px var(--mono); letter-spacing: .5px; margin: 0 -2px -2px 0; display: inline-flex; align-items: center; gap: 4px; }
.pg-tabs button:hover { background: var(--hi); color: var(--pg-hi-ink); }
.pg-tabs button.on { background: var(--ink); color: var(--paper); position: relative; z-index: 1; }
.pg-tabs button.on .pg-p { background: transparent; color: var(--paper); border-color: var(--paper); }
.pg-tabs button small { font-size: 10px; opacity: .7; }
.pg-note { font: 700 12px var(--mono); color: var(--ink2); margin: 10px 0 0; }
.pg-404 { max-width: 640px; margin: 50px auto; text-align: center; }
.pg-404 .big-btn { display: inline-block; width: auto; padding: 14px 24px; }
.pg-side { font: 700 12px var(--mono); color: var(--pg-on); padding: 1px 6px; white-space: nowrap; }
.pg-side.l { background: var(--blue); } .pg-side.s { background: var(--red); }
.pg-state { font-style: normal; font-weight: 700; padding: 0 4px; border: 1px solid currentColor; font-size: .92em; }
.pg-state.queued, .pg-state.sent { color: var(--ink2); } .pg-state.done { color: var(--blue); } .pg-state.refunded { color: var(--red); }
.name-row input, .pg-ad-in { background: var(--pg-field); color: var(--ink); }

/* rubber stamps: ink sits IN the paper (multiply) on light paper, plain ink at night */
.pg-art { display: block; width: 100%; max-width: 120px; aspect-ratio: 1; transform: rotate(var(--r, 0deg)); transition: transform .18s; mix-blend-mode: multiply; }
.pg-art svg { display: block; width: 100%; height: 100%; overflow: visible; }
.pg-sa.ink-blue { color: var(--blue); } .pg-sa.ink-red { color: var(--red); } .pg-sa.ink-ink { color: var(--ink); } .pg-sa.off { color: var(--ink3); }
.pg-stamp { position: absolute; transform: translate(-50%, -50%) rotate(var(--r, -10deg)); font: 400 30px/1 var(--head); letter-spacing: 2px; padding: 5px 12px 2px; border: 3px solid currentColor; border-radius: 4px; white-space: nowrap; pointer-events: none; z-index: 5; mix-blend-mode: multiply; }
.pg-stamp.red { color: var(--red); } .pg-stamp.blue { color: var(--blue); } .pg-stamp.ink { color: var(--ink); } .pg-stamp.grey { color: var(--ink3); }
.pg-stamp.slam { animation: pgSlam .32s cubic-bezier(.2, 1.6, .4, 1) both; }
@keyframes pgSlam { from { transform: translate(-50%, -50%) rotate(var(--r, -10deg)) scale(2.2); opacity: 0; } }
:root[data-theme="dark"] .pg-art, :root[data-theme="dark"] .pg-stamp, :root[data-theme="dark"] .pg-bigst { mix-blend-mode: normal; }

/* ================================================================ THE TIMES */
.pg-mast { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; }
#npTitle { margin: 0; font: 400 clamp(28px, calc((100vw - 130px) / 9.4), 104px)/.95 var(--head); letter-spacing: 1px; white-space: nowrap; overflow: hidden; text-align: center; min-width: 0; padding-top: 4px; }
.pg-ear { display: flex; align-items: center; gap: 8px; font: 700 10px/1.2 var(--mono); letter-spacing: 1.5px; color: var(--ink2); border: 2px solid var(--ink); padding: 4px 8px; background: var(--white); }
.pg-ear.r { text-align: right; }
.pg-rollers svg { display: block; width: 54px; height: 45px; overflow: visible; }
.pg-roll { transform-box: fill-box; transform-origin: center; transition: transform .28s cubic-bezier(.3, 1.5, .5, 1); }
.pg-roll circle { fill: var(--white); stroke: var(--ink); stroke-width: 2.5; }
.pg-roll .in { fill: var(--ink); stroke: none; }
.pg-roll .dot { fill: var(--red); stroke: none; }
.pg-roll path { stroke: var(--ink); stroke-width: 2.2; stroke-linecap: round; fill: none; }
.pg-roll-sheet { stroke: var(--ink3); stroke-width: 2; stroke-dasharray: 4 3; fill: none; }
.pg-issues { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font: 700 12px var(--mono); padding: 2px 0; border-bottom: 1px solid var(--ink); }
.pg-issues a { text-decoration: none; display: inline-flex; align-items: center; min-height: 36px; padding: 0 8px; }
.pg-issues a:hover { background: var(--hi); color: var(--pg-hi-ink); }
.pg-issues i { color: var(--ink3); font-style: normal; }
.pg-front { padding-top: 6px; }
.pg-front::after { content: ""; display: table; clear: both; }
.pg-headwrap { position: relative; }
.pg-head { margin-top: 22px; }
.pg-head .pg-w { display: inline-block; }
.pg-head.pg-set .pg-w { animation: pgDrop .3s steps(3, end) both; animation-delay: calc(var(--i, 0) * 35ms); }
@keyframes pgDrop { from { transform: translateY(-24px); opacity: 0; } }
.pg-head.pg-fade { animation: pgFade .15s ease-out; }
@keyframes pgFade { from { opacity: 0; } }
.pg-hchip { font: 700 .4em/1 var(--mono); border: .12em solid currentColor; padding: .12em .25em .08em; vertical-align: .7em; margin-left: -.1em; }
.pg-strike { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; }
.pg-strike path { stroke: var(--red); stroke-width: 6; stroke-linecap: round; fill: none; }
.pg-extra { position: absolute; left: -8px; top: -12px; z-index: 3; background: var(--red); color: var(--pg-on); font: 400 20px/1 var(--head); letter-spacing: 2px; padding: 6px 12px 3px; transform: rotate(-8deg); box-shadow: 3px 3px 0 var(--pg-shade); pointer-events: none; }
.pg-extra.on { animation: pgExtra .5s cubic-bezier(.2, 1.6, .4, 1) both; }
@keyframes pgExtra { from { transform: rotate(-8deg) scale(2.2); opacity: 0; } }
.pg-numbers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); margin: 14px 0 4px; }
.pg-numbers div { padding: 8px 10px; border-right: 1px solid var(--ink); min-width: 0; }
.pg-numbers div:nth-child(4) { border-right: 0; }
.pg-numbers i { display: block; font: 700 10px var(--mono); font-style: normal; letter-spacing: 1px; color: var(--ink2); }
.pg-numbers b { font: 400 30px/1.1 var(--head); letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.pg-numbers small { display: block; font: 700 10px var(--mono); color: var(--ink3); letter-spacing: .5px; }
.pg-numbers p { grid-column: 1 / -1; margin: 0; padding: 5px 10px; border-top: 1px dotted var(--ink3); font: 700 11px var(--mono); color: var(--ink2); }
.pg-coins li { grid-template-columns: 26px minmax(0, 1fr) 64px auto; }
.pg-ls { height: 10px; border: 1.5px solid var(--ink); background: var(--red); position: relative; align-self: center; }
.pg-ls i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--blue); }
.pg-obits { list-style: none; margin: 0; padding: 0; }
.pg-obits li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 7px 0; border-bottom: 1px dotted var(--ink3); font: 400 13px/1.4 var(--mono); }
.pg-ob-who { font-weight: 700; color: var(--red); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-ob-who .pg-name { color: var(--ink); }
.pg-ob-t { grid-column: 2; grid-row: 1; color: var(--ink3); font-size: 11px; }
.pg-ob-l { grid-column: 1 / -1; }
.pg-ob-l a { text-decoration: none; }
.pg-ads p { margin: 0 0 8px; }
.pg-ads p:first-child::first-letter { font: inherit; float: none; margin: 0; }

/* THE STANDINGS: a newspaper stock table */
.pg-sports { margin-top: 26px; border-top: 4px double var(--ink); padding-top: 12px; scroll-margin-top: 16px; }
.pg-sports-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; border-bottom: 2px solid var(--ink); padding-bottom: 8px; }
.pg-sports-head h3 { margin: 0; font: 400 clamp(30px, 5vw, 46px)/1 var(--head); letter-spacing: 1px; }
.pg-kicker { background: var(--ink); color: var(--paper); font: 700 11px var(--mono); letter-spacing: 2px; padding: 2px 7px; align-self: center; }
.pg-close { margin-left: auto; font: 700 12px var(--mono); color: var(--ink2); }
.pg-tabrow { display: flex; gap: 14px; flex-wrap: wrap; margin: 12px 0; }
.pg-only-s { display: none; }
.pg-tables { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.pg-table { padding: 10px 12px 12px; border-right: 1px solid var(--ink); min-width: 0; }
.pg-table:last-child { border-right: 0; }
.pg-table h5 { margin: 0 0 6px; font: 400 18px/1 var(--head); letter-spacing: 1px; }
.pg-table table { width: 100%; border-collapse: collapse; font: 400 12.5px var(--mono); }
.pg-table th { text-align: left; font: 700 10px var(--mono); letter-spacing: .5px; color: var(--ink2); border-bottom: 2px solid var(--ink); padding: 3px 2px; }
.pg-table th:last-child { text-align: right; }
.pg-table td { padding: 4px 2px; border-bottom: 1px dotted var(--ink3); }
.pg-table .rk { font: 400 16px/1 var(--head); width: 28px; }
.pg-table .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 0; width: 100%; }
.pg-table .v { text-align: right; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pg-table .v a { text-decoration: none; border-bottom: 2px solid var(--hi); }
.pg-table tr.pg-me td { background: var(--hi); color: var(--pg-hi-ink); }
.pg-table .pg-none { color: var(--ink3); text-align: center; padding: 14px 0; }
.pg-pin { margin: 6px 0 0; font: 700 12px var(--mono); background: var(--hi); color: var(--pg-hi-ink); padding: 4px 7px; border: 1.5px dashed var(--pg-hi-ink); }
.pg-yours { grid-column: 1 / -1; max-width: 420px; }
.pg-yours .nm { width: auto; max-width: none; }

/* ================================================================ MY DESK + /p/<name> */
body[data-view="public"] [data-private], body:not([data-view="public"]) [data-public] { display: none !important; }
.pg-deskhead { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pg-deskhead .headline { margin: 0; overflow-wrap: anywhere; }
.pg-badge { background: var(--blue); color: var(--pg-on); font: 700 12px var(--mono); letter-spacing: 1px; padding: 4px 9px; transform: rotate(-3deg); box-shadow: 2px 2px 0 var(--pg-shade); }
.pg-wallet { font: 700 13px var(--mono); border: 1.5px dashed var(--ink3); padding: 3px 7px; }
.pg-you { display: inline-block; font: 700 13px var(--mono); background: var(--hi); color: var(--pg-hi-ink); padding: 4px 9px; margin: 0 0 10px; }
.pg-streak { display: inline-flex; align-items: baseline; gap: 6px; font: 400 14px var(--mono); border: 2px solid var(--ink); background: var(--white); padding: 4px 11px; margin: 0 0 4px; box-shadow: 3px 3px 0 var(--pg-shade); }
.pg-streak b { font: 400 18px/1 var(--head); letter-spacing: 1px; color: var(--blue); }
.pg-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 14px 0 16px; }
.pg-stat { min-width: 0; }
.pg-stat b { display: block; min-height: 1.1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.pg-stat b a { text-decoration: none; }
.pg-stat small a { text-decoration: none; }
.pg-mtcard { padding: 4px 10px; overflow-x: auto; }
.pg-mt { width: 100%; border-collapse: collapse; font: 400 13px var(--mono); }
.pg-mt th { text-align: left; font: 700 10.5px var(--mono); letter-spacing: .5px; color: var(--ink2); border-bottom: 2px solid var(--ink); padding: 6px 6px; white-space: nowrap; }
.pg-mt td { padding: 7px 6px; border-bottom: 1px dotted var(--ink3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pg-mt tr:last-child td { border-bottom: 0; }
.pg-ledger { padding: 8px 10px 6px; }
.pg-ledger canvas { display: block; width: 100%; height: 220px; }
.pg-ledger-note { margin: 4px 0 0; font: 400 11px var(--mono); color: var(--ink3); }
.pg-count { font: 700 13px var(--mono); background: var(--ink); color: var(--paper); padding: 4px 9px; letter-spacing: 1px; }

/* THE STAMP BOOK: an album page with a stitched spine */
.pg-book { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 14px; padding: 18px 16px; background: var(--white); border: var(--line); box-shadow: var(--drop); position: relative; }
.pg-book::before { content: ""; position: absolute; left: 50%; top: 10px; bottom: 10px; border-left: 2px dashed var(--ink3); pointer-events: none; }
.pg-slot { display: flex; flex-direction: column; align-items: center; gap: 4px; background: none; border: 0; padding: 6px 2px; min-width: 0; color: var(--ink); cursor: default; position: relative; }
.pg-slot.got { cursor: pointer; }
.pg-slot:not(.got) .pg-art { opacity: .55; }
.pg-slot.got:hover .pg-art, .pg-slot.got:focus-visible .pg-art { transform: rotate(0deg) scale(1.07); }
.pg-slot.inked .pg-art { animation: pgInk .5s cubic-bezier(.2, 1.6, .4, 1) both; }
@keyframes pgInk { from { transform: rotate(var(--r, 0deg)) scale(1.9); opacity: 0; } }
.pg-cap { font: 700 10.5px/1.25 var(--mono); color: var(--ink2); text-align: center; min-height: 2.5em; overflow-wrap: anywhere; }
.pg-slot.got .pg-cap { color: var(--ink); letter-spacing: 1px; }
.pg-bigstamp { width: min(220px, 70vw); margin: 8px auto 10px; }
.pg-bigstamp svg { display: block; width: 100%; height: auto; overflow: visible; transform: rotate(-6deg); }

/* THE BIN: torn scraps in one pile */
.pg-binbar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.pg-binhead { margin: 0; font: 400 13px var(--mono); color: var(--ink2); }
.pg-binhead b { font: 400 22px/1 var(--head); color: var(--red); letter-spacing: .5px; }
.pg-binhead small { display: block; margin-top: 2px; font: 700 11px var(--mono); color: var(--ink3); }
.pg-bin { display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; padding: 24px 28px 30px; min-height: 130px; background: var(--sheet); border: var(--line); box-shadow: var(--drop); outline: 2px dashed var(--ink3); outline-offset: -10px; }
.pg-bin .np-empty { align-self: center; }
.pg-frag { width: 120px; height: 84px; margin: -8px -12px; padding: 0; border: 0; background: none; color: var(--ink); transform: rotate(var(--r, 0deg)); filter: drop-shadow(2px 2px 0 var(--pg-shade)); cursor: pointer; transition: transform .15s; position: relative; }
.pg-frag:hover, .pg-frag:focus-visible { transform: rotate(0deg) translateY(-6px) scale(1.06); z-index: 60 !important; outline: none; }
.pg-frag-in { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 100%; height: 100%; padding: 8px 13px; background: var(--white); clip-path: var(--cp); font: 400 10.5px/1.25 var(--mono); text-align: left; position: relative; overflow: hidden; }
.pg-frag-in b { font: 400 17px/1 var(--head); letter-spacing: .5px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-frag-in em { font: 700 12px var(--mono); font-style: normal; color: var(--red); }
.pg-frag-in::after { content: ""; position: absolute; left: -10%; right: -10%; top: 47%; border-top: 2px dashed var(--red); transform: rotate(-9deg); opacity: .65; }
.pg-more { width: auto; margin: 14px auto 0; display: block; padding: 10px 20px; font-size: 18px; }

/* the mended receipt (tap a scrap) */
.sheet.pg-mend-sheet { overflow-x: hidden; }
.pg-mend { position: relative; margin: 8px auto 16px; max-width: 300px; filter: drop-shadow(4px 4px 0 var(--pg-shade)); }
.pg-half { background: var(--white); transition: transform .3s cubic-bezier(.2, 1.3, .4, 1); }
.pg-half.top { position: relative; transform: translate(-18px, -24px) rotate(-7deg); }
.pg-half.bot { position: absolute; inset: 0; transform: translate(16px, 30px) rotate(6deg); }
.pg-mend.joined .pg-half { transform: none; }
.pg-sr { padding: 14px 16px 18px; font: 400 13px var(--mono); }
.pg-sr-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.pg-sr-top b { font: 400 26px/1 var(--head); letter-spacing: .5px; }
.pg-sr-no { font-size: 11px; color: var(--ink3); border-bottom: 1px dashed var(--ink3); padding: 4px 0 6px; }
.pg-sr dl { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; margin: 8px 0; }
.pg-sr dt { color: var(--ink2); } .pg-sr dd { margin: 0; text-align: right; font-weight: 700; }
.pg-sr-res { font: 400 34px/1 var(--head); text-align: center; border-top: 1px dashed var(--ink3); padding-top: 8px; }
.pg-sr-foot { text-align: center; font-size: 11px; color: var(--ink3); margin-top: 8px; overflow-wrap: anywhere; }

/* the desk's side column */
.pg-aside { display: flex; flex-direction: column; gap: 18px; }
.pg-ctl { padding: 14px; }
.pg-ctl .big-btn { font-size: 20px; padding: 12px; }
.pg-gap { margin-top: 14px; }
.pg-check { display: flex; gap: 8px; align-items: center; font: 700 12px var(--mono); margin-top: 10px; min-height: 36px; cursor: pointer; }
.pg-check input { width: 18px; height: 18px; accent-color: var(--ink); flex: none; }
.pg-bal { display: flex; justify-content: space-between; align-items: baseline; font: 700 15px var(--mono); padding: 5px 0; border-bottom: 1px dotted var(--ink3); }
.pg-side-card { padding: 12px 14px; }
.pg-histcard { padding: 4px 8px; overflow-x: auto; }

/* ================================================================ THE HOUSE: THE PROOF */
.pg-h1 { margin-top: 0; }
.pg-tills { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; margin: 22px 0 10px; align-items: start; }
.pg-till { display: flex; justify-content: center; filter: drop-shadow(4px 4px 0 var(--pg-shade)); min-width: 0; }
/* the torn top and bottom edge: two zigzag mask layers that meet in the middle (no mask-composite needed) */
.pg-till-paper, .pg-big {
  --z: 8px;
  -webkit-mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / calc(var(--z) * 2) 51% repeat-x, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--z) * 2) 51% repeat-x;
  mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / calc(var(--z) * 2) 51% repeat-x, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--z) * 2) 51% repeat-x;
}
.pg-till-paper { width: min(390px, 100%); background: var(--white); padding: 24px 22px 26px; font: 400 14px var(--mono); position: relative; animation: pgPrint .9s steps(12, end); }
@keyframes pgPrint { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
.pg-till-h { font: 400 26px/1 var(--head); letter-spacing: 1px; text-align: center; }
.pg-till-sub { text-align: center; font: 400 11px var(--mono); color: var(--ink3); border-bottom: 1px dashed var(--ink3); padding: 5px 0 9px; }
.pg-till-lines { list-style: none; margin: 14px 0 6px; padding: 0; }
.pg-till-lines li { display: flex; align-items: baseline; gap: 6px; padding: 5px 0; font: 700 14px var(--mono); }
.pg-till-lines li span { white-space: nowrap; }
.pg-till-lines li i { flex: 1; min-width: 12px; border-bottom: 2px dotted var(--ink3); transform: translateY(-4px); }
.pg-till-lines li b { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pg-till-lines .tot { border-top: 3px double var(--ink); margin-top: 8px; padding-top: 10px; }
.pg-till-lines .tot span, .pg-till-lines .tot b { font: 400 25px/1 var(--head); letter-spacing: .5px; }
.pg-till-src { font: 400 11px var(--mono); color: var(--ink2); margin: 10px 0 0; text-align: center; }
.pg-till-stamp { display: flex; justify-content: center; min-height: 64px; margin-top: 10px; }
.pg-till-foot { text-align: center; color: var(--ink3); margin-top: 12px; letter-spacing: 2px; font-size: 11px; overflow: hidden; white-space: nowrap; }
.pg-bigst { align-self: center; transform: rotate(-8deg); border: 3px solid currentColor; border-radius: 6px; padding: 7px 14px 5px; text-align: center; mix-blend-mode: multiply; }
.pg-bigst b { display: block; font: 400 25px/1 var(--head); letter-spacing: 1px; white-space: nowrap; }
.pg-bigst small { display: block; font: 700 10.5px var(--mono); margin-top: 3px; }
.pg-bigst.blue { color: var(--blue); } .pg-bigst.red { color: var(--red); } .pg-bigst.ink { color: var(--ink); } .pg-bigst.grey { color: var(--ink3); }
.pg-bigst.slam { animation: pgBig .4s cubic-bezier(.2, 1.6, .4, 1) both; }
@keyframes pgBig { from { transform: rotate(-8deg) scale(2.4); opacity: 0; } }
.pg-copyfix { max-width: 640px; margin: 14px auto 0; text-align: center; font: 700 14px/1.6 var(--mono); }
.pg-copyfix p { margin: 0; }
.pg-copyfix p:last-child { display: inline-block; background: var(--hi); color: var(--pg-hi-ink); padding: 0 7px; margin-top: 2px; }
body:not(.pg-live) .pg-live-only { display: none; }
.pg-wallets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pg-addr { border: var(--line); background: var(--white); padding: 12px 14px; box-shadow: 4px 4px 0 var(--pg-shade); min-width: 0; }
.pg-addr i { display: block; font: 700 11px var(--mono); font-style: normal; color: var(--ink2); letter-spacing: 1px; }
.pg-addr code { display: block; font: 700 13px/1.45 var(--mono); word-break: break-all; margin: 6px 0 8px; }
.pg-addr-b { display: flex; gap: 8px; flex-wrap: wrap; }
.pg-addr-b button, .pg-addr-b a { border: 2px solid var(--ink); background: var(--sheet); color: var(--ink); padding: 6px 11px; min-height: 36px; font: 700 12px var(--mono); text-decoration: none; display: inline-flex; align-items: center; box-shadow: 2px 2px 0 var(--pg-shade); }
.pg-addr-b button:hover, .pg-addr-b a:hover { background: var(--hi); color: var(--pg-hi-ink); }
.pg-loads { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pg-load { border: var(--line); background: var(--white); padding: 12px 14px; box-shadow: 4px 4px 0 var(--pg-shade); min-width: 0; }
.pg-load-h { display: flex; justify-content: space-between; align-items: baseline; }
.pg-load-h b { font: 400 24px/1 var(--head); letter-spacing: 1px; }
.pg-load-h span { font: 700 13px var(--mono); }
.pg-gauge { height: 22px; border: 2px solid var(--ink); background: var(--sheet); margin: 8px 0; position: relative; overflow: hidden; }
.pg-gauge i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--ink); transition: width .6s cubic-bezier(.3, 1.2, .5, 1); }
.pg-load.hot .pg-gauge i { background: var(--red); }
.pg-load.hot .pg-load-h span { color: var(--red); }
.pg-load p { margin: 0; font: 400 13px/1.45 var(--mono); }
.pg-cashcard { padding: 4px 10px; overflow-x: auto; margin-top: 10px; }
.pg-cash { width: 100%; border-collapse: collapse; font: 400 13px var(--mono); }
.pg-cash th { text-align: left; font: 700 10.5px var(--mono); letter-spacing: .5px; color: var(--ink2); border-bottom: 2px solid var(--ink); padding: 6px 6px; white-space: nowrap; }
.pg-cash td { padding: 6px 6px; border-bottom: 1px dotted var(--ink3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pg-cash td.blue, .pg-cash td.red { font-weight: 700; }
#hvHistTabs { margin-bottom: 10px; }

/* ================================================================ RULES */
.pg-stampgrid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 12px 10px; padding: 16px; background: var(--white); border: var(--line); box-shadow: var(--drop); }
.pg-slot.ruled .pg-cap { color: var(--ink2); letter-spacing: 0; }

/* ================================================================ THE TICKET LINK /t/<id> */
.pg-tk { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 34px; align-items: start; }
.pg-tk-l { min-width: 0; }
.pg-bigwrap { filter: drop-shadow(5px 5px 0 var(--pg-shade)); perspective: 900px; }
.pg-big { --z: 9px; background: var(--white); padding: 24px 24px 28px; font: 400 14px var(--mono); position: relative; transition: transform .22s ease-in; transform-origin: center; }
.pg-big.live { background: var(--white); background: color-mix(in srgb, var(--pg-tint) calc(var(--t, 0) * 100%), var(--white)); }
.pg-big.pg-flip { transform: rotateY(90deg); }
.pg-big.pg-hot:not(.pg-flip) { animation: pgTremble .18s steps(2) infinite; }
@keyframes pgTremble { 50% { transform: translate(1px, -1px) rotate(.5deg); } }
.pg-rc-load { font: 700 14px var(--mono); color: var(--ink3); padding: 34px 0; text-align: center; margin: 0; }
.pg-rc-head { display: flex; justify-content: space-between; font: 700 12px var(--mono); letter-spacing: 2px; border-bottom: 2px solid var(--ink); padding-bottom: 7px; }
.pg-rc-no { font-size: 12px; color: var(--ink3); padding: 6px 0; border-bottom: 1px dashed var(--ink3); overflow-wrap: anywhere; }
.pg-rc-no .pg-name { color: var(--ink); }
.pg-rc-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 12px 0 6px; }
.pg-rc-sym { font: 400 40px/1 var(--head); letter-spacing: .5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-rc-sym a { text-decoration: none; }
.pg-rc-top .pg-side { font-size: 14px; padding: 4px 9px; }
.pg-rc-degen { background: var(--red); color: var(--pg-on); font: 700 11px var(--mono); letter-spacing: 1px; padding: 4px 8px; margin: 6px 0; text-align: center; }
.pg-big dl { display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; margin: 12px 0; }
.pg-big dt { color: var(--ink2); } .pg-big dd { margin: 0; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.pg-rc-fuse { position: relative; height: 14px; border: 1.5px solid var(--ink); margin: 12px 0 22px; background: var(--sheet); }
.pg-rc-fuse i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--red); transition: width .3s; }
.pg-rc-fuse span { position: absolute; right: 0; top: calc(100% + 3px); font: 700 11px var(--mono); color: var(--ink2); }
.pg-rc-fuse span.red { color: var(--red); }
.pg-rc-res { text-align: center; border-top: 1px dashed var(--ink3); padding-top: 12px; margin-top: 14px; }
.pg-rc-res b { display: block; font: 400 clamp(36px, 11vw, 54px)/1 var(--head); letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.pg-rc-res span { font: 700 13px var(--mono); color: var(--ink2); }
.pg-rc-meta { text-align: center; font: 400 12px var(--mono); color: var(--ink2); margin-top: 8px; min-height: 1em; }
.pg-rc-perf { border-top: 2px dashed var(--ink); margin: 18px -24px 10px; position: relative; }
.pg-rc-perf span { position: absolute; left: 12px; top: -11px; background: var(--white); padding: 0 4px; font-size: 15px; }
.pg-big.live .pg-rc-perf span { background: transparent; }
.pg-rc-foot { text-align: center; font: 700 12px var(--mono); color: var(--ink3); overflow-wrap: anywhere; }
.pg-rc-stamp { position: absolute; inset: 0; pointer-events: none; z-index: 4; }
.pg-tk-stamps h4 { font: 400 17px/1 var(--head); letter-spacing: 1px; margin: 26px 0 8px; }
.pg-strip { display: flex; gap: 8px; flex-wrap: wrap; }
.pg-strip .pg-art { width: 74px; }
.pg-tk-r { min-width: 0; }
.pg-tk-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pg-tk-top .headline { margin: 0; }
.pg-tk-top .headline a { border-bottom-width: 5px; }
.pg-tk-live { background: var(--red); color: var(--pg-on); font: 700 12px var(--mono); letter-spacing: 1px; padding: 4px 9px; animation: pgBlink 1.2s steps(2, jump-none) infinite; }
@keyframes pgBlink { 50% { opacity: .55; } }
.pg-tk-watch { font: 700 13px var(--mono); border: 2px solid var(--ink); padding: 4px 9px; background: var(--white); box-shadow: 2px 2px 0 var(--pg-shade); }
.pg-tk-chart { height: 330px; margin: 16px 0 6px; overflow: hidden; }
.pg-tk-chart #tkChart { position: absolute; inset: 0; }
.pg-tk-chart #tkPath { display: none; width: 100%; height: 100%; }
.pg-tk-chart.pg-canvas #tkChart { display: none; }
.pg-tk-chart.pg-canvas #tkPath { display: block; }
.pg-sub { font: 400 22px/1 var(--head); letter-spacing: 1px; margin: 20px 0 8px; }
.pg-fine { margin: 0; padding: 0 0 0 22px; font: 400 13px/1.65 var(--mono); }
.pg-fine b { font-weight: 700; }
.pg-tk-rules { list-style: none; padding: 10px 12px; margin: 14px 0 0; border: 2px dashed var(--ink3); font: 400 12px/1.6 var(--mono); }
.pg-tk-rules b { font-weight: 700; background: var(--hi); color: var(--pg-hi-ink); padding: 0 4px; }

/* ================================================================ admin.html: the vault console (dense) */
.pg-ad-login { max-width: 440px; padding: 18px; }
.pg-ad-msg { font: 700 13px var(--mono); color: var(--red); min-height: 1.2em; margin: 8px 0 0; }
.pg-ad-bar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.pg-ad-out { flex: 1; min-width: 0; margin: 0; font: 700 13px var(--mono); background: var(--white); border: 2px solid var(--ink); padding: 8px 10px; overflow-wrap: anywhere; }
.pg-ad-out.bad { background: var(--red); color: var(--pg-on); }
.pg-ad-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pg-ad-panel { padding: 10px 12px 12px; min-width: 0; overflow-x: auto; }
.pg-ad-panel.wide { grid-column: 1 / -1; }
.pg-ad-panel h4 { margin: 0 0 8px; font: 400 18px/1.2 var(--head); letter-spacing: 1px; border-bottom: 2px solid var(--ink); padding-bottom: 4px; }
.pg-kv { border-collapse: collapse; font: 400 12px var(--mono); width: 100%; margin-bottom: 8px; }
.pg-kv th { text-align: left; font-weight: 700; padding: 3px 8px 3px 0; color: var(--ink2); white-space: nowrap; vertical-align: top; }
.pg-kv td { padding: 3px 6px; border-bottom: 1px dotted var(--ink3); overflow-wrap: anywhere; }
.pg-kv.wide thead th { border-bottom: 2px solid var(--ink); font-size: 10.5px; }
.pg-kv code { font: 400 11px var(--mono); }
.pg-ad-b { border: 2px solid var(--ink); background: var(--sheet); color: var(--ink); font: 700 12px var(--mono); padding: 6px 10px; min-height: 36px; box-shadow: 2px 2px 0 var(--pg-shade); white-space: nowrap; }
.pg-ad-b:active { transform: translate(1px, 1px); box-shadow: 1px 1px 0 var(--pg-shade); }
.pg-ad-b.red { background: var(--red); color: var(--pg-on); }
.pg-ad-b.arm { background: var(--hi); color: var(--pg-hi-ink); outline: 3px solid var(--red); outline-offset: 1px; }
.pg-ad-row { display: flex; align-items: center; gap: 10px; padding: 4px 0; flex-wrap: wrap; }
.pg-ad-row b { font: 400 18px/1 var(--head); letter-spacing: 1px; }
.pg-ad-row span { font: 400 12px var(--mono); }
.pg-ad-in { display: block; width: 100%; border: 2px solid var(--ink); padding: 8px; font: 700 13px var(--mono); margin: 6px 0; }
.pg-ad-off th { color: var(--ink3); text-decoration: line-through; }
.pg-ad-err { list-style: none; margin: 0; padding: 0; font: 400 12px var(--mono); }
.pg-ad-err li { padding: 3px 0; border-bottom: 1px dotted var(--ink3); overflow-wrap: anywhere; }
.pg-ad-err time { color: var(--red); font-weight: 700; }
.pg-ad-line { margin: 0 0 6px; font: 400 13px var(--mono); }

/* ================================================================ smaller screens (375px works: no page scroll, taps ≥ 36px) */
@media (max-width: 1100px) {
  .pg-tables { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-table:nth-child(3) { border-right: 0; }
  .pg-table:nth-child(n+4) { border-top: 1px solid var(--ink); }
  .pg-stampgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .pg-tk { grid-template-columns: minmax(0, 1fr); }
  .pg-tk-l { max-width: 440px; width: 100%; margin: 0 auto; }
  .pg-ad-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .pg-mast { grid-template-columns: minmax(0, 1fr); }
  .pg-ear { display: none; }
  .pg-numbers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-numbers div:nth-child(2) { border-right: 0; }
  .pg-numbers div:nth-child(n+3) { border-top: 1px solid var(--ink); }
  .pg-only-s { display: flex; margin-bottom: 8px; }
  .pg-tables { grid-template-columns: minmax(0, 1fr); }
  .pg-table { border-right: 0; padding: 10px 0; }
  .pg-table:nth-child(n+4) { border-top: 0; }
  .pg-tables[data-pick="profit"] .pg-table:not(.pg-yours):not([data-k="profit"]),
  .pg-tables[data-pick="best"] .pg-table:not(.pg-yours):not([data-k="best"]),
  .pg-tables[data-pick="shred"] .pg-table:not(.pg-yours):not([data-k="shred"]),
  .pg-tables[data-pick="streak"] .pg-table:not(.pg-yours):not([data-k="streak"]),
  .pg-tables[data-pick="volume"] .pg-table:not(.pg-yours):not([data-k="volume"]) { display: none; }
  .pg-close { margin-left: 0; width: 100%; }
  .pg-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .pg-stat b { font-size: 28px; }
  .pg-tills, .pg-wallets, .pg-loads { grid-template-columns: minmax(0, 1fr); }
  .pg-tk-chart { height: 260px; }
  .pg-bin { padding: 22px 18px 26px; }
}
@media (max-width: 600px) {
  .pg-hide-s { display: none; }
  .pg-book { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 14px 10px; }
  .pg-stampgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 12px; }
  .pg-mt, .pg-cash { font-size: 12px; }
  .pg-big { padding: 20px 18px 24px; }
  .pg-rc-perf { margin-left: -18px; margin-right: -18px; }
  .pg-rc-sym { font-size: 32px; }
}
@media (max-width: 480px) {
  .pg-hide-xs { display: none; }
  .pg-frag { margin: -8px -14px; }
}
@media (prefers-reduced-motion: reduce) {
  .pg-roll, .pg-half, .pg-big, .pg-frag, .pg-art, .pg-strike path, .pg-gauge i, .pg-rc-fuse i { transition: none !important; }
  .pg-big.pg-hot { animation: none !important; }
}

/* GK 2026-10-12: one vault, not two. The USDC vault is the one big receipt; the SOL for fees is a small grey line under it. */
.pg-tills { grid-template-columns: minmax(0, 1fr); gap: 14px; justify-items: center; }
#tillUSDC .pg-till-paper { width: min(520px, 100%); }
#tillUSDC .pg-till-h { font-size: 34px; }
#tillUSDC .pg-till-lines .tot span, #tillUSDC .pg-till-lines .tot b { font-size: 34px; }
#tillSOL { filter: none; width: min(520px, 100%); }
.pg-sol { width: 100%; border: 2px dashed var(--ink3); padding: 10px 14px; font: 400 12px var(--mono); color: var(--ink2); }
.pg-sol-main { display: flex; align-items: center; gap: 12px; }
.pg-sol-main b { font: 400 22px/1 var(--head); letter-spacing: .5px; color: var(--ink); white-space: nowrap; }
.pg-sol-main span { font: 700 12px/1.35 var(--mono); }
.pg-sol small { display: block; margin-top: 6px; font-size: 11px; color: var(--ink3); }
.pg-sol small i { font-style: normal; }
#tillUSDC { width: min(520px, 100%); }
#tillUSDC .pg-till-paper { width: 100%; }