/* Willmay design system · Edition 31. Loaded last on every route. Fonts are self-hosted (OFL-1.1). */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-var-latin.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url(/assets/fonts/jetbrains-mono-var-latin.woff2) format('woff2')}
html{
 --font-sans:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
 --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 --head:var(--font-sans);
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;
 --radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-pill:999px;
 --shadow-sm:0 1px 2px rgb(20 10 30/.06),0 1px 1px rgb(20 10 30/.04);
 --shadow-md:0 8px 24px -12px rgb(40 12 40/.18),0 2px 6px rgb(20 10 30/.05);
 --shadow-lg:0 24px 60px -24px rgb(40 12 40/.28);
 --ok:#0d7a52;--ok-soft:#e3f6ee;--warn:#8a5a00;--warn-soft:#fff3d6;--err:#b3184d;--err-soft:#ffe8ef;--info:#1f4fd1;--info-soft:#e8efff;
 --focus:0 0 0 3px color-mix(in srgb,var(--accent) 45%,transparent);
 --ease:cubic-bezier(.2,.7,.2,1);--dur:180ms;
}
html[data-theme=midnight]{--ok:#5fe0ab;--ok-soft:#173b2e;--warn:#ffc860;--warn-soft:#3a2f16;--err:#ff8fb0;--err-soft:#3d1a26;--info:#9db8ff;--info-soft:#1d2744;--shadow-md:0 8px 24px -12px rgb(0 0 0/.6);--shadow-lg:0 24px 60px -24px rgb(0 0 0/.7)}
body{font-family:var(--font-sans);font-feature-settings:'cv11','ss01';text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-sans);letter-spacing:-.015em}
code,kbd,pre,.mono{font-family:var(--font-mono);font-size:.92em}
/* Amounts, blocks and tables line up. */
dd,td,.net-card dd,.contract-action-facts dd,.contract-odds-bar+small,[data-amount],.contract-table,.net-pill{font-variant-numeric:tabular-nums}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--radius-sm)}
.skip-link{position:absolute;left:var(--space-4);top:-60px;z-index:100;padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--ink);color:var(--page);transition:top var(--dur) var(--ease)}.skip-link:focus{top:var(--space-3)}

