/* Account pages - payouts, billing, certificates, leaderboard, notifications,
   journal, calendar, scaling. Built from the terminal's tokens and components;
   only what those pages need and terminal.css does not already have. */
.pg-form { display: flex; flex-direction: column; gap: 12px; padding: 14px; }
.pg-form .t-field select, .pg-form .t-field input[type=text], .pg-form .t-field input[type=number], .pg-form .t-field input[type=password], .pg-form .t-field input[type=email] {
  width: 100%; padding: 10px 11px; background: var(--panel); border: 1px solid var(--line); color: var(--ink); font: 500 12.5px/1.4 Inter, sans-serif; border-radius: 4px; }
.pg-form .t-field select:focus, .pg-form .t-field input:focus { border-color: var(--red); outline: none; }
.pg-form .seg { width: 100%; }
.pg-form .seg button { flex: 1; }
.po-amt { display: flex; gap: 6px; }
.po-amt input { flex: 1; }
.po-desk { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--red-dim); }
.po-desk .kv { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; }
.po-desk .kv span { color: var(--dim); }
.po-desk .kv b { font-family: 'DM Mono', monospace; font-weight: 500; }
.st { display: inline-block; padding: 2px 7px; border: 1px solid; border-radius: 3px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.st--pending, .st--processing, .st--evaluation { color: #d29a2a; border-color: #d29a2a; }
.st--paid, .st--completed, .st--funded, .st--passed, .st--win { color: var(--green); border-color: var(--green); }
.st--failed, .st--cancelled, .st--breached, .st--refunded, .st--loss { color: var(--red); border-color: var(--red); }
.st--open, .st--answered, .st--breakeven { color: var(--dim); border-color: var(--line2); }
.mono { font-family: 'DM Mono', monospace; }
.pg-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* billing */
.inv-head { display: grid; grid-template-columns: 1fr auto; gap: 14px; padding: 14px; }
.inv-head .who b { display: block; font-size: 13px; }
.inv-head .who span { display: block; color: var(--dim); font-size: 11px; }

/* certificates - cards carry the active design's palette (--ca accent, --cp paper, --ck ink) */
.cert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; padding: 14px; }
.cert { --ca: var(--red); --cp: var(--panel); --ck: var(--ink); position: relative; border: 1px solid var(--line2); border-radius: 18px; padding: 18px 18px 16px; background: var(--panel); display: flex; flex-direction: column; gap: 6px; min-height: 150px; overflow: hidden; }
/* the inner outline sits 6px inside an 18px corner, so its own radius is 12px - one arc, not two */
.cert::before { content: ''; position: absolute; inset: 6px; border: 1px solid var(--line-soft); border-radius: 12px; pointer-events: none; }
.cert::after { content: attr(data-kanji); position: absolute; right: 14px; bottom: 6px; font: 700 64px/1 'Noto Sans JP', sans-serif; color: var(--ca); opacity: .1; pointer-events: none; }
.cert__k { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: .22em; text-transform: uppercase; color: var(--ca); display: flex; align-items: center; gap: 8px; }
.cert__k::before { content: ''; width: 18px; height: 12px; border-radius: 3px; background: var(--cp); border: 1px solid var(--line2); box-shadow: inset 0 -3px 0 var(--ca); flex: 0 0 auto; }
.cert__t { font-size: 17px; font-weight: 800; letter-spacing: -.01em; }
.cert__who { font-size: 12px; color: var(--ink); }
.cert__meta { display: flex; gap: 14px; flex-wrap: wrap; margin-top: auto; font-size: 10.5px; color: var(--dim); }
.cert__meta b { color: var(--ink); font-family: 'DM Mono', monospace; font-weight: 500; }
.cert__acts { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; align-items: center; }
.cert__design { margin-left: auto; font-size: 10px; color: var(--faint); }
.cert--locked { opacity: .55; }
.cert--locked .cert__k { color: var(--faint); }
.cert--locked .cert__k::before { display: none; }
/* the certificate page: a scaled A4 sheet with its actions above it */
.cert-stage { max-width: 1100px; margin: 0 auto; width: 100%; }
.cert-acts { align-items: center; margin-bottom: 4px; }
.cert-acts__sp { flex: 1; }
.cert-note { font-size: 12px; }
.cert-note b { font-weight: 500; }
@media print { .side, .top, .status, .gate, .cert-acts, .cert-note { display: none !important; } .app { display: block; margin: 0; border: 0; box-shadow: none; background: none; height: auto; } .main, .scroll { overflow: visible; height: auto; padding: 0; } .cert-stage { max-width: none; } }

/* leaderboard */
.lb-top { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 14px; }
.lb-pod { border: 1px solid var(--line); border-radius: 6px; padding: 14px; position: relative; overflow: hidden; }
.lb-pod.first { border-color: var(--red); background: var(--red-dim); }
.lb-pod .rk { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: .22em; color: var(--red); }
.lb-pod .nm { font-size: 15px; font-weight: 800; margin: 6px 0 2px; }
.lb-pod .ac { font-size: 10.5px; color: var(--dim); font-family: 'DM Mono', monospace; }
.lb-pod .rt { font-family: 'DM Mono', monospace; font-size: 22px; margin-top: 10px; }
.lb-me td { background: var(--red-dim) !important; }
.lb-rank { font-family: 'DM Mono', monospace; color: var(--dim); }
.lb-bar { height: 3px; background: var(--line); margin-top: 4px; }
.lb-bar i { display: block; height: 100%; background: var(--red); }

/* notifications */
.nf-list { display: flex; flex-direction: column; }
.nf { display: grid; grid-template-columns: 36px 1fr auto; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--line); align-items: start; text-decoration: none; color: var(--ink); }
.nf:last-child { border-bottom: 0; }
.nf:hover { background: var(--red-dim); }
.nf i { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line2); display: grid; place-items: center; font: 700 12px 'Noto Sans JP', sans-serif; color: var(--red); font-style: normal; }
.nf b { display: block; font-size: 12.5px; }
.nf span { display: block; font-size: 11px; color: var(--dim); margin-top: 2px; }
.nf time { font-family: 'DM Mono', monospace; font-size: 9.5px; color: var(--faint); white-space: nowrap; }
.nf--breach i { color: var(--red); border-color: var(--red); }
.nf--paid i, .nf--funded i, .nf--pass i { color: var(--green); border-color: var(--green); }
.nf-filters { display: flex; gap: 4px; flex-wrap: wrap; padding: 10px 14px; border-bottom: 1px solid var(--line); }

