/* Hashlock theme. Tokens + components. See design/DESIGN.md.
   Fonts: load Instrument Sans + Martian Mono from Google Fonts in the page head. */
:root{
  color-scheme:light;
  --ent-plate:#ECEBF1;
  --ent-sheet:#F8F7FB;
  --ent-sheet-2:#E3E2EC;
  --ent-ink:#191A44;
  --ent-ink-2:#45476F;
  --ent-ink-3:#5F6189;
  --ent-rule:rgba(25,26,68,.14);
  --ent-rule-strong:rgba(25,26,68,.28);
  --ent-ion:#4B33DB;
  --ent-ion-soft:rgba(75,51,219,.10);
  --ent-ion-ink:#3A24C4;
  --ent-photon:#E39A1E;
  --ent-photon-soft:rgba(227,154,30,.16);
  --ent-photon-ink:#8A5300;
  --ent-ok:#1D7F55;
  --ent-bad:#BE2F4A;
  --ent-on-ink:#F8F7FB;
  --ent-on-ion:#FFFFFF;
  --ent-lift:0 12px 32px -12px rgba(25,26,68,.28);

  --ent-font:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ent-mono:"Martian Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --ent-fs-1:13px;--ent-fs-2:15px;--ent-fs-3:17px;--ent-fs-4:21px;
  --ent-fs-5:clamp(26px,2.2vw + 16px,34px);
  --ent-fs-6:clamp(40px,5.4vw + 14px,76px);
  --ent-r-chip:999px;--ent-r-ctl:10px;--ent-r-panel:16px;
  --ent-gutter:16px;--ent-max:1180px;
}
@media (min-width:720px){:root{--ent-gutter:32px}}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ent-plate:#0A0A0C;--ent-sheet:#141416;--ent-sheet-2:#1E1E22;
    --ent-ink:#ECEAF7;--ent-ink-2:#B4B5D8;--ent-ink-3:#8F91BD;
    --ent-rule:rgba(236,234,247,.16);--ent-rule-strong:rgba(236,234,247,.32);
    --ent-ion:#A394FF;--ent-ion-soft:rgba(163,148,255,.16);--ent-ion-ink:#B9ADFF;
    --ent-photon:#F5B54A;--ent-photon-soft:rgba(245,181,74,.16);--ent-photon-ink:#F5B54A;
    --ent-ok:#5BD39A;--ent-bad:#FF7A90;
    --ent-on-ink:#0A0A0C;--ent-on-ion:#0A0A0C;
    --ent-lift:0 16px 40px -14px rgba(0,0,8,.6);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ent-plate:#0A0A0C;--ent-sheet:#141416;--ent-sheet-2:#1E1E22;
  --ent-ink:#ECEAF7;--ent-ink-2:#B4B5D8;--ent-ink-3:#8F91BD;
  --ent-rule:rgba(236,234,247,.16);--ent-rule-strong:rgba(236,234,247,.32);
  --ent-ion:#A394FF;--ent-ion-soft:rgba(163,148,255,.16);--ent-ion-ink:#B9ADFF;
  --ent-photon:#F5B54A;--ent-photon-soft:rgba(245,181,74,.16);--ent-photon-ink:#F5B54A;
  --ent-ok:#5BD39A;--ent-bad:#FF7A90;
  --ent-on-ink:#0A0A0C;--ent-on-ion:#0A0A0C;
  --ent-lift:0 16px 40px -14px rgba(0,0,8,.6);
}

