/* Floating navigation, shared by the exchange and order pages. */
body{background:#f7f8fa}
.site-header{height:80px;margin:10px auto 26px;width:calc(100% - 6.6%);max-width:1540px;padding:0 32px;display:flex;justify-content:flex-start;align-items:center;gap:24px;border:0;border-radius:18px;background:#fff;z-index:10}
.site-header .brand{flex:none;padding-inline-end:24px;border-inline-end:1px solid #e4e7ef;line-height:1;direction:inherit}
.site-header .brand-mark{width:44px;height:44px;object-fit:contain}
.site-header .brand-logo{display:block;height:44px;width:auto;max-width:190px;object-fit:contain}
.header-end{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-header .nav{display:flex;align-items:center;gap:24px;font-size:14px;font-weight:500;color:#18243b}
.site-header .nav a{white-space:nowrap;padding:10px 0}
.site-header .nav a:hover,.site-header .nav a.active{color:#8246ff}
.header-actions{display:flex;align-items:center;gap:12px;flex:none}
.header-login{height:40px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(110deg,#9238ee,#397bfa);border-radius:7px;color:#fff;font-size:14px;font-weight:500;white-space:nowrap}
.header-login:hover{filter:brightness(1.08)}
.header-login svg{width:19px;height:19px;flex:none}
.header-tools{display:flex;align-items:center;gap:12px;border-inline-start:1px solid #e4e7ef;padding-inline-start:16px}
.header-icon{display:inline-grid;place-items:center;width:34px;height:34px;padding:6px;border:1px solid transparent;border-radius:8px;background:#f5f5f7;color:#79808d;cursor:pointer;font:700 13px/1 var(--font)}
.header-icon:hover{border-color:#8246ff;color:#8246ff}
.header-icon svg{width:20px;height:20px}
.language-flag{width:19px;height:15px;border-radius:1px;object-fit:cover}
.theme-sun{display:none}
[data-theme=dark] .theme-moon{display:none}
[data-theme=dark] .theme-sun{display:block}
.site-header .menu-toggle{display:none}
html:lang(ar) .site-header .nav,html:lang(ar) .header-login{font-size:16px}
.demo-bar{background:transparent;color:#64718a;min-height:0;padding:0 20px 14px}
@media(max-width:900px){.site-header{padding:0 22px;gap:18px}.site-header .brand{padding-inline-end:18px}.site-header .nav{gap:16px}.header-end{gap:16px}.header-login{padding:0 14px}}
@media(max-width:760px){
  .site-header{height:72px;width:calc(100% - 24px);padding:0 16px;margin:12px auto 20px;gap:12px;border-radius:15px}
  .site-header .brand{border:0;padding:0}.site-header .brand-mark{width:38px;height:38px}.site-header .brand-logo{height:38px;max-width:150px}
  .header-end{justify-content:flex-end;gap:8px}.header-actions{gap:10px}.header-tools{gap:6px;padding-inline-start:10px}
  .header-login{padding:0 12px}.site-header .menu-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:34px;height:34px;padding:6px;background:transparent;border:0;border-radius:8px;cursor:pointer}
  .site-header .menu-toggle span{width:20px;height:2px;background:var(--ink)}
  .site-header .nav{display:none;position:absolute;top:calc(100% + 8px);inset-inline:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px 18px;box-shadow:0 12px 25px #18233b12;gap:0}
  .site-header .nav.open{display:flex;flex-direction:column;align-items:stretch}
  .site-header .nav a{padding:12px 4px;border-bottom:1px solid var(--line)}.site-header .nav a:last-child{border:0}
}
@media(max-width:360px){.site-header{width:calc(100% - 16px);padding:0 8px;gap:8px}.site-header .brand-mark{width:32px;height:32px}.site-header .brand-logo{height:30px;max-width:120px}.header-actions{gap:7px}.header-login{padding:0 8px;gap:6px}.header-tools{padding-inline-start:7px;gap:3px}.header-end{gap:4px}.header-icon{width:30px;height:32px}html:lang(ar) .header-login{font-size:14px}}