/* journal */
.jn-stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.jn-note { width: 100%; min-width: 160px; padding: 4px 6px; background: transparent; border: 1px solid transparent; color: var(--ink); font: 500 11px Inter, sans-serif; }
.jn-note:focus { border-color: var(--red); outline: none; background: var(--panel); }
.jn-tags { display: flex; gap: 4px; flex-wrap: wrap; }
.jn-tag { padding: 2px 6px; border: 1px solid var(--line2); border-radius: 3px; font-size: 9.5px; color: var(--dim); cursor: pointer; }
.jn-tag.on { border-color: var(--red); color: var(--red); }
.jn-day { background: var(--red-dim); }
.jn-day td { font-weight: 700; font-size: 11px; }

/* calendar */
.cal-sessions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 14px; }
.cal-sess { border: 1px solid var(--line); border-radius: 6px; padding: 12px 14px; }
.cal-sess.on { border-color: var(--green); }
.cal-sess b { display: block; font-size: 13px; }
.cal-sess span { display: block; font-size: 10.5px; color: var(--dim); margin-top: 3px; }
.cal-sess .cal-st { margin-top: 8px; font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.cal-sess.on .cal-st { color: var(--green); }
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin: 0 14px 14px; }
.cal-day { background: var(--panel); min-height: 92px; padding: 8px; }
.cal-day.today { background: var(--red-dim); }
.cal-day .d { font-family: 'DM Mono', monospace; font-size: 10px; color: var(--dim); }
.cal-day.today .d { color: var(--red); }
.cal-ev { margin-top: 5px; font-size: 10.5px; line-height: 1.35; padding-left: 6px; border-left: 2px solid var(--line2); }
.cal-ev.hi { border-left-color: var(--red); }
.cal-ev.hol { border-left-color: #d29a2a; }
.cal-ev small { display: block; color: var(--faint); font-family: 'DM Mono', monospace; font-size: 9px; }
.cal-nav { display: flex; gap: 6px; align-items: center; }

/* scaling */
.sc-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; padding: 14px; }
.sc-step { border: 1px solid var(--line); border-radius: 6px; padding: 12px; }
.sc-step.on { border-color: var(--red); background: var(--red-dim); }
.sc-step .lv { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: .2em; color: var(--red); }
.sc-step .sz { font-size: 18px; font-weight: 800; margin: 4px 0; }
.sc-step .sp { font-size: 10.5px; color: var(--dim); }

@media (max-width: 900px) { .lb-top, .cal-sessions { grid-template-columns: 1fr; } .jn-stats { grid-template-columns: repeat(2, 1fr); } .cal-week { grid-template-columns: repeat(2, 1fr); } .inv-head { grid-template-columns: 1fr; } }

