:root {
  --paper: #f7f2e9;
  --paper-deep: #eee6d9;
  --ink: #19201d;
  --muted: #6c706a;
  --line: #c9c3b8;
  --orange: #e75a23;
  --orange-deep: #bb4014;
  --yellow: #e9c84c;
  --green: #45755e;
  --mono: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: "DM Sans", Arial, sans-serif;
  --serif: "Newsreader", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: var(--sans); }
button, input { font: inherit; }
button { cursor: pointer; }
.noise { position: fixed; z-index: 20; inset: 0; pointer-events: none; opacity: .12; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); }
.site-header { height: 74px; position: relative; z-index: 5; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; max-width: 1440px; margin: 0 auto; padding: 0 38px; border-bottom: 1px solid var(--line); }
.wordmark { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-size: 14px; font-weight: 700; letter-spacing: .14em; text-decoration: none; }
.wordmark i { color: var(--orange); font-style: normal; }
.wordmark-mark { display: flex; align-items: end; gap: 2px; height: 16px; }
.wordmark-mark span { display: block; width: 3px; background: var(--orange); }
.wordmark-mark span:nth-child(1) { height: 6px; }.wordmark-mark span:nth-child(2) { height: 11px; }.wordmark-mark span:nth-child(3) { height: 16px; }
.header-status { display: flex; align-items: center; gap: 8px; color: var(--muted); font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.signal-dot, .live-indicator { width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 4px rgba(233, 200, 76, .15); }
.header-status.online .signal-dot, .live-indicator { background: var(--green); box-shadow: 0 0 0 4px rgba(69, 117, 94, .13); }
.header-status.offline .signal-dot { background: var(--orange); box-shadow: 0 0 0 4px rgba(231, 90, 35, .13); }
.text-button { justify-self: end; display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 13px; font-weight: 600; }
.text-button svg { width: 16px; transition: transform .2s; }.text-button:hover svg { transform: translate(2px, -2px); }

.landing { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(350px, .9fr); min-height: calc(100vh - 74px); max-width: 1440px; margin: auto; overflow: hidden; border-bottom: 1px solid var(--line); }
.hero-grid { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(25,32,29,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(25,32,29,.07) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, #000 12%, transparent 78%); }
.hero-grid::after { content: ""; position: absolute; left: 0; bottom: 0; width: 72%; height: 36%; background: radial-gradient(ellipse at 35% 100%, rgba(233,200,76,.24), transparent 64%); }
.grid-label { position: absolute; color: #918a80; font: 9px var(--mono); letter-spacing: .07em; }.grid-label-a { top: 16%; left: 6%; }.grid-label-b { bottom: 11%; left: 42%; }
.route { position: absolute; border: 1px solid rgba(231,90,35,.72); border-radius: 50%; transform: rotate(-27deg); }.route-one { width: 52vw; height: 26vw; top: 10%; left: -12%; }.route-two { width: 39vw; height: 16vw; top: 35%; left: 8%; border-style: dashed; }
.orbit { position: absolute; border: 1px solid rgba(25,32,29,.15); border-radius: 50%; }.orbit-a { width: 25vw; height: 25vw; left: 23%; bottom: -11vw; }.orbit-b { width: 40vw; height: 40vw; left: 15%; bottom: -25vw; }
.waypoint { position: absolute; width: 9px; height: 9px; border: 2px solid var(--orange); border-radius: 50%; background: var(--paper); }.waypoint-a { top: 31%; left: 20%; }.waypoint-b { top: 44%; left: 48%; }.waypoint-c { top: 19%; left: 58%; background: var(--yellow); border-color: var(--yellow); }
.hero-copy { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; padding: 11vw 7vw 9vw; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; color: var(--muted); font: 10px var(--mono); letter-spacing: .13em; }.eyebrow span { color: var(--orange); }
.hero-copy h1, .dashboard-heading h1 { max-width: 660px; margin: 0; font: 500 clamp(64px, 7.1vw, 111px)/.82 var(--serif); letter-spacing: -.065em; }.hero-copy h1 em, .dashboard-heading h1 em { color: var(--orange); font-weight: 500; }
.hero-lead { max-width: 410px; margin: 34px 0 0; color: #525851; font-size: 16px; line-height: 1.72; }
.hero-ruler { width: min(100%, 470px); display: grid; grid-template-columns: auto 1fr auto 1fr auto 1fr auto 1fr auto; align-items: center; gap: 8px; margin-top: 58px; color: var(--muted); font: 9px var(--mono); }.hero-ruler span:nth-child(even) { height: 1px; background: var(--line); }
.auth-panel { position: relative; z-index: 2; align-self: center; width: min(100% - 46px, 410px); margin: 42px 7vw 42px auto; padding: 25px 27px 23px; background: rgba(255,252,246,.76); border: 1px solid rgba(25,32,29,.75); box-shadow: 8px 8px 0 var(--yellow); backdrop-filter: blur(8px); }
.panel-topline, .section-heading, .connection-heading { display: flex; align-items: center; justify-content: space-between; }.panel-topline { padding-bottom: 22px; border-bottom: 1px solid var(--line); }.panel-topline p, .panel-index { margin: 0; font: 9px var(--mono); letter-spacing: .13em; }.panel-index { color: var(--orange); }
.auth-tabs { display: flex; gap: 22px; margin-top: 22px; border-bottom: 1px solid var(--line); }.auth-tab { position: relative; padding: 0 0 11px; border: 0; background: none; color: var(--muted); font-size: 14px; }.auth-tab.active { color: var(--ink); font-weight: 700; }.auth-tab.active::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--orange); }
.auth-form { margin-top: 25px; }.auth-form.hidden { display: none; }.auth-form h2 { margin: 0; font: 500 33px/.95 var(--serif); letter-spacing: -.04em; }.form-intro { margin: 9px 0 22px; color: var(--muted); font-size: 13px; line-height: 1.5; }
label { display: block; } label > span, .redeem-form label, .identity-form label, .token-entry > label { display: block; margin-bottom: 7px; font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
input { width: 100%; height: 45px; padding: 0 12px; border: 1px solid var(--line); border-radius: 0; outline: 0; background: rgba(255,255,255,.48); color: var(--ink); font-size: 14px; transition: border-color .18s, box-shadow .18s; }.auth-form label + label { margin-top: 14px; } input:focus { border-color: var(--orange); box-shadow: 3px 3px 0 rgba(231,90,35,.16); } input::placeholder { color: #99958e; }
.primary-button, .secondary-button, .copy-button { display: inline-flex; justify-content: center; align-items: center; gap: 10px; border: 0; font-weight: 700; }.primary-button { width: 100%; height: 47px; margin-top: 23px; background: var(--ink); color: var(--paper); font-size: 14px; }.primary-button:hover { background: var(--orange-deep); }.primary-button svg { width: 17px; }.auth-note { display: flex; align-items: flex-start; gap: 7px; margin: 20px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.auth-note svg { flex: 0 0 auto; width: 14px; color: var(--green); }
.hero-footnote { position: absolute; z-index: 1; bottom: 26px; left: 7vw; display: flex; align-items: center; gap: 12px; color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; }.hero-footnote .line { width: 38px; height: 1px; background: var(--orange); }
.landing-notes { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1440px; margin: 0 auto; border-bottom: 1px solid var(--line); }.landing-notes article { min-height: 218px; padding: 30px 38px; border-right: 1px solid var(--line); }.landing-notes article:last-child { border-right: 0; }.note-number, .section-code { display: block; color: var(--orange); font: 10px var(--mono); letter-spacing: .1em; }.landing-notes h2 { margin: 18px 0 12px; font: 500 27px/.93 var(--serif); letter-spacing: -.035em; }.landing-notes p { max-width: 275px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }

.dashboard { max-width: 1280px; margin: 0 auto; padding: 68px 36px 42px; }.dashboard-heading { display: flex; justify-content: space-between; gap: 35px; align-items: end; padding-bottom: 50px; }.dashboard-heading h1 { font-size: clamp(54px, 6vw, 88px); }.account-stamp { min-width: 205px; display: grid; gap: 5px; padding: 13px 0 13px 16px; border-left: 2px solid var(--yellow); color: var(--muted); font: 10px var(--mono); letter-spacing: .06em; }.account-stamp strong { max-width: 250px; overflow: hidden; color: var(--ink); font: 500 13px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.connection-board { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 22px; min-height: 300px; padding: 60px 32px 28px; overflow: hidden; background: var(--ink); color: var(--paper); }.connection-board::before { content: ""; position: absolute; width: 520px; height: 520px; top: -330px; right: -65px; border: 1px solid rgba(233,200,76,.5); border-radius: 50%; box-shadow: 0 0 0 54px rgba(233,200,76,.06), 0 0 0 110px rgba(233,200,76,.04); }.connection-board::after { content: ""; position: absolute; right: 5%; bottom: 45px; width: 36%; height: 1px; background: linear-gradient(90deg, transparent, var(--orange), transparent); }.board-corner { position: absolute; top: 18px; left: 32px; color: var(--yellow); font: 9px var(--mono); letter-spacing: .14em; }.connection-main { position: relative; z-index: 1; align-self: center; }.connection-heading { justify-content: start; gap: 10px; }.connection-heading p { margin: 0; color: #c0c6bc; font: 10px var(--mono); letter-spacing: .12em; }.address-value { max-width: 770px; margin: 14px 0 8px; overflow-wrap: anywhere; color: #fffaf1; font: 500 clamp(25px, 3.3vw, 49px)/.98 var(--serif); letter-spacing: -.035em; }.address-description { max-width: 560px; margin: 0; color: #c0c6bc; font-size: 13px; line-height: 1.55; }.copy-button { position: relative; z-index: 1; align-self: center; min-width: 132px; height: 42px; padding: 0 15px; background: var(--yellow); color: var(--ink); font-size: 13px; }.copy-button:hover { background: #f4d75c; }.copy-button:disabled { cursor: not-allowed; opacity: .42; }.copy-button svg { width: 15px; }
.token-entry { position: relative; z-index: 1; grid-column: 1 / -1; align-self: end; padding-top: 13px; border-top: 1px solid rgba(247,242,233,.2); }.token-entry > label { color: #c0c6bc; }.token-control { display: flex; max-width: 620px; }.token-control input { height: 39px; border-color: #53605a; background: rgba(255,255,255,.06); color: var(--paper); font: 12px var(--mono); }.token-control input::placeholder { color: #a7afa7; }.icon-button { width: 44px; flex: 0 0 44px; border: 1px solid #53605a; border-left: 0; background: rgba(255,255,255,.06); color: var(--paper); }.icon-button svg { width: 16px; }.token-entry p { display: flex; align-items: center; gap: 6px; margin: 7px 0 0; color: #c0c6bc; font-size: 10px; }.token-entry p svg { width: 12px; color: var(--yellow); }
.save-warning { position: relative; z-index: 1; grid-column: 2; display: flex; align-items: flex-start; gap: 10px; max-width: 285px; padding: 12px; border: 1px solid rgba(233,200,76,.5); background: rgba(233,200,76,.09); }.save-warning > svg { flex: 0 0 auto; width: 17px; color: var(--yellow); }.save-warning div { display: grid; gap: 3px; }.save-warning strong { color: #fff8e9; font-size: 11px; }.save-warning span { color: #c0c6bc; font-size: 10px; line-height: 1.45; }
.console-grid { display: grid; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: 55px; margin-top: 65px; }.console-section { min-width: 0; padding-top: 17px; border-top: 2px solid var(--ink); }.section-heading h2 { margin: 8px 0 0; font: 500 35px/.95 var(--serif); letter-spacing: -.04em; }.status-chip, .identity-count { padding: 5px 7px; border: 1px solid var(--line); color: var(--muted); font: 9px var(--mono); letter-spacing: .06em; text-transform: uppercase; }.status-chip.active { border-color: rgba(69,117,94,.5); background: rgba(69,117,94,.08); color: var(--green); }.status-chip.expired { border-color: rgba(231,90,35,.4); color: var(--orange-deep); }
.subscription-readout { display: grid; grid-template-columns: 1fr 1.15fr; gap: 20px; margin: 28px 0 24px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.subscription-readout div { display: grid; gap: 8px; }.subscription-readout span { color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; }.subscription-readout strong { font-size: 15px; }.redeem-form, .identity-form { margin-top: 20px; }.redeem-form > div, .identity-form > div { display: flex; }.redeem-form input, .identity-form input { min-width: 0; border-right: 0; }.secondary-button { min-width: 70px; padding: 0 13px; background: var(--orange); color: #fffaf3; font-size: 12px; }.secondary-button:hover { background: var(--orange-deep); }.redeem-form p, .identity-form p, .section-lead { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.section-lead { max-width: 480px; margin-top: 20px; font-size: 13px; }
.identity-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 24px 0 20px; padding: 0; list-style: none; }.identity-list li { min-width: 0; min-height: 70px; display: flex; flex-direction: column; justify-content: center; gap: 7px; padding: 10px; border: 1px solid var(--line); }.identity-list li::before { content: "SLOT"; color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; }.identity-list li span { overflow: hidden; color: var(--ink); font: 500 12px var(--mono); text-overflow: ellipsis; white-space: nowrap; }.identity-list li.empty { border-style: dashed; opacity: .56; }.identity-list li.empty span { color: var(--muted); }.identity-form.is-limit { opacity: .52; }.identity-form.is-limit input, .identity-form.is-limit button { cursor: not-allowed; }
.support-band { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 72px; padding: 29px 32px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.support-band h2 { margin: 9px 0 5px; font: 500 27px/.95 var(--serif); letter-spacing: -.035em; }.support-band p { margin: 0; color: var(--muted); font-size: 12px; }.support-contact { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); font: 500 20px var(--mono); text-decoration: none; }.support-contact svg { width: 18px; color: var(--orange); }.support-contact svg:last-child { width: 15px; color: var(--ink); }
.toast-region { position: fixed; z-index: 30; right: 22px; bottom: 22px; display: grid; gap: 8px; width: min(380px, calc(100vw - 44px)); }.toast { display: flex; align-items: flex-start; gap: 10px; padding: 13px 14px; border: 1px solid var(--ink); background: #fffaf1; box-shadow: 4px 4px 0 var(--yellow); font-size: 13px; line-height: 1.4; animation: toast-in .22s ease-out; }.toast.error { border-color: var(--orange-deep); box-shadow: 4px 4px 0 rgba(231,90,35,.32); }.toast svg { flex: 0 0 auto; width: 17px; color: var(--green); }.toast.error svg { color: var(--orange); } @keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 800px) { .site-header { height: 62px; grid-template-columns: 1fr auto; padding: 0 20px; }.header-status { display: none; }.landing { grid-template-columns: 1fr; min-height: auto; }.hero-copy { min-height: 515px; padding: 82px 25px 74px; }.hero-copy h1 { font-size: clamp(61px, 17vw, 84px); }.hero-lead { max-width: 345px; margin-top: 27px; font-size: 14px; }.hero-ruler { margin-top: 40px; }.auth-panel { width: auto; margin: 0 25px 55px; }.route-one { width: 110vw; height: 55vw; top: 5%; left: -28%; }.route-two { width: 88vw; height: 42vw; top: 32%; left: -15%; }.orbit-a { width: 70vw; height: 70vw; left: 25%; bottom: -35vw; }.orbit-b { display: none; }.hero-footnote { display: none; }.landing-notes { grid-template-columns: 1fr; }.landing-notes article { min-height: auto; padding: 26px 25px; border-right: 0; border-bottom: 1px solid var(--line); }.landing-notes article:last-child { border-bottom: 0; }.dashboard { padding: 46px 20px 28px; }.dashboard-heading { display: block; padding-bottom: 37px; }.dashboard-heading h1 { font-size: clamp(51px, 15vw, 70px); }.account-stamp { width: fit-content; margin-top: 26px; }.connection-board { display: flex; flex-direction: column; gap: 20px; min-height: 0; padding: 55px 20px 20px; }.connection-board::before { width: 310px; height: 310px; top: -222px; right: -130px; }.address-value { font-size: clamp(27px, 8vw, 38px); }.copy-button { align-self: flex-start; }.token-entry { width: 100%; }.save-warning { max-width: none; }.console-grid { grid-template-columns: 1fr; gap: 45px; margin-top: 52px; }.identity-list { grid-template-columns: 1fr; }.identity-list li { min-height: 55px; flex-direction: row; align-items: center; justify-content: flex-start; }.identity-list li::before { width: 42px; }.support-band { display: block; padding: 25px 0; }.support-contact { margin-top: 22px; }.toast-region { right: 15px; bottom: 15px; width: calc(100vw - 30px); } }
@media (max-width: 420px) { .site-header .text-button span { display: none; }.site-header .text-button svg { width: 19px; height: 19px; }.auth-panel { margin-right: 18px; margin-left: 18px; padding: 21px 20px; }.hero-copy { padding-right: 20px; padding-left: 20px; }.subscription-readout { grid-template-columns: 1fr; gap: 18px; }.redeem-form > div, .identity-form > div { flex-wrap: wrap; }.redeem-form input, .identity-form input { border-right: 1px solid var(--line); }.secondary-button { width: 100%; height: 42px; margin-top: 8px; }.save-warning { grid-column: auto; } }