:root{
    
    color-scheme:dark;
    
    --w-body:400; --w-med:560; --w-semi:620; --w-head:660;
    
    --t-2xs:11px; --t-xs:12px; --t-sm:13.5px; --t-base:16px; --t-md:18px;
    --radius-xs:4px; --radius-sm:7px; --radius-md:10px; --radius:14px;
    --radius-lg:20px; --radius-pill:999px;
    --t-lg:22px; --t-figure:26px; --t-2xl:clamp(32px,5vw,46px);
    --bg:#080E18; --surface:#0F1826; --surface-2:#141F31; --surface-3:#1B283D;
    --border:#243347; --border-strong:#31445E;
    --ink:#E8EEF6; --ink-soft:#AEBDD0; --muted:#8090A5;
    --accent:#2ED6C2; --accent-ink:#7ff0e3; --accent-tint:#123430; --btn-fill:#2ED6C2;
    --recur:#EDA255; --recur-tint:#33230F; --recur-ink:#EDA255;
    --good:#33C98C; --warn:#E6C255; --bad:#EF7259;
    
    --warn-ink:#D9B155;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 12px 34px rgba(0,0,0,.4);
    --font-sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --font-mono:ui-monospace,"SF Mono","JetBrains Mono","Cascadia Code",Menlo,Consolas,monospace;
  }
  
  :root[data-theme="light"]{
    color-scheme:light;
    --bg:#EEF2F6; --surface:#FFFFFF; --surface-2:#F1F5F9; --surface-3:#E7EDF3;
    --border:#D7E0EA; --border-strong:#C2Cedb;
    
    --ink:#0F1B2D; --ink-soft:#41536A; --muted:#5C6C7E;
    --accent:#0C9A8B; --accent-ink:#0A786B; --accent-tint:#DBF1EE;
    
    --btn-fill:#0A786B;
    
    --recur:#D97B22; --recur-tint:#FBEAD7; --recur-ink:#9E5A19;
    --good:#12996A; --warn:#C98A0B; --bad:#D2503A;
    --warn-ink:#926606;
    --shadow:0 1px 2px rgba(16,27,45,.05), 0 8px 30px rgba(16,27,45,.07);
  }
  *{box-sizing:border-box}
  body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:var(--font-sans); line-height:1.5;
    -webkit-font-smoothing:antialiased;
    padding:clamp(16px,4vw,48px) clamp(14px,4vw,24px) 64px;
  }
  .wrap{max-width:940px; margin:0 auto}
  
  .eyebrow{
    font-family:var(--font-mono); font-size:var(--t-xs); letter-spacing:.16em;
    text-transform:uppercase; color:var(--accent-ink); font-weight:var(--w-semi);
    display:flex; align-items:center; gap:9px; margin:0 0 14px;
  }
  .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);
    box-shadow:0 0 0 4px var(--accent-tint)}
  h1{font-size:var(--t-2xl); line-height:1.02; letter-spacing:-.025em;
    font-weight:var(--w-head); margin:0 0 12px; text-wrap:balance}
  .lede{font-size:var(--t-base); color:var(--ink-soft); max-width:60ch; margin:0}
  .lede b{color:var(--ink); font-weight:var(--w-semi)}
  header{margin-bottom:30px}

  
  .card{background:var(--surface); border:1px solid var(--border);
    border-radius:var(--radius); box-shadow:var(--shadow)}
  .console{padding:clamp(16px,3vw,24px)}
  .field-label{display:flex; justify-content:space-between; align-items:baseline;
    font-size:var(--t-xs); color:var(--muted); font-weight:var(--w-semi); margin-bottom:9px}
  .field-label span:last-child{font-family:var(--font-mono); font-size:var(--t-2xs); letter-spacing:.04em}
  .inputrow{display:flex; gap:10px; flex-wrap:wrap}
  #raw{
    flex:1 1 320px; min-width:0; font-family:var(--font-mono); font-size:var(--t-base);
    color:var(--ink); background:var(--surface-2); border:1.5px solid var(--border-strong);
    border-radius:var(--radius-md); padding:14px 15px; transition:border-color .15s, box-shadow .15s;
  }
  #raw:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-tint)}
  #raw::placeholder{color:var(--muted)}
  .btn{
    font-family:var(--font-sans); font-weight:var(--w-semi); font-size:var(--t-base); cursor:pointer;
    background:var(--btn-fill); color:#fff; border:none; border-radius:var(--radius-md);
    padding:0 22px; min-height:48px; transition:filter .15s, transform .05s;
  }
  
  .btn{color:#04211d}
  :root[data-theme="light"] .btn{color:#fff}
  .btn:hover{filter:brightness(1.06)}
  .btn:active{transform:translateY(1px)}
  .btn:focus-visible{outline:3px solid var(--accent-tint); outline-offset:2px}

  
  .tabs{display:flex; gap:4px; margin:18px 0 11px; background:var(--surface-2);
    padding:4px; border-radius:var(--radius-md); width:fit-content; max-width:100%;
    overflow-x:auto; scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:none}
  .tab{font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--muted); background:none; border:none;
    cursor:pointer; padding:6px 14px; border-radius:var(--radius-sm)}
  .tab[aria-selected="true"]{background:var(--surface); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.08)}
  .chips{display:flex; flex-wrap:wrap; gap:8px}
  
  .playpass{margin-top:14px}
  .playpass:empty{display:none}
  .chip{font-family:var(--font-mono); font-size:var(--t-xs); color:var(--ink-soft);
    background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm);
    padding:7px 11px; cursor:pointer; transition:border-color .12s, color .12s, background .12s;
    max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .chip:hover{border-color:var(--accent); color:var(--ink); background:var(--surface)}

  
  #result{margin-top:22px}
  .res-card{overflow:hidden}
  .res-head{display:flex; gap:16px; align-items:center; padding:20px clamp(16px,3vw,24px);
    border-bottom:1px solid var(--border)}
  .glyph{flex:none; width:60px; height:60px; border-radius:var(--radius); display:grid; place-items:center;
    font-size:30px; background:var(--surface-3); border:1px solid var(--border)}
  .res-title{min-width:0; flex:1}
  
  b, strong{font-weight:var(--w-semi)}
  .res-title h3{margin:0; font-size:var(--t-lg); font-weight:var(--w-head); letter-spacing:-.01em;
    overflow:hidden; text-overflow:ellipsis}
  .res-title .sub{color:var(--muted); font-size:var(--t-sm); margin-top:2px}
  .typepill{flex:none; align-self:flex-start; font-family:var(--font-mono); font-size:var(--t-2xs);
    font-weight:var(--w-semi); letter-spacing:.04em; text-transform:uppercase; padding:5px 9px;
    border-radius:var(--radius-sm); background:var(--accent-tint); color:var(--accent-ink)}
  .typepill.transfer{background:var(--surface-3); color:var(--ink-soft)}
  .typepill.fee{background:var(--surface-3); color:var(--muted)}

  .meta{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1px;
    background:var(--border)}
  .cell{background:var(--surface); padding:13px clamp(14px,2.5vw,18px)}
  .cell .k{font-size:var(--t-2xs); text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
    font-weight:var(--w-semi); margin-bottom:4px}
  .cell .v{font-size:var(--t-sm); font-weight:var(--w-semi); display:flex; align-items:center; gap:7px}
  .catdot{width:9px;height:9px;border-radius:50%; flex:none}
  .recbadge{display:inline-flex; align-items:center; gap:6px; font-size:var(--t-sm); font-weight:var(--w-semi);
    color:var(--recur-ink); background:var(--recur-tint); padding:4px 9px; border-radius:var(--radius-sm)}
  .recbadge.no{color:var(--muted); background:var(--surface-3)}

  .conf{padding:15px clamp(16px,3vw,24px); border-top:1px solid var(--border);
    display:flex; align-items:center; gap:14px}
  .conf .k{font-size:var(--t-2xs); text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
    font-weight:var(--w-semi); flex:none}
  .bar{flex:1; height:8px; border-radius:var(--radius-xs); background:var(--surface-3); overflow:hidden}
  .bar>i{display:block; height:100%; width:0; border-radius:var(--radius-xs); transition:width .6s cubic-bezier(.2,.7,.2,1)}
  .conf .pct{font-family:var(--font-mono); font-size:var(--t-sm); font-weight:var(--w-semi); flex:none;
    font-variant-numeric:tabular-nums; min-width:44px; text-align:right}

  
  .wrongbar{display:flex; flex-wrap:wrap; gap:8px; align-items:center;
    padding:12px clamp(16px,3vw,24px); border-top:1px solid var(--border)}
  .wrongbar .k{font-size:var(--t-2xs); text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
    font-weight:var(--w-semi); margin-right:4px}
  .wrongbar .copied.no{color:var(--muted)}
  .copybtn:disabled{cursor:default; opacity:.55}

  details.trace{border-top:1px solid var(--border)}
  details.trace summary{list-style:none; cursor:pointer; padding:13px clamp(16px,3vw,24px);
    font-size:var(--t-xs); font-weight:var(--w-semi); color:var(--muted); display:flex; align-items:center; gap:8px}
  details.trace summary::-webkit-details-marker{display:none}
  details.trace summary .caret{transition:transform .2s; font-size:var(--t-2xs)}
  details.trace[open] summary .caret{transform:rotate(90deg)}
  .steps{padding:2px clamp(16px,3vw,24px) 18px; display:flex; flex-direction:column; gap:0}
  .step{display:grid; grid-template-columns:130px 1fr; gap:12px; padding:7px 0;
    border-top:1px dashed var(--border); align-items:baseline}
  .step:first-child{border-top:none}
  .step .sk{font-size:var(--t-2xs); text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:var(--w-semi)}
  .step .sv{font-family:var(--font-mono); font-size:var(--t-xs); color:var(--ink-soft); word-break:break-word}

  
  .apibar{display:flex; gap:8px; align-items:center; padding:0 clamp(16px,3vw,24px) 10px}
  .copybtn{font-family:var(--font-mono); font-size:var(--t-xs); cursor:pointer;
    color:var(--ink-soft); background:transparent; border:1px solid var(--border);
    border-radius:var(--radius-sm); padding:5px 11px}
  .copybtn:hover{border-color:var(--muted); color:var(--ink)}
  .copied{font-size:var(--t-xs); color:var(--good)}
  .apijson{margin:0 clamp(16px,3vw,24px) 18px; padding:12px 14px; overflow:auto;
    max-height:340px; font-family:var(--font-mono); font-size:var(--t-xs); line-height:1.55;
    background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-md);
    color:var(--ink-soft); white-space:pre}

  
  section.feed{margin-top:44px}
  .feed h2{font-size:var(--t-md); font-weight:var(--w-head); letter-spacing:-.01em; margin:0 0 4px}
  .feed p.note{color:var(--muted); font-size:var(--t-sm); margin:0 0 16px}

  
  section.proof{margin-top:44px}
  .proof h2{font-size:var(--t-md); font-weight:var(--w-head); letter-spacing:-.01em; margin:0 0 4px}
  .proof p.note{color:var(--muted); font-size:var(--t-sm); margin:0 0 16px}
  .proof code{font-family:var(--font-mono); font-size:var(--t-xs); background:var(--surface-2);
    border:1px solid var(--border); border-radius:var(--radius-xs); padding:1px 5px}
  .scoregrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px}
  .score{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:16px 17px; display:flex; flex-direction:column; gap:5px}
  
  .score .n{font-size:var(--t-figure); font-weight:var(--w-head); letter-spacing:-.02em; color:var(--accent-ink);
    font-variant-numeric:tabular-nums; line-height:1}
  .score .k{font-size:var(--t-2xs); font-family:var(--font-mono); letter-spacing:.09em;
    text-transform:uppercase; color:var(--muted)}
  .score .s{font-size:var(--t-xs); color:var(--ink-soft); line-height:1.45; margin-top:3px}
  
  .caveat{margin:16px 0 0; padding:14px 16px; border-radius:var(--radius);
    background:var(--recur-tint); border:1px solid var(--recur);
    color:var(--ink-soft); font-size:var(--t-sm); line-height:1.55}
  .caveat b{color:var(--ink)}
  .tablewrap{overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface)}
  table{width:100%; border-collapse:collapse; min-width:620px}
  th{font-size:var(--t-2xs); text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
    font-weight:var(--w-semi); text-align:left; padding:11px 14px; border-bottom:1px solid var(--border)}
  td{padding:11px 14px; border-bottom:1px solid var(--border); font-size:var(--t-sm); vertical-align:middle}
  tr:last-child td{border-bottom:none}
  td.rawcell{font-family:var(--font-mono); font-size:var(--t-xs); color:var(--muted); max-width:230px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .mname{display:flex; align-items:center; gap:9px; font-weight:var(--w-semi)}
  .mname .g{font-size:17px}
  .cat{display:inline-flex; align-items:center; gap:6px; font-size:var(--t-xs); color:var(--ink-soft)}
  .minibar{width:52px; height:6px; border-radius:var(--radius-xs); background:var(--surface-3); overflow:hidden; display:inline-block; vertical-align:middle}
  .minibar>i{display:block; height:100%}
  
  .rec-y{color:var(--recur-ink); font-weight:var(--w-semi)}
  .rec-n{color:var(--muted)}

  footer{margin-top:40px; padding-top:22px; border-top:1px solid var(--border); color:var(--muted); font-size:var(--t-sm)}
  footer b{color:var(--ink-soft)}
  footer .grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px; margin-top:14px}
  footer .grid div{font-size:var(--t-sm)}
  footer .grid .h{color:var(--ink); font-weight:var(--w-semi); font-size:var(--t-sm); margin-bottom:3px; display:block}
  .fade{animation:fade .4s ease both}
  
  .sitebar{display:flex; align-items:center; gap:18px; flex-wrap:wrap;
    padding-bottom:20px; margin-bottom:26px; border-bottom:1px solid var(--border)}
  .sitebar a{color:var(--muted); text-decoration:none; font-size:var(--t-sm); font-weight:var(--w-med)}
  .sitebar a:hover{color:var(--ink)}
  .sitebar .home{color:var(--ink); font-weight:var(--w-head); font-size:var(--t-base); margin-right:auto}
  .sitebar .go{color:var(--btn-fill)}

  @keyframes fade{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
  @media (prefers-reduced-motion:reduce){
    .fade{animation:none} .bar>i{transition:none}
  }


.u-mb-36.u-mb-36 { margin-bottom: 36px; }
.u-mono.u-mono { font-family: var(--font-mono); }
.u-c-good.u-c-good { color: var(--good); }
.u-mw-340.u-mw-340 { max-width: 340px; }



.dropzone { border: 1px dashed var(--border); border-radius: var(--radius-md); padding: 12px 14px;
  margin-top: 12px; transition: border-color .12s ease, background .12s ease; }
.dropzone[data-over] { border-color: var(--accent); background: var(--surface-2); }
.droptrigger { font: inherit; font-size: var(--t-sm); font-weight: var(--w-semi); cursor: pointer;
  background: transparent; color: var(--ink); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 6px 12px; }
.droptrigger:hover { border-color: var(--accent); }
.dropnote { font-size: var(--t-xs); color: var(--muted); margin: 8px 0 0; line-height: 1.5; }
.dropmsg { font-size: var(--t-xs); color: var(--ink-soft); margin: 8px 0 0; }

.dropmsg[data-bad] { color: var(--warn-ink); }