/* rules */
.rb-pick{display:grid;grid-template-columns:1.2fr 1fr auto;gap:12px;align-items:start}
.rb-step{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.rb-step > div{flex:1;min-width:0} .rb-step b{display:block;font-size:12px;color:var(--faint);margin-bottom:8px;font-weight:500}
.rb-n{width:24px;height:24px;border-radius:7px;background:var(--fill);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700;flex:0 0 auto}
.rb-step .seg button small{display:block;font-size:10px;opacity:.75;font-weight:400;margin-top:1px}
.rb-step--find{align-items:center} .rb-step--find input{width:100%;padding:10px 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);font:500 12.5px var(--ui)}
.rb-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.rb-kpi{padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,var(--card-2),var(--card));position:relative;overflow:hidden}
.rb-kpi::after{content:attr(data-k);position:absolute;right:10px;bottom:-6px;font:700 46px/1 'Noto Sans JP',sans-serif;color:var(--red);opacity:.08}
.rb-kpi span{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.rb-kpi b{display:block;font:600 22px/1.1 var(--num);letter-spacing:-.02em;margin:8px 0 4px}
.rb-kpi i{display:block;font-style:normal;font-size:11.5px;color:var(--dim)}
.rb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px}
.rule{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,var(--card-2),var(--card));padding:18px 20px;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}
.rule.hard{border-color:var(--red-b)}
.rule__top{display:flex;align-items:flex-start;gap:12px}
.rule__k{width:40px;height:40px;border-radius:12px;background:var(--red-a);color:var(--red);display:grid;place-items:center;font:700 16px 'Noto Sans JP',sans-serif;flex:0 0 auto}
.rule__t{flex:1} .rule__t h3{font-size:15px;font-weight:600;letter-spacing:-.01em}
.rule__t small{display:block;font-size:11px;color:var(--faint);margin-top:2px}
.rule__fig{font:600 20px/1 var(--num);letter-spacing:-.02em;white-space:nowrap;text-align:right}
.rule__fig small{display:block;font:500 10px var(--ui);color:var(--faint);margin-top:4px;letter-spacing:.04em;text-transform:uppercase}
.rule p{font-size:12.5px;line-height:1.6;color:var(--dim)}
.rule .ex{padding:10px 12px;border-radius:12px;background:var(--red-a);border:1px solid var(--red-b);font-size:12px;color:var(--ink)}
.rule .ex b{font-family:var(--num);font-weight:600}
.rule .br{font-size:11.5px;color:var(--faint)} .rule .br b{color:var(--red);font-weight:600}
.rule .tag-hard{position:absolute;top:14px;right:16px;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);border:1px solid var(--red-b);border-radius:999px;padding:2px 8px}
.rule.hard .rule__fig{margin-top:22px}
.rb-ban{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;padding:14px 22px}
.rb-ban div{padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-size:12.5px}
.rb-ban b{display:block;margin-bottom:3px} .rb-ban span{color:var(--faint);font-size:11.5px}
.rb-always{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;padding:14px 22px}
.rb-always div{padding:12px 14px;border-left:2px solid var(--red);font-size:12.5px} .rb-always b{display:block} .rb-always span{color:var(--faint);font-size:11.5px}
.rule.dim-out{display:none}
@media (max-width:900px){.rb-pick{grid-template-columns:1fr}}

