:root {
  color-scheme: dark;
  --bg: #07100f;
  --panel: #0d1a17;
  --panel-soft: #11211d;
  --line: rgba(164, 212, 190, .15);
  --text: #eff8f3;
  --muted: #95a9a0;
  --green: #95e8bd;
  --green-strong: #50d396;
  --mono: 'DM Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
  --sans: 'Manrope', Inter, ui-sans-serif, system-ui, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: radial-gradient(ellipse at 50% -10%, #12352a 0, #0a1a15 28rem, var(--bg) 70rem); color: var(--text); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.topbar, footer { width: min(1120px, calc(100% - 56px)); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.topbar { height: 82px; border-bottom: 1px solid rgba(164, 212, 190, .1); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: #b5c8bf; font: 500 10px var(--mono); letter-spacing: .14em; }
.brand-mark { color: var(--green); font: 800 24px var(--sans); letter-spacing: -.08em; }
.pilot-chip { display: flex; align-items: center; gap: 9px; border: 1px solid rgba(149, 232, 189, .22); border-radius: 999px; padding: 9px 13px; color: #c3d7cc; font: 10px var(--mono); letter-spacing: .07em; }
.pulse, .network i { display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--green-strong); box-shadow: 0 0 11px #50d396a0; }
.pilot-sep { color: #547162; }
main { width: min(1120px, calc(100% - 56px)); margin: 0 auto; }
.hero { padding: 92px 0 74px; text-align: center; }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 11px; color: var(--green); font: 10px var(--mono); letter-spacing: .16em; }
.eyebrow-line { width: 22px; height: 1px; background: var(--green-strong); }
.eyebrow-dot { color: #4c7763; }
h1 { margin: 28px 0 18px; font-size: clamp(42px, 6.4vw, 73px); line-height: 1.06; font-weight: 600; letter-spacing: -.065em; }
h1 span { color: var(--green); }
.hero-copy { max-width: 570px; margin: 0 auto; color: #a9bdb3; font-size: 15px; line-height: 1.8; }
.hero-copy strong { color: #e4f7ed; font-weight: 600; }
.login-card { max-width: 612px; margin: 46px auto 0; text-align: left; border: 1px solid rgba(149, 232, 189, .22); border-radius: 15px; background: linear-gradient(145deg, rgba(16, 35, 28, .98), rgba(10, 22, 19, .98)); box-shadow: 0 24px 90px rgba(0, 0, 0, .32), 0 0 48px rgba(39, 154, 103, .07); overflow: hidden; }
.card-topline { display: flex; align-items: center; gap: 11px; padding: 16px 21px; border-bottom: 1px solid var(--line); color: #91aa9c; font: 9px var(--mono); letter-spacing: .12em; }
.step-index { color: var(--green); }
.network { display: flex; align-items: center; gap: 7px; margin-left: auto; color: #8ea99a; letter-spacing: .06em; }
.network i { width: 5px; height: 5px; }
.card-content { padding: 26px 26px 23px; }
.card-intro { display: flex; align-items: center; gap: 15px; margin-bottom: 22px; }
.wallet-icon { display: grid; width: 46px; height: 46px; flex: 0 0 46px; place-items: center; border: 1px solid rgba(149, 232, 189, .2); border-radius: 12px; background: rgba(70, 172, 119, .08); }
.wallet-icon svg { width: 25px; fill: none; stroke: var(--green); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.card-intro h2 { margin: 0 0 5px; font-size: 15px; font-weight: 700; letter-spacing: -.02em; }
.card-intro p { margin: 0; color: var(--muted); font-size: 11px; }
.primary-button, .secondary-button { border: 0; border-radius: 8px; cursor: pointer; font-family: var(--sans); font-weight: 700; transition: .18s ease; }
.primary-button { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 15px 17px; background: var(--green); color: #071b12; font-size: 13px; }
.primary-button:hover:not(:disabled) { background: #b0f3cd; transform: translateY(-1px); box-shadow: 0 8px 28px #50d39625; }
.primary-button:disabled { opacity: .58; cursor: wait; }
.button-arrow { font-size: 19px; font-weight: 400; }
.busy .button-arrow { animation: drift .8s infinite alternate ease-in-out; }
@keyframes drift { to { transform: translate(3px, -3px); } }
.status { display: flex; align-items: flex-start; gap: 9px; min-height: 34px; margin: 13px 1px 0; color: #82988e; font-size: 10px; line-height: 1.55; }
.status-icon { width: 6px; height: 6px; flex: 0 0 6px; margin-top: 4px; border-radius: 50%; background: #658474; }
.status[data-state='pending'] { color: #d5c18b; }
.status[data-state='pending'] .status-icon { background: #e7bf56; box-shadow: 0 0 9px #e7bf56a0; }
.status[data-state='success'] { color: #9ce8bf; }
.status[data-state='success'] .status-icon { background: var(--green-strong); box-shadow: 0 0 10px #50d396a0; }
.status[data-state='error'] { color: #f2a49c; }
.status[data-state='error'] .status-icon { background: #ee7368; box-shadow: 0 0 10px #ee736880; }
.card-footer { display: flex; align-items: center; justify-content: center; gap: 15px; padding: 14px; border-top: 1px solid var(--line); color: #82998e; font: 9px var(--mono); letter-spacing: .04em; }
.card-footer b { color: var(--green); font-weight: 400; }
.footer-rule { width: 28px; height: 1px; background: #385346; }
.entity-panel { margin-top: 19px; border-top: 1px solid var(--line); padding-top: 17px; }
.verified-row { display: flex; align-items: center; gap: 8px; color: #c3e9d1; font-size: 11px; }
.checkmark { display: inline-grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; background: #174832; color: var(--green); font-size: 11px; }
.text-button { border: 0; background: none; color: #9bb0a5; font: 10px var(--mono); cursor: pointer; }
.verified-row .text-button { margin-left: auto; }
.text-button:hover { color: var(--green); }
.entity-form { margin-top: 18px; }
.entity-form label { display: flex; justify-content: space-between; margin-bottom: 9px; color: #d7e4dc; font-size: 11px; font-weight: 700; }
.entity-form label span, .entity-label { color: #739280; font: 9px var(--mono); letter-spacing: .1em; }
.handle-control { display: flex; align-items: center; gap: 8px; border: 1px solid rgba(149, 232, 189, .2); border-radius: 8px; padding: 5px; background: rgba(0, 0, 0, .12); }
.handle-control > span { padding-left: 8px; color: var(--green); font: 13px var(--mono); }
.handle-control input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--text); font: 12px var(--mono); }
.handle-control input::placeholder { color: #5f7669; }
.passphrase-label { margin-top: 15px; }
.passphrase-input { width: 100%; margin-top: 8px; padding: 11px 12px; border: 1px solid rgba(149, 232, 189, .2); border-radius: 8px; outline: 0; background: rgba(0, 0, 0, .12); color: var(--text); font: 11px var(--mono); }
.passphrase-input:focus, .handle-control:focus-within { border-color: rgba(149, 232, 189, .6); }
.secondary-button { padding: 10px 12px; background: #1c3f30; color: #b7ebce; font-size: 10px; }
.secondary-button:hover { background: #26573f; }
.field-hint { margin: 8px 0 0; color: #73897d; font-size: 9px; line-height: 1.5; }
.entity-existing { margin-top: 14px; color: #abc6b7; font-size: 11px; }
.created-entity { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 14px; padding: 13px; border: 1px solid rgba(149, 232, 189, .15); border-radius: 8px; background: rgba(44, 115, 76, .09); }
.created-entity strong { color: var(--green); font-size: 18px; }
.mono { color: #82998e; font: 10px var(--mono); }
.export-button { padding: 0; }
.account-actions { display: flex; align-items: center; gap: 20px; margin-top: 12px; }
.danger-button { color: #d6928b; }
.trust-row { display: flex; justify-content: center; flex-wrap: wrap; gap: 34px; margin-top: 29px; color: #748b80; font: 9px var(--mono); letter-spacing: .06em; }
.trust-row > div { display: flex; align-items: center; gap: 8px; }
.trust-icon { color: var(--green); font-size: 15px; }
.protocol-note { display: grid; grid-template-columns: 96px 1fr auto; align-items: start; gap: 25px; margin: 0 0 62px; padding: 25px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; }
.note-index { color: var(--green); font: 10px var(--mono); letter-spacing: .1em; }
.protocol-note h2 { margin: 0 0 7px; font-size: 14px; }
.protocol-note p { max-width: 610px; margin: 0; color: #8fa399; font-size: 11px; line-height: 1.7; }
.protocol-note > a { color: #b7e9cc; font-size: 10px; }
.protocol-note > a span { padding-left: 5px; }
footer { min-height: 74px; border-top: 1px solid rgba(164, 212, 190, .1); color: #70847a; font: 9px var(--mono); letter-spacing: .05em; }
footer i { color: var(--green); font-style: normal; }
footer a { color: #a3b6ab; }
.privacy-main { max-width: 780px; min-height: calc(100vh - 156px); padding: 70px 0; }
.privacy-main .eyebrow { justify-content: flex-start; }
.privacy-main h1 { margin-top: 25px; }
.privacy-card { margin-top: 34px; padding: 27px; border: 1px solid var(--line); border-radius: 12px; background: rgba(13, 26, 23, .8); }
.privacy-card h2 { margin: 18px 0 8px; color: #dcece3; font-size: 13px; }
.privacy-card h2:first-child { margin-top: 0; }
.privacy-card p { color: #98ada2; font-size: 12px; line-height: 1.8; }
[hidden] { display: none !important; }
.own-wallet-toggle { margin-top: 13px; width: 100%; }
#own-wallet { text-align: left; }
#own-wallet h3 { font-size: 14px; }
.wallet-address { overflow-wrap: anywhere; font: 11px var(--mono); color: var(--green); }
.wallet-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; margin: 16px 0; }
.wallet-check { gap: 9px; align-items: flex-start; margin-top: 16px; line-height: 1.6; }
dialog { width: min(620px, calc(100% - 32px)); padding: 24px; border: 1px solid var(--green); border-radius: 12px; background: #0d1a17; color: var(--text); }
dialog::backdrop { background: #000b; }
dialog h2 { font-size: 18px; }
dialog p { font-size: 12px; line-height: 1.6; }
dialog pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 50vh; overflow: auto; font: 11px/1.7 var(--mono); }

@media (max-width: 650px) {
  .topbar, footer, main { width: calc(100% - 34px); }
  .topbar { height: 68px; }
  .brand { gap: 8px; font-size: 8px; letter-spacing: .08em; }
  .brand-mark { font-size: 21px; }
  .pilot-chip { gap: 6px; padding: 8px 9px; font-size: 8px; letter-spacing: .02em; }
  .hero { padding: 66px 0 51px; }
  h1 { font-size: clamp(39px, 11vw, 58px); }
  .hero-copy { font-size: 13px; }
  .login-card { margin-top: 34px; }
  .card-content { padding: 20px 17px 18px; }
  .card-topline { padding: 14px; gap: 7px; font-size: 8px; }
  .network { font-size: 7px; }
  .card-intro h2 { font-size: 13px; }
  .card-intro p { font-size: 10px; }
  .card-footer { gap: 9px; font-size: 8px; }
  .footer-rule { width: 14px; }
  .trust-row { gap: 12px 19px; font-size: 8px; }
  .protocol-note { grid-template-columns: 1fr; gap: 10px; padding: 20px 0; margin-bottom: 35px; }
  .protocol-note > a { margin-top: 4px; }
  footer { flex-wrap: wrap; gap: 8px 16px; padding: 19px 0; font-size: 8px; }
  footer span:nth-child(2) { display: none; }
}