@font-face {
  font-family:'DM Sans';
  src:url('/static/assets/fonts/dmsans.woff2') format('woff2');
  font-weight:100 1000;
  font-style:normal;
  font-display:swap
}
@font-face {
  font-family:Fahkwang;
  src:url('/static/assets/fonts/fahkwang-400.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap
}
@font-face {
  font-family:Fahkwang;
  src:url('/static/assets/fonts/fahkwang-600.woff2') format('woff2');
  font-weight:600;
  font-style:normal;
  font-display:swap
}
:root {
  color-scheme:dark;
  --ground:#050505;
  --surface:#101014;
  --raised:#1b1b20;
  --ink:#f6f4ee;
  --muted:#b3b0aa;
  --line:#303034;
  --control:#77777e;
  --accent:#9baeff;
  --error:#ffb4b4;
  --space:24px;
  --radius:4px;
  --body:'DM Sans',system-ui,sans-serif;
  --display:Fahkwang,system-ui,sans-serif
}
* {
  box-sizing:border-box
}
html {
  background:var(--ground);
  scroll-padding-top:24px
}
body {
  margin:0;
  color:var(--ink);
  background:var(--ground);
  font:400 16px/1.55 var(--body);
  text-rendering:optimizeLegibility
}
button,input {
  font:inherit
}
a {
  color:inherit;
  text-underline-offset:4px
}
a:hover {
  color:var(--accent)
}
button,a,input,summary {
  touch-action:manipulation
}
button,input,summary {
  min-height:44px
}
button {
  border:1px solid transparent;
  border-radius:var(--radius);
  padding:9px 18px;
  background:var(--ink);
  color:var(--ground);
  font-weight:600;
  cursor:pointer
}
button:hover:enabled {
  background:var(--accent)
}
button:active:enabled {
  transform:translateY(1px)
}
button:disabled {
  cursor:default;
  opacity:.62
}
button.secondary {
  background:var(--raised);
  color:var(--ink);
  border-color:var(--line)
}
button.secondary:hover:enabled {
  background:var(--line)
}
:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:4px
}
input:not([type=radio]) {
  width:100%;
  border:1px solid var(--control);
  border-radius:var(--radius);
  background:var(--ground);
  color:var(--ink);
  padding:10px 12px
}
input[type=radio] {
  accent-color:var(--accent);
  width:18px;
  height:18px;
  min-height:0;
  margin:0
}
input[aria-invalid=true] {
  border-color:var(--error)
}
[hidden] {
  display:none!important
}
.wrap {
  width:min(calc(100% - 64px),1120px);
  margin-inline:auto
}
.top-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:96px
}
.brand {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-family:var(--display);
  font-size:20px;
  text-decoration:none;
  white-space:nowrap
}
nav {
  display:flex;
  gap:24px;
  flex-wrap:wrap
}
nav a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  text-decoration:none
}
.skip-link {
  position:absolute;
  top:8px;
  left:16px;
  transform:translateY(-150%);
  background:var(--ink);
  color:var(--ground);
  padding:10px 16px;
  z-index:2
}
.skip-link:focus {
  transform:none
}
main {
  padding-block:28px 64px
}
h1,h2,h3,p,dl {
  margin:0
}
h1 {
  font:400 30px/1.25 var(--display);
  letter-spacing:-.02em;
  margin-bottom:28px
}
h2 {
  font-size:22px;
  line-height:1.3;
  font-weight:500;
  margin-bottom:24px
}
h3 {
  font-size:16px;
  line-height:1.5;
  font-weight:600;
  margin-bottom:12px
}
p {
  margin-block:16px
}
label,legend {
  font-weight:500
}
form>label {
  display:block;
  margin-bottom:8px
}
.workspace {
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);
  gap:48px;
  align-items:start
}
.check-area {
  padding-block:8px
}
.account-area {
  background:var(--surface);
  padding:28px;
  border-radius:var(--radius)
}
.account-area h2 {
  margin-bottom:12px
}
.depth {
  border:0;
  padding:0;
  margin:20px 0;
  display:flex;
  gap:4px 24px;
  flex-wrap:wrap
}
.depth legend {
  margin-bottom:6px
}
.depth label {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  font-weight:400
}
.allowance {
  color:var(--muted);
  max-width:49ch;
  margin-bottom:0
}
.account-area details {
  border-bottom:1px solid var(--line)
}
.account-area details:last-of-type {
  border-bottom:0
}
.account-area summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  list-style:none;
  padding-block:10px
}
.account-area summary::-webkit-details-marker {
  display:none
}
.account-area summary::after {
  content:'+';
  font-size:20px;
  margin-left:16px
}
.account-area details[open] summary::after {
  content:'−'
}
.account-area details form {
  padding-block:12px 20px
}
.account-area form button {
  margin-top:12px
}
.account-area form p {
  color:var(--muted);
  margin-bottom:0
}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px
}
.balance {
  margin-block:24px
}
.balance>div {
  display:flex;
  justify-content:space-between;
  gap:16px
}
.balance dd {
  margin:0;
  font-variant-numeric:tabular-nums
}
.operation-status {
  padding:12px 0;
  overflow-wrap:anywhere
}
.operation-status[data-kind=error] {
  color:var(--error)
}
.result {
  margin-top:24px;
  background:var(--surface);
  padding:24px
}
.pricing-area,.quick-start {
  margin-top:64px
}
.pricing-grid {
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);
  gap:48px
}
.table-scroll {
  max-width:100%;
  overflow-x:auto
}
table {
  width:100%;
  border-collapse:collapse;
  font-variant-numeric:tabular-nums
}
th,td {
  text-align:left;
  padding:12px 12px 12px 0;
  border-bottom:1px solid var(--line)
}
th {
  font-weight:400
}
thead th {
  font-size:14px;
  color:var(--muted);
  padding-top:0
}
td:last-child,th:last-child {
  padding-right:0
}
tbody th {
  font-weight:500
}
.num {
  text-align:right
}
.purchase {
  white-space:nowrap;
  margin-left:4px
}
.costs>div {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:8px 0
}
.costs dd {
  margin:0;
  white-space:nowrap;
  font-variant-numeric:tabular-nums
}
.costs dt {
  max-width:25ch
}
.pricing-grid p {
  color:var(--muted)
}
.notice {
  background:var(--surface);
  padding:16px
}
.section-heading {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px
}
.section-heading>a {
  min-height:44px;
  display:inline-flex;
  align-items:center
}
.quick-start-grid {
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);
  gap:48px
}
.quick-start-grid>div {
  min-width:0
}
pre {
  margin:0;
  max-width:100%;
  overflow-x:auto;
  background:var(--surface);
  padding:20px;
  font:14px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;
  border-radius:var(--radius)
}
code {
  font:14px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;
  overflow-wrap:anywhere
}
.connection>div {
  margin-bottom:10px
}
.connection dt {
  font-size:14px;
  color:var(--muted)
}
.connection dd {
  margin:0;
  overflow-wrap:anywhere
}
.quick-start>p {
  color:var(--muted)
}
footer {
  border-top:1px solid var(--line)
}
.footer-inner {
  padding-block:28px 36px;
  color:var(--muted);
  font-size:14px
}
.footer-inner p {
  max-width:95ch;
  margin:0 0 12px
}
.footer-inner nav {
  margin-top:12px
}
.legal {
  max-width:760px;
  padding-block:28px 64px;
  overflow-wrap:anywhere
}
.legal h1 {
  margin-bottom:24px
}
.legal h2 {
  margin-top:40px;
  margin-bottom:16px
}
.legal h3 {
  margin-top:28px
}
.legal p,.legal ul {
  margin-block:16px
}
.legal li {
  margin-bottom:8px
}
.legal .note {
  color:var(--muted)
}
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0
}
/* 1120px canvas = (1072px columns) + 48px gutter. All bands share the two column tracks. */
@media(max-width:900px) {
  .workspace,.pricing-grid,.quick-start-grid {
    grid-template-columns:minmax(0,1fr);
    gap:32px
  }
  .account-area {
    padding:24px
  }
  .pricing-area,.quick-start {
    margin-top:48px
  }
  .costs {
    max-width:none
  }
  .top-inner {
    min-height:88px
  }
  .legal {
    max-width:720px
  }
}
@media(max-width:540px) {
  .wrap {
    width:calc(100% - 32px)
  }
  .top-inner {
    align-items:flex-start;
    flex-direction:column;
    justify-content:center;
    gap:8px;
    padding-block:18px
  }
  .brand {
  display:inline-flex;
  align-items:center;
  min-height:44px;
    font-size:19px
  }
  nav {
    gap:20px
  }
  .top nav {
    width:100%;
    justify-content:space-between
  }
  main {
    padding-top:20px
  }
  h1 {
    font-size:26px;
    margin-bottom:24px
  }
  h2 {
    font-size:21px
  }
  .account-area {
    padding:20px
  }
  .depth {
    display:block
  }
  .depth label {
    min-height:48px
  }
  .pricing-area,.quick-start {
    margin-top:40px
  }
  .workspace {
    gap:32px
  }
  th,td {
    padding-right:10px;
    font-size:14px
  }
  .purchase {
    padding-inline:10px;
    font-size:14px
  }
  .costs>div {
    gap:16px
  }
  .section-heading {
    align-items:flex-start
  }
  .section-heading>a {
    font-size:14px
  }
  .footer-inner {
    padding-top:24px
  }
  .legal h1 {
    font-size:26px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }
}