/* pay */
.pay .pay__b{padding:16px 22px 20px;display:flex;flex-direction:column;gap:14px}
.pay__sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.pay__sum div{padding:10px 12px;border:1px solid var(--line);border-radius:12px} .pay__sum span{display:block;font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.06em} .pay__sum b{display:block;font-family:var(--num);font-size:15px;margin-top:3px}
.pay__due{border-color:var(--red)!important;background:var(--red-a)} .pay__due b{font-size:20px!important;color:var(--red)}
.pay__code{display:flex;gap:6px;max-width:420px} .pay__code input{flex:1;padding:9px 12px;border-radius:10px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);font:500 12.5px var(--ui)}
.pay__lab{font-size:11px;color:var(--faint);text-transform:uppercase;letter-spacing:.06em;margin-bottom:-6px}
.pay__coins{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.pay__coin{padding:12px 14px;border:1px solid var(--line-2);border-radius:14px;background:var(--card);text-align:left;color:var(--dim);cursor:pointer;transition:border-color .2s} .pay__coin b{display:block;font-size:14px;color:var(--ink)} .pay__coin span{display:block;font-family:var(--num);font-size:12.5px;margin-top:2px} .pay__coin small{display:block;font-size:10.5px;color:var(--faint)}
.pay__coin.on{border-color:var(--red);box-shadow:0 0 0 1px var(--red-b)} .pay__coin:hover{border-color:var(--red)}
.pay__go{width:100%;max-width:420px;height:48px;border-radius:14px;font-size:14px}
.pay__note{font-size:12px;color:var(--faint);line-height:1.6}
.pay__intent{display:grid;grid-template-columns:200px 1fr;gap:18px;align-items:start}
.pay__qr{padding:10px;background:#fff;border-radius:14px;width:200px} .pay__qr img{display:block}
.pay__det{display:flex;flex-direction:column;gap:12px}
.pay__row{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center} .pay__row span{grid-column:1/-1;font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.06em} .pay__row b{font-size:14px;word-break:break-all}
@media (max-width:760px){.pay__intent{grid-template-columns:1fr}}

/* competitions: the 2027 Grand Trading Cup */
.cup .feat__in{position:relative;z-index:1}
.cup__dates{font-family:var(--num);font-size:12.5px;color:var(--faint);margin:2px 0 8px}
.cup__in{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;border:1px solid var(--up);color:var(--up);font-size:12.5px;font-weight:600;background:var(--up-a)}
.cup__fine{font-size:11.5px;color:var(--faint);margin-top:10px;max-width:60ch;line-height:1.5}
.cup__prize{font-size:11.5px!important;line-height:1.3;white-space:normal}
.cup-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.cup-how{padding:14px 22px 18px;display:flex;flex-direction:column;gap:12px;font-size:12.5px;color:var(--dim);line-height:1.6}
.cup-formula{padding:12px 14px;border:1px solid var(--red-b);border-radius:12px;background:var(--red-a);font-family:var(--num);font-size:13.5px;color:var(--ink)}
.cup-formula b{color:var(--red)}
.cup-terms{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}
.cup-terms div{padding:10px 12px;border:1px solid var(--line);border-radius:12px}
.cup-terms dt{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)} .cup-terms dd{margin-top:3px;color:var(--ink);font-size:12px;line-height:1.5}
.cup-list{list-style:none;padding:8px 22px 16px;display:flex;flex-direction:column}
.cup-list li{padding:11px 0;border-bottom:1px solid var(--line)} .cup-list li:last-child{border-bottom:0}
.cup-list b{display:block;font-size:13px} .cup-list span{font-size:12px;color:var(--faint)}
.cup-tbl th:nth-child(2),.cup-tbl td:nth-child(2){min-width:180px}
.cup-name{color:var(--ink)} .cup-name:hover b{color:var(--red)}
@media (max-width:960px){.cup-grid{grid-template-columns:1fr}.cup-terms{grid-template-columns:1fr}}

/* clans - coming soon */
.clans .panel__head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.clans__b{padding:16px 22px 20px}
.clans__lead{font-size:13px;color:var(--dim);max-width:70ch;line-height:1.6}
.clans__steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0;counter-reset:cs}
.clans__steps li{position:relative;padding:16px 16px 14px;border:1px solid var(--line);border-radius:16px;background:var(--card);counter-increment:cs}
.clans__steps li::before{content:counter(cs);position:absolute;top:12px;left:14px;width:22px;height:22px;border-radius:7px;background:var(--fill);color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center}
.clans__steps svg{display:block;width:100%;max-width:150px;height:auto;margin:6px auto 10px}
.clans__steps b{display:block;font-size:13.5px} .clans__steps span{display:block;font-size:12px;color:var(--faint);line-height:1.5;margin-top:3px}
.c-ring{fill:none;stroke:var(--line-2);stroke-width:1.5;stroke-dasharray:4 4}
.c-dot{fill:var(--card-2);stroke:var(--dim);stroke-width:1.6} .c-dot--hi{fill:var(--fill);stroke:var(--fill)}
.c-line{fill:none;stroke:var(--dim);stroke-width:1.8;stroke-linecap:round;opacity:.7} .c-line--hi{stroke:var(--red);stroke-width:2.4;opacity:1}
.c-bar{fill:var(--raise);stroke:var(--line-2);stroke-width:1.2} .c-bar--hi{fill:var(--red-a);stroke:var(--red)}
.c-flag{fill:var(--red)}
.clans__cta{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .clans__note{font-size:12px;color:var(--faint)}
@media (max-width:900px){.clans__steps{grid-template-columns:1fr}}

/* record - the public track record */
.rec-own{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 14px;border:1px solid var(--up);border-radius:14px;background:var(--up-a);font-size:12.5px;color:var(--dim)}
.rec-own.is-private{border-color:var(--red-b);background:var(--red-a)}
.rec-own b{color:var(--ink)} .rec-own__a{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.rec-own__url{width:min(360px,70vw);padding:8px 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);font:500 12px var(--num)}
.rec-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:6px 0 2px}
.rec-who{display:flex;align-items:center;gap:14px}
.rec-av{width:52px;height:52px;border-radius:16px;background:var(--fill);color:#fff;display:grid;place-items:center;font-size:22px;font-weight:700;box-shadow:0 8px 24px rgba(224,32,31,.35)}
.rec-who h1{font:600 26px/1.15 var(--ui);letter-spacing:-.03em} .rec-who p{font-size:12.5px;color:var(--faint);margin-top:3px}
.verified{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid var(--up);color:var(--up);font-size:12.5px;font-weight:600;background:var(--up-a)}
.rec-cards{grid-template-columns:repeat(6,1fr)}
.rec-cards .hcard b{font-size:22px}
.rec-grid{grid-template-columns:1.4fr 1fr;gap:16px} .rec-grid .panel{min-height:0}
.rec-curve{height:260px;padding:8px 10px 6px}
.rec-months{padding:12px 16px 4px;display:flex;flex-direction:column;gap:8px}
.rm-year{display:grid;grid-template-columns:38px repeat(12,1fr) 52px;gap:3px;align-items:center}
.rm-year em{font-style:normal;font-family:var(--num);font-size:11px;color:var(--faint)}
.rm-year strong{font-family:var(--num);font-size:11.5px;text-align:right}
.rm{display:flex;flex-direction:column;align-items:center;justify-content:center;height:36px;border-radius:7px;border:1px solid var(--line);font-size:9px;color:var(--faint);background:var(--card)}
.rm i{font-style:normal;font-size:8.5px;letter-spacing:.04em;text-transform:uppercase} .rm b{font-family:var(--num);font-size:10.5px;color:var(--ink)}
.rm--up{background:color-mix(in srgb, var(--up) calc(var(--a) * 100%), var(--card));border-color:transparent}
.rm--dn{background:color-mix(in srgb, var(--dn) calc(var(--a) * 100%), var(--card));border-color:transparent}
.rm--up i,.rm--dn i,.rm--up b,.rm--dn b{color:var(--ink)}
.rm--none{opacity:.45}
.rec-kv{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.rec-kv > div{padding:12px 16px;border-right:1px solid var(--line)} .rec-kv > div:last-child{border-right:0}
.rec-kv span{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)} .rec-kv b{display:block;font-family:var(--num);font-size:17px;font-weight:600;margin-top:3px}
.rec-kv--4{border-top:0}
.rec-badges{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--line-2);border-radius:999px;font-size:12px;color:var(--ink);background:var(--card)}
.badge i{width:24px;height:24px;border-radius:50%;background:var(--red-a);color:var(--red);display:grid;place-items:center;font:700 12px 'Noto Sans JP',sans-serif;font-style:normal}
.badge--funded i,.badge--paid i{background:var(--up-a);color:var(--up)}
.rec-empty{padding:34px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.rec-empty h2{font-size:20px;font-weight:600;letter-spacing:-.02em} .rec-empty p{font-size:13px;color:var(--faint);max-width:52ch}
.rec-lock{width:48px;height:48px;border-radius:14px;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--faint)}
.rec-foot{font-size:11.5px;color:var(--faint);line-height:1.6;padding:0 4px 10px} .rec-foot a{color:var(--red)}
@media (max-width:1100px){.rec-cards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.rec-grid{grid-template-columns:1fr}.rm-year{grid-template-columns:repeat(6,1fr)}.rm-year em,.rm-year strong{grid-column:1/-1;text-align:left}.rec-kv{grid-template-columns:repeat(2,1fr)}}

