@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{color-scheme:dark;--bg:#101011;--panel:#19191b;--ink:#eeeae0;--text:var(--ink);--muted:#aaa6a2;--line:#ffffff24;--red:#e55253;--green:#c7dec9;--orange:#f0ba88}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 'DM Sans',system-ui,sans-serif}body::before{display:none}a{color:inherit;text-underline-offset:5px}img{max-width:100%;height:auto}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #f1d6a6;outline-offset:4px}button,input,select{background:#1b1b1d;border:1px solid #ffffff38;border-radius:2px;padding:11px 15px}button:hover:not(:disabled){border-color:#e8e1d0;background:#272527;transform:none}button.primary,.button.primary{background:var(--ink);color:#171719;border-color:var(--ink)}button.primary:hover:not(:disabled),.button.primary:hover{background:#fff9eb;color:#101011}.icon{display:inline-flex;align-items:center;vertical-align:middle;flex:none}.icon svg{display:block;width:20px;height:20px}.skip-link{position:absolute;top:0;left:20px;transform:translateY(-120%);z-index:100;background:var(--ink);color:#101011;padding:12px}.skip-link:focus{transform:none}
.site-header,.battle .site-header{max-width:1200px;margin:0 auto;padding:24px 32px;min-height:100px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line);background:none}.site-brand{display:block;flex:none;font:700 19px/.94 Impact,'Arial Narrow',sans-serif;letter-spacing:.3px;text-decoration:none;color:var(--ink)}.site-brand>span{display:block;font-size:34px;color:var(--red);letter-spacing:1px}.site-header nav,.battle .site-header nav{display:flex;flex-wrap:wrap;align-items:center;gap:25px;margin-left:auto;width:auto;justify-content:flex-end}.site-header nav a,.battle .site-header nav a{padding:10px 0;font-size:13px;white-space:nowrap;text-decoration:none;color:#bab6b0;border-bottom:2px solid transparent}.site-header nav a:hover{color:#fff}.site-header nav a[aria-current=page],.battle .site-header nav a[aria-current=page]{color:var(--ink);border-color:var(--red);text-decoration:none}.site-header .wallet-button{font-size:12px;min-height:44px;padding:10px 14px}.site-footer,.battle .site-footer{max-width:1136px;margin:0 auto;padding:35px 0;display:flex;flex-wrap:wrap;align-items:center;gap:28px;border-top:1px solid var(--line);font:13px/1.6 'DM Sans',sans-serif;color:var(--muted);letter-spacing:0}.site-footer nav{display:flex;flex-wrap:wrap;gap:24px;margin:0 0 0 auto;width:auto}.site-footer nav a{font-size:13px;text-decoration:none;padding:10px 0}.site-footer .site-brand{font-size:14px}.site-footer .site-brand>span{font-size:25px}.footer-note{width:100%;font-size:12px}
body:not(.battle) main{display:block;width:100%;max-width:1200px;padding:0 32px;margin:auto}.eyebrow{font:600 11px/1.5 'DM Sans',sans-serif;letter-spacing:2px;color:var(--muted);margin:0 0 20px}.button{display:inline-flex;justify-content:center;align-items:center;gap:24px;min-height:48px;padding:13px 21px;border:1px solid var(--line);border-radius:2px;text-decoration:none;font-size:14px;font-weight:700}.button.secondary{background:transparent;color:var(--ink)}.button.secondary:hover{background:#ffffff0c;border-color:var(--muted)}.text-link{font-size:14px;font-weight:600;display:inline-flex;align-items:center;gap:12px}.home h2,.site-page h2,.mint h2{font:600 36px/1.1 'Space Grotesk',sans-serif;letter-spacing:-1.3px;margin:0 0 20px}.home p,.site-page p,.mint p{color:var(--muted)}
.home-hero{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:65px 0 60px}.masthead{font:900 clamp(72px,8.8vw,124px)/.92 Impact,'Arial Narrow',sans-serif;letter-spacing:.5px;margin:0;color:var(--ink)}.masthead>span{display:block;font-size:1.46em;letter-spacing:2px;color:var(--red)}.hero-copy .eyebrow{font-size:10px;letter-spacing:2.4px}.hero-description{font-size:18px;line-height:1.6;margin:26px 0;color:var(--ink)!important}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-note{font-size:12px;margin:14px 0 0}.hero-character{padding:18px 0 0}.form-example{min-width:0}.portrait-window{position:relative;border:1px solid #ffffff30;aspect-ratio:1;background:#17171a}.portrait-window img{width:100%;height:100%;display:block;aspect-ratio:1;object-fit:contain;image-rendering:pixelated}.portrait-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}.portrait-controls>span{font-size:13px;font-weight:600}.portrait-controls>div{display:flex;gap:0}.portrait-controls button{font-size:12px;padding:8px 16px;min-height:40px;border-radius:0}.portrait-controls button[aria-pressed=true]{color:#101011;background:var(--ink);border-color:var(--ink)}.art-caption{font-size:12px;margin:12px 0;color:var(--muted)}.portrait-window.is-changing{animation:form-reveal .35s ease-out}@keyframes form-reveal{0%{filter:brightness(1.7);transform:translateY(2px)}100%{filter:none;transform:none}}
.collection-preview{border-top:1px solid var(--line);padding:55px 0}.section-heading{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;margin-bottom:30px}.section-heading p{margin:0}.section-heading .eyebrow{margin-bottom:18px}.section-heading h2{margin:0}.art-lineup{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.art-lineup img{width:100%;aspect-ratio:1;object-fit:contain;image-rendering:pixelated}.section-tail{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px}.section-tail p{font-size:12px;margin:0}.home-battle{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:100px;padding:55px 0}.home-battle h2{font:700 64px/.98 Impact,'Arial Narrow',sans-serif;letter-spacing:.3px}.home-battle>div>p:not(.eyebrow){max-width:450px;margin:24px 0}.rule-example{align-self:center;border-left:3px solid var(--red);padding:8px 0 8px 40px}.equation{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--ink)}.equation span{font:700 76px/1 Impact,'Arial Narrow',sans-serif}.equation b{font-size:30px;font-weight:400;color:var(--muted)}.rule-outcome{margin-top:28px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:start}.rule-outcome strong{color:var(--red);font-size:20px}.rule-outcome span{font-size:14px}.rule-example>p:last-child{font-size:12px;margin-bottom:0!important}.mint-invitation{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:55px 0}.mint-invitation p{margin-bottom:0}.mint-invitation .eyebrow{margin-bottom:15px}.mint-invitation .button{flex:none}
.page-intro{padding:58px 0 35px;max-width:740px}.page-intro h1,.mint h1{font:700 clamp(38px,5vw,60px)/1.05 'Space Grotesk',sans-serif;letter-spacing:-2px;margin:0 0 22px}.page-intro p:not(.eyebrow){font-size:17px;margin:0}.gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 24px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.gallery-toolbar>div{display:flex;gap:8px}.gallery-toolbar button{font-size:13px;min-height:44px}.gallery-toolbar button[aria-pressed=true]{background:var(--ink);color:#171719;border-color:var(--ink)}#galleryCount{font-size:12px;color:var(--muted)}.collection-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px}.art-tile{min-width:0}.art-tile img{display:block;width:100%;aspect-ratio:1;object-fit:contain;image-rendering:pixelated}.tile-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:13px 0 8px}.tile-heading h3,.neighbor-tile h2{font-size:14px;letter-spacing:0;margin:0}.tile-heading>span{font-size:11px;color:var(--muted)}.art-tile details,.neighbor-tile details{font-size:12px;border-top:1px solid var(--line);padding:8px 0}.art-tile summary,.neighbor-tile summary{cursor:pointer;padding:4px 0;color:var(--muted)}.trait-list{margin:10px 0 0}.trait-list>div{display:flex;justify-content:space-between;gap:16px;padding:4px 0}.trait-list dt{color:var(--muted);font-weight:400}.trait-list dd{text-align:right;margin:0}.collection-story{display:grid;grid-template-columns:1fr 380px;gap:100px;align-items:center;margin:65px 0;padding:55px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.collection-story h2{font-size:46px}.collection-story .button{margin-top:15px}.faq-section,.contract-section{display:grid;grid-template-columns:1fr 1.45fr;gap:75px;padding:10px 0 60px}.faq-list details{border-top:1px solid var(--line)}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{font-weight:500;padding:20px 0;cursor:pointer}.faq-list details p{margin:0 0 22px;font-size:14px}.contract-section{border-top:1px solid var(--line);padding-top:45px}.contract-section h2{font-size:28px}.contract-facts{margin:0 0 24px;overflow-wrap:anywhere}.contract-facts dt{font-size:12px;color:var(--muted);margin-top:14px}.contract-facts dd{margin:2px 0 12px;font-size:14px}.contract-facts dt:first-child{margin-top:0}.reveal-details{border-top:1px solid var(--line);padding:16px 0}.reveal-details summary{cursor:pointer}.reveal-details p{font-size:14px}.reveal-details button{margin:6px 5px 0 0;font-size:13px}.site-status:empty{display:none}.site-status{font-size:14px}.ownership-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0}.ownership-toolbar>div,.ownership-toolbar form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ownership-toolbar input{width:95px}.ownership-toolbar label{font-size:13px}.empty-collection{display:flex;align-items:center;gap:35px;padding:50px 0;max-width:750px;min-height:350px}.empty-collection img{width:170px;aspect-ratio:1;image-rendering:pixelated}.empty-collection h2{font-size:25px}.neighbor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px;margin:32px 0}.neighbor-tile img{display:block;width:100%;aspect-ratio:1;object-fit:contain;image-rendering:pixelated;margin-bottom:14px}.neighbor-tile h2{margin-bottom:12px}.neighbor-tile a{display:inline-block;margin-top:10px;font-size:13px}.neighbors-page{min-height:calc(100svh - 300px)}#moreNeighbors{margin-bottom:40px}
body.mint main{padding-top:52px;padding-bottom:50px}.mint .pitch{max-width:640px;font-size:17px;margin-bottom:28px}.mint-art{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:800px;margin:30px 0}.mint-art img{display:block;width:100%;aspect-ratio:1;image-rendering:pixelated;object-fit:contain}.mint-console{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;margin-top:35px}.mint .card{padding:28px;border:1px solid var(--line);background:var(--panel);align-self:start}.mint .status{font-size:19px;margin-top:0;color:var(--ink)}.mint .status.warn{color:var(--orange)}.mint .status.open{color:var(--green)}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0}.facts dt{font-size:12px;color:var(--muted)}.facts dd{margin:4px 0;font-size:22px;overflow-wrap:anywhere}.qty{display:flex;align-items:center;gap:20px}.qty button{min-width:44px;min-height:44px}.qty output{font-size:24px}.total{font-size:18px}.mint button.primary{width:100%}.mint .note,.mint .owned{font-size:13px;overflow-wrap:anywhere}.mint .muted{color:var(--muted)}.mint .reveal{max-width:650px;font-size:13px;margin-top:25px}.mint-information h2{font-size:24px}.mint-information p{font-size:14px}.mint-information strong{color:var(--ink)}.mint-contract{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;overflow-wrap:anywhere}.mint-contract span:empty{display:none}
@media(max-width:900px){.site-header,.battle .site-header{gap:20px;padding:20px 24px}.site-header nav,.battle .site-header nav{gap:18px}.site-footer,.battle .site-footer{margin:0 24px}.home-hero{gap:32px}.masthead{font-size:9vw}.hero-description{font-size:16px}.hero-actions .button{font-size:12px;padding:12px 14px;gap:12px}.section-heading{gap:32px}.home-battle{gap:40px}.home h2,.site-page h2{font-size:30px}.collection-story{grid-template-columns:1fr 300px;gap:40px}.faq-section,.contract-section{gap:35px}.mint-console{gap:35px}.battle .site-header .wallet-button{font-size:11px;padding:9px}}
@media(max-width:640px){.site-header,.battle .site-header{display:grid;grid-template-columns:76px 1fr;gap:10px;padding:15px 20px;min-height:90px}.site-brand{font-size:16px}.site-brand>span{font-size:28px}.site-header nav,.battle .site-header nav{gap:0 15px;justify-content:flex-end;align-content:center;margin:0}.site-header nav a,.battle .site-header nav a{font-size:12px;padding:8px 0;min-height:36px}.site-header .wallet-button{grid-column:2;justify-self:end}.site-footer,.battle .site-footer{margin:0 20px;padding:28px 0;gap:20px}.site-footer nav{gap:20px}.site-footer nav a{font-size:12px}.footer-note{font-size:11px}body:not(.battle) main{padding:0 20px}.home-hero{grid-template-columns:1fr;gap:28px;padding:35px 0 40px}.masthead{font-size:clamp(72px,18vw,116px);display:flex;flex-direction:column;max-width:420px}.masthead>span{font-size:1.35em}.hero-description{font-size:16px;margin:20px 0}.hero-actions .button{font-size:13px;min-height:48px}.hero-note{font-size:12px}.hero-character{padding:0;max-width:460px}.portrait-controls{padding:12px 0}.portrait-controls button{min-height:44px}.collection-preview{padding:35px 0}.section-heading{grid-template-columns:1fr;gap:20px;margin-bottom:25px}.section-heading>p{font-size:14px}.art-lineup{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.section-tail{align-items:flex-start;flex-direction:column;gap:12px}.home-battle{grid-template-columns:1fr;gap:32px;padding:35px 0}.home-battle h2{font-size:48px}.home-battle>div>p:not(.eyebrow){font-size:14px}.rule-example{padding-left:22px}.equation span{font-size:65px}.mint-invitation{padding:35px 0;display:block}.mint-invitation .button{margin-top:22px}.mint-invitation p{font-size:14px}.page-intro{padding:35px 0 25px}.page-intro h1,.mint h1{font-size:38px;letter-spacing:-1.4px}.page-intro p:not(.eyebrow){font-size:15px}.gallery-toolbar{gap:10px;padding:15px 0}.gallery-toolbar button{padding:9px 12px;font-size:12px}.gallery-toolbar>div{gap:5px}#galleryCount{font-size:11px}.collection-grid,.neighbor-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}.tile-heading{flex-wrap:wrap;gap:3px}.tile-heading h3{font-size:13px}.tile-heading>span{font-size:11px}.art-tile summary,.neighbor-tile summary{padding:9px 0}.trait-list>div{display:block}.trait-list dd{text-align:left}.collection-story{grid-template-columns:1fr;gap:30px;padding:35px 0;margin:40px 0}.collection-story p{font-size:14px}.collection-story .form-example{max-width:400px}.faq-section,.contract-section{grid-template-columns:1fr;gap:18px;padding-bottom:35px}.faq-section h2{margin:0}.faq-list summary{font-size:14px;min-height:48px}.contract-section{padding-top:35px}.ownership-toolbar{display:block;padding:18px 0}.ownership-toolbar form{margin-top:18px}.ownership-toolbar button{font-size:13px}.empty-collection{align-items:flex-start;gap:20px;min-height:0;padding:30px 0}.empty-collection img{width:90px}.empty-collection h2{font-size:20px;letter-spacing:-.6px}.empty-collection p{font-size:13px}.empty-collection .text-link{font-size:12px}.mint-console{grid-template-columns:1fr;gap:28px}.mint-art{gap:8px}.mint .card{padding:20px}.mint .pitch{font-size:15px}body.mint main{padding-top:35px;padding-bottom:35px}.facts dd{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.ownership-toolbar[data-unavailable=true]{filter:grayscale(1);opacity:.55}

.match-notice{position:fixed;z-index:80;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);box-sizing:border-box;width:max-content;max-width:calc(100vw - 24px);display:flex;align-items:center;gap:18px;padding:12px 16px;background:#151923;color:#f4f5f9;border:1px solid #8c98b4;box-shadow:0 4px 24px #0009;font:600 13px/1.3 system-ui,sans-serif}.match-notice[hidden]{display:none}.match-notice a{flex-shrink:0;color:#10131e;background:#e5bc60;padding:9px 12px;text-decoration:none}.match-notice a:hover{background:#ffe2a0}.match-notice a:focus-visible{outline:2px solid white;outline-offset:3px}

.match-notice-copy{display:grid;gap:4px;min-width:0}.match-notice-timer{font-size:12px;font-weight:400;color:#cbd2e1}.match-notice[data-urgent=true]{border-color:#ec786f}.match-notice[data-urgent=true] .match-notice-timer{color:#ffaaa3}
.royale-return{position:fixed;bottom:14px;right:14px;z-index:80;max-width:calc(100vw - 28px);padding:14px 18px;background:#171322;color:#ffe9a3;border:2px solid #7661a0;box-shadow:0 6px 20px #0008;font:12px/1.4 monospace;text-decoration:none}.royale-return[hidden]{display:none}body:has(.match-notice:not([hidden])) .royale-return{bottom:90px}

/* Shared wallet selector for collection and mint pages. */
.wallet-picker{width:min(360px,calc(100vw - 32px));max-height:calc(100dvh - 48px);box-sizing:border-box;padding:22px;border:1px solid #66528c;border-radius:12px;background:#151020;color:#eee8ff;box-shadow:0 20px 80px #000a;font-family:system-ui,sans-serif}
.wallet-picker::backdrop{background:#05030bc9}
.wallet-picker h2{margin:0 0 18px;font-size:20px}
.wallet-picker-list{display:grid;gap:8px;max-height:55dvh;overflow-y:auto}
.wallet-picker button{font:600 15px/1.4 system-ui,sans-serif;cursor:pointer;color:inherit;min-height:48px;border:1px solid #493b60;border-radius:7px;background:#21182f;padding:10px 12px}
.wallet-picker-option{display:flex;align-items:center;gap:12px;width:100%;text-align:left}
.wallet-picker-option span{overflow-wrap:anywhere}
.wallet-picker-option img{flex-shrink:0;object-fit:contain}
.wallet-picker button:hover{background:#352449;border-color:#ab8cde}
.wallet-picker button:focus-visible{outline:2px solid #b8eafa;outline-offset:2px}
.wallet-picker-message{font-size:14px;line-height:1.5;color:#c4b9d5}
.wallet-picker-message:empty{display:none}
.wallet-picker-back{margin-top:16px;width:100%}

/* ------------------------------------------------------------- wordmark
   One treatment for the name, in two lockups, and nothing on the site spells
   it any other way. This is the lockup from the unrevealed token: Impact,
   NEIGHBOR in cream above WAR at 1.46x — two tone, flat, always stacked, so
   the name reads the same at 17px in a footer and at display size in a hero.

   Vertical is the text alone, for narrow and square spaces. Horizontal puts
   the mark to the left of that same text, matched to its exact height, for
   wide short ones. The mark is the
   one the token draws, on its own violet ground — not redrawn or inverted to
   suit the surface it sits on.

   WAR takes the pink on the site's dark panels; on a light trait ground — the
   token, the placeholder — it takes the deep ink the skull is drawn in. That
   is the only variable: .wordmark-ink. */
:root{--brand-cream:#ffe9a3;--brand-cream-shade:#8d6b33;--brand-pink:#ff5c8a;--brand-pink-shade:#7a1f55;--brand-ink:#120d24}
.wordmark{font-family:Impact,'Arial Narrow',Haettenschweiler,sans-serif;font-weight:400;font-style:normal;line-height:1;letter-spacing:1px;text-decoration:none;color:var(--brand-cream)}
.wordmark .wm-name{display:block;line-height:1;font-size:1em;letter-spacing:inherit;color:var(--brand-cream);text-shadow:none}
/* .site-brand>span and .site-footer .site-brand>span both still reach this
   wrapper and were setting it to 34px and 25px. The lockup states its own
   size at a specificity that outranks them, so the mark beside it is sized
   against the size the text is actually drawn at. */
.site-brand.wordmark .wm-name,.masthead.wordmark .wm-name{font-size:1em}
.wordmark .wm-name>span{display:block;font-size:1.46em;line-height:1;letter-spacing:2px;color:var(--brand-pink);text-shadow:none}
.wordmark-ink .wm-name,.wordmark-ink .wm-name>span{text-shadow:none}
.wordmark-ink .wm-name>span{color:var(--brand-ink)}
.wordmark-v{display:inline-block}
.site-brand.wordmark-h{display:inline-flex;align-items:flex-start;gap:.4em}
.wordmark-h{display:inline-flex;align-items:flex-start;gap:.4em}
/* Measured, not guessed. The viewBox (2 0 28 32) is the skull path's exact
   bounds, so the box is all drawing. Impact at line-height:1 puts NEIGHBOR's
   cap top .0881em below the block's top edge, and WAR's baseline .0881+2.2187
   below that — measured off actualBoundingBoxAscent/Descent at this size.
   The mark is set to that span, so its top and bottom land on the top of the
   N and the bottom of the R with nothing left over. */
.wordmark-h .wm-icon{flex:none;display:block;align-self:flex-start;height:2.2187em;width:auto;aspect-ratio:28/32;margin-top:.0881em}
.site-header .site-brand.wordmark{font-size:18px;line-height:1}
.site-footer .site-brand.wordmark{font-size:17px;line-height:1}

/* The game page's chrome joins the rest of the site. Only the ground and the
   header rule change — .game-frame paints its own background and bezel, so
   nothing inside the console is touched by this. */
body.battle{background:#120d24}
body.battle .site-header,body.battle .site-footer{border-color:#4b3f70}
body.battle .site-header{border-bottom-width:3px;border-bottom-style:solid}


/* ------------------------------------------------------ the shared chrome */
/* The header and footer are one design on every page, so everything they need
   to render lives here, in the stylesheet every page with chrome loads.
   These rules used to sit in home.css, which play.html never loads: its
   wallet button and footer quietly fell back to the bare site.css look while
   the markup matched perfectly, so sync_chrome --check saw nothing wrong.

   The palette is declared on the chrome elements rather than on body, so it
   cannot be knocked out by whatever a page sets for itself. battle.css and
   console.css carry the same values under their own scopes; these are the
   copy the chrome relies on. */
.site-header,.site-footer{
 --ink:#ffe9a3;--ink-deep:#1b1030;--ink-shade:#8d6b33;
 --pink:#ff5c8a;--pink-shade:#7a1f55;
 --cyan:#5ee6e0;--cyan-shade:#2b5f66;
 --lav:#c9bbe8;--lav-dim:#9d90c4;--lav-faint:#6b5f99;
 --panel:#1d1738;--panel-dark:#120d24;--bar:#0f0b1f;
 --edge:#4b3f70;--edge-dim:#3b3260;
}

/* The wallet button carries .cab-btn, whose base lives in home.css. The
   chrome cannot depend on that, so the parts it needs are restated here. */
.site-header .wallet-button.cab-btn{display:inline-flex;align-items:center;text-decoration:none}

/* The wallet control lives in the header, far right, where a visitor already
   looks for it — not buried in the page's own toolbar. site.css sizes
   .wallet-button, so the cabinet look is stated at a specificity that wins. */
.site-header .wallet-button.cab-btn{flex:none;margin-left:20px;min-height:42px;
 padding:11px 15px;font-size:12px;letter-spacing:1px;border:0;border-radius:0;
 background:#221a38;color:var(--lav);box-shadow:inset 0 0 0 2px var(--edge)}
.site-header .wallet-button.cab-btn:hover:not(:disabled){color:var(--ink);
 box-shadow:inset 0 0 0 2px var(--cyan-shade)}
.site-header .wallet-button.cab-btn:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.site-header .wallet-menu{position:relative;flex:none;margin-left:20px}
.site-header .wallet-menu .wallet-button.cab-btn{margin-left:0}
.site-header .wallet-button[aria-expanded="true"]{color:var(--ink);box-shadow:inset 0 0 0 2px var(--cyan-shade)}
.wallet-menu-list{
 position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:186px;
 display:flex;flex-direction:column;padding:4px;
 background:var(--panel);box-shadow:inset 0 0 0 2px var(--edge),0 12px 28px #0009;
}
.wallet-menu-item{
 padding:11px 13px;border:0;border-radius:0;background:none;text-align:left;
 font:600 12px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.4px;color:var(--lav);cursor:pointer;
}
.wallet-menu-item:hover:not(:disabled){background:var(--bar);color:var(--ink)}
.wallet-menu-item:focus-visible{outline:3px solid var(--cyan);outline-offset:-3px}
.wallet-menu-item.is-leave{margin-top:4px;border-top:2px solid var(--edge-dim);color:var(--pink)}
.wallet-menu-item.is-leave:hover{background:var(--bar);color:var(--pink)}

/* Four columns: who this is, where to go, where to find us, and the small
   print. site.css lays the footer out as a single flex row, so these rules
   are written to beat it rather than fight it. */
body .site-footer{display:block;max-width:1200px;margin:0 auto;padding:40px 32px 26px;
 border-top:2px solid var(--edge-dim);gap:0}
.ft-grid{display:grid;gap:30px 40px;grid-template-columns:1fr}
@media(min-width:680px){.ft-grid{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.ft-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}}

.ft-brand{min-width:0}
.ft-note{margin:14px 0 0;font-size:13px;line-height:1.6;color:var(--lav-dim);max-width:34ch}

body .site-footer .ft-col{display:flex;flex-direction:column;align-items:flex-start;gap:0;width:auto;margin:0;justify-content:flex-start}
body .site-footer .ft-col h2{margin:0 0 14px;font:600 10px/1 'DM Sans',system-ui,sans-serif;
 letter-spacing:2.2px;text-transform:uppercase;color:var(--lav-faint)}
body .site-footer .ft-col a{display:inline-flex;align-items:center;gap:10px;
 min-height:0;padding:5px 0;font-size:13.5px;line-height:1.5;color:var(--lav);
 text-decoration:none;border:0;white-space:nowrap}
body .site-footer .ft-col a:hover{color:var(--ink)}
body .site-footer .ft-col a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
body .site-footer .ft-col a[aria-current=page]{color:var(--ink)}

.ft-icon{flex:none;width:16px;height:16px;display:block;fill:currentColor}
/* The lucide mark is stroked, the brand marks are filled. */
.ft-link[data-link=explorer] .ft-icon{fill:none;stroke:currentColor}
.ft-link[data-pending]{cursor:default;color:var(--lav-faint)}
.ft-link[data-pending]:hover{color:var(--lav-faint)}

.ft-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;
 margin-top:34px;padding-top:18px;border-top:2px solid var(--edge-dim);
 font-size:12px;color:var(--lav-faint)}


/* In-page links glide rather than jump. The reduced-motion block above already
   forces scroll-behavior back to auto, so this needs no guard of its own. */
html{scroll-behavior:smooth}
:target{scroll-margin-top:18px}
