/* ChopGate verify + try-it page.
   Tokens are named by meaning. Hue values stay the 0xAILab space tone. */
@font-face{
  font-family:"Sora";
  src:url("./fonts/Sora-VariableFont_wght.ttf") format("truetype");
  font-weight:100 800;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Michroma";
  src:url("./fonts/Michroma-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans";
  src:url("./fonts/IBMPlexSans-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight:100 700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Mono";
  src:url("./fonts/IBMPlexMono-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Mono";
  src:url("./fonts/IBMPlexMono-Medium.ttf") format("truetype");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

:root{
  color-scheme:dark;
  --space:#020308;
  --ink:#EDF0F8;
  --mute:#8D94AA;
  --line:rgba(160,180,255,.2);
  --glass:rgba(8,10,20,.74);
  --chain:#7FB2FF;
  --chain-dim:rgba(127,178,255,.16);
  --ok:#62D9A0;
  --hold:#FFD27A;
  --deny:#FF9E6B;
  --press:rgba(127,178,255,.28);
  --wm:"Sora","IBM Plex Sans","Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  --kr:"IBM Plex Sans","Sora","Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --label:"Michroma","Sora",sans-serif;
  --max:1080px;
  --type-body:16px;
  --leading-body:1.5;
  --type-kicker:14px;
  --type-label:13px;
  --type-helper:14px;
  --type-heading:20px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --press-ms:120ms;
  --hit:44px;
  --gap-hit:12px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--space);color:var(--ink)}
html{overflow-x:hidden}
body{
  font-family:var(--kr);
  font-size:var(--type-body);
  line-height:var(--leading-body);
  min-height:100%;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(1200px 500px at 80% -10%,rgba(127,178,255,.12),transparent 60%),
    radial-gradient(800px 400px at 0% 20%,rgba(90,80,180,.1),transparent 55%),
    var(--space);
}
img,video,canvas{max-width:100%;height:auto}
button,a{color:inherit}
button{font:inherit;background:none;border:0;padding:0;cursor:pointer}
a{text-decoration:none}
:focus-visible{outline:2px solid var(--chain);outline-offset:3px;border-radius:var(--radius-sm)}
h1,h2,h3,p,li,dd,dt{margin:0;overflow-wrap:anywhere}
[lang="en"] h1,[lang="en"] h2,[lang="en"] p{word-break:normal}
.num{font-variant-numeric:tabular-nums}

.ico{
  width:1.15em;
  height:1.15em;
  flex:none;
  fill:none;
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.wrap{
  width:min(var(--max), 100%);
  margin:0 auto;
  padding:var(--space-5) var(--space-4) var(--space-6);
  box-sizing:border-box;
}
@media (max-width:420px){
  .wrap{padding:var(--space-4) var(--space-4) var(--space-6)}
}

.top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--gap-hit);
  margin-bottom:var(--space-5);
}
.brand{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}
.brand .name{
  font-family:var(--wm);
  font-weight:600;
  font-size:1.45rem;
  letter-spacing:-.02em;
  line-height:1.2;
  display:inline-flex;
  align-items:center;
  min-height:var(--hit);
  min-width:var(--hit);
}
.brand .tag{font-family:var(--wm);font-size:.875rem;color:var(--mute)}

.lang-btn,.btn,.hit{
  min-height:var(--hit);
  min-width:var(--hit);
  max-width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--space-2);
  overflow-wrap:anywhere;
  white-space:normal;
  padding:var(--space-2) var(--space-4);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:rgba(6,8,16,.6);
  color:var(--ink);
  text-align:center;
  line-height:1.3;
  transition:background-color var(--press-ms) linear,border-color var(--press-ms) linear,transform var(--press-ms) linear;
}
.lang-btn{
  flex:none;
  border-radius:999px;
  font-family:var(--wm);
  font-size:.875rem;
  color:var(--ink);
}
.btn.is-pressed,.hit.is-pressed,.lang-btn.is-pressed,
.btn:active,.hit:active,.lang-btn:active{
  background:var(--press);
  border-color:var(--chain);
  transform:translateY(1px);
}

.stack{display:flex;flex-direction:column;gap:var(--space-4)}
.card{
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--glass);
  padding:var(--space-5) var(--space-5) var(--space-4);
  box-shadow:0 0 40px rgba(90,120,255,.06) inset;
  min-width:0;
}
@media (max-width:420px){
  .card{padding:var(--space-4);border-radius:14px}
}

