/* Shared presentation only. Market accents and semantic buy/sell colors are retained. */
:root:not(.light) body{--muted:#b0afbb;--muted-2:#92919f}
html.light body{--muted:#605c69;--muted-2:#706b78}
body{--ui-radius:18px;--ui-gap:18px}
[dir=rtl] :is(h1,h2,h3,h4,label,button,.nav-group,.portal-eyebrow,.eyebrow){letter-spacing:normal}
:is(#view,#landing,#auth) :is(p,small,label){text-wrap:pretty}
#view{line-height:1.8}
#view :is(h1,h2,h3){line-height:1.55;text-wrap:balance}
#view :is(.page-head,.adm-header,.mh-head,.gr-title){border-radius:22px;border-color:var(--line-strong);background:var(--surface);box-shadow:none}
#view :is(.page-head,.adm-header,.mh-head) h1{font-size:clamp(25px,2.8vw,36px);margin:5px 0 8px}
#view :is(.page-head,.adm-header,.mh-head) p{max-width:760px;font-size:14px;line-height:1.9;color:var(--muted)}
#view :is(.card,.kpi,.mh-card,.mc-card,.ps-card,.acad-card,.ix-panel,.rc-it,.ach-it,.set-card){border-color:var(--line);border-radius:var(--ui-radius)}
#view :is(.card,.kpi,.acad-card,.rc-it,.ach-it,.set-card){background:var(--surface);box-shadow:none}
#view :is(.rc-big,.ach-gold){border-color:var(--line-strong);background:color-mix(in srgb,var(--gold) 7%,var(--surface))}
#view :is(.slc-in,.ref-in,.ach-in,.lux-sub-inner,.chat-card,.msg-other .msg-b,.ask-panel,.ask-bot){background:var(--surface);color:var(--text);border-color:var(--line)}
#view :is(.kpi-grid,.ix-actions,.rc-grid,.ach-grid){gap:var(--ui-gap)}
#view .kpi{padding:22px}.kpi .kl{font-size:12px;line-height:1.7}.kpi .kd{color:var(--muted);line-height:1.8}
#view :is(.empty,.chat-empty,.ww-empty){padding:32px 20px;line-height:1.9}
#view :is(.csub,.hint,.help,.field small){color:var(--muted);font-size:12px;line-height:1.9}
:is(#app,#landing,#auth,#modalBox) :is(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--gold);outline-offset:4px}
:is(#app,#auth,#modalBox) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){font-family:inherit;line-height:1.7;border-radius:10px}
:is(#app,#auth,#modalBox) textarea{resize:vertical;scrollbar-width:thin;scrollbar-color:var(--line-strong) var(--surface)}
:is(#app,#auth) :is(button,.btn){min-height:40px}
:is(#app,#landing,#auth) .btn{line-height:1.5;border-radius:11px;white-space:normal;box-shadow:none}
:is(#app,#landing,#auth) .btn-gold:hover{filter:brightness(1.06);box-shadow:0 6px 18px #0002}
:is(#app,#landing,#auth) button:disabled{cursor:not-allowed}
#view :is(.tabs,.adm-tabs,.set-tabs,.ix-filters){gap:8px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
#view table{font-size:13px;line-height:1.75}#view :is(th,td){padding:13px 14px;vertical-align:middle}#view th{color:var(--muted);font-weight:600;white-space:nowrap}#view tbody tr:hover{background:color-mix(in srgb,var(--gold) 4%,transparent)}
#view :is(.badge,.badge-pill){line-height:1.6;font-size:11px}
#side.portal-side .nav-group{font-size:11px;line-height:1.8;padding-top:18px}
#side.portal-side #sideNav button{font-size:13px;min-height:46px}
#side.portal-side #sideNav button.active{background:color-mix(in srgb,var(--gold) 8%,var(--surface))}
#view .ps-steps{flex-wrap:wrap;row-gap:12px}#view .ps-head p{line-height:1.9}
#view .mc-status,#view .mh-status{line-height:1.9;overflow-wrap:anywhere}
#view .gr-trial{border:1px solid var(--line-strong);border-radius:16px;background:var(--surface);padding:20px}
#view .gr-trial b{font-size:17px}#view .gr-trial p{margin:12px 0;line-height:1.9}
.econ-hero{background:linear-gradient(115deg,var(--surface),var(--bg-2));color:var(--text)}.econ-hero p{color:var(--text)}.econ-hero small{color:var(--muted)}.econ-emblem,.econ-emblem i{border-color:var(--line-strong)}
.econ-room .econ-guides article:hover{border-color:var(--line-strong)}
/* Light theme must remain readable in the data radar as well. */
html.light .ww{--surface:#fff;--text:#172638;--muted:#526274;--line:#d4dfe6;--ww:#12675f;--ww-soft:#12675f0d}
html.light .ww-chain{--ww:#235d94}html.light .ww-gold{--ww:#795a13}
html.light .ww :is(.ww-hero,.ww-detection,.ww-stats article,.ww-trade,.ww-transfer,.ww-controls,.ww-explain){background:#f7fafc;color:var(--text);border-color:#cedce4}
html.light .ww :is(.ww-hero p,.ww-caption,.ww-scope-foot,.ww-detection small){color:#526274}
html.light .ww :is(.ww-status,.ww-command-tag,.ww-tabs button){background:#fff;color:#365165;border-color:#cbdbe5}
html.light .ww .ww-tabs button.active{color:var(--ww);border-color:var(--ww)}
html.light .ww .ww-status.live{color:#12675f}
/* Public cards follow the chosen market, without old fixed gold surfaces. */
#landing :is(.faq-item,.ref-in,.offer-in,.learn-card,.rev-card){background:var(--surface);border-color:var(--line);box-shadow:none}
#landing :is(.sec-head p,.rev-text,.faq-body){line-height:1.95}
#landing .section{scroll-margin-top:110px}#landing .plan h3{line-height:1.65}
#landing .package-description{line-height:1.9}#landing .rev-card{border-radius:18px}
#auth .auth-card{border-color:var(--line-strong);box-shadow:0 20px 70px #0002}
.admin-workspace #adminTabs{display:grid!important;grid-template-columns:1fr 1.6fr 1.2fr .8fr!important;gap:18px;padding:18px;border-radius:18px;align-items:start}
.admin-workspace #adminTabs .adm-nav-group{min-width:0}.admin-workspace #adminTabs .adm-nav-group h3{font-size:11px;margin:0 0 12px;color:var(--muted)}
.admin-workspace #adminTabs .adm-nav-group>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.admin-workspace #adminTabs .adm-nav-group:first-child>div,.admin-workspace #adminTabs .adm-nav-group:last-child>div{grid-template-columns:1fr}
.admin-workspace #adminTabs .atab{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:7px;min-height:44px;padding:9px 8px;font-size:11px;line-height:1.6;text-align:start;white-space:normal;border-radius:9px}
.admin-workspace #adminTabs .atab-ic{font-size:17px;flex-shrink:0}.admin-workspace #adminTabs [hidden]{display:none!important}
#view :is(.pf-row2,.pwa-card){background:var(--surface);border-color:var(--line-strong);box-shadow:none}
@media(max-width:1100px){.admin-workspace #adminTabs{grid-template-columns:1fr 1fr!important}}
@media(max-width:600px){.admin-workspace #adminTabs{gap:14px 10px;padding:14px}.admin-workspace #adminTabs .adm-nav-group>div{grid-template-columns:1fr}.admin-workspace #adminTabs .atab{font-size:12px}}
@media(max-width:700px){body{--ui-radius:14px;--ui-gap:12px}#view :is(.page-head,.adm-header,.mh-head){padding:20px 16px;border-radius:17px}#view :is(.page-head,.adm-header,.mh-head) p{font-size:13px}#view :is(.card,.kpi){padding:18px}#view :is(th,td){padding:11px 12px}#view .gr-trial{padding:16px}:is(#app,#auth,#modalBox) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){font-size:16px}:is(#app,#auth) :is(.btn,summary){min-height:44px}.econ-filters label{min-width:0;flex-basis:140px}}
@media(prefers-reduced-motion:reduce){#view *,#landing *,#auth *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Consistent Arabic UI typography, without changing the selected market palette. */
body{--font-ui:'Tajawal',Arial,sans-serif;--font-heading:'El Messiri','Tajawal',sans-serif;font-family:var(--font-ui)}
button,input,select,textarea{font-family:var(--font-ui)}
html[dir=rtl] :is(.market-switch,.market-picker,.market-theme-picker,.hero-market-switch) button{font-family:var(--font-ui);letter-spacing:normal}
#landing button,#view button,#modalBox button,.ask-panel button{font-family:var(--font-ui)}
#landing .hero-market-options button,#landing #plans .plan-in button{font-family:var(--font-ui);letter-spacing:normal}
#view :is(h1,h2,h3),#auth :is(h1,h2,h3){font-family:var(--font-heading)}
#view :is(p,label,small),.ask-m{overflow-wrap:break-word}
#view input[type=email],#view input[type=url],#auth input[type=email]{direction:ltr;text-align:start}
html[dir=rtl] :is(.lab-core-caption,.lab-quota-count,.mono){font-variant-numeric:tabular-nums}
@media(max-width:600px){#landing :is(input,select,textarea),.ask-compose input{font-size:16px}#landing button{min-height:40px}#view :is(.mh-grid,.mw-grid,.rc-grid){min-width:0}.ask-panel{max-width:calc(100vw - 24px)}}