/* ---------- base (opt in with class="ent" on <body>) ---------- */
body.ent{margin:0;background:var(--ent-plate);color:var(--ent-ink);font-family:var(--ent-font);
  font-size:var(--ent-fs-3);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.ent *,.ent *::before,.ent *::after{box-sizing:border-box}
.ent a:not(.ent-btn){color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
.ent a:not(.ent-btn):hover{color:var(--ent-ion-ink)}
.ent :focus-visible{outline:2px solid var(--ent-ion);outline-offset:2px;border-radius:4px}
.ent ::selection{background:var(--ent-ion);color:var(--ent-on-ion)}
.ent h1,.ent h2,.ent h3{font-stretch:78%;font-variation-settings:"wdth" 78;font-weight:640;letter-spacing:-.012em;margin:0;text-wrap:balance}
.ent h1{font-size:var(--ent-fs-6);line-height:1.02;letter-spacing:-.022em}
.ent h2{font-size:var(--ent-fs-5);line-height:1.1}
.ent h3{font-size:var(--ent-fs-4);line-height:1.2;font-stretch:88%;font-variation-settings:"wdth" 88;font-weight:620}
.ent p{margin:0;max-width:68ch;text-wrap:pretty}
.ent-lead{font-size:var(--ent-fs-4);line-height:1.45;color:var(--ent-ink-2);max-width:56ch}
.ent-small{font-size:var(--ent-fs-1);color:var(--ent-ink-3);line-height:1.5}
.ent-mono{font-family:var(--ent-mono);font-size:.82em;font-variation-settings:"wdth" 90;letter-spacing:0}
.ent-wrap{max-width:var(--ent-max);margin:0 auto;padding:0 var(--ent-gutter)}
.ent-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- buttons ---------- */
.ent-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;
  border-radius:var(--ent-r-ctl);border:1.5px solid transparent;font:600 var(--ent-fs-2)/1 var(--ent-font);
  text-decoration:none;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s;white-space:nowrap}
.ent .ent-btn--primary,.ent-btn--primary{background:var(--ent-ink);color:var(--ent-on-ink)}
.ent .ent-btn--primary:hover{background:var(--ent-ion);color:var(--ent-on-ion)}
.ent .ent-btn--quiet,.ent-btn--quiet{background:transparent;color:var(--ent-ink);border-color:var(--ent-rule-strong)}
.ent .ent-btn--quiet:hover{border-color:var(--ent-ink);color:var(--ent-ink)}
.ent .ent-btn--seal,.ent-btn--seal{background:var(--ent-ion);color:var(--ent-on-ion)}
.ent .ent-btn--seal:hover{background:var(--ent-ink);color:var(--ent-on-ink)}
.ent-btn:disabled,.ent-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.ent-btn--sm{min-height:36px;padding:0 12px;font-size:var(--ent-fs-1)}

/* ---------- chips ---------- */
.ent-chip{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 12px;border-radius:var(--ent-r-chip);
  border:1px solid var(--ent-rule-strong);background:var(--ent-sheet);font-size:var(--ent-fs-1);color:var(--ent-ink-2);max-width:100%}
.ent-chip--ca{padding-right:4px}
.ent-chip--ca .ent-mono{color:var(--ent-ink)}
.ent-chip button{font:600 var(--ent-fs-1)/1 var(--ent-font);color:var(--ent-ion-ink);background:var(--ent-ion-soft);border:0;
  border-radius:var(--ent-r-chip);min-height:26px;padding:0 10px;cursor:pointer}
.ent-chip--soon{color:var(--ent-photon-ink);border-color:var(--ent-photon);background:var(--ent-photon-soft)}

/* ---------- panel ---------- */
.ent-panel{background:var(--ent-sheet);border:1px solid var(--ent-rule);border-radius:var(--ent-r-panel);padding:20px}

/* ---------- sealed badge ---------- */
.ent-sealed{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 10px 0 7px;border-radius:var(--ent-r-chip);
  background:var(--ent-ion-soft);color:var(--ent-ion-ink);font:600 12px/1 var(--ent-font)}
.ent-sealed::before{content:"";width:12px;height:11px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3E%3Cpath d='M6 2.2 2 8.6M6 2.2l4 6.4' stroke='%23000' stroke-width='1.4' fill='none'/%3E%3Ccircle cx='6' cy='2.2' r='2.2'/%3E%3Ccircle cx='2' cy='8.6' r='2'/%3E%3Ccircle cx='10' cy='8.6' r='2'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3E%3Cpath d='M6 2.2 2 8.6M6 2.2l4 6.4' stroke='%23000' stroke-width='1.4' fill='none'/%3E%3Ccircle cx='6' cy='2.2' r='2.2'/%3E%3Ccircle cx='2' cy='8.6' r='2'/%3E%3Ccircle cx='10' cy='8.6' r='2'/%3E%3C/svg%3E") center/contain no-repeat}
.ent-sealed--agent{background:transparent;border:1px solid var(--ent-rule-strong);color:var(--ent-ink-3)}
.ent-sealed--agent::before{opacity:.6}

/* ---------- vault state ---------- */
.ent-vault{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:var(--ent-fs-2);color:var(--ent-ink)}
.ent-vault__dot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--ent-ion)}
.ent-vault.is-pending .ent-vault__dot{background:transparent;border:2px dashed var(--ent-ion)}
.ent-vault.is-agent .ent-vault__dot{background:var(--ent-ink-3)}
.ent-vault.is-agent{color:var(--ent-ink-2)}
.ent-vault.is-successor .ent-vault__dot{background:transparent;border:2px solid var(--ent-photon)}
.ent-keys{display:grid;grid-template-columns:repeat(10,1fr);gap:3px;width:120px;height:6px}
.ent-keys i{background:var(--ent-ion);border-radius:2px}
.ent-keys i.used{background:var(--ent-rule-strong)}

