@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanThin.ttf") format("truetype"); font-style: normal; font-weight: 100; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanLight.ttf") format("truetype"); font-style: normal; font-weight: 300; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanRegular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanMedium.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanBold.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanExtraBold.ttf") format("truetype"); font-style: normal; font-weight: 800; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanBlack.ttf") format("truetype"); font-style: normal; font-weight: 900; font-display: swap; }
@font-face { font-family: "IRANYekan"; src: url("../font/iranyekan/IRANYekanExtraBlack2.ttf") format("truetype"); font-style: normal; font-weight: 950; font-display: swap; }
:root {
  color-scheme: light;
  --gold: #C9A227; --gold-light: #E8C860; --gold-dark: #9A7B12;
  --paper: #FBF8F1; --surface: #FFFFFF; --ink: #2B2B2B; --muted: #77736B;
  --line: #EAE4D7; --success: #168A54; --danger: #C84B4B; --warning: #C97820; --focus: #7B5D0A;
  --shadow-card: 0 10px 30px rgba(71,55,15,.065); --shadow-float: 0 22px 56px rgba(49,38,10,.2);
  --radius-sm: .6rem; --radius-md: 1rem; --radius-lg: 1.25rem; --radius-pill: 999px;
  --space-page: 1.25rem; --z-sticky: 120; --z-dropdown: 220; --z-header: 440; --z-backdrop: 550;
  --z-dialog: 650; --z-sheet: 720; --z-toast: 920;
  --font-body: "IRANYekan",Tahoma,"Segoe UI",sans-serif;
  --font-numeric: "IRANYekan",Tahoma,sans-serif;
}
* { box-sizing: border-box; }
*[hidden] { display: none !important; }
.icon { display: inline-block; flex: 0 0 auto; width: 18px; height: 18px; vertical-align: middle; }
html { min-width: 320px; scroll-behavior: smooth; scrollbar-color: #c4aa55 #f3efe5; scrollbar-width: thin; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-body); font-size: 15px; line-height: 1.65; text-rendering: optimizeLegibility; }
button,input,select,textarea { font: inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
#main-content h1[tabindex="-1"]:focus-visible { outline: none; }
::selection { background: rgba(201,162,39,.25); color: var(--ink); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f3efe5; }
::-webkit-scrollbar-thumb { background: #c4aa55; border: 2px solid #f3efe5; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold-dark); }
@media (forced-colors: active) { html { scrollbar-color: auto; } * { forced-color-adjust: auto; } }
.skip-link { position: fixed; z-index: 1000; top: .75rem; right: .75rem; padding: .65rem 1rem; border-radius: var(--radius-md); background: var(--ink); color: white; transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
.app-root,.app-shell { min-height: 100vh; }
.app-shell { padding-bottom: env(safe-area-inset-bottom); }
.topbar { position: sticky; top: 0; z-index: var(--z-header); border-bottom: 1px solid rgba(234,228,215,.88); background: rgba(251,248,241,.94); backdrop-filter: blur(15px); }
.topbar-inner { display: flex; align-items: center; gap: 1.5rem; width: min(100% - 2.5rem,88rem); min-height: 78px; margin-inline: auto; }
.brand { display: inline-flex; align-items: center; gap: .7rem; flex: 0 0 auto; }
.brand-mark { width: 42px; height: 42px; object-fit: contain; }
.brand-copy { display: grid; line-height: 1.22; }
.brand-copy strong { color: #79570b; font-size: 1.13rem; font-weight: 800; }
.brand-copy span { margin-top: .18rem; color: var(--muted); font: 500 .68rem/1.3 var(--font-numeric); letter-spacing: .14em; direction: ltr; text-align: right; }
.desktop-nav { display: flex; align-items: center; justify-content: center; flex: 1; gap: .32rem; }
.nav-link { display: inline-flex; align-items: center; gap: .42rem; min-height: 44px; padding: .45rem .83rem; border-radius: 11px; color: #625d52; font-size: .86rem; font-weight: 600; transition: background .16s ease,color .16s ease; }
.nav-link:hover { background: #f2ebd9; color: var(--ink); }
.nav-link[aria-current="page"] { background: #f0e4bd; color: #674f0d; }
.nav-link svg { width: 17px; height: 17px; }
.top-actions { display: flex; align-items: center; gap: .55rem; margin-inline-start: auto; }
.icon-button { position: relative; display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; cursor: pointer; transition: background .16s ease,border-color .16s ease,transform .16s ease; }
.icon-button:hover { border-color: var(--line); background: white; }
.icon-button:active { transform: scale(.95); }
.icon-button svg { width: 20px; height: 20px; stroke: currentColor; }
.unread-dot { position: absolute; top: 7px; left: 6px; min-width: 17px; height: 17px; display: grid; place-items: center; padding: 0 4px; border: 2px solid var(--paper); border-radius: 99px; background: var(--danger); color: white; font-size: .6rem; line-height: 1; }
.user-chip { display: flex; align-items: center; gap: .55rem; max-width: 178px; padding: .35rem .5rem; border-radius: var(--radius-pill); }
.avatar { display: grid; flex: 0 0 auto; place-items: center; width: 36px; height: 36px; border: 1px solid #e8d9a9; border-radius: 50%; background: linear-gradient(145deg,#fffdf8,#efe2bc); color: #72570a; font-weight: 700; }
.user-chip-text { overflow: hidden; display: grid; line-height: 1.35; }
.user-chip-text strong,.user-chip-text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-chip-text strong { font-size: .76rem; }
.user-chip-text small { color: var(--muted); font-size: .65rem; }
.mobile-menu-button { display: none; }
.page-wrap { width: min(100% - 2.5rem,88rem); margin: 0 auto; padding: 1.55rem 0 3rem; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; }
.page-heading h1 { margin: 0; color: #302b20; font-size: clamp(1.24rem,2vw,1.68rem); line-height: 1.45; font-weight: 800; }
.page-heading p { margin: .22rem 0 0; color: var(--muted); font-size: .83rem; }
.eyebrow { display: flex; align-items: center; gap: .42rem; color: var(--gold-dark); font-size: .72rem; font-weight: 700; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(22,138,84,.1); }
.card { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-card); }
.card-pad { padding: 1.15rem 1.25rem; }
.card-title-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: .9rem; }
.card-title-row h2,.card-title-row h3 { margin: 0; font-size: .96rem; font-weight: 750; }
.card-title-row p { margin: .2rem 0 0; color: var(--muted); font-size: .73rem; }
.text-muted { color: var(--muted); }.text-success { color: var(--success); }.text-danger { color: var(--danger); }.text-warning { color: var(--warning); }
.numbers { font-family: var(--font-numeric); font-variant-numeric: tabular-nums; direction: rtl; unicode-bidi: isolate; }
.ltr-number { direction: ltr; unicode-bidi: isolate; text-align: left; }
.gold-hero { position: relative; isolation: isolate; overflow: hidden; padding: 1.35rem 1.5rem 1.2rem; border: 1px solid rgba(255,255,255,.32); border-radius: 22px; background: linear-gradient(112deg,#8f6c12 0%,#b58c1c 48%,#d3ad3c 100%); color: white; box-shadow: 0 15px 32px rgba(124,93,14,.19); }
.gold-hero::before { position: absolute; z-index: -1; inset: 0; content: ""; opacity: .35; background: radial-gradient(ellipse at 88% 10%,rgba(255,245,203,.5),transparent 31%),repeating-linear-gradient(138deg,transparent 0 21px,rgba(255,255,255,.045) 22px 23px); }
.gold-hero::after { position: absolute; z-index: -1; right: 30%; bottom: -58px; width: 55%; height: 112px; border: 1px solid rgba(255,248,212,.18); border-radius: 50%; content: ""; transform: rotate(-8deg); }
.gold-hero-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.market-label { display: flex; align-items: center; gap: .6rem; }
.market-icon { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.28); border-radius: 13px; background: rgba(255,255,255,.13); }
.market-icon svg { width: 21px; height: 21px; }
.market-label h2 { margin: 0; font-size: 1rem; font-weight: 750; }
.market-label p { margin: .12rem 0 0; color: rgba(255,255,255,.76); font-size: .71rem; }
.live-pill { display: inline-flex; align-items: center; gap: .38rem; padding: .28rem .58rem; border: 1px solid rgba(255,255,255,.3); border-radius: var(--radius-pill); background: rgba(255,255,255,.12); font-size: .66rem; white-space: nowrap; }
.live-pulse { width: 7px; height: 7px; border-radius: 50%; background: #9cffbf; box-shadow: 0 0 0 4px rgba(156,255,191,.14); animation: pulse 1.8s ease-in-out infinite; }
.price-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 1.25rem; }
.price-block { padding: .1rem 1.2rem .1rem 1rem; }
.price-block + .price-block { border-inline-start: 1px solid rgba(255,255,255,.28); }
.price-kind { display: flex; align-items: center; gap: .4rem; color: rgba(255,255,255,.82); font-size: .76rem; }
.price-kind svg { width: 15px; height: 15px; }
.price-value { display: flex; align-items: baseline; gap: .44rem; margin-top: .08rem; font-size: clamp(1.55rem,3.1vw,2.25rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.5; }
.price-value small { color: rgba(255,255,255,.77); font-size: .68rem; letter-spacing: 0; font-weight: 500; }
.price-foot { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-top: .22rem; color: rgba(255,255,255,.74); font-size: .67rem; }
.price-change { display: inline-flex; align-items: center; gap: .25rem; padding: .16rem .45rem; border-radius: 8px; background: rgba(18,97,51,.38); color: #d9ffe6; font-weight: 700; }
.price-change.down { background: rgba(121,36,29,.35); color: #ffe1db; }
.chart-spark { position: absolute; left: 1.1rem; bottom: 1.25rem; width: 27%; height: 43px; opacity: .85; pointer-events: none; }
.market-foot { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: 1rem; padding-top: .7rem; border-top: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.76); font-size: .68rem; }
.reference-price { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .3rem .8rem; margin-top: .85rem; padding: .72rem .8rem; border: 1px solid rgba(255,255,255,.26); border-radius: 12px; background: rgba(67,47,8,.16); color: rgba(255,255,255,.92); }
.reference-price > span { font-size: .72rem; }.reference-price strong { font-size: .92rem; font-weight: 750; }.reference-price small { flex-basis: 100%; color: rgba(255,255,255,.78); font-size: .64rem; }.reference-price a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.closed-banner { padding: .58rem .75rem; border: 1px solid #f1c98f; border-radius: 10px; background: #fff5e7; color: #784a0c; font-size: .78rem; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(270px,.82fr); gap: 1rem; margin-top: 1rem; align-items: start; }
.main-stack,.side-stack { display: grid; gap: 1rem; min-width: 0; }
.balance-card { position: relative; overflow: hidden; padding: 1.2rem 1.25rem; }
.balance-card::after { position: absolute; top: -52px; left: -32px; width: 170px; height: 170px; border: 1px solid #efe5c6; border-radius: 50%; content: ""; box-shadow: 0 0 0 18px rgba(239,229,198,.17),0 0 0 36px rgba(239,229,198,.11); }
.balance-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.balance-top .label { display: flex; align-items: center; gap: .45rem; color: var(--muted); font-size: .79rem; }
.balance-amount { position: relative; z-index: 1; margin-top: .4rem; font-size: clamp(1.55rem,2.5vw,2rem); font-weight: 800; letter-spacing: -.04em; }
.balance-unit { color: var(--muted); font-size: .73rem; font-weight: 500; }
.balance-subgrid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: 1rem; }
.balance-mini { padding: .72rem .8rem; border: 1px solid #eee8da; border-radius: 12px; background: rgba(255,255,255,.75); }
.balance-mini span { display: block; color: var(--muted); font-size: .68rem; }
.balance-mini strong { display: block; margin-top: .22rem; font-size: .99rem; }
.shortcut-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .7rem; }
.shortcut { display: grid; justify-items: center; align-content: start; gap: .47rem; min-height: 95px; padding: .8rem .35rem .62rem; border: 1px solid var(--line); border-radius: 16px; background: white; color: var(--ink); font-size: .7rem; font-weight: 650; text-align: center; cursor: pointer; transition: transform .16s ease,box-shadow .16s ease,border-color .16s ease; }
.shortcut:hover { transform: translateY(-2px); border-color: #d6c27c; box-shadow: 0 8px 17px rgba(114,87,12,.08); }.shortcut:active { transform: scale(.98); }
.shortcut-disabled { cursor: not-allowed; opacity: .58; }
.shortcut-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: #fbf2d7; color: #8c6e12; }
.shortcut-icon.green { background: #eaf6ee; color: var(--success); }.shortcut-icon.red { background: #fff0ed; color: var(--danger); }.shortcut-icon.blue { background: #edf4fb; color: #4777a1; }
.shortcut-icon-glyph { display: block; width: 22px; height: 22px; background: currentColor; -webkit-mask-image: var(--shortcut-icon-image); mask-image: var(--shortcut-icon-image); -webkit-mask-position: center; mask-position: center; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
.chart-card { padding: 1.1rem 1.2rem 1rem; }
.chart-svg { display: block; width: 100%; height: 185px; overflow: visible; }
.chart-gridline { stroke: #efeadd; stroke-width: 1; stroke-dasharray: 3 5; }.chart-line { fill: none; stroke: #bf9011; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }.chart-area { fill: url(#goldArea); }.chart-dot { fill: #fff; stroke: #bd8d0b; stroke-width: 2.5; }.chart-axis-label { fill: #8c877a; font: 10px var(--font-body); }
.chart-summary { display: flex; justify-content: space-between; gap: .6rem; color: var(--muted); font-size: .69rem; }
.range-tabs { display: flex; align-items: center; gap: .25rem; padding: .2rem; border-radius: 10px; background: #f6f3ec; }
.range-tab { min-height: 32px; padding: .32rem .62rem; border: 0; border-radius: 8px; background: transparent; color: #77736b; font-size: .68rem; cursor: pointer; }
.range-tab[aria-pressed="true"] { background: white; color: #74570a; box-shadow: 0 1px 4px rgba(49,39,10,.09); font-weight: 700; }
.activity-list { display: grid; }.activity-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: .65rem; padding: .7rem 0; border-bottom: 1px solid #f1eee7; }.activity-row:last-child { border-bottom: 0; }
.activity-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #f8f3e4; color: var(--gold-dark); }.activity-icon.green { background: #eaf6ee; color: var(--success); }.activity-icon.red { background: #fff0ed; color: var(--danger); }.activity-icon svg { width: 18px; height: 18px; }
.activity-copy { min-width: 0; display: grid; }.activity-copy strong { overflow: hidden; font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }.activity-copy small { color: var(--muted); font-size: .65rem; }.activity-value { text-align: left; font-size: .74rem; font-weight: 750; white-space: nowrap; }.activity-value small { display: block; color: var(--muted); font-size: .6rem; font-weight: 500; }
.button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 46px; padding: .67rem 1rem; border: 1px solid transparent; border-radius: 12px; font-size: .82rem; font-weight: 700; line-height: 1.3; text-align: center; cursor: pointer; transition: background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease; }
.button:hover { transform: translateY(-1px); }.button:active { transform: translateY(0) scale(.985); }.button:disabled,.button[aria-disabled="true"] { opacity: .52; cursor: not-allowed; transform: none; box-shadow: none; }.button svg { width: 18px; height: 18px; flex: 0 0 auto; }
.button-primary { background: var(--gold); color: #211a08; box-shadow: 0 4px 11px rgba(154,123,18,.15); }.button-primary:hover { background: #d4ae38; }.button-darkgold { background: var(--gold-dark); color: white; }.button-outline { border-color: var(--line); background: white; color: #4b463c; }.button-outline:hover { border-color: #cfb557; background: #fffdf8; }.button-ghost { background: transparent; color: #75600f; }.button-success { background: var(--success); color: white; }.button-danger { background: var(--danger); color: white; }.button-warning { border-color: #efd09e; background: #fff3df; color: #784a0c; }.button-small { min-height: 36px; padding: .45rem .7rem; border-radius: 10px; font-size: .72rem; }.button-block { width: 100%; }
.button-busy { position: relative; color: transparent; pointer-events: none; }.button-busy::after { position: absolute; width: 18px; height: 18px; border: 2px solid #211a08; border-top-color: transparent; border-radius: 50%; content: ""; animation: spin .7s linear infinite; }
.field { display: grid; gap: .34rem; min-width: 0; }.field label { color: #514c42; font-size: .76rem; font-weight: 650; }.field-hint { color: var(--muted); font-size: .67rem; }.input-wrap { position: relative; display: flex; align-items: center; }
.field input,.field select,.field textarea,.text-input { width: 100%; min-height: 48px; padding: .7rem .82rem; border: 1px solid #e2dccf; border-radius: 12px; outline: 0; background: #fff; color: var(--ink); transition: border-color .15s ease,box-shadow .15s ease; }
.field textarea { min-height: 104px; resize: none; }.field input:hover,.field select:hover,.field textarea:hover { border-color: #c9b46d; }.field input:focus,.field select:focus,.field textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,162,39,.13); }.field [aria-invalid="true"] { border-color: var(--danger); }.field-error { min-height: 1.15rem; color: #a32f2f; font-size: .68rem; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .9rem; }.form-stack { display: grid; gap: .85rem; }
.trade-keypad { display: none; }
.keypad-key { min-height: 42px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); font-weight: 700; cursor: pointer; }
.keypad-key:active { background: #f4ead0; transform: scale(.98); }.keypad-muted { color: var(--danger); background: #fff8f6; }.keypad-dot { font-size: 1.1rem; }
.segmented { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: .22rem; border: 1px solid var(--line); border-radius: 12px; background: #f8f6f1; }.segmented button { min-height: 40px; padding: .45rem .7rem; border: 0; border-radius: 9px; background: transparent; color: #696356; font-size: .77rem; font-weight: 650; cursor: pointer; }.segmented button[aria-pressed="true"] { background: white; color: #54400a; box-shadow: 0 1px 5px rgba(39,31,7,.12); }.segmented.buy button[aria-pressed="true"] { background: var(--success); color: white; }.segmented.sell button[aria-pressed="true"] { background: var(--danger); color: white; }
.status-pill { display: inline-flex; align-items: center; gap: .3rem; padding: .22rem .55rem; border-radius: var(--radius-pill); font-size: .66rem; font-weight: 700; white-space: nowrap; }.status-success { background: #e8f5ed; color: #176c42; }.status-warning { background: #fff2dd; color: #805013; }.status-danger { background: #fff0ed; color: #a13832; }.status-neutral { background: #f1f0ec; color: #5d5a53; }
.info-banner,.notice-card { display: flex; align-items: flex-start; gap: .55rem; padding: .72rem .82rem; border: 1px solid #eadcb6; border-radius: 12px; background: #fffaf0; color: #6e5712; font-size: .74rem; }.info-banner svg,.notice-card svg { flex: 0 0 auto; width: 17px; height: 17px; margin-top: .12rem; }.danger-banner { border-color: #f0ceca; background: #fff6f4; color: #863f39; }
.empty-state { display: grid; justify-items: center; gap: .35rem; padding: 2rem 1rem; color: var(--muted); text-align: center; }.empty-state svg { width: 34px; height: 34px; color: #b29b50; }.empty-state strong { color: var(--ink); font-size: .85rem; }.empty-state p { margin: 0; font-size: .72rem; }
.inline-loading { display: grid; place-items: center; min-height: 90px; color: var(--muted); font-size: .75rem; }.spinner { width: 24px; height: 24px; margin-bottom: .5rem; border: 2px solid #eadfbf; border-top-color: var(--gold-dark); border-radius: 50%; animation: spin .7s linear infinite; }.skeleton-shimmer { min-height: 68px; border-radius: 12px; background: linear-gradient(100deg,#f3efe4 30%,#fff9e9 45%,#f3efe4 60%); background-size: 250% 100%; animation: shimmer 1.8s ease-in-out infinite; }
.table-frame { overflow: auto; border: 1px solid var(--line); border-radius: 13px; scrollbar-gutter: stable; }table { width: 100%; min-width: 660px; border-collapse: collapse; text-align: right; font-size: .74rem; }caption { padding: .6rem; color: var(--muted); text-align: right; }th,td { padding: .78rem .82rem; border-bottom: 1px solid #f0ede5; vertical-align: middle; white-space: nowrap; }th { position: sticky; top: 0; z-index: 2; background: #fbfaf7; color: #69645a; font-size: .67rem; font-weight: 700; }th button { display: inline-flex; align-items: center; gap: .25rem; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }tbody tr:hover { background: #fdfbf6; }tbody tr:last-child td { border-bottom: 0; }.table-actions { display: flex; gap: .35rem; align-items: center; }
.pagination { display: flex; justify-content: space-between; align-items: center; gap: .7rem; padding-top: .85rem; color: var(--muted); font-size: .7rem; }.pagination-actions { display: flex; gap: .4rem; }
.search-box { position: relative; display: flex; align-items: center; min-width: 210px; }.search-box input { width: 100%; min-height: 43px; padding: .6rem 2.25rem .6rem .8rem; border: 1px solid var(--line); border-radius: 11px; background: white; }.search-box>svg { position: absolute; right: .72rem; width: 17px; height: 17px; color: #938b79; pointer-events: none; }.search-clear { position: absolute; left: .35rem; display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; }
.filter-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .65rem; margin-bottom: .85rem; }.filter-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.kpi-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .8rem; }.kpi-card { padding: 1rem; }.kpi-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; color: var(--muted); font-size: .72rem; }.kpi-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #fbf3d9; color: #8a6c0b; }.kpi-icon svg { width: 19px; height: 19px; }.kpi-value { margin-top: .55rem; font-size: 1.25rem; font-weight: 800; letter-spacing: -.035em; }.kpi-foot { margin-top: .1rem; color: var(--muted); font-size: .63rem; }
.admin-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 1rem; align-items: start; }.admin-sidebar { position: sticky; top: 94px; display: grid; gap: .25rem; padding: .7rem; }.admin-sidebar-label { padding: .35rem .62rem .45rem; color: #918a7a; font-size: .64rem; font-weight: 700; }.admin-sidebar .nav-link { justify-content: flex-start; }.admin-sidebar .nav-link[aria-current="page"] { background: #f2e9cb; }.admin-main { min-width: 0; display: grid; gap: 1rem; }.admin-topline { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }.admin-topline .page-heading { margin: 0; }.mobile-nav { display: none; }.bottom-spacer { height: .5rem; }
.auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(300px,.85fr) minmax(370px,1.15fr); background: #fffefa; }.auth-brand-panel { position: relative; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: clamp(2rem,6vw,5rem); background: radial-gradient(ellipse at 85% 77%,rgba(232,200,96,.45),transparent 34%),linear-gradient(145deg,#fffdf8,#f4ead0); }.auth-brand-panel::after { position: absolute; right: -13%; bottom: -18%; width: 84%; aspect-ratio: 1; border: 1px solid rgba(201,162,39,.36); border-radius: 49% 51% 50% 45%; content: ""; transform: rotate(-20deg); box-shadow: 0 0 0 24px rgba(201,162,39,.05),0 0 0 50px rgba(201,162,39,.045); }.auth-logo { position: relative; z-index: 1; display: grid; justify-items: center; align-content: center; flex: 1; }.auth-logo img { width: 130px; height: 130px; filter: drop-shadow(0 12px 17px rgba(145,108,12,.19)); }.auth-logo strong { margin-top: .65rem; color: #79570b; font-size: 1.65rem; }.auth-logo span { color: var(--muted); font-size: .85rem; letter-spacing: .18em; direction: ltr; }.auth-brand-copy { position: relative; z-index: 1; max-width: 420px; }.auth-brand-copy h1 { margin: 0; font-size: clamp(1.45rem,2.2vw,2rem); line-height: 1.45; }.auth-brand-copy p { color: #706957; font-size: .88rem; }.auth-form-panel { display: grid; place-items: center; padding: 2rem; }.auth-form { width: min(100%,430px); }.auth-form h2 { margin: 0 0 .2rem; font-size: 1.42rem; }.auth-form>p { margin: 0 0 1.4rem; color: var(--muted); font-size: .78rem; }.auth-switch { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .72rem; }.auth-switch button { padding: .2rem; border: 0; background: transparent; color: #8b680b; font-size: inherit; font-weight: 700; cursor: pointer; }.password-wrap { position: relative; }.password-wrap input { padding-left: 3rem; }.password-toggle { position: absolute; left: .4rem; display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); cursor: pointer; }
.admin-mobile-menu { display: none; }.trade-card { max-width: 690px; margin-inline: auto; padding: clamp(1rem,3vw,1.45rem); }.trade-stepper { display: grid; grid-template-columns: repeat(3,1fr); gap: .55rem; margin-bottom: 1.25rem; }.trade-step { display: flex; align-items: center; gap: .5rem; color: #9a9485; font-size: .68rem; }.trade-step::after { height: 1px; flex: 1; background: #e9e4d9; content: ""; }.trade-step:last-child::after { display: none; }.step-number { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid #ddd6c5; border-radius: 50%; background: white; color: #817969; font-size: .66rem; font-weight: 700; }.trade-step[aria-current="step"] { color: #66500c; font-weight: 700; }.trade-step[aria-current="step"] .step-number,.trade-step.done .step-number { border-color: var(--gold); background: var(--gold); color: #211a08; }.trade-panel { animation: route-in .2s ease-out; }.trade-panel h2 { margin: 0 0 .3rem; font-size: 1.12rem; }.trade-panel>p { margin: 0 0 1rem; color: var(--muted); font-size: .74rem; }.trade-toggle { margin-bottom: 1rem; }.amount-entry { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: .6rem; }.input-suffix { display: inline-flex; align-items: center; justify-content: center; min-width: 55px; height: 48px; border: 1px solid var(--line); border-radius: 11px; background: #faf8f2; color: #6c665a; font-size: .72rem; }.range-input { width: 100%; accent-color: var(--gold-dark); direction: ltr; }.range-endpoints { display: flex; justify-content: space-between; color: var(--muted); font-size: .61rem; }.quote-total { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; border: 1px solid #efe6ca; border-radius: 14px; background: #fffcf5; }.quote-total span { color: var(--muted); font-size: .72rem; }.quote-total strong { font-size: 1.15rem; }.review-grid { display: grid; gap: .55rem; padding: .85rem 0; }.review-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .45rem 0; border-bottom: 1px dashed #eee7d8; font-size: .75rem; }.review-row span { color: var(--muted); }.review-row strong { text-align: left; }.lock-timer { display: flex; align-items: center; gap: .65rem; padding: .65rem .8rem; border-radius: 12px; background: #fbf4dd; color: #70560c; font-size: .72rem; }.lock-ring { display: grid; flex: 0 0 auto; place-items: center; width: 34px; height: 34px; border: 2px solid var(--gold); border-radius: 50%; font-weight: 800; }.swipe-track { position: relative; overflow: hidden; min-height: 58px; margin-top: .8rem; border: 1px solid #d4c27e; border-radius: 15px; background: linear-gradient(90deg,#ead899,#f5ebc8); }.swipe-label { display: grid; min-height: 56px; place-items: center; padding: .3rem 3.5rem; color: #53410d; font-size: .75rem; font-weight: 750; text-align: center; pointer-events: none; }.swipe-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: .002; cursor: ew-resize; }.swipe-thumb { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 44px; height: 44px; border: 2px solid #fff9e6; border-radius: 12px; background: linear-gradient(140deg,#c9a227,#9a7b12); color: white; box-shadow: 0 3px 9px rgba(86,61,7,.25); pointer-events: none; transition: right .12s ease; }.swipe-thumb svg { width: 20px; height: 20px; transform: rotate(180deg); }.receipt-success { max-width: 530px; margin: 2rem auto; padding: 1.5rem; text-align: center; }.success-mark { display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto .9rem; border: 1px solid #ead79b; border-radius: 50%; background: radial-gradient(circle,#f9f0d1,#fffaf0); color: #93720f; box-shadow: 0 0 0 9px rgba(201,162,39,.08); }.success-mark svg { width: 38px; height: 38px; }.receipt-reference { display: inline-block; margin-top: .5rem; padding: .33rem .65rem; border-radius: 8px; background: #f7f4ec; direction: ltr; font-family: var(--font-numeric); font-size: .8rem; }
.profile-head { display: flex; align-items: center; gap: .85rem; padding: 1.1rem; }.profile-head .avatar { width: 54px; height: 54px; font-size: 1.15rem; }.profile-head h2 { margin: 0; font-size: .95rem; }.profile-head p { margin: .12rem 0 0; color: var(--muted); font-size: .71rem; }.settings-list { display: grid; }.settings-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; min-height: 62px; padding: .7rem .85rem; border-bottom: 1px solid #f0ede6; }.settings-row:last-child { border-bottom: 0; }.settings-row-main { display: flex; align-items: center; gap: .65rem; min-width: 0; }.settings-row-main strong { display: block; font-size: .77rem; }.settings-row-main small { display: block; color: var(--muted); font-size: .65rem; }
.install-app-row { width: 100%; border: 0; border-bottom: 1px solid #f0ede6; background: transparent; text-align: start; cursor: pointer; }
.switch { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; width: 44px; height: 26px; padding: 3px; border: 0; border-radius: 99px; background: #d9d5cc; cursor: pointer; transition: background .18s ease; }.switch::before { width: 20px; height: 20px; border-radius: 50%; background: white; content: ""; box-shadow: 0 1px 3px rgba(0,0,0,.17); transition: transform .18s ease; }.switch[aria-checked="true"] { background: var(--gold-dark); }.switch[aria-checked="true"]::before { transform: translateX(-18px); }.switch:disabled { opacity: .52; cursor: not-allowed; }
.admin-review-card { padding: 1rem; }.review-item { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(120px,.7fr) auto; gap: .8rem; align-items: center; padding: .8rem 0; border-bottom: 1px solid #f0ede5; }.review-item:last-child { border-bottom: 0; }.review-item-main { min-width: 0; }.review-item-main strong { display: block; font-size: .77rem; }.review-item-main small { display: block; color: var(--muted); font-size: .66rem; }.review-item-value { font-size: .73rem; font-weight: 750; }.admin-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.timeline { display: grid; gap: .85rem; }.timeline-row { display: grid; grid-template-columns: 15px minmax(0,1fr); gap: .62rem; }.timeline-pin { position: relative; display: flex; justify-content: center; }.timeline-pin::before { width: 9px; height: 9px; margin-top: .38rem; border: 2px solid #c9a227; border-radius: 50%; background: white; content: ""; }.timeline-row:not(:last-child) .timeline-pin::after { position: absolute; top: 17px; bottom: -14px; width: 1px; background: #e7dec6; content: ""; }.timeline-copy strong { display: block; font-size: .74rem; }.timeline-copy p { margin: .1rem 0 0; color: var(--muted); font-size: .67rem; }
.toggle-row { display: grid; grid-template-columns: minmax(180px,1fr) repeat(3,86px); gap: .4rem; align-items: center; padding: .68rem .5rem; border-bottom: 1px solid #f0ede5; font-size: .69rem; }.toggle-row.head { color: var(--muted); font-size: .64rem; font-weight: 700; }.toggle-cell { display: flex; justify-content: center; }
.dialog-backdrop { position: fixed; z-index: var(--z-backdrop); inset: 0; display: grid; place-items: center; padding: 1rem; background: rgba(34,29,18,.42); }.app-dialog { width: min(100%,480px); max-height: min(88vh,760px); overflow: auto; padding: 1.2rem; border: 1px solid #eee4c9; border-radius: 20px; background: white; box-shadow: var(--shadow-float); animation: dialog-in .2s ease-out; }.app-dialog h2 { margin: 0; font-size: 1.05rem; }.app-dialog p { color: var(--muted); font-size: .76rem; }.dialog-actions { display: flex; justify-content: flex-start; gap: .5rem; margin-top: 1rem; }
.sheet-backdrop { position: fixed; z-index: var(--z-backdrop); inset: 0; background: rgba(34,29,18,.36); }.bottom-sheet { position: fixed; z-index: var(--z-sheet); right: 50%; bottom: 0; width: min(100%,620px); max-height: 82vh; overflow: auto; padding: 1.2rem 1.25rem calc(1.35rem + env(safe-area-inset-bottom)); border: 1px solid #ece3cc; border-bottom: 0; border-radius: 24px 24px 0 0; background: white; box-shadow: var(--shadow-float); transform: translateX(50%); animation: sheet-in .28s cubic-bezier(.2,.8,.2,1); }.sheet-handle { width: 42px; height: 4px; margin: -.45rem auto .9rem; border-radius: 99px; background: #ded9cf; }
.toast-region { position: fixed; z-index: var(--z-toast); top: calc(.8rem + env(safe-area-inset-top)); right: 50%; display: grid; width: min(calc(100% - 1.4rem),430px); gap: .5rem; transform: translateX(50%); pointer-events: none; }.toast { display: flex; align-items: flex-start; gap: .55rem; padding: .72rem .85rem; border: 1px solid var(--line); border-radius: 13px; background: white; color: var(--ink); box-shadow: 0 10px 30px rgba(44,35,11,.16); font-size: .75rem; pointer-events: auto; animation: toast-in .2s ease-out; }.toast[data-tone="success"] { border-color: #c6e5d2; }.toast[data-tone="warning"] { border-color: #f1d9ad; }.toast[data-tone="error"] { border-color: #efc9c5; }.toast-icon { flex: 0 0 auto; color: var(--gold-dark); }.toast[data-tone="success"] .toast-icon { color: var(--success); }.toast[data-tone="error"] .toast-icon { color: var(--danger); }.toast-text { flex: 1; }.toast-close { border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.bottom-nav-spacer,.admin-empty,.install-button { display: none; }.notice-card { color: #64510f; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 3px rgba(156,255,191,.1); } 50% { box-shadow: 0 0 0 7px rgba(156,255,191,.03); } }
@keyframes spin { to { transform: rotate(360deg); } } @keyframes shimmer { to { background-position: -250% 0; } }
@keyframes route-in { from { opacity: .65; transform: translateX(8px); } to { opacity: 1; transform: translateX(0); } }
.route-screen { animation: route-in .18s ease-out both; }
@keyframes dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes sheet-in { from { opacity: .6; transform: translate(50%,24px); } to { opacity: 1; transform: translate(50%,0); } }
@keyframes toast-in { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1020px) { .topbar-inner,.page-wrap { width: min(100% - 2rem,88rem); }.topbar-inner { gap: .85rem; }.nav-link { padding-inline: .58rem; font-size: .78rem; }.dashboard-grid { grid-template-columns: minmax(0,1.3fr) minmax(250px,.8fr); }.admin-layout { grid-template-columns: 190px minmax(0,1fr); } }
@media (max-width: 760px) {
  body { font-size: 14px; }.topbar-inner { min-height: 64px; width: calc(100% - 1.25rem); gap: .45rem; }.brand { gap: .42rem; }.brand-mark { width: 35px; height: 35px; }.brand-copy strong { font-size: .93rem; }.brand-copy span { font-size: .56rem; }.desktop-nav { display: none; }.top-actions { gap: .15rem; }.user-chip { max-width: 115px; gap: .35rem; padding: .2rem; }.user-chip-text small { display: none; }.user-chip-text strong { font-size: .68rem; }.avatar { width: 33px; height: 33px; }.icon-button { width: 39px; height: 39px; }.mobile-menu-button { display: inline-grid; }
  .page-wrap { width: calc(100% - 1.1rem); padding: 1rem 0 calc(6.2rem + env(safe-area-inset-bottom)); }.page-heading { align-items: center; margin-bottom: .9rem; }.page-heading h1 { font-size: 1.23rem; }.page-heading p { font-size: .72rem; }
  .gold-hero { padding: 1.05rem 1rem .85rem; border-radius: 18px; }.price-grid { margin-top: .85rem; }.price-block { padding-inline: .65rem; }.price-block:first-child { padding-right: 0; }.price-value { font-size: clamp(1.25rem,6vw,1.72rem); }.price-kind { font-size: .69rem; }.price-foot { font-size: .59rem; }.chart-spark { width: 30%; opacity: .45; }.market-foot { margin-top: .65rem; padding-top: .55rem; font-size: .61rem; }
  .dashboard-grid { grid-template-columns: 1fr; gap: .75rem; margin-top: .75rem; }.main-stack,.side-stack { gap: .75rem; }.balance-card,.chart-card { padding: .95rem; }.balance-amount { font-size: 1.65rem; }.shortcut-grid { gap: .46rem; }.shortcut { min-height: 84px; padding: .58rem .2rem .5rem; border-radius: 13px; font-size: .63rem; }.shortcut-icon { width: 35px; height: 35px; border-radius: 11px; }.card { border-radius: 16px; }.card-pad { padding: .95rem; }
  .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .55rem; }.kpi-card { padding: .75rem; }.kpi-value { font-size: 1.05rem; }.admin-layout { grid-template-columns: 1fr; }.admin-sidebar { display: none; }.admin-main { gap: .75rem; }.admin-mobile-menu { display: inline-grid; }
  .mobile-nav { position: fixed; z-index: var(--z-header); right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); align-items: end; min-height: calc(62px + env(safe-area-inset-bottom)); padding: .25rem .25rem calc(.3rem + env(safe-area-inset-bottom)); border-top: 1px solid #e9e3d6; background: rgba(255,255,255,.96); box-shadow: 0 -7px 24px rgba(65,49,12,.06); backdrop-filter: blur(16px); }.mobile-nav-link { display: grid; justify-items: center; align-content: center; gap: .08rem; min-height: 48px; padding: .1rem; border: 0; border-radius: 10px; background: transparent; color: #817a6c; font-size: .59rem; cursor: pointer; }.mobile-nav-link svg { width: 20px; height: 20px; }.mobile-nav-link[aria-current="page"] { color: #8a690b; font-weight: 750; }.mobile-nav-trade { position: relative; top: -13px; }.mobile-nav-trade .trade-fab { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: .05rem; border: 3px solid white; border-radius: 50%; background: linear-gradient(145deg,#d9b444,#a77d0c); color: #fff; box-shadow: 0 4px 11px rgba(114,83,7,.27); }.mobile-nav-trade .trade-fab svg { width: 21px; height: 21px; }.bottom-nav-spacer { display: block; height: 2rem; }
  .auth-shell { grid-template-columns: 1fr; min-height: 100vh; }.auth-brand-panel { display: none; }.auth-form-panel { align-items: start; padding: max(2.5rem,env(safe-area-inset-top)) 1.2rem 2rem; }.auth-form { margin: 0 auto; }.auth-form h2 { font-size: 1.3rem; }.form-grid { grid-template-columns: 1fr; }
  .trade-card { padding: .95rem; }.trade-keypad { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .4rem; }.trade-step { gap: .3rem; font-size: .6rem; }.step-number { width: 24px; height: 24px; }.review-item { grid-template-columns: minmax(0,1fr) auto; }.review-item-value { grid-column: 1; }.admin-actions { grid-column: 1/-1; justify-content: flex-start; }.toggle-row { grid-template-columns: minmax(145px,1fr) repeat(3,62px); font-size: .63rem; }.filter-row { align-items: stretch; }.search-box { min-width: min(100%,230px); flex: 1; }.filter-tools { width: 100%; }.filter-tools select { flex: 1; }.pagination { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 430px) { .topbar-inner { min-height: 59px; }.brand-copy span { display: none; }.top-actions .user-chip-text { display: none; }.top-actions .user-chip { padding: 0; }.gold-hero-head { gap: .5rem; }.market-icon { width: 35px; height: 35px; }.market-label h2 { font-size: .84rem; }.live-pill { padding-inline: .4rem; font-size: .59rem; }.price-value { font-size: 1.28rem; }.price-value small { font-size: .59rem; }.price-foot { align-items: flex-start; flex-direction: column; gap: .2rem; }.price-block { padding-inline: .48rem; }.activity-row { grid-template-columns: 34px minmax(0,1fr) auto; gap: .5rem; }.activity-icon { width: 33px; height: 33px; }.activity-value { font-size: .65rem; }.page-heading .button { min-height: 40px; padding-inline: .65rem; font-size: .7rem; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }.route-screen { transform: none !important; } }
@media print { .topbar,.mobile-nav,.button,.filter-row,.toast-region,.skip-link { display: none !important; } body { background: white; }.page-wrap { width: 100%; padding: 0; }.card { box-shadow: none; break-inside: avoid; }.table-frame { overflow: visible; } }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; clip-path: inset(50%) !important; }
.segmented { display: flex; gap: .25rem; width: 100%; padding: .25rem; border: 1px solid var(--line); border-radius: 13px; background: #f5f3ee; }
.segment-option { display: inline-flex; flex: 1; justify-content: center; align-items: center; gap: .4rem; min-height: 44px; border-radius: 10px; color: var(--muted); font-size: .76rem; font-weight: 700; text-decoration: none; }
.segment-option.is-active { background: white; box-shadow: 0 2px 7px rgba(49,38,9,.1); color: var(--ink); }
.segment-option.is-buy { color: var(--success); }.segment-option.is-sell { color: var(--danger); }
.segment-option.is-disabled { cursor: not-allowed; opacity: .55; }
.definition-list { display: grid; gap: .15rem; margin: 0 0 1rem; }
.definition-list>div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .85rem .1rem; border-bottom: 1px solid var(--line); }
.definition-list dt { color: var(--muted); font-size: .77rem; }.definition-list dd { margin: 0; font-size: .82rem; font-weight: 700; text-align: left; }
.is-busy { opacity: .75; cursor: progress !important; }.is-busy::after { display: inline-block; width: 13px; height: 13px; margin-inline-start: .45rem; border: 2px solid currentColor; border-left-color: transparent; border-radius: 50%; content: ""; vertical-align: -2px; animation: spin .7s linear infinite; }
.price-flash { animation: price-tint .75s ease-out; }
@keyframes price-tint { 0% { filter: brightness(1.13); } 100% { filter: none; } }
.dialog-close { float: left; }
.dialog-copy { margin-top: .6rem; }
.dialog-extra .field { margin-top: .8rem; }
.admin-menu-open .admin-sidebar { display: grid; }
.contact-fab { position: fixed; z-index: calc(var(--z-header) - 1); left: max(1.2rem,env(safe-area-inset-left)); bottom: 1.2rem; display: inline-flex; align-items: center; gap: .4rem; min-height: 46px; padding: .55rem .85rem; border: 1px solid #e6d8ad; border-radius: 999px; background: #fff; color: #73580b; box-shadow: 0 8px 24px rgba(70,53,9,.15); font-size: .72rem; font-weight: 750; cursor: pointer; }
.contact-fab svg { width: 19px; height: 19px; }
.mobile-contact { display: none; }
.mobile-contact-icon { width: 19px; height: 19px; }
.push-activation-prompt { position: fixed; z-index: calc(var(--z-header) - 1); top: calc(78px + env(safe-area-inset-top)); right: max(.9rem,env(safe-area-inset-right)); display: grid; gap: .55rem; width: min(370px,calc(100vw - 1.8rem)); padding: .9rem; border: 1px solid #e9dfc5; border-radius: 16px; background: rgba(255,255,255,.98); box-shadow: 0 14px 38px rgba(49,38,10,.18); animation: prompt-in .2s ease-out; }
.push-prompt-head { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.push-prompt-symbol { display: grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border: 1px solid #eee2bf; border-radius: 12px; background: #fbf5e3; color: #84680d; }
.push-prompt-symbol svg { width: 20px; height: 20px; }
.push-prompt-heading { flex: 1; min-width: 0; color: var(--ink); font-size: .78rem; font-weight: 750; }
.push-prompt-close { display: grid; flex: 0 0 auto; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); cursor: pointer; }
.push-prompt-close:hover { background: #f5f2ea; color: var(--ink); }
.push-prompt-close svg { width: 17px; height: 17px; }
.push-prompt-copy { margin: 0; color: var(--muted); font-size: .69rem; line-height: 1.7; }
.push-prompt-action { justify-self: start; min-height: 40px; padding-inline: .85rem; font-size: .69rem; }
@keyframes prompt-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.notification-template { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .45rem .7rem; grid-column: 1/-1; padding: .6rem .2rem .8rem; border-bottom: 1px solid var(--line); }
.notification-template label { color: var(--muted); font-size: .67rem; font-weight: 700; }
.notification-template textarea { grid-column: 1; min-height: 48px; padding: .55rem .65rem; border: 1px solid var(--line); border-radius: 10px; background: white; font-size: .72rem; resize: vertical; }
.notification-template .field-hint { grid-column: 1/-1; margin: 0; }
.notification-template button { grid-column: 2; grid-row: 2; }
@media (max-width:760px) { .mobile-contact { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: .32rem; min-height: 36px; padding: .35rem .58rem; border: 1px solid #e8ddbd; border-radius: 999px; background: #fff; color: #765a0b; box-shadow: 0 2px 7px rgba(70,53,9,.06); font-size: .66rem; font-weight: 750; cursor: pointer; transition: background .16s ease,border-color .16s ease,transform .16s ease; }.mobile-contact:hover { border-color: #d5bd70; background: #fffdf7; }.mobile-contact:active { transform: scale(.96); }.mobile-contact:focus-visible,.contact-fab:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }.mobile-nav-link .mobile-nav-icon { width: 22px; height: 22px; stroke: currentColor; }.contact-fab { display: none; }.mobile-nav-link[aria-current="page"]:not(.mobile-nav-trade) { background: #fbf7eb; }.mobile-nav-trade .trade-fab { border: 2px solid #e9d795; background: #fff; color: #765a0b; }.mobile-nav-trade .trade-fab .mobile-trade-icon { width: 22px; height: 22px; stroke: currentColor; }.notification-template { grid-column: 1/-1; }.admin-menu-open .admin-sidebar { display: grid; } }
@media (max-width: 760px) {
  #app.admin-menu-open > .app-shell > .route-screen {
    animation: none;
    transform: none;
  }

  #app.admin-menu-open::before {
    position: fixed;
    z-index: var(--z-backdrop);
    inset: 64px 0 0;
    background: rgba(34,29,18,.34);
    content: "";
  }

  #app.admin-menu-open .admin-sidebar {
    position: fixed;
    z-index: var(--z-sheet);
    top: calc(64px + .5rem);
    right: .75rem;
    bottom: max(.75rem,env(safe-area-inset-bottom));
    display: grid;
    align-content: start;
    grid-auto-rows: min-content;
    gap: .3rem;
    width: min(82vw,300px);
    overflow: auto;
    overscroll-behavior: contain;
    padding: .75rem;
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--shadow-float);
  }

  #app.admin-menu-open .admin-sidebar .nav-link {
    justify-content: flex-start;
    width: 100%;
    min-height: 48px;
    padding: .65rem .75rem;
  }
}

@media (max-width: 430px) {
  #app.admin-menu-open::before { top: 59px; }
  #app.admin-menu-open .admin-sidebar { top: calc(59px + .5rem); }
}

/* Shared full Nab Tala mark */
.brand { gap: 0; }
.brand-mark { width: 72px; height: 72px; object-fit: contain; }
.auth-logo img { width: min(62%,330px); height: auto; max-height: 42vh; object-fit: contain; filter: drop-shadow(0 12px 17px rgba(145,108,12,.19)); }
.auth-login-art-mobile { display: none; }
@media (max-width: 760px) {
  .brand-mark { width: 60px; height: 60px; }
  .auth-login-art-mobile { display: block; width: min(35vw,145px); height: 150px; margin: 0 auto .45rem; object-fit: contain; filter: drop-shadow(0 9px 13px rgba(145,108,12,.14)); }
}
@media (max-width: 430px) {
  .brand-mark { width: 54px; height: 54px; }
  .auth-login-art-mobile { width: min(34vw,128px); height: 132px; }
}

/* Trade page: keep the heading centered and the order flow comfortably sized. */
.trade-page-heading {
  display: block;
  margin-bottom: 1.15rem;
  text-align: center;
}
.trade-page-heading > div {
  width: min(100%, 52rem);
  margin-inline: auto;
}
.trade-card {
  width: 100%;
  max-width: 800px;
  padding: clamp(1rem, 2.5vw, 1.75rem);
}
.trade-stepper,
.trade-panel {
  width: min(100%, 660px);
  margin-inline: auto;
}
.trade-stepper { margin-bottom: 1.4rem; }
.trade-step { min-width: 0; white-space: nowrap; }
.trade-panel { min-width: 0; }
.trade-panel .form-stack { min-width: 0; }
.balance-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .8rem;
  margin: .1rem 0 .85rem;
  padding: .7rem .85rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.balance-inline span { color: var(--muted); font-size: .72rem; }
.balance-inline strong { max-width: 100%; font-size: .8rem; overflow-wrap: anywhere; }
.trade-panel .quote-total { margin-top: .75rem; }
.trade-panel .quote-total strong { min-width: 0; text-align: left; overflow-wrap: anywhere; }
.trade-panel .chart-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: baseline;
  gap: .35rem .8rem;
  margin-top: .65rem;
  padding: .75rem .85rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.trade-panel .chart-summary strong { min-width: 0; color: var(--ink); font-size: .78rem; overflow-wrap: anywhere; }
.trade-panel .form-actions {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: .6rem;
}
.trade-panel .form-actions > * { min-width: 0; }
.trade-panel .review-row strong { min-width: 0; overflow-wrap: anywhere; }
.lock-timer > span:last-child { min-width: 0; line-height: 1.65; }
.swipe-label { line-height: 1.55; }
.trade-form-error:not(:empty) {
  display: grid;
  justify-items: start;
  gap: .65rem;
  margin: .85rem 0;
  padding: .8rem .9rem;
  border: 1px solid #f0ceca;
  border-radius: 12px;
  background: #fff6f4;
  color: #863f39;
  font-size: .75rem;
  line-height: 1.7;
}
.trade-form-error .button { min-height: 40px; }

@media (max-width: 760px) {
  .trade-page-heading { margin-bottom: .85rem; }
  .trade-page-heading h1 { font-size: 1.22rem; }
  .trade-page-heading p { max-width: 31rem; margin-inline: auto; line-height: 1.7; }
  .trade-card { padding: .9rem; }
  .trade-stepper { margin-bottom: 1.05rem; }
  .trade-panel h2 { font-size: 1.02rem; }
  .trade-panel > p { margin-bottom: .85rem; line-height: 1.7; }
  .trade-panel .form-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trade-panel .form-actions .button { padding-inline: .55rem; font-size: .73rem; }
  .quote-total { gap: .45rem; padding: .75rem .8rem; }
  .trade-panel .quote-total strong { font-size: clamp(.88rem, 4vw, 1.05rem); }
  .swipe-label { padding-inline: 3.2rem; font-size: .69rem; }
}
@media (max-width: 360px) {
  .trade-card { padding: .72rem; }
  .trade-step { gap: .22rem; font-size: .56rem; }
  .step-number { width: 22px; height: 22px; }
  .trade-panel .form-actions { grid-template-columns: 1fr; }
}

/* Wallet top-up history makes each receipt's review outcome easy to find. */
.deposit-history-link { width: min(100%, 510px); margin: .8rem auto 0; }
.deposit-history-list { display: grid; gap: .7rem; }
.deposit-history-item { min-width: 0; padding: .85rem; border: 1px solid var(--line); border-radius: 14px; background: #fffefa; }
.deposit-history-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .65rem; }
.deposit-history-title { display: grid; min-width: 0; gap: .12rem; }
.deposit-history-title strong { font-size: .77rem; }
.deposit-history-title small { color: var(--muted); font-size: .65rem; }
.deposit-history-title bdi { color: #5e584c; }
.deposit-history-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem .8rem; margin: .75rem 0 0; padding-top: .65rem; border-top: 1px solid #f0ede5; }
.deposit-history-meta div { display: grid; min-width: 0; gap: .12rem; }
.deposit-history-meta dt { color: var(--muted); font-size: .63rem; }
.deposit-history-meta dd { min-width: 0; margin: 0; font-size: .7rem; font-weight: 650; overflow-wrap: anywhere; }
.deposit-history-status { margin: .7rem 0 0; padding: .55rem .65rem; border-radius: 10px; background: #fff7e7; color: #79580b; font-size: .68rem; line-height: 1.7; }
.deposit-history-status.is-approved { background: #edf7f0; color: #176c42; }
.deposit-rejection-note { margin-top: .7rem; padding: .65rem .75rem; border: 1px solid #f0ceca; border-radius: 10px; background: #fff6f4; color: #863f39; }
.deposit-rejection-note strong { display: block; font-size: .69rem; }
.deposit-rejection-note p { margin: .18rem 0 0; font-size: .69rem; line-height: 1.75; overflow-wrap: anywhere; }
.deposit-admin-rejection { color: #963a34 !important; }
.deposit-admin-rejection strong { color: #963a34; }
@media (max-width: 760px) {
  .deposit-history-item { padding: .72rem; }
  .deposit-history-head { align-items: center; }
  .deposit-history-head .status-pill { flex: 0 0 auto; }
}

/* Shared layout and interaction refinements */
html { min-width: 0; }
.page-wrap { min-inline-size: 0; }
.page-heading, .card-title-row, .filter-tools, .dialog-actions { flex-wrap: wrap; }
.field input, .field textarea, .field select { min-inline-size: 0; }
.password-wrap input { padding-inline-end: 3rem; }
.password-toggle { inset-inline-end: .35rem; inset-block-start: 50%; transform: translateY(-50%); }
.field-error:empty, .form-error:empty { display: none; }
.form-error:not(:empty) { color: #863f39; overflow-wrap: anywhere; }
.review-item-main, .settings-row-main, .timeline-copy { overflow-wrap: anywhere; }
.table-frame { max-inline-size: 100%; overscroll-behavior-inline: contain; }
.app-dialog { max-height: min(88dvh, 760px); overscroll-behavior: contain; }
.route-screen { animation: page-arrival .23s cubic-bezier(.2,.75,.25,1); }
@keyframes page-arrival { from { opacity: .65; translate: 0 5px; } to { opacity: 1; translate: 0 0; } }
.page-wrap[aria-busy="true"] { cursor: progress; opacity: .72; transition: opacity .18s ease; }
.button.is-busy { color: transparent; }
.button.is-busy::after { content: ""; position: absolute; inline-size: 1em; block-size: 1em; border: 2px solid var(--ink); border-inline-end-color: transparent; border-radius: 50%; animation: spin .65s linear infinite; }
@media (max-width: 760px) {
  .field input, .field select, .field textarea { font-size: 16px; }
  .filter-tools > *, .deposit-history-head > * { max-inline-size: 100%; }
  .filter-tools select { min-inline-size: 0; }
  .definition-list > div { flex-wrap: wrap; gap: .35rem .75rem; }
  .deposit-history-head, .settings-row { flex-wrap: wrap; }
  .notification-template { grid-template-columns: minmax(0,1fr); }
  .notification-template button { grid-column: 1; grid-row: auto; justify-self: start; }
  .admin-topline { flex-wrap: wrap; }
}

/* Nab Tala visual polish: stronger hierarchy, calm depth, and consistent touch states. */
body {
  background:
    radial-gradient(ellipse at 92% -10rem, rgba(222,190,91,.12), transparent 34rem),
    var(--paper);
}
.topbar {
  border-bottom-color: rgba(222,214,194,.72);
  background: rgba(255,253,248,.94);
  box-shadow: 0 5px 22px rgba(68,51,13,.035);
}
.topbar-inner { gap: clamp(.7rem,1.5vw,1.5rem); }
.brand-mark { width: 64px; height: 64px; }
.brand-copy strong { font-size: 1.08rem; letter-spacing: -.025em; }
.desktop-nav { gap: .2rem; }
.nav-link {
  position: relative;
  min-height: 42px;
  padding-inline: .72rem;
  border-radius: 12px;
  transition: color .2s ease, background .2s ease, transform .2s ease;
}
.nav-link:hover { transform: translateY(-1px); background: #f5efdf; }
.nav-link[aria-current="page"] { background: #f2e9cd; color: #614900; }
.page-wrap { padding-top: clamp(1.15rem,2vw,1.8rem); }
.page-heading { margin-bottom: 1.45rem; }
.page-heading h1 {
  display: flex;
  align-items: center;
  gap: .58rem;
  letter-spacing: -.035em;
}
.page-heading h1::before {
  width: 4px;
  height: 1.08em;
  flex: 0 0 auto;
  border-radius: 99px;
  background: linear-gradient(180deg,var(--gold-light),var(--gold-dark));
  content: "";
}
.trade-page-heading h1 { justify-content: center; }
.page-heading p { max-width: 60ch; line-height: 1.8; }
.card {
  border-color: #e9e2d3;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.card-title-row { margin-bottom: 1rem; }
.gold-hero {
  border-color: rgba(255,255,255,.4);
  border-radius: 25px;
  background: linear-gradient(118deg,#80610e 0%,#aa8115 36%,#c9a12b 72%,#d8b74e 100%);
  box-shadow: 0 18px 40px rgba(113,83,8,.2), inset 0 1px 0 rgba(255,255,255,.22);
}
.gold-hero::before { opacity: .4; }
.market-icon { border-radius: 15px; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.price-grid { gap: .2rem; }
.price-block { padding-block: .28rem; }
.price-kind { font-weight: 650; }
.price-value { text-shadow: 0 2px 14px rgba(50,35,3,.14); }
.price-change { box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.balance-card { border-color: #e8dfc9; background: linear-gradient(135deg,#fff 0%,#fff 62%,#fffaf0 100%); }
.balance-mini { border-color: #ebe5d8; background: rgba(255,255,255,.9); }
.shortcut { min-height: 104px; border-color: #ebe5d8; border-radius: 17px; }
.shortcut:hover { border-color: #d9c57f; box-shadow: 0 12px 24px rgba(94,71,10,.11); }
.shortcut-icon { border: 1px solid rgba(201,162,39,.1); }
.chart-card, .activity-card { background: linear-gradient(160deg,#fff 0%,#fffefa 100%); }
.chart-svg { height: 205px; }
.home-chart-card { padding: 1.05rem; }
.home-chart-head { display: flex; align-items: center; justify-content: space-between; gap: .9rem; margin-bottom: .85rem; }
.home-chart-title { display: flex; align-items: center; gap: .68rem; min-width: 0; }
.home-chart-mark { display: grid; flex: 0 0 auto; place-items: center; width: 39px; height: 39px; border: 1px solid #efe4bd; border-radius: 13px; background: linear-gradient(145deg,#fffaf0,#f7f0dd); color: #8c6b10; }
.home-chart-mark svg { width: 20px; height: 20px; }
.home-chart-title small { display: block; margin-bottom: .08rem; color: #907313; font-size: .59rem; font-weight: 750; }
.home-chart-title h2 { margin: 0; color: var(--ink); font-size: .9rem; letter-spacing: -.015em; }
.home-chart-title p { margin: .16rem 0 0; color: var(--muted); font-size: .65rem; line-height: 1.6; }
.home-chart-link { flex: 0 0 auto; min-height: 36px; padding: .38rem .58rem; border: 1px solid #eee7d7; border-radius: 11px; background: #fff; font-size: .65rem; white-space: nowrap; }
.home-chart-link svg { width: 14px; height: 14px; }
.home-chart-stage { overflow: hidden; padding: .35rem .45rem .12rem; border: 1px solid #f0eadc; border-radius: 15px; background: linear-gradient(180deg,#fbfaf6 0%,#fff 100%); }
.home-chart-stage-meta { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .12rem .38rem 0; color: #686254; font-size: .62rem; }
.home-chart-stage-meta span { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; }
.home-chart-stage-meta i,.home-chart-quote-label i { width: 7px; height: 7px; border-radius: 50%; background: var(--gold-dark); box-shadow: 0 0 0 3px rgba(154,123,18,.1); }
.home-chart-stage-meta small { color: #8d877a; font-size: .58rem; }
.home-chart-card .chart-svg { height: 176px; margin-top: .18rem; }
.home-chart-card .chart-gridline { stroke: #e9e3d5; stroke-dasharray: 2 5; }
.home-chart-card .chart-line { stroke: #b78912; stroke-width: 3; }
.home-chart-card .chart-dot { fill: #fff; stroke: #9d7611; stroke-width: 3; }
.home-chart-card .chart-axis-label { fill: #827b6c; font-size: 9px; }
.home-chart-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem; margin-top: .65rem; }
.home-chart-quote { min-width: 0; padding: .58rem .72rem; border: 1px solid #eee9de; border-radius: 12px; background: #fff; }
.home-chart-quote-label { display: flex; align-items: center; gap: .42rem; color: #777164; font-size: .61rem; }
.home-chart-quote.buy .home-chart-quote-label i { background: var(--success); box-shadow: 0 0 0 3px rgba(22,138,84,.1); }
.home-chart-quote.sell .home-chart-quote-label i { background: var(--danger); box-shadow: 0 0 0 3px rgba(200,75,75,.1); }
.home-chart-quote strong { display: flex; align-items: baseline; gap: .28rem; margin-top: .18rem; color: var(--success); font-size: .84rem; line-height: 1.5; }
.home-chart-quote.sell strong { color: var(--danger); }
.home-chart-quote strong small { color: #8a8579; font-size: .58rem; font-weight: 550; }
.activity-row { transition: background .18s ease; }
.activity-row:hover { background: #fffdf8; }
.button {
  min-height: 48px;
  border-radius: 13px;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.button-primary {
  background: linear-gradient(135deg,#d5b23e 0%,#c29a20 100%);
  box-shadow: 0 7px 16px rgba(154,123,18,.17), inset 0 1px 0 rgba(255,255,255,.28);
}
.button-primary:hover { background: linear-gradient(135deg,#dfc15d 0%,#caa52f 100%); box-shadow: 0 10px 22px rgba(154,123,18,.2); }
.button-outline { border-color: #e7dfcf; box-shadow: 0 2px 7px rgba(60,48,20,.025); }
.field input, .field select, .field textarea, .text-input {
  border-color: #e6dfd1;
  border-radius: 13px;
  background: #fffefa;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.field input:hover, .field select:hover, .field textarea:hover { border-color: #cbb76e; background: #fff; }
.field input:focus, .field select:focus, .field textarea:focus {
  border-color: #bd941b;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(201,162,39,.13);
}
.field input:-webkit-autofill, .field input:-webkit-autofill:hover, .field input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink);
  box-shadow: 0 0 0 1000px #fffefa inset;
  transition: background-color 9999s ease-out 0s;
}
.field label { color: #514b3f; font-weight: 700; }
.field-hint { line-height: 1.75; }
.form-error:not(:empty), .trade-form-error:not(:empty) { border-radius: 14px; }
.range-tabs { border: 1px solid #eee9de; background: #f8f6f0; }
.range-tab[aria-pressed="true"] { color: #604900; box-shadow: 0 2px 8px rgba(55,43,13,.1); }
.table-frame { border: 1px solid #eee9de; border-radius: 14px; background: #fff; }
table { border-collapse: separate; border-spacing: 0; }
th { background: #faf8f2; }
tbody tr { transition: background .16s ease; }
tbody tr:hover { background: #fffdf7; }
.kpi-card { border-color: #e9e2d3; background: linear-gradient(145deg,#fff 0%,#fffefa 100%); }
.admin-sidebar { border-color: #e9e2d3; background: rgba(255,255,255,.9); }
.admin-sidebar .nav-link { min-height: 46px; border-radius: 12px; }
.admin-sidebar .nav-link[aria-current="page"] { background: #f4edda; color: #604900; }
.admin-topline { align-items: flex-start; }
.settings-row, .admin-user-row, .review-item { border-radius: 14px; }
.trade-card { border-color: #e7dfcf; box-shadow: 0 16px 40px rgba(71,55,15,.075); }
.trade-step[aria-current="step"] .step-number, .trade-step.done .step-number { box-shadow: 0 0 0 4px rgba(201,162,39,.13); }
.quote-total { border-color: #eadcae; background: linear-gradient(120deg,#fffdf7,#fcf5df); }
.app-dialog { border-radius: 22px; box-shadow: 0 24px 70px rgba(38,30,11,.24); }
.dialog-backdrop { background: rgba(34,29,18,.48); }
.toast { border-radius: 14px; box-shadow: 0 12px 32px rgba(37,30,12,.17); }
.mobile-nav { border-top-color: rgba(228,220,202,.9); box-shadow: 0 -8px 28px rgba(65,49,12,.075); }
.mobile-nav-link[aria-current="page"] { color: #725607; }
.contact-fab { box-shadow: 0 10px 25px rgba(70,53,9,.13); transition: transform .18s ease, box-shadow .18s ease; }
.contact-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(70,53,9,.17); }
.auth-shell { background: #fffefa; }
.auth-brand-panel {
  background:
    radial-gradient(ellipse at 76% 73%,rgba(232,200,96,.42),transparent 36%),
    linear-gradient(145deg,#fffdf8 0%,#f7efd9 100%);
}
.auth-brand-copy h1 { letter-spacing: -.035em; }
.auth-form-panel { background: linear-gradient(145deg,#fffefa 0%,#fbf8f1 100%); }
.auth-form { padding: clamp(1.35rem,3vw,2rem); border: 1px solid #eee8dc; border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 18px 48px rgba(72,55,12,.08); }
.auth-form h2 { letter-spacing: -.03em; }
.auth-switch { border-top-color: #eee9df; }
@media (min-width: 761px) {
  .auth-shell { min-height: 100svh; }
  .auth-brand-panel { min-height: 100svh; }
  .auth-form-panel { padding: clamp(2rem,5vw,5rem); }
}
@media (max-width: 760px) {
  body { background: #fbf8f1; }
  .topbar-inner { min-height: 64px; }
  .brand-mark { width: 58px; height: 58px; }
  .page-wrap { padding-top: 1rem; }
  .page-heading { align-items: flex-start; gap: .65rem; margin-bottom: 1rem; }
  .page-heading h1 { font-size: 1.22rem; }
  .card { border-radius: 17px; }
  .gold-hero { border-radius: 20px; box-shadow: 0 14px 28px rgba(113,83,8,.16); }
  .shortcut { min-height: 88px; }
  .chart-svg { height: 175px; }
  .home-chart-card { padding: .82rem; }
  .home-chart-head { align-items: flex-start; gap: .45rem; margin-bottom: .7rem; }
  .home-chart-mark { width: 34px; height: 34px; border-radius: 11px; }
  .home-chart-mark svg { width: 18px; height: 18px; }
  .home-chart-title { gap: .5rem; }
  .home-chart-title h2 { font-size: .82rem; }
  .home-chart-title p { max-width: 26ch; font-size: .59rem; }
  .home-chart-link { min-height: 32px; padding: .32rem .44rem; font-size: .59rem; }
  .home-chart-link svg { width: 12px; height: 12px; }
  .home-chart-stage { padding-inline: .22rem; }
  .home-chart-card .chart-svg { height: 158px; }
  .home-chart-summary { gap: .42rem; }
  .home-chart-quote { padding: .52rem .58rem; }
  .home-chart-quote strong { font-size: .75rem; }
  .button { min-height: 46px; }
  .auth-form-panel { padding: max(1.25rem,env(safe-area-inset-top)) .85rem calc(1.25rem + env(safe-area-inset-bottom)); }
  .auth-form { width: min(100%,460px); padding: 1.2rem; border-radius: 21px; box-shadow: 0 12px 32px rgba(72,55,12,.065); }
  .auth-login-art-mobile { width: 96px; height: 105px; margin-bottom: .3rem; filter: drop-shadow(0 6px 8px rgba(145,108,12,.12)); }
  .auth-form h2 { font-size: 1.28rem; }
  .auth-form > p { margin-bottom: 1.05rem; }
  .admin-sidebar { border-radius: 18px; }
}
@media (max-width: 430px) {
  .brand-mark { width: 52px; height: 52px; }
  .home-chart-head { flex-wrap: wrap; }
  .home-chart-link { margin-inline-start: 2.1rem; }
  .price-value { letter-spacing: -.025em; }
  .auth-form { padding: 1rem; }
  .auth-login-art-mobile { width: 88px; height: 94px; }
  .auth-switch { gap: .55rem; font-size: .68rem; }
}
@media (prefers-reduced-motion: reduce) {
  .card, .shortcut, .contact-fab, .nav-link { transition: none; }
}

/* Price card: white surface with immediate buy/sell color recognition. */
.gold-hero {
  border: 1px solid #e8e1d2;
  border-radius: 24px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 12px 30px rgba(71,55,15,.065);
}
.gold-hero::before {
  background: radial-gradient(ellipse at 5% 100%,rgba(201,162,39,.09),transparent 48%);
  opacity: 1;
}
.gold-hero::after {
  right: 8%;
  bottom: -76px;
  border-color: rgba(201,162,39,.12);
}
.gold-hero-head, .price-grid, .reference-price, .market-foot { position: relative; z-index: 1; }
.market-label h2 { color: #2f2b23; }
.market-label p { color: var(--muted); }
.market-icon {
  border-color: #eadcae;
  background: #fff9e8;
  color: #8b690c;
}
.live-pill {
  border-color: #e8dfc9;
  background: #faf8f2;
  color: #6b5614;
}
.price-grid { gap: .65rem; }
.price-block {
  padding: .72rem .82rem;
  border: 1px solid #eee9df;
  border-radius: 16px;
  background: #fffefa;
}
.price-block + .price-block { border-inline-start: 1px solid #eee9df; }
.price-kind { color: #6d675b; font-weight: 700; }
.price-block:first-child .price-kind, .price-block:first-child .price-kind svg { color: #137044; }
.price-block:nth-child(2) .price-kind, .price-block:nth-child(2) .price-kind svg { color: #a9363e; }
.price-value { text-shadow: none; }
.price-block:first-child .price-value { color: #137044; }
.price-block:nth-child(2) .price-value { color: #b23f45; }
.price-value small { color: currentColor; opacity: .74; }
.price-foot { color: #77736b; }
.price-discount-field { width: min(100%, 28rem); }
.sell-discount-note { display: block; margin-top: -.2rem; }
.percent-input-wrap { position: relative; }
.percent-input-wrap input { padding-inline-end: 2.7rem; }
.percent-input-wrap > span { position: absolute; inset-inline-end: .9rem; top: 50%; color: var(--muted); font-size: .9rem; transform: translateY(-50%); pointer-events: none; }
.price-change { background: #eaf6ee; color: #176c42; }
.price-change.down { background: #fff0ed; color: #a83e3e; }
.reference-price {
  border-color: #eee6d3;
  background: #faf8f2;
  color: #4a453b;
}
.reference-price small { color: #77736b; }
.reference-price a { color: #75580c; }
.market-foot { border-top-color: #eee9df; color: #77736b; }
.chart-spark { opacity: .55; }
.chart-spark path { stroke: rgba(154,123,18,.32); }
.gold-hero .chart-spark { display: none; }
@media (max-width: 760px) {
  .gold-hero { padding: 1rem .9rem .85rem; }
  .price-grid { gap: .4rem; }
  .price-block { padding: .62rem .5rem; border-radius: 13px; }
}
@media (max-width: 430px) {
  .price-grid { gap: .32rem; }
  .price-block { padding-inline: .38rem; }
}

/* Wallet balance card: clear hierarchy and a dedicated, reliable visibility control. */
.balance-card {
  padding: 1.1rem 1.15rem 1rem;
  border-color: #e8e1d2;
  background: linear-gradient(145deg,#fff 0%,#fff 68%,#fffaf0 100%);
}
.balance-card::after { display: none; }
.balance-top { margin-bottom: .22rem; }
.balance-top .label { color: #716b5e; font-weight: 700; }
.balance-top .label .icon { color: #9b7813; }
.balance-visibility {
  z-index: 2;
  width: 42px;
  height: 42px;
  border: 1px solid #e9dfc1;
  background: #fffdf7;
  color: #80610e;
  cursor: pointer;
}
.balance-visibility:hover { border-color: #d8c47d; background: #fff8e6; }
.balance-visibility[aria-pressed="true"] { border-color: #e6d69f; background: #f8f1dd; }
.balance-visibility svg { width: 19px; height: 19px; }
.balance-amount {
  margin-top: .28rem;
  padding-bottom: .68rem;
  border-bottom: 1px solid #f0ece3;
  color: #302b20;
  font-size: clamp(1.45rem,2.4vw,1.9rem);
  letter-spacing: -.025em;
  line-height: 1.45;
}
.balance-unit { margin-inline-start: .12rem; font-size: .68rem; }
.balance-subgrid { gap: .62rem; margin-top: .72rem; }
.balance-mini {
  display: grid;
  align-content: center;
  gap: .22rem;
  min-width: 0;
  min-height: 59px;
  padding: .62rem .75rem;
  border-color: #eee8dc;
  border-radius: 14px;
  background: rgba(255,255,255,.94);
}
.balance-mini > span { color: #858071; font-size: .63rem; }
.balance-mini strong { min-width: 0; margin-top: 0; color: #383329; font-size: .86rem; line-height: 1.45; }
.balance-mini strong small { color: #817b6e; font-size: .63rem; font-weight: 500; }
@media (max-width: 760px) {
  .balance-card { padding: .88rem; }
  .balance-amount { padding-bottom: .58rem; font-size: 1.48rem; }
  .balance-subgrid { gap: .45rem; margin-top: .6rem; }
  .balance-mini { min-height: 54px; padding: .55rem .6rem; }
}
@media (max-width: 430px) {
  .balance-card { padding: .75rem; }
  .balance-visibility { width: 40px; height: 40px; }
  .balance-amount { font-size: 1.35rem; }
  .balance-mini > span { font-size: .58rem; }
  .balance-mini strong { font-size: .73rem; }
  .balance-mini strong small { font-size: .57rem; }
}

/* Keep the buy and sell quote content centered inside each price card. */
.gold-hero .price-block { text-align: center; }
.gold-hero .price-kind { justify-content: center; }
.gold-hero .price-value { justify-content: center; }
.gold-hero .price-foot { align-items: center; justify-content: center; flex-direction: column; gap: .25rem; text-align: center; }

/* Live Persian amount spelling, trading availability and admin hours. */
.amount-words { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 1.15em; overflow-x: auto; overflow-y: hidden; color: #76601a; font-size: .68rem; font-weight: 650; line-height: 1.45; white-space: nowrap; scrollbar-width: none; }
.amount-words::-webkit-scrollbar { display: none; }
.amount-words[hidden] { display: none; }
.trade-screen { position: relative; min-height: min(72vh, 760px); }
.trade-screen-content { transition: filter .22s ease, opacity .22s ease; }
.trade-screen.is-disabled .trade-screen-content { filter: blur(7px); opacity: .64; pointer-events: none; user-select: none; }
.trade-disabled-overlay { position: absolute; z-index: 3; inset: 0; display: grid; place-items: center; padding: clamp(.8rem, 3vw, 2rem); border-radius: 22px; background: rgba(251,248,241,.16); }
.trade-disabled-message { display: grid; justify-items: center; gap: .55rem; width: min(100%, 450px); padding: clamp(1.25rem, 4vw, 2rem); border-color: #ead9a4; background: rgba(255,255,255,.96); text-align: center; box-shadow: 0 18px 50px rgba(65,49,12,.15); animation: route-in .24s ease-out; }
.trade-disabled-message h2 { margin: .15rem 0 0; font-size: clamp(1rem, 2.5vw, 1.28rem); }
.trade-disabled-message p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.8; }
.trade-disabled-icon { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid #ead9a4; border-radius: 16px; background: #fff9e8; color: #90700d; }
.trade-disabled-icon .icon { width: 25px; height: 25px; }
.trade-hours-card .trade-force-toggle { margin-top: .8rem; padding-top: .9rem; border-top: 1px solid var(--line); }
@media (max-width: 760px) {
  .trade-screen { min-height: 66vh; }
  .trade-disabled-overlay { padding: .55rem; }
  .trade-disabled-message { border-radius: 17px; }
  .trade-hours-card .card-title-row { align-items: flex-start; }
  .trade-hours-card .trade-force-toggle { align-items: center; }
}

/* Keep the amount unit anchored inside its input on every viewport. */
.amount-entry { display: block; }
.amount-input-wrap { position: relative; min-width: 0; }
.amount-input-wrap > input { padding-inline-end: 4.6rem; }
.amount-input-wrap > .input-suffix {
  position: absolute;
  inset-inline-end: .65rem;
  top: 50%;
  z-index: 1;
  min-width: 3.15rem;
  height: 2rem;
  padding: 0 .45rem;
  border: 0;
  border-inline-start: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 650;
  transform: translateY(-50%);
  pointer-events: none;
}

/* Trade step one: center the progress and keep both choices side by side. */
.trade-selection-card {
  display: grid;
  justify-items: center;
  max-width: 760px;
  padding: 1.25rem;
}
.trade-page-heading { margin-bottom: .85rem; }
.trade-page-heading h1 { font-size: 1.22rem; }
.trade-page-heading p { max-width: 31rem; margin-inline: auto; line-height: 1.7; }
.trade-selection-card .trade-stepper,
.trade-selection-card .trade-select-panel {
  width: min(100%, 660px);
}
.trade-selection-card .trade-stepper {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(1.4rem,.42fr) minmax(0,1fr) minmax(1.4rem,.42fr) minmax(0,1fr);
  align-items: center;
  gap: clamp(.32rem,1.2vw,.72rem);
  margin-bottom: 1.4rem;
  padding: .48rem clamp(.55rem,2vw,.9rem);
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(67,52,13,.035);
}
.trade-selection-card .trade-step {
  display: flex;
  justify-content: center;
  gap: .42rem;
  min-width: 0;
  color: #8d877a;
  font-size: .68rem;
  white-space: nowrap;
}
.trade-selection-card .trade-step::after { display: none; }
.trade-step-label { line-height: 1.4; }
.trade-step-connector { height: 1px; background: #e9e4d9; }
.trade-step-connector.is-complete { background: #d9c57e; }
.trade-selection-card .step-number { width: 29px; height: 29px; flex: 0 0 29px; font-size: .68rem; }
.trade-select-panel { min-width: 0; }
.trade-select-intro { margin-bottom: 1.05rem; text-align: center; }
.trade-select-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  margin-bottom: .38rem;
  padding: .15rem .58rem;
  border: 1px solid #eee4c7;
  border-radius: 999px;
  background: #fffaf0;
  color: #80620f;
  font-size: .64rem;
  font-weight: 700;
}
.trade-selection-card .trade-select-kicker { margin-inline: auto; }
.trade-select-panel .trade-select-intro h2 { margin: 0; font-size: clamp(1.06rem, 1.8vw, 1.28rem); }
.trade-select-panel .trade-select-intro p { margin: .24rem 0 0; color: var(--muted); font-size: .76rem; line-height: 1.8; }
.trade-choice-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; }
.trade-choice {
  position: relative;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: .58rem;
  min-width: 0;
  min-height: 154px;
  padding: 1.1rem .7rem .95rem;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: #fff;
  color: var(--ink);
  text-align: center;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
a.trade-choice { cursor: pointer; }
a.trade-choice:hover { transform: translateY(-1px); border-color: #d9c47b; box-shadow: 0 7px 18px rgba(73,57,15,.07); }
.trade-choice.is-selected { border-color: #d6bb5d; background: linear-gradient(180deg,#fffdf8 0%,#fff 100%); box-shadow: inset 0 0 0 1px rgba(201,162,39,.12),0 8px 24px rgba(73,57,15,.055); }
.trade-choice-buy .trade-choice-icon { color: var(--success); }
.trade-choice-sell .trade-choice-icon { color: var(--danger); }
.trade-choice-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid currentColor;
  border-radius: 15px;
  background: #fff;
}
.trade-choice-buy .trade-choice-icon { background: #f0f8f3; border-color: #d8eddf; }
.trade-choice-sell .trade-choice-icon { background: #fff4f2; border-color: #f1ddda; }
.trade-choice-icon .icon { width: 21px; height: 21px; }
.trade-choice-copy { display: grid; justify-items: center; width: 100%; min-width: 0; gap: .16rem; }
.trade-choice-copy strong { font-size: .9rem; line-height: 1.5; }
.trade-choice-buy .trade-choice-copy strong { color: #16764b; }
.trade-choice-sell .trade-choice-copy strong { color: #b34243; }
.trade-choice-copy small { max-width: 23ch; color: var(--muted); font-size: .66rem; line-height: 1.65; }
.trade-choice-state {
  display: grid;
  place-items: center;
  position: absolute;
  inset-block-start: .65rem;
  inset-inline-end: .65rem;
  width: 24px;
  height: 24px;
  border: 1px solid #ded8ca;
  border-radius: 50%;
  color: #fff;
}
.trade-choice.is-selected .trade-choice-state { border-color: var(--gold-dark); background: var(--gold); }
.trade-choice-state .icon { width: 14px; height: 14px; }
.trade-choice.is-disabled { cursor: not-allowed; opacity: .56; }
.trade-selection-facts { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-top: .85rem; }
.trade-selection-facts .balance-inline,
.trade-selection-facts .quote-total {
  display: grid;
  align-content: center;
  justify-content: initial;
  gap: .22rem;
  min-width: 0;
  min-height: 76px;
  margin: 0;
  padding: .72rem .9rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}
.trade-selection-facts .balance-inline span,
.trade-selection-facts .quote-total span { font-size: .67rem; }
.trade-selection-facts .balance-inline strong,
.trade-selection-facts .quote-total strong {
  min-width: 0;
  color: var(--ink);
  font-size: clamp(.84rem, 1.25vw, 1rem);
  font-weight: 750;
  line-height: 1.55;
  text-align: start;
  overflow-wrap: anywhere;
}
.trade-selection-price.is-buy .quote-total { border-color: #dcece1; background: #fbfefc; }
.trade-selection-price.is-buy .quote-total strong { color: #16764b; }
.trade-selection-price.is-sell .quote-total { border-color: #f0dfdc; background: #fffdfc; }
.trade-selection-price.is-sell .quote-total strong { color: #b34243; }
.trade-selection-continue {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  width: 100%;
  min-height: 52px;
  margin: .95rem 0 0 auto;
}
.trade-selection-continue .icon { width: 18px; height: 18px; }
@media (prefers-reduced-motion: reduce) {
  .trade-choice { transition: none; }
  a.trade-choice:hover { transform: none; }
}

/* Desktop deposit destination details align with the receipt form below. */
@media (min-width: 761px) {
  .deposit-bank-card {
    width: min(100%, 690px);
    margin: 0 auto .8rem;
    padding: 1.05rem 1.15rem;
  }
  .deposit-bank-card .card-title-row {
    justify-content: flex-start;
    gap: .55rem;
    margin-bottom: .42rem;
  }
  .deposit-bank-card .card-title-row .icon {
    width: 19px;
    height: 19px;
    color: var(--gold-dark);
  }
  .deposit-bank-card > p {
    margin: .15rem 0 .8rem;
    font-size: .74rem;
    line-height: 1.7;
  }
  .deposit-bank-details {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: .55rem;
    margin: 0;
  }
  .deposit-bank-details > div {
    display: grid;
    align-content: center;
    gap: .28rem;
    min-height: 62px;
    padding: .55rem .75rem;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fffdf8;
  }
  .deposit-bank-details > div:nth-child(n+3) { grid-column: 1 / -1; }
  .deposit-bank-details dt { font-size: .68rem; }
  .deposit-bank-details dd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    min-width: 0;
    text-align: start;
  }
  .deposit-bank-details dd[dir="ltr"] { direction: ltr; text-align: left; }
  .deposit-bank-details .button-small { min-height: 36px; padding: .35rem .7rem; }
}

.receipt-file-picker {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
  gap: .7rem;
  min-width: 0;
  min-height: 54px;
  padding: .35rem .45rem;
  border: 1px solid #e2dccf;
  border-radius: 12px;
  background: #fff;
}
.field input.receipt-file-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}
.field .receipt-file-trigger {
  min-height: 42px;
  margin: 0;
  padding: .5rem .85rem;
  color: #66500c;
  font-size: .74rem;
  white-space: nowrap;
  cursor: pointer;
}
.receipt-file-input:focus-visible + .receipt-file-trigger {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}
.receipt-file-name {
  min-width: 0;
  color: var(--muted);
  font-size: .7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .contact-fab {
    display: inline-flex !important;
    left: max(.75rem,env(safe-area-inset-left));
    bottom: calc(72px + env(safe-area-inset-bottom));
    min-height: 44px;
    padding-inline: .8rem;
  }
  .push-activation-prompt {
    top: calc(68px + env(safe-area-inset-top));
    right: max(.65rem,env(safe-area-inset-right));
    width: min(370px,calc(100vw - 1.3rem));
  }
}

/* Keep the three trade stages on one row at every step. */
.trade-card .trade-stepper {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(1.4rem,.42fr) minmax(0,1fr) minmax(1.4rem,.42fr) minmax(0,1fr);
  align-items: center;
  gap: clamp(.32rem,1.2vw,.72rem);
  padding: .48rem clamp(.55rem,2vw,.9rem);
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(67,52,13,.035);
}
.trade-card .trade-step {
  display: flex;
  justify-content: center;
  gap: .42rem;
  min-width: 0;
  white-space: nowrap;
}
.trade-card .trade-step::after { display: none; }
.trade-card .step-number { flex: 0 0 29px; }
.trade-card .trade-step-connector { width: 100%; min-width: 0; height: 1px; }
@media (max-width: 760px) {
  .trade-card .trade-stepper {
    grid-template-columns: minmax(0,1fr) minmax(.75rem,.25fr) minmax(0,1fr) minmax(.75rem,.25fr) minmax(0,1fr);
    gap: .24rem;
    padding-inline: .45rem;
  }
  .trade-card .trade-step { gap: .24rem; font-size: .6rem; }
  .trade-card .step-number { flex-basis: 24px; width: 24px; height: 24px; }
}
@media (max-width: 360px) {
  .trade-card .trade-step { gap: .16rem; font-size: .54rem; }
  .trade-card .step-number { flex-basis: 22px; width: 22px; height: 22px; }
}

.admin-create-user { margin-bottom: 1rem; overflow: hidden; }
.admin-create-user-summary { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.2rem; cursor: pointer; list-style: none; }
.admin-create-user-summary::-webkit-details-marker { display: none; }
.admin-create-user-summary:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; }
.admin-create-user-summary strong, .admin-create-user-summary small { display: block; }
.admin-create-user-summary strong { font-size: .95rem; color: var(--ink); }
.admin-create-user-summary small { margin-top: .18rem; font-size: .72rem; color: var(--muted); }
.admin-create-user-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 12px; color: #815f08; background: #f9f0d7; }
.admin-create-user-chevron { display: grid; place-items: center; margin-inline-start: auto; color: var(--muted); transition: transform .2s ease; }
.admin-create-user[open] .admin-create-user-chevron { transform: rotate(90deg); }
.admin-create-user-form { padding: 1.1rem 1.2rem 1.2rem; border-top: 1px solid var(--line); }
.admin-create-user-form > p { margin: 0; font-size: .76rem; }
.admin-create-user-form > .button { justify-self: start; }
@media (max-width: 600px) { .admin-create-user-summary, .admin-create-user-form { padding-inline: .95rem; } .admin-create-user-form > .button { width: 100%; } }