.footer-inner a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
}
.checkbox-row {
  display:flex;
  align-items:center;
  gap:12px;
  min-height:44px;
  margin-block:12px;
  font-weight:400;
}
.checkbox-row input[type=checkbox] {
  width:18px;
  height:18px;
  min-height:18px;
  flex:0 0 18px;
  accent-color:var(--accent);
}
#key-details > label:first-child {
  display:block;
  margin-top:20px;
  margin-bottom:8px;
}
#current-key { font-family:ui-monospace,monospace; }
.recovery-row {
  padding-block:14px;
  border-bottom:1px solid var(--line);
  overflow-wrap:anywhere;
}
.recovery-row p { margin:0 0 8px; }
.recovery-row button { margin-top:4px; }
.result h2 { margin-bottom:12px; }
.result h3 { margin-top:24px; }
.result p { margin-block:12px; }
.result ul { padding-left:20px; }
.result li { margin-block:12px; }
.result details summary { cursor:pointer; min-height:44px; }
.result .source-time { color:var(--muted); }
.result [data-kind=error] { color:var(--error); }
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:9px 18px;
  text-decoration:none;
  border-radius:var(--radius);
  background:var(--raised);
  color:var(--ink);
  border:1px solid var(--line);
  font-weight:600;
}
.button:hover { background:var(--line); }
dialog {
  width:min(calc(100% - 32px),500px);
  max-height:calc(100% - 48px);
  overflow:auto;
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
}
dialog::backdrop { background:rgb(0 0 0 / .75); }
dialog h2 { margin-bottom:16px; }
dialog .checkbox-row a { text-underline-offset:3px; }
[aria-busy=true] { cursor:progress; }
.result { overflow-wrap:anywhere; }