/* ---------- flywheel meter ---------- */
.ent-flywheel{display:grid;gap:10px}
.ent-flywheel__bar{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--ent-sheet-2)}
.ent-flywheel__bar > span{display:block;height:100%}
.ent-flywheel__bar .fee{background:var(--ent-photon)}
.ent-flywheel__bar .creator{background:var(--ent-ion)}
.ent-flywheel__bar .burn{background:var(--ent-photon)}
.ent-flywheel__bar .treasury{background:var(--ent-ink-3)}
.ent-flywheel__legend{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:var(--ent-fs-1);color:var(--ent-ink-2)}
.ent-flywheel__legend b{font-family:var(--ent-mono);font-weight:500;color:var(--ent-ink);font-variation-settings:"wdth" 90}
.ent-swatch{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* ---------- steps ---------- */
.ent-steps{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;gap:0}
.ent-steps > li{counter-increment:s;position:relative;padding:0 0 28px 52px}
.ent-steps > li::before{content:counter(s);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;border:1.5px solid var(--ent-ink);font:600 15px/1 var(--ent-font);background:var(--ent-plate)}
.ent-steps > li::after{content:"";position:absolute;left:16.5px;top:34px;bottom:2px;width:1.5px;background:var(--ent-rule-strong)}
.ent-steps > li:last-child{padding-bottom:0}
.ent-steps > li:last-child::after{display:none}
.ent-steps h3{margin-bottom:6px}
.ent-steps p{color:var(--ent-ink-2)}

/* ---------- compare table ---------- */
.ent-compare{width:100%;border-collapse:collapse;font-size:var(--ent-fs-2)}
.ent-compare th,.ent-compare td{text-align:left;vertical-align:top;padding:14px 16px 14px 0;border-top:1px solid var(--ent-rule)}
.ent-compare thead th{border-top:0;font-weight:600;color:var(--ent-ink-3);font-size:var(--ent-fs-1);padding-bottom:8px}
.ent-compare tbody th{font-weight:600;width:28%}
.ent-compare td{color:var(--ent-ink-2);width:36%}
.ent-compare td.is-ent{color:var(--ent-ink)}
@media (max-width:640px){
  .ent-compare thead{display:none}
  .ent-compare tr{display:grid;grid-template-columns:1fr;border-top:1px solid var(--ent-rule);padding:14px 0}
  .ent-compare th,.ent-compare td,.ent-compare tbody th{border:0;padding:3px 0;width:auto}
  .ent-compare td::before{content:attr(data-h);display:block;font-size:var(--ent-fs-1);color:var(--ent-ink-3)}
}

/* ---------- site header / footer used by brand.js pages ---------- */
.ent-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.ent-logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ent-ink);font:650 20px/1 var(--ent-font);
  font-stretch:88%;font-variation-settings:"wdth" 88;letter-spacing:-.01em}
.ent-logo svg{width:26px;height:26px;flex:none}
.ent-nav{display:flex;align-items:center;gap:6px}
.ent-nav a.ent-navlink{padding:10px;text-decoration:none;font-size:var(--ent-fs-2);color:var(--ent-ink-2);border-radius:8px}
.ent-nav a.ent-navlink:hover,.ent-nav a.ent-navlink[aria-current="page"]{color:var(--ent-ink)}
.ent-nav a.ent-navlink[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--ent-ion);text-decoration-thickness:2px;text-underline-offset:6px}
.ent-theme-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:var(--ent-r-ctl);border:1px solid var(--ent-rule-strong);
  background:transparent;color:var(--ent-ink);cursor:pointer;padding:0}
.ent-theme-btn svg{width:18px;height:18px}
@media (max-width:560px){.ent-nav .ent-hide-sm{display:none}}
.ent-foot{border-top:1px solid var(--ent-rule);padding-top:28px;padding-bottom:40px;font-size:var(--ent-fs-1);color:var(--ent-ink-3)}
.ent-foot nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:12px}
.ent-foot a{color:var(--ent-ink-2)}

@media (prefers-reduced-motion:reduce){.ent *{transition:none!important;animation:none!important}}
.ent-visually-hidden:focus{position:fixed!important;left:12px;top:12px;width:auto;height:auto;clip:auto;padding:10px 14px;background:var(--ent-ink);color:var(--ent-on-ink);border-radius:var(--ent-r-ctl);z-index:100}
.ent-vault.is-derived .ent-vault__dot{background:transparent;border:2px solid var(--ent-photon)}
.ent-vault.is-derived{color:var(--ent-photon-ink)}