.kicker{
  font-family:var(--label);
  font-size:var(--type-kicker);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--chain);
  margin-bottom:var(--space-2);
  line-height:1.4;
}
.card h2{
  font-family:var(--wm);
  font-weight:600;
  font-size:var(--type-heading);
  letter-spacing:-.02em;
  line-height:1.35;
  margin-bottom:var(--space-2);
}
.card p{color:var(--ink);font-size:var(--type-body)}
.try .kicker{color:var(--hold)}

.badge-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--gap-hit);
  margin:var(--space-3) 0 var(--space-4);
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:var(--space-2);
  min-height:var(--hit);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:var(--space-2) var(--space-4);
  font-family:var(--wm);
  font-size:1.05rem;
  color:var(--ink);
  max-width:100%;
}
.badge.live{border-color:rgba(142,232,184,.55)}
.badge.recorded{border-color:rgba(255,224,163,.55)}
.status-line{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--space-2);
  font-size:1.25rem;
  font-weight:600;
  line-height:1.35;
  min-width:0;
}
.status-line-compact{font-size:1rem;font-weight:600}
.status-name{color:var(--mute);font-weight:600}
.status-value{min-width:0;overflow-wrap:anywhere}

.hash-lead,.table-lead,.note,.fonts,.limits{
  color:var(--mute);
  font-size:.95rem;
}
.hash-lead{margin-bottom:var(--space-3)}

.scroll{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  margin:0;
}
table{
  width:100%;
  min-width:0;
  border-collapse:collapse;
  font-size:.95rem;
}
th,td{
  text-align:left;
  vertical-align:top;
  padding:var(--space-2);
  border-bottom:1px solid var(--line);
  overflow-wrap:anywhere;
}
th{
  font-family:var(--wm);
  font-weight:500;
  font-size:var(--type-label);
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--mute);
}
.mono{font-family:var(--mono);font-size:var(--type-helper);overflow-wrap:anywhere}
.signer,.hash{min-width:0}
.verdict{font-weight:600}
.verdict.allow,.verdict.approved{color:var(--ok)}
.verdict.block,.verdict.hold{color:var(--hold)}
.verdict.fail{color:var(--deny)}
.jev{font-family:var(--mono);font-size:var(--type-helper);line-height:1.45}
.jev .muted{color:var(--mute);font-family:var(--kr);font-size:var(--type-helper)}
.related{margin-top:var(--space-2)}
.link-row{display:flex;flex-wrap:wrap;gap:var(--gap-hit);align-items:center;min-width:0;max-width:100%}
.link-row > .hit{flex:1 1 12rem;max-width:100%}
.match-yes{color:var(--ok);font-weight:600}
.match-no{color:var(--deny);font-weight:600}
.match-na{color:var(--mute)}
.note{margin-top:var(--space-3)}
.footer{margin-top:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2)}
.fonts,.limits{font-size:.875rem}
.kicker-follow{margin-top:var(--space-1)}
.kicker-gap{margin-top:var(--space-5)}

@media (max-width:720px){
  .scroll{overflow-x:visible}
  table,thead,tbody,tr,th,td{display:block;width:100%}
  thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  tr{border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);margin:0 0 var(--space-3);background:rgba(8,10,20,.45)}
  tr:last-child{margin-bottom:0}
  th,td{border:0;padding:var(--space-2) 0}
  td{display:grid;grid-template-columns:minmax(0,7.5rem) minmax(0,1fr);gap:var(--space-2);align-items:start;min-width:0}
  td::before{content:attr(data-label);color:var(--mute);font-family:var(--wm);font-size:var(--type-label);letter-spacing:.04em;text-transform:uppercase;padding-top:2px}
}