/* settings: share your record */
.share{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.share input{flex:1;min-width:200px;padding:8px 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);font:500 12px var(--num)}
.ev-beta{display:inline-block;vertical-align:middle;margin-left:10px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--red);border:1px solid var(--red-b,rgba(224,32,31,.4));background:var(--red-a,rgba(224,32,31,.08))}

/* phone pass (max-width 680px) */
@media (max-width:680px){
  .rec-own__a{width:100%}
  .rec-own__url{flex:1 1 180px;width:auto;min-width:0;min-height:40px;font-size:16px}
  .rec-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cert-grid{grid-template-columns:1fr;padding:12px}
  .cert-acts{flex-wrap:wrap;gap:8px}
  .cert-acts__sp{display:none}
  .cert-stage .mzc-wrap{border-radius:4px}
}

/* ── accounts (/evaluations): the accounts you hold, the one you open next ──
   Built on the shared tokens only, so the papyrus light theme needs no
   overrides: every colour here is remapped by shell.css under
   [data-theme="light"]. */
.acc-who { font-size: 11.5px; color: var(--faint); font-family: var(--ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 46%; }

/* the accounts table: a two-line first cell, and cells that line up with the
   22px gutter the panel head uses instead of hugging the card edge */
#accDesksPanel .trades th { padding: 11px 22px; background: transparent; }
#accDesksPanel .trades td { padding: 13px 22px; vertical-align: middle; }
#accDesksPanel .trades tbody tr:last-child td { border-bottom: 0; }
#accDesksPanel .trades td .mini-btn { padding: 6px 13px; }
.acc-cell { min-width: 220px; }
.acc-code { display: block; font: 500 13.5px/1.2 var(--num); letter-spacing: -.01em; color: var(--ink); }
.acc-sub { display: block; margin-top: 6px; font: 500 11px/1.5 var(--ui); color: var(--faint); white-space: normal; letter-spacing: .01em; }
.acc-none { padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.acc-none b { font-size: 14px; font-weight: 600; color: var(--ink); }
.acc-none span { font-size: 12.5px; line-height: 1.7; color: var(--faint); max-width: 70ch; }

/* open an account: the price is the headline on every card */
.ev-lede { padding: 16px 22px 4px; font-size: 13px; line-height: 1.7; color: var(--dim); max-width: 84ch; }
.px-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 16px 22px 6px; }
.px-card { position: relative; display: flex; flex-direction: column; gap: 2px; text-align: left; padding: 18px 18px 16px; border: 1px solid var(--line-2); border-radius: 18px; background: var(--raise); color: var(--ink); cursor: pointer; transition: border-color .15s, transform .15s, box-shadow .15s; }
.px-card:hover { border-color: var(--red-b, var(--line-3)); transform: translateY(-1px); }
.px-card.on { border-color: var(--red); box-shadow: 0 0 0 1px var(--red), 0 14px 30px var(--red-a); }
.px-card__sz { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.px-card__px { display: block; margin: 10px 0 0; font: 600 40px/1 var(--num); letter-spacing: -.035em; color: var(--ink); }
.px-card.on .px-card__px { color: var(--red); }
.px-card__per { font-size: 11px; color: var(--faint); margin-top: 6px; }
.px-card__note { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); font-size: 11.5px; line-height: 1.45; color: var(--dim); }

.ev-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin: 16px 22px 0; padding: 18px 20px; border: 1px solid var(--line-2); border-radius: 18px; background: var(--red-a); }
.ev-cta__t { flex: 1 1 320px; min-width: 0; }
.ev-cta__t b { display: block; font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); }
.ev-cta__t span { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.65; color: var(--dim); max-width: 64ch; }
.ev-cta__go { flex: 0 0 auto; padding: 12px 22px; font-size: 13.5px; }

