/* WEST PROTOCOL presentation; settlement logic and market data are shared. */
html{--bg:#101116;--panel:#17191f;--surface:#20232b;--border:#2b2e36;--text:#f1f0ed;--muted:#9ea2ad;--accent:#f154a5;--ink:#fff;--error:#ffb3aa}
html[data-theme=light]{--bg:#f5f6f8;--panel:#fff;--surface:#eff0f4;--border:#d8dbe3;--text:#161820;--muted:#626877;--accent:#c51670;--ink:#fff;--error:#a32723}
body{font-family:Arial,Helvetica,sans-serif}
.header{min-height:96px;gap:32px;max-width:none;padding:20px 4%}
.brand{gap:13px;letter-spacing:.035em;white-space:nowrap;font-weight:800}
.brand:hover{text-decoration:none}
.brand-mark{background:var(--accent);color:#fff;width:39px;height:42px;display:grid;place-items:center;font-size:30px;font-weight:900;border-radius:9px;flex-shrink:0}
.brand small{display:block;color:var(--muted);font-size:12px;letter-spacing:.27em;font-weight:500}
.header nav{align-items:center;gap:26px;font-size:14px;white-space:nowrap}
.header nav a{padding:10px 0}
.header nav .active{color:var(--accent)}
.header-actions{gap:12px}
.network{font-size:13px;background:var(--surface);border:1px solid var(--border);border-radius:30px;padding:7px 13px;white-space:nowrap}
.icon-button{border-color:transparent;background:transparent;flex-shrink:0}
#connect{white-space:nowrap;min-height:44px;border-radius:10px;font-size:14px}
.hero-token{border-radius:20px;background:radial-gradient(ellipse at top right,#f154a525,transparent 70%),var(--panel)}
.hero-token strong{color:var(--accent)}
html[data-theme=light] .eyebrow,html[data-theme=light] .unit-usd{color:var(--accent)}
.recovery{border-color:var(--accent)}
.tabs .selected{background:var(--surface);color:var(--accent)}
.status.error{color:var(--error)}
@media(max-width:1250px){.network{display:none}.header{gap:26px}.header nav{gap:19px}}
@media(max-width:850px){.header{padding:18px 5%;flex-wrap:wrap;gap:16px}.header nav{order:3;width:100%;justify-content:flex-start;overflow-x:auto;gap:19px;border-top:1px solid var(--border);padding-top:8px}.brand{font-size:15px}.header-actions{margin-left:auto}.header-actions select{max-width:100px}}
@media(max-width:520px){.header nav{gap:17px;font-size:12px}.header-actions{gap:4px}#connect{font-size:12px;padding:10px 12px}.brand-mark{width:34px;height:38px;font-size:27px}.brand{gap:9px}.brand small{font-size:10px}.header-actions select{max-width:75px}.hero h1{font-size:42px}}