.hash-list{display:flex;flex-direction:column;gap:var(--space-3);min-width:0}
.hash-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);background:rgba(8,10,20,.45);min-width:0}
.hash-card header{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);align-items:baseline;margin-bottom:var(--space-2)}
.hash-card header strong{font-family:var(--wm);font-weight:600}
.hash-card header .mono{color:var(--mute);font-size:var(--type-helper);overflow-wrap:anywhere}
.hash-row{display:grid;grid-template-columns:minmax(7rem,13rem) minmax(0,1fr);gap:var(--space-2) var(--space-3);padding:var(--space-1) 0;align-items:start}
.hash-row dt{color:var(--mute);font-family:var(--wm);font-size:var(--type-label);letter-spacing:.04em;text-transform:uppercase;padding-top:2px}
.hash-row dd{margin:0;overflow-wrap:anywhere}
.hash-note{margin-top:var(--space-2);color:var(--mute);font-size:.9rem}
@media (max-width:720px){
  .hash-row{grid-template-columns:minmax(0,1fr)}
}

dl.hash-dl{margin:0}
.demo-lead{color:var(--mute);font-size:1rem;margin-bottom:var(--space-3)}
.demo-sub{margin-top:var(--space-2);color:var(--ink);font-size:1rem}
.demo-frame{width:100%;max-width:100%;min-width:0;border-radius:var(--radius-md);overflow:hidden;background:#000;border:1px solid var(--line)}
.demo-frame video{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:16/9;background:#000}
.jev-note{margin-top:var(--space-1);color:var(--mute);font-family:var(--kr);font-size:var(--type-helper);line-height:1.4}
.scene-cell{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.row-source{
  font-family:var(--wm);
  font-size:var(--type-label);
  line-height:1.3;
  letter-spacing:.04em;
  text-transform:uppercase;
  border:1px solid var(--line);
  border-radius:999px;
  padding:2px 8px;
}
.row-source.live{color:var(--ok);border-color:rgba(98,217,160,.55)}
.row-source.recorded{color:var(--hold);border-color:rgba(255,224,163,.55)}
.gas-note{margin-top:0}
#gas-lock{color:var(--deny)}
.connect-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-hit);margin-top:var(--space-3)}
.web-hint{margin:0;flex:1 1 16rem;min-width:0}
.hold-status{margin-top:var(--space-4);font-size:var(--type-body)}
.attack-list{display:flex;flex-direction:column;gap:var(--gap-hit);margin-top:var(--space-3)}
.attack{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0}
.attack .btn{width:100%}
.see{margin:0;color:var(--mute);font-size:var(--type-helper)}
.limits{margin-top:var(--space-4)}
.limits > summary{
  min-height:var(--hit);
  min-width:var(--hit);
  display:flex;
  align-items:center;
  padding:var(--space-2) var(--space-4);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  cursor:pointer;
  font-size:var(--type-body);
  line-height:1.3;
  list-style:none;
}
.limits > summary::-webkit-details-marker{display:none}
.limits-body{display:flex;flex-direction:column;gap:var(--gap-hit);margin-top:var(--space-3)}
.limits-body p{margin:0}
.verdict-line{display:flex;align-items:flex-start;gap:8px;font-weight:600;font-size:var(--type-body);margin:0}
.result-card[data-verdict="refused"],
.result-card[data-verdict="failed"],
.result-card[data-verdict="resolved"]{border-color:rgba(255,158,107,.75)}
.result-card[data-verdict="paid"]{border-color:rgba(98,217,160,.7)}
.result-card[data-verdict="held"]{border-color:rgba(255,210,122,.75)}
.result-card[data-verdict="refused"] .verdict-line,
.result-card[data-verdict="failed"] .verdict-line,
.result-card[data-verdict="resolved"] .verdict-line{color:var(--deny)}
.result-card[data-verdict="paid"] .verdict-line{color:var(--ok)}
.result-card[data-verdict="held"] .verdict-line{color:var(--hold)}
.result-reason,.result-paid,.result-note{margin-top:8px;font-size:var(--type-body)}
.result-paid{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-hit)}
.result-card .verdict-line{margin-top:0}
.hash-label{font-family:var(--mono)}