.ev-alt { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 12px 22px 0; padding: 14px 20px; border: 1px dashed var(--line-2); border-radius: 18px; }
.ev-alt b { display: block; font-size: 13px; font-weight: 600; color: var(--ink); }
.ev-alt span { display: block; margin-top: 4px; font-size: 12px; line-height: 1.6; color: var(--faint); max-width: 62ch; }
#evOpenPanel .sim-note { padding: 14px 22px 18px; font-size: 11px; letter-spacing: 0; color: var(--faint); line-height: 1.6; }
#evOpenPanel .sim-note a, .acc-none a { color: var(--red); }
#evOpenPanel .auth-err { padding: 8px 22px 0; font-size: 12px; }

/* the rule book: every rule, with the figure for the size picked */
.ev-rules { width: 100%; border-collapse: collapse; }
.ev-rules th, .ev-rules td { text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.ev-rules thead th { padding: 11px 22px; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); background: transparent; }
.ev-rules tbody th { padding: 15px 22px; width: 23%; min-width: 180px; font-size: 13px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); }
.ev-rules tbody td { padding: 15px 22px; font-size: 12.5px; line-height: 1.7; color: var(--dim); }
.ev-rules tbody tr:last-child th, .ev-rules tbody tr:last-child td { border-bottom: 0; }
.ev-rules__f { width: 21%; min-width: 170px; white-space: nowrap; }
.ev-rules__f b { display: block; font: 600 17px/1.2 var(--num); letter-spacing: -.02em; color: var(--ink); }
.ev-rules__f span { display: block; margin-top: 5px; font-size: 11px; line-height: 1.5; color: var(--faint); white-space: normal; }
.ev-rules__hard th { color: var(--red); }
.ev-rules__hard th em { display: block; margin-top: 5px; font-style: normal; font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--red); opacity: .8; }
.ev-rules__wait { padding: 22px; color: var(--faint); font-size: 12px; }
#evRulesPanel .pg-note { padding: 14px 22px 18px; } #evRulesPanel .pg-note a { color: var(--red); }

@media (max-width: 1100px) { .px-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
  .px-cards { grid-template-columns: 1fr; padding: 14px 14px 4px; gap: 10px; }
  .px-card__px { font-size: 34px; }
  .ev-lede { padding: 14px 14px 2px; }
  .ev-cta, .ev-alt { margin: 12px 14px 0; padding: 16px; }
  .ev-cta__go { width: 100%; }
  .acc-who { display: none; }
  #accDesksPanel .trades th, #accDesksPanel .trades td, .ev-rules thead th, .ev-rules tbody th, .ev-rules tbody td { padding-left: 14px; padding-right: 14px; }
  #evOpenPanel .sim-note, #evRulesPanel .pg-note, #evOpenPanel .auth-err, .acc-none { padding-left: 14px; padding-right: 14px; }
  .ev-rules tbody th { min-width: 130px; }
}

/* ── the programme switcher (/evaluations) ──────────────────────────────────
   Three programmes, one radio group. Tokens only, so the papyrus light theme
   needs no override. */