/* Cards, panels, tables, forms */
.contract-panel,.net-card,.contract-action-form{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
.contract-panel{padding:var(--space-5)}
.net-card:hover,.contract-open-markets article:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.contract-open-markets article{background:var(--surface);border-color:var(--line);transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
.contract-action-facts div,.contract-market-mini,.contract-empty-note,.contract-wallet-bar{background:var(--soft);border-radius:var(--radius-md)}
.contract-action-facts dt,.net-card dt{color:var(--muted);opacity:1;letter-spacing:.02em;text-transform:uppercase;font-size:.68rem;font-weight:600}
.contract-action-form{gap:var(--space-3);padding:var(--space-4)}
.contract-action-form.is-danger{border-color:color-mix(in srgb,var(--err) 50%,var(--line))}
.contract-action-form label{color:var(--ink);font-weight:500}
.contract-action-form input,.contract-action-form select,.contract-action-form textarea{background:var(--page);border:1px solid var(--line);border-radius:var(--radius-sm);min-height:42px;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.contract-action-form input:focus,.contract-action-form select:focus,.contract-action-form textarea:focus{border-color:var(--accent);box-shadow:var(--focus);outline:none}
.contract-action-form [aria-invalid=true]{border-color:var(--err)}
.field-error{min-height:1em;margin:0;color:var(--err);font-size:.78rem;font-weight:500}
.field-helpers{display:flex;gap:var(--space-2);flex-wrap:wrap}
.chip{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--radius-pill);padding:2px 10px;font-size:.75rem;font-weight:600;cursor:pointer;transition:background var(--dur) var(--ease)}
.chip:hover{background:var(--soft)}
.copy-btn{border:0;background:transparent;color:var(--accent-dark);cursor:pointer;font-weight:600;font-size:.78rem;padding:2px 6px}
.contract-table{border-collapse:separate;border-spacing:0}.contract-table th{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;font-weight:600;background:var(--soft)}
.contract-table th:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.contract-table th:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.contract-table td,.contract-table th{border-bottom:1px solid var(--line);padding:var(--space-2) var(--space-3)}
.contract-table tbody tr{transition:background var(--dur) var(--ease)}.contract-table tbody tr:hover{background:color-mix(in srgb,var(--soft) 70%,transparent)}
.contract-odds-bar span{transition:width 600ms var(--ease)}
.contract-odds-bar span:first-child{background:var(--yes)}.contract-odds-bar span:last-child{background:var(--no)}
.net-connected .net-pill{background:var(--ok-soft);color:var(--ok)}.net-connecting .net-pill,.net-reconnecting .net-pill{background:var(--warn-soft);color:var(--warn)}.net-offline .net-pill{background:var(--err-soft);color:var(--err)}
.net-pill::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px}
.net-connected .net-pill::before{animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{50%{opacity:.35}}
.net-error{color:var(--err)}
.contract-tx-error{background:var(--err-soft);color:var(--err)}.contract-tx-success{background:var(--ok-soft);color:var(--ok)}

/* Transaction stepper */
.tx-stepper{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);border-radius:var(--radius-md);background:var(--soft);border:1px solid var(--line)}
.tx-stepper ol{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);list-style:none;margin:0;padding:0;counter-reset:s}
.tx-stepper li{counter-increment:s;display:flex;align-items:center;gap:var(--space-2);font-size:.8rem;color:var(--muted);font-weight:500}
.tx-stepper li::before{content:counter(s);display:grid;place-items:center;width:24px;height:24px;flex:none;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);font-size:.72rem;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
.tx-stepper li[data-state=done]{color:var(--ok)}.tx-stepper li[data-state=done]::before{content:'✓';background:var(--ok);border-color:var(--ok);color:#fff}
.tx-stepper li[data-state=active]{color:var(--ink);font-weight:650}.tx-stepper li[data-state=active]::before{border-color:var(--accent);color:var(--accent-dark);animation:pulse 1.2s var(--ease) infinite}
.tx-stepper li[data-state=failed]{color:var(--err)}.tx-stepper li[data-state=failed]::before{content:'!';background:var(--err);border-color:var(--err);color:#fff}
.tx-stepper p{margin:0;font-size:.85rem}
@media (max-width:600px){.tx-stepper ol{grid-template-columns:repeat(2,1fr)}}

/* Toasts */
.toast-region{position:fixed;right:var(--space-4);bottom:var(--space-4);z-index:200;display:flex;flex-direction:column;gap:var(--space-2);max-width:min(380px,calc(100vw - 32px));pointer-events:none}
.toast{pointer-events:auto;display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-left:4px solid var(--info);box-shadow:var(--shadow-lg);font-size:.86rem;animation:toast-in 220ms var(--ease) both}
.toast[data-kind=success]{border-left-color:var(--ok)}.toast[data-kind=error]{border-left-color:var(--err)}.toast[data-kind=warn]{border-left-color:var(--warn)}
.toast a{color:var(--accent-dark);font-weight:600}.toast button{margin-left:auto;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:1rem;line-height:1}
.toast.is-leaving{animation:toast-out 180ms var(--ease) both}
@keyframes toast-in{from{opacity:0;transform:translateY(8px) scale(.98)}}@keyframes toast-out{to{opacity:0;transform:translateY(8px)}}

/* Confirmation modal */
.confirm-dialog{border:1px solid var(--line);border-radius:var(--radius-lg);padding:0;max-width:min(460px,calc(100vw - 32px));background:var(--surface);color:var(--ink);box-shadow:var(--shadow-lg)}
.confirm-dialog::backdrop{background:rgb(20 10 30/.45);backdrop-filter:blur(3px)}
.confirm-dialog[open]{animation:toast-in 200ms var(--ease) both}
.confirm-dialog form{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5)}
.confirm-dialog h2{margin:0;font-size:1.15rem}.confirm-dialog p{margin:0;color:var(--muted)}
.confirm-dialog .confirm-summary{font-family:var(--font-mono);font-size:.8rem;background:var(--soft);border-radius:var(--radius-sm);padding:var(--space-3);word-break:break-all;color:var(--ink)}
.confirm-dialog .confirm-actions{display:flex;justify-content:flex-end;gap:var(--space-2)}
.button-danger{background:var(--err)!important;color:#fff!important;border-color:var(--err)!important}

/* Layout rhythm */
willmay-trade,willmay-owner,willmay-network-status{padding-inline:var(--space-4)}
.contract-action-grid{gap:var(--space-4)}
@media (max-width:600px){.contract-panel{padding:var(--space-4)}.contract-action-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}}
/* Buttons used by contract panels: AA contrast in every theme */
willmay-trade .button,willmay-owner .button,willmay-network-status .button,.confirm-dialog .button{border-radius:var(--radius-pill);font-weight:600;padding:.55rem 1rem;min-height:40px;border:1px solid var(--line);cursor:pointer;transition:background var(--dur) var(--ease),transform var(--dur) var(--ease)}
willmay-trade .button-primary,willmay-owner .button-primary{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
willmay-trade .button-soft,willmay-owner .button-soft,.confirm-dialog .button-soft{background:var(--surface);color:var(--ink)}
willmay-trade .button:active,willmay-owner .button:active{transform:translateY(1px)}
willmay-trade .button[disabled],willmay-owner .button[disabled]{opacity:.55;cursor:not-allowed}
p a,li a,.contract-data-note a{text-decoration:underline;text-underline-offset:2px}
/* Edition 32 · admin gate */
[data-admin-link][hidden],[data-admin-shell][hidden],.admin-gate[hidden]{display:none!important}
.admin-gate{min-height:100vh;display:grid;place-items:center;padding:var(--space-5);background:var(--page)}
.admin-gate-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);text-align:center;max-width:420px;padding:var(--space-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-md)}
.admin-gate-card h1{margin:0;font-size:1.4rem}.admin-gate-card p{margin:0;color:var(--muted)}
.admin-gate .button-primary{background:var(--accent-dark);color:#fff;border:0;border-radius:var(--radius-pill);padding:.6rem 1.2rem;font-weight:600;cursor:pointer}
/* Edition 33 · selected network tab keeps AA contrast */
.contract-network-tabs .button[aria-pressed=true],willmay-trade .contract-network-tabs .button-primary[aria-pressed=true],willmay-owner .contract-network-tabs .button-primary[aria-pressed=true]{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}