.scene{
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  background:rgba(8,10,20,.45);
  min-width:0;
}
.scene:focus-visible{outline-offset:4px}
.scene-sentence{font-size:1.25rem;font-weight:600;line-height:1.35;margin:var(--space-2) 0 var(--space-3)}
.scene-steps{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}
.scene-steps li{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;min-height:var(--hit);padding:var(--space-1) 0}
.scene-steps li.is-current{border:1px solid var(--chain);border-radius:var(--radius-md);padding:var(--space-2);background:var(--chain-dim)}
.scene-steps li.is-done .status-value{color:var(--mute)}
.scene-steps .step-now{font-size:.875rem;border:1px solid var(--line);border-radius:999px;padding:2px 8px}
.scene-controls{display:flex;flex-wrap:wrap;gap:var(--gap-hit);margin-top:var(--space-3)}
.forged{
  margin-top:var(--space-3);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  background:rgba(127,178,255,.06);
}
.steps{margin:var(--space-3) 0;padding-left:1.25rem;display:flex;flex-direction:column;gap:var(--space-2)}
.wallet-path,.update-slot,.mainnet-line{margin-top:var(--space-3)}
.faucet-block{margin-top:var(--space-3)}
.faucet-block .link-row{margin:0}
.update-slot{border-left:3px solid var(--hold);padding-left:var(--space-3)}
.attack-row{display:flex;flex-wrap:wrap;gap:var(--gap-hit);margin-top:var(--space-3)}
.attack-row .btn{flex:1 1 220px}
.fixed-args{margin-top:var(--space-3)}
.hold-links{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gap-hit);margin-top:var(--space-2)}
.result-list{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4)}
.result-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-3);min-width:0}
.result-card[data-state="success"]{border-color:rgba(98,217,160,.7)}
.result-card[data-state="failure"]{border-color:rgba(255,158,107,.75)}
.result-card[data-state="loading"]{border-color:rgba(255,210,122,.7)}
.result-card[data-state="empty"]{border-color:var(--line)}
[hidden]{display:none !important}
.result-card p{margin-top:var(--space-2)}
.cost-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3);margin-top:var(--space-3)}
.cost-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-3);min-width:0}
.cost-card h3{font-size:1rem;margin-bottom:var(--space-2)}
.cost-card dl{display:flex;flex-direction:column;gap:var(--space-2)}
.cost-card div{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--space-2);align-items:baseline}
.cost-card dd{margin:0;font-variant-numeric:tabular-nums}
.est{color:var(--mute);font-size:var(--type-helper);margin-left:var(--space-1)}
@media (min-width:768px){
  .cost-grid{grid-template-columns:1fr 1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  .btn.is-pressed,.hit.is-pressed,.lang-btn.is-pressed,
  .btn:active,.hit:active,.lang-btn:active{transform:none}
}
:lang(ko){word-break:keep-all}
th[data-i18n="colPayout"]{white-space:nowrap}
a.hit > span{white-space:nowrap}
.result-raw{margin-top:8px;font-size:var(--type-body);overflow-wrap:anywhere}
/* evidence table: cards at every width; two columns of cards from 900px */
.scroll{overflow-x:visible}
table,thead,tbody,tr,th,td{display:block;width:100%}
thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
tr{border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);margin:0 0 var(--space-3);background:rgba(8,10,20,.45)}
tr:last-child{margin-bottom:0}
th,td{border:0;padding:var(--space-2) 0}
td{display:grid;grid-template-columns:minmax(0,7.5rem) minmax(0,1fr);gap:var(--space-2);align-items:start;min-width:0}
td::before{content:attr(data-label);color:var(--mute);font-family:var(--wm);font-size:var(--type-label);letter-spacing:.04em;text-transform:uppercase;padding-top:2px}
@media (min-width:900px){
  tbody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
  tbody tr{margin:0}
}
/* proof page: the story is on the home page now, so its three heading-only cards are hidden here */
#explain,#problem,#solution{display:none}