.pg-switch { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 16px 22px 2px; }
.pg-opt { display: flex; flex-direction: column; gap: 7px; text-align: left; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 16px; background: var(--card-2); color: var(--ink); cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
.pg-opt:hover { border-color: var(--line-3); transform: translateY(-1px); }
.pg-opt:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.pg-opt.on { border-color: var(--red); background: var(--red-a); }
.pg-opt__h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pg-opt__h b { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; }
.pg-opt.on .pg-opt__h b { color: var(--red); }
.pg-opt__tag { padding: 2px 8px; border-radius: 999px; font: 600 10px/1.6 var(--ui); letter-spacing: .08em; text-transform: uppercase; color: var(--faint); border: 1px solid var(--line-2); background: var(--raise); white-space: nowrap; }
.pg-opt__tag--instant { color: var(--up); border-color: var(--up-a); background: var(--up-a); }
.pg-opt__tag--scale { color: var(--red); border-color: var(--red-b); background: var(--red-a); }
.pg-opt__w { font-size: 12px; line-height: 1.6; color: var(--dim); }
/* a programme that is not on sale: readable, obviously inert, nothing to click */
/* the price a size returns to when the beta ends, beside what it costs today */
.px-card__was { margin-right: 9px; font-size: .52em; font-weight: 600; color: var(--faint); text-decoration-thickness: 1.5px; }
.px-card.on .px-card__was { color: var(--dim); }
.pg-opt--soon { opacity: .42; cursor: default; }
.pg-opt--soon:hover { border-color: var(--line-2); transform: none; }
.pg-opt__tag--soon { color: var(--faint); border-color: var(--line-2); background: var(--raise); }

/* a size card for something that is not for sale: the figure still reads, but
   nothing about it says "buy" */
.px-cards { grid-template-columns: repeat(var(--px-cols, 4), minmax(0, 1fr)); }
.px-card--soon { background: var(--card-2); }
.px-card--soon .px-card__px { color: var(--dim); font-weight: 500; }
.px-card--soon.on { border-color: var(--line-3); box-shadow: 0 0 0 1px var(--line-3); }
.px-card--soon.on .px-card__px { color: var(--ink); }
.px-card--soon .px-card__note { color: var(--faint); }
.ev-cta--soon { background: transparent; border-style: dashed; }
.ev-wait-msg { margin: 10px 22px 0; padding: 12px 16px; border: 1px solid var(--up-a); border-radius: 14px; background: var(--up-a); font-size: 12.5px; line-height: 1.65; color: var(--ink); }

/* ── the Scale ladder ───────────────────────────────────────────────────────
   A staircase, not a table. Every step doubles, so the bar heights run on a
   log scale: an even flight of stairs is the honest picture of doubling. */
.lad { padding: 6px 22px 2px; }
.lad__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.lad__step { display: grid; grid-template-rows: auto auto 168px 1fr auto; gap: 7px; align-content: start; min-width: 0; }
.lad__lv { font: 600 10px/1.4 var(--ui); letter-spacing: .14em; text-transform: uppercase; color: var(--faint); }
.lad__bal { font: 600 20px/1 var(--num); letter-spacing: -.03em; color: var(--ink); }
.lad__bar { position: relative; border: 1px solid var(--line); border-radius: 14px; background: var(--card-2); overflow: hidden; }
.lad__bar i { position: absolute; left: 0; right: 0; bottom: 0; height: var(--h, 20%); display: block; border-radius: 12px 12px 0 0; background: linear-gradient(180deg, var(--red) 0%, var(--red-a) 100%); }
.lad__step--hi .lad__bar i { background: linear-gradient(180deg, var(--up) 0%, var(--up-a) 100%); }
.lad__step--top .lad__bar { border-color: var(--up); }
.lad__step--top .lad__lv { color: var(--up); }
.lad__tg { font-size: 11.5px; line-height: 1.55; color: var(--dim); }
.lad__sp { justify-self: start; padding: 3px 9px; border-radius: 999px; font: 600 10.5px/1.5 var(--ui); letter-spacing: .04em; color: var(--red); border: 1px solid var(--red-b); background: var(--red-a); white-space: nowrap; }
.lad__step--hi .lad__sp { color: var(--up); border-color: var(--up-a); background: var(--up-a); }
.lad__key { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 16px 0 0; border-top: 1px solid var(--line); }
.lad__key dt { font: 600 10px/1.4 var(--ui); letter-spacing: .14em; text-transform: uppercase; color: var(--faint); }
.lad__key dd { margin: 5px 0 0; font-size: 12px; line-height: 1.6; color: var(--dim); }
#evLadderPanel .pg-note { padding: 14px 22px 18px; }

@media (max-width: 1100px) {
  .px-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-switch { grid-template-columns: 1fr; }
  .lad__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lad__key { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .px-cards { grid-template-columns: 1fr; }
  .pg-switch { padding: 14px 14px 2px; }
  .ev-wait-msg { margin: 10px 14px 0; }
  .lad { padding: 6px 14px 2px; }
  .lad__grid { grid-template-columns: 1fr; gap: 0; }
  .lad__step { grid-template-columns: auto 1fr auto; grid-template-rows: auto auto auto;
               grid-template-areas: "lv bal sp" "bar bar bar" "tg tg tg";
               align-items: center; gap: 8px 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
  .lad__grid li:last-child { border-bottom: 0; }
  .lad__lv { grid-area: lv; }
  .lad__bal { grid-area: bal; font-size: 17px; }
  .lad__sp { grid-area: sp; justify-self: end; }
  .lad__bar { grid-area: bar; height: 9px; border-radius: 999px; }
  .lad__bar i { width: var(--h, 20%); height: 100%; right: auto; top: 0; border-radius: 999px;
                background: linear-gradient(90deg, var(--red) 0%, var(--red-a) 100%); }
  .lad__step--hi .lad__bar i { background: linear-gradient(90deg, var(--up) 0%, var(--up-a) 100%); }
  .lad__tg { grid-area: tg; }
  .lad__key { grid-template-columns: 1fr; margin-top: 16px; }
  #evLadderPanel .pg-note { padding: 14px 14px 18px; }
}

/* ==========================================================================
   Responsive + rendering pass, 23 Sep 2026.
   Widths 320 to 2560, landscape phones, tablets, and a downgrade for cheap
   hardware. Layout and rendering cost only.
   ========================================================================== */

/* The rule book is a table of sentences, and shell.css sets td{white-space:
   nowrap} for the number tables. That held this table at 2,054px at every
   viewport: it scrolled sideways inside its card even on a 2,560px monitor. */
.ev-rules td, .ev-rules th { white-space: normal; }
.ev-rules__f { white-space: nowrap; }
.ev-rules tbody td { overflow-wrap: anywhere; }
/* the panel heading carries the programme name, which can be long */
#evRuleH { min-width: 0; overflow-wrap: anywhere; }

/* Under 760px three columns of prose cannot hold, so the rule stacks: the
   name, then the figure, then what it means. No scroll, no clipped words. */
@media (max-width: 760px) {
  .ev-rules, .ev-rules thead, .ev-rules tbody, .ev-rules tr, .ev-rules th, .ev-rules td { display: block; width: auto; }
  .ev-rules thead { display: none; }
  .ev-rules tbody tr { padding: 14px 16px; border-bottom: 1px solid var(--line); }
  .ev-rules tbody tr:last-child { border-bottom: 0; }
  .ev-rules tbody th, .ev-rules tbody td { padding: 0; border-bottom: 0; min-width: 0; width: auto; }
  .ev-rules tbody th { font-size: 14px; }
  .ev-rules__f { margin: 8px 0 6px; }
  .ev-rules__f b { font-size: 20px; }
  .ev-rules__f span { display: inline; margin-left: 8px; }
  .ev-rules tbody td:not(.ev-rules__f) { font-size: 12.5px; }
  #evRulesPanel .trades-scroll { overflow: visible; }
}

/* every control a finger reaches for, on tablets and landscape phones too */
@media (max-width: 1080px), (pointer: coarse) {
  .px-card { min-height: 88px; }
  .pg-opt { min-height: 56px; }
  .ev-cta__go { min-height: 44px; }
  .share input, .rec-own__url { min-height: 44px; font-size: 16px; }
  .share .mini-btn, .share .cbtn { min-height: 44px; }
  #accDesksPanel .trades td .mini-btn { min-height: 40px; padding: 8px 14px; }
  .cert-acts .mini-btn, .cert-acts .cbtn { min-height: 44px; }
}

/* 320-400px: one column everywhere, gutters that match the shell */
@media (max-width: 400px) {
  .px-cards, .pg-switch, .lad { padding-left: 12px; padding-right: 12px; }
  .ev-lede, #evOpenPanel .sim-note, #evRulesPanel .pg-note { padding-left: 12px; padding-right: 12px; }
  .ev-cta, .ev-alt, .ev-wait-msg { margin-left: 12px; margin-right: 12px; }
  .ev-rules tbody tr { padding-left: 12px; padding-right: 12px; }
  .px-card__px { font-size: 30px; }
  .rec-cards { grid-template-columns: 1fr; }
  .cert-grid { padding: 10px; }
  .lb-top, .cal-week { grid-template-columns: 1fr; }
}

/* landscape phones: two columns of size cards fit again, and the ladder goes
   back to a row so the page is not four screens of scrolling */
@media (max-height: 520px) and (orientation: landscape) {
  .px-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .px-card { padding: 12px 14px 12px; }
  .px-card__px { font-size: 28px; margin-top: 6px; }
  .pg-switch { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-opt { padding: 10px 12px; }
  .lad__step { grid-template-rows: auto auto 100px 1fr auto; }
  .cert-stage { max-width: 62vw; }
}

/* above 1600: the sheets stop growing, the grids gain columns */
@media (min-width: 1600px) {
  .ev-lede, .acc-none span, .ev-cta__t span, .ev-alt span { max-width: 84ch; }
  .ev-rules tbody td { max-width: 78ch; }
  .rec-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .cert-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
  .cert-stage { max-width: 940px; }
  .inv-wrap { max-width: 900px; }
}

/* low-end: flat surfaces, no lift on hover, no transitions worth a frame */
html.mz-low .px-card, html.mz-low .pg-opt { transition: none; }
html.mz-low .px-card:hover, html.mz-low .pg-opt:hover { transform: none; }
html.mz-low .px-card.on { box-shadow: 0 0 0 1px var(--red); }
html.mz-low .cert, html.mz-low .lb-pod, html.mz-low .cert-stage .mzc-wrap { box-shadow: none; }
html.mz-low .inv-sheet { box-shadow: none; }
/* checkout: asset first, then the network it is sent on */
.pay__lab small{display:block;font-size:11px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--faint);margin-top:3px}
.pay__nets{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin-bottom:14px}
.pay__net{display:block;text-align:left;padding:11px 13px;border-radius:12px;border:1px solid var(--line-2);background:var(--card-2);transition:border-color .2s,background .2s}
.pay__net b{display:block;font-size:13px;font-weight:600}
.pay__net span{display:block;font-size:12px;color:var(--faint);margin-top:2px}
.pay__net em{display:block;font-style:normal;font-size:11px;color:var(--warn,#c07f28);margin-top:4px}
.pay__net:hover{border-color:var(--red)}
.pay__net.on{border-color:var(--red);background:var(--red-a)}
.pay__row--warn b{color:var(--warn,#c07f28)}
@media (max-width:600px){.pay__nets{grid-template-columns:1fr}}

/* the identity gate shown before a payout can be requested */
.ky-gate{display:grid;gap:8px;justify-items:start;padding:16px 18px;margin:0 0 18px;border:1px solid var(--line-3);border-radius:var(--r);background:linear-gradient(160deg,var(--red-a),var(--card))}
.ky-gate b{font-size:15px;font-weight:650}
.ky-gate p{color:var(--dim);font-size:13px;line-height:1.6;max-width:62ch}
.ky-gate .mini-btn{display:inline-flex;align-items:center;min-height:40px;padding:0 14px}
