:root{
  --font-ui-base:"Vazirmatn",Tahoma,Arial,sans-serif;
  --font-display-base:"Lalezar","Vazirmatn",Tahoma,sans-serif;
  --font-ui:var(--font-ui-base);
  --font-display:var(--font-display-base);
  --radius-control:14px;
  --radius-card:20px;
  --radius-sheet:28px;
  --motion-fast:160ms;
  --motion-page:220ms;
  --easing-standard:cubic-bezier(.22,1,.36,1);
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --safe-left:env(safe-area-inset-left,0px);
  --safe-right:env(safe-area-inset-right,0px);
  font-family:var(--font-ui);
  color-scheme:light dark;
}
body[data-visual-template="sobh"]{
  --bg:#f8f7fc;--surface-1:#ffffff;--surface-2:#f0eefb;--surface-raised:#ffffff;
  --text:#19213a;--text-muted:#5d667d;--border:#7f89a2;--primary:#5146c8;
  --primary-hover:#4035ae;--primary-ink:#ffffff;--secondary:#2f7f74;--success:#17795e;
  --warning:#8b5800;--danger:#ad314a;--info:#245bb3;--focus:#b44f31;
  --shadow-1:0 12px 28px rgba(25,33,58,.12);--shadow-2:0 24px 70px rgba(25,33,58,.16);
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--focus);--copper-deep:var(--focus);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(81,70,200,.24);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
}
body[data-visual-template="relay"]{
  --bg:#080a0f;--surface-1:#111620;--surface-2:#181f2b;--surface-raised:#202938;
  --text:#f4f7fa;--text-muted:#aeb8c7;--border:#59677f;--primary:#7c8cff;
  --primary-hover:#9ba7ff;--primary-ink:#080a0f;--secondary:#34d7c5;--success:#58d68d;
  --warning:#ffc46b;--danger:#ff8498;--info:#7c8cff;--focus:#ffc46b;
  --shadow-1:0 12px 28px rgba(0,0,0,.32);--shadow-2:0 24px 70px rgba(0,0,0,.48);
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--focus);--copper-deep:var(--focus);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(124,140,255,.30);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
}
body[data-visual-template="madar"]{
  --bg:#f5f7f8;--surface-1:#ffffff;--surface-2:#eaf0f5;--surface-raised:#ffffff;
  --text:#10283a;--text-muted:#586b79;--border:#7f95a2;--primary:#145fd7;
  --primary-hover:#0d4fb9;--primary-ink:#ffffff;--secondary:#16806f;--success:#16806f;
  --warning:#986000;--danger:#9b3f4a;--info:#145fd7;--focus:#9b3f4a;
  --shadow-1:0 12px 28px rgba(16,40,58,.12);--shadow-2:0 24px 70px rgba(16,40,58,.16);
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--focus);--copper-deep:var(--focus);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(20,95,215,.24);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 70% -10%,var(--glow),transparent 36%),linear-gradient(155deg,var(--bg),var(--bg2));color:var(--text);overflow-x:hidden;-webkit-tap-highlight-color:transparent}
button,input,textarea,select{font:inherit}
button{color:inherit}
.hidden{display:none!important}
.ambient{position:fixed;z-index:0;border-radius:50%;filter:blur(90px);pointer-events:none;opacity:.18}
.ambient-a{width:320px;height:320px;background:var(--primary);top:12%;right:-180px}
.ambient-b{width:300px;height:300px;background:var(--secondary);bottom:10%;left:-190px}
.boot,.fatal{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px;background:var(--bg)}
.boot strong{margin-top:24px;font-size:1.1rem}
.boot small{color:var(--muted);margin-top:8px}
.brand-mark{width:78px;height:78px;position:relative;display:grid;place-items:center}
.brand-mark span{position:absolute;border:2px solid var(--primary);border-radius:50%;animation:pulse 1.8s ease-in-out infinite}
.brand-mark span:nth-child(1){width:26px;height:26px;background:var(--primary);box-shadow:0 0 32px var(--primary)}
.brand-mark span:nth-child(2){width:52px;height:52px;animation-delay:.2s}
.brand-mark span:nth-child(3){width:78px;height:78px;animation-delay:.4s}
.fatal-icon{width:64px;height:64px;display:grid;place-items:center;border-radius:22px;background:rgba(255,100,124,.14);color:var(--danger);font-size:2rem;font-weight:900}
.fatal h1{margin:20px 0 8px}
.fatal p{max-width:420px;color:var(--muted);line-height:1.9}
.app{position:relative;z-index:1;max-width:960px;margin:auto;min-height:100vh}
.topbar{height:calc(72px + var(--safe-top));padding:calc(12px + var(--safe-top)) 18px 8px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;background:linear-gradient(to bottom,var(--topbar-1),var(--topbar-2),transparent);backdrop-filter:blur(14px)}
.profile-chip,.balance-pill,.icon-button{border:0;background:transparent;cursor:pointer}
.profile-chip{display:flex;align-items:center;gap:10px;padding:0;text-align:right}
.profile-chip>span:last-child{display:flex;flex-direction:column;gap:2px}
.profile-chip b{font-size:.86rem}
.profile-chip small{font-size:.68rem;color:var(--muted)}
.avatar{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,var(--primary),var(--primary-hover));font-weight:900;box-shadow:0 8px 24px rgba(105,81,255,.35);border:1px solid rgba(255,255,255,.22)}
.top-actions{display:flex;align-items:center;gap:8px}
.icon-button{width:40px;height:40px;border-radius:14px;background:var(--card);border:1px solid var(--line);display:grid;place-items:center;font-size:1.1rem}
.balance-pill{display:flex;flex-direction:column;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:7px 12px}
.balance-pill small{font-size:.58rem;color:var(--muted)}
.balance-pill b{font-size:.73rem}
.viewport{padding:8px 16px calc(102px + var(--safe-bottom));outline:none}
.page{display:none;animation:pageIn .36s cubic-bezier(.22,.8,.3,1)}
.page.active{display:block}
.glass{background:linear-gradient(145deg,var(--glass-1),var(--glass-2));border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px)}
.hero{min-height:310px;border-radius:30px;padding:30px;display:flex;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:auto -10% -60% 30%;height:250px;background:radial-gradient(circle,var(--glow-2),transparent 60%)}
.hero-copy{position:relative;z-index:2;max-width:60%}
.eyebrow{font-size:.72rem;color:var(--cyan);font-weight:800;letter-spacing:.04em}
.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);margin-left:6px}
.hero h1,.page-title h1{font-size:clamp(1.8rem,8vw,3rem);line-height:1.35;margin:14px 0 10px;letter-spacing:-.04em}
.hero h1 em{font-style:normal;color:var(--primary2);background:none}
.hero p,.page-title p{color:var(--muted);line-height:1.8;font-size:.84rem}
.button{border:0;border-radius:15px;padding:12px 18px;font-weight:800;cursor:pointer;transition:transform .2s,filter .2s}
.button:active{transform:scale(.97)}
.button.glow,.button.primary{background:linear-gradient(135deg,var(--primary),var(--primary-hover));box-shadow:0 10px 30px var(--glow)}
.button.secondary{background:var(--primary-soft);color:var(--primary-hover);border:1px solid var(--primary-soft)}
.button.admin{width:100%;margin-top:16px;background:linear-gradient(135deg,var(--admin-1),var(--admin-2));color:var(--admin-ink)}
.orbital{position:absolute;left:5%;top:50%;width:180px;height:180px;transform:translateY(-50%)}
.planet{position:absolute;inset:38px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#9ef4ff,#388aca 45%,#5134a3 78%);box-shadow:0 0 55px rgba(42,190,226,.36)}
.planet span{font-size:2rem;font-weight:900;opacity:.8}
.orbital i{position:absolute;inset:10px;border:1px solid rgba(155,123,255,.3);border-radius:50%;animation:spin 10s linear infinite}
.orbital i:after{content:"";position:absolute;width:9px;height:9px;top:14px;right:24px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan)}
.orbital i:nth-child(3){inset:0 40px;transform:rotate(62deg);animation-duration:8s}
.orbital i:nth-child(4){inset:28px 0;transform:rotate(-40deg);animation-duration:12s}
.section-head{display:flex;align-items:end;justify-content:space-between;margin:28px 2px 14px}
.section-head small{color:var(--muted);font-size:.67rem}
.section-head h2{font-size:1.08rem;margin:4px 0 0}
.text-button{border:0;background:transparent;color:var(--primary2);font-size:.76rem;cursor:pointer}
.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.metric{border-radius:20px;padding:16px;display:flex;align-items:center;gap:12px}
.metric-icon{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;font-size:1.3rem}
.metric-icon.violet{background:var(--primary-soft);color:var(--primary-hover)}
.metric-icon.cyan{background:var(--secondary-soft);color:var(--cyan)}
.metric div{display:flex;flex-direction:column}
.metric small{font-size:.66rem;color:var(--muted)}
.metric b{font-size:1.4rem;margin-top:2px}
.empty-state{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:.8rem}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.quick-grid button{background:var(--quick-bg);border:1px solid var(--line);border-radius:20px;padding:18px;text-align:right;display:grid;grid-template-columns:42px 1fr;column-gap:10px;cursor:pointer}
.quick-grid span{grid-row:1/3;width:42px;height:42px;border-radius:14px;background:var(--primary-soft);display:grid;place-items:center;color:var(--primary2);font-size:1.3rem}
.quick-grid b{font-size:.82rem}
.quick-grid small{color:var(--muted);font-size:.65rem;margin-top:4px}
.page-title{padding:26px 4px 10px}
.page-title h1{font-size:2rem;margin-bottom:4px}
.filter-row{display:flex;gap:8px;overflow-x:auto;padding:12px 0 16px;scrollbar-width:none}
.filter-row button,.admin-nav button{white-space:nowrap;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:9px 15px;color:var(--muted);cursor:pointer}
.filter-row button.active,.admin-nav button.active{background:var(--primary);color:#fff;border-color:transparent}
.plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.plan-card{border-radius:24px;padding:18px;position:relative;overflow:hidden}
.plan-card:before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:var(--accent,var(--primary));filter:blur(75px);opacity:.18;top:-50px;left:-40px}
.plan-card .plan-panel{font-size:.65rem;color:var(--cyan)}
.plan-card h3{font-size:1rem;margin:10px 0;min-height:44px}
.plan-card .chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.chip{font-size:.61rem;color:var(--muted);padding:5px 8px;border:1px solid var(--line);border-radius:9px}
.plan-card .price{display:flex;align-items:end;gap:4px;margin:18px 0 12px}
.plan-card .price b{font-size:1.25rem}
.plan-card .price small{font-size:.62rem;color:var(--muted);padding-bottom:3px}
.plan-card .button{width:100%}
.stack-list{display:flex;flex-direction:column;gap:12px}
.order-card,.ticket-card,.admin-row{border-radius:22px;padding:17px;background:var(--card);border:1px solid var(--line)}
.order-top,.ticket-top,.admin-row-top{display:flex;justify-content:space-between;gap:12px}
.order-card h3,.ticket-card h3{font-size:.9rem;margin:0 0 5px}
.order-card small,.ticket-card small{color:var(--muted);font-size:.65rem}
.status{font-size:.62rem;border-radius:999px;padding:6px 9px;height:max-content}
.status.approved,.status.open{color:var(--green);background:var(--success-soft)}
.status.pending,.status.waiting_approval,.status.paid_pending_delivery{color:var(--amber);background:var(--warning-soft)}
.status.rejected,.status.failed,.status.closed{color:var(--danger);background:var(--danger-soft)}
.order-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.order-actions button{border:1px solid var(--line);background:var(--ghost-bg);border-radius:12px;padding:8px 11px;font-size:.69rem;cursor:pointer}
.usage{margin-top:14px}
.usage-head{display:flex;justify-content:space-between;font-size:.66rem;color:var(--muted);margin-bottom:8px}
.progress{height:8px;border-radius:99px;background:var(--track-bg);overflow:hidden}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--cyan));border-radius:inherit;transition:none}
.wallet-card{position:relative;overflow:hidden;padding:28px;border-radius:28px;background:linear-gradient(135deg,var(--wallet-1),var(--wallet-2) 60%,var(--wallet-3));box-shadow:0 20px 70px rgba(64,79,214,.34);display:flex;flex-direction:column}
.wallet-card span{font-size:.75rem;opacity:.78}
.wallet-card strong{font-size:2.3rem;margin:12px 0 0}
.wallet-card small{opacity:.72}
.wallet-shine{position:absolute;width:220px;height:220px;border:1px solid rgba(255,255,255,.2);border-radius:50%;left:-60px;top:-120px;box-shadow:0 0 0 30px rgba(255,255,255,.04),0 0 0 65px rgba(255,255,255,.03)}
.notice{display:flex;gap:12px;margin:15px 0;padding:14px;border-radius:16px;font-size:.72rem;line-height:1.8}
.notice.info{background:var(--secondary-soft);border:1px solid var(--secondary-soft);color:var(--info-ink)}
.notice span{width:24px;height:24px;flex:0 0 24px;border-radius:8px;display:grid;place-items:center;background:rgba(40,215,228,.15);font-weight:900}
.notice p{margin:0}
.timeline{border-right:1px solid var(--line);margin-right:10px;padding-right:20px}
.timeline article{position:relative;padding:0 0 20px}
.timeline article:before{content:"";position:absolute;right:-26px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 5px rgba(124,92,255,.12)}
.timeline h4{margin:0;font-size:.78rem}
.timeline p{margin:5px 0;color:var(--muted);font-size:.66rem}
.compose-card{padding:18px;border-radius:24px}
.compose-card label{font-size:.76rem;font-weight:800}
.compose-card textarea{width:100%;min-height:130px;resize:vertical;margin:10px 0;background:var(--field-bg);color:var(--text);border:1px solid var(--line);border-radius:16px;padding:14px;line-height:1.8;outline:none}
.compose-card textarea:focus,.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--primary)}
.compose-card>div{display:flex;justify-content:space-between;align-items:center}
.compose-card small{color:var(--muted)}
.ticket-card p{white-space:pre-wrap;line-height:1.8;font-size:.75rem;color:var(--text-soft)}
.ticket-reply{padding:12px;border-radius:13px;background:rgba(53,223,162,.06);border:1px solid rgba(53,223,162,.22)}
.referral-card{border-radius:28px;text-align:center;padding:30px;display:flex;flex-direction:column;align-items:center}
.gift{font-size:3rem;width:80px;height:80px;border-radius:28px;display:grid;place-items:center;color:var(--warning);background:linear-gradient(145deg,rgba(255,182,77,.2),rgba(124,92,255,.15));box-shadow:inset 0 0 30px rgba(255,255,255,.04)}
.referral-card strong{font-size:3rem;margin-top:14px}
.referral-card span,.referral-card b{font-size:.76rem;color:var(--muted)}
.referral-card b{color:var(--green);margin-top:10px}
.copy-field{display:flex;margin:14px 0;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.copy-field input{min-width:0;flex:1;background:transparent;border:0;color:var(--muted);direction:ltr;padding:13px}
.copy-field button{border:0;background:var(--primary);padding:0 18px;color:#fff;font-weight:800}
.prose{border-radius:22px;padding:18px;white-space:pre-wrap;line-height:2;color:var(--text-soft);font-size:.78rem}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.guide-grid article{padding:17px;border-radius:20px}
.guide-grid span{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary2);font-weight:900}
.guide-grid h3{font-size:.79rem}
.guide-grid p{font-size:.68rem;line-height:1.8;color:var(--muted)}
.terms{border-radius:20px;margin-top:12px;padding:15px}
.terms summary{cursor:pointer;font-size:.8rem;font-weight:800}
.profile-hero{text-align:center;padding:30px}
.avatar.large{width:88px;height:88px;border-radius:30px;font-size:2rem;margin:auto}
.profile-hero h1{margin:18px 0 4px}
.profile-hero p{color:var(--muted);font-size:.72rem}
.profile-service-section{margin:0 0 14px;padding:18px;border-radius:22px}
.profile-service-heading{display:flex;align-items:end;justify-content:space-between;gap:12px}
.profile-service-heading small{color:var(--muted);font-size:.72rem}
.profile-service-heading h2{margin:4px 0 0;font-size:1.12rem}
.profile-service-picker{display:grid;gap:7px;margin-top:16px;color:var(--muted);font-size:.76rem;font-weight:800}
.profile-service-picker select{width:100%;min-height:44px;padding:0 12px;color:var(--text);border:1px solid var(--line);border-radius:12px;background:var(--surface);font:inherit}
.profile-service-status{min-height:1.5em;margin:13px 0 0;color:var(--muted);font-size:.76rem;line-height:1.7}
.profile-service-card:empty{display:none}
.settings-list{border-radius:22px;overflow:hidden}
.settings-list button{width:100%;display:flex;justify-content:space-between;padding:16px;border:0;border-bottom:1px solid var(--line);background:transparent;cursor:pointer}
.settings-list button:last-child{border-bottom:0}
.admin-heading .eyebrow{color:var(--amber)}
.admin-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.admin-metric{border-radius:20px;padding:15px;background:var(--card);border:1px solid var(--line)}
.admin-metric small{display:block;color:var(--muted);font-size:.62rem}
.admin-metric strong{display:block;font-size:1.15rem;margin-top:7px}
.chart-card{border-radius:24px;padding:18px;margin-top:14px}
.bar-chart{height:180px;display:flex;align-items:end;gap:5px;border-bottom:1px solid var(--line);padding-top:12px}
.bar-chart i{flex:1;min-width:4px;background:linear-gradient(to top,var(--primary),var(--cyan));border-radius:6px 6px 0 0;opacity:.78;position:relative}
.bar-chart i:hover:after{content:attr(data-value);position:absolute;bottom:100%;right:50%;transform:translateX(50%);font-style:normal;font-size:.58rem;background:#020711;padding:5px;border-radius:6px}
.admin-nav{display:flex;gap:7px;overflow-x:clip;overflow-y:visible;padding:8px;margin:15px 0;border-radius:18px;box-shadow:none}
.admin-nav button{padding:8px 13px;font-size:.7rem}
.admin-content{min-height:220px}
.admin-row{margin-bottom:10px}
.admin-row h3{font-size:.82rem;margin:0}
.admin-row p{font-size:.68rem;color:var(--muted);line-height:1.7}
.admin-row-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.mini-button{border:1px solid var(--line);background:rgba(255,255,255,.04);padding:7px 10px;border-radius:10px;font-size:.65rem;cursor:pointer}
.mini-button.danger{color:var(--danger)}
.search-box{display:flex;gap:8px;margin-bottom:12px}
.search-box input{flex:1;min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);padding:12px}
.field{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.field label{font-size:.7rem;color:var(--muted)}
.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);border-radius:13px;background:rgba(4,12,24,.72);color:var(--text);padding:11px;outline:none}
.field textarea{min-height:90px;resize:vertical}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.bottom-nav{position:fixed;z-index:30;bottom:0;right:50%;transform:translateX(50%);width:min(100%,960px);padding:9px 14px calc(9px + var(--safe-bottom));display:grid;grid-template-columns:repeat(6,1fr);background:linear-gradient(to top,rgba(7,17,31,.98) 60%,rgba(7,17,31,.78));backdrop-filter:blur(18px);border-top:1px solid var(--line)}
.bottom-nav button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:3px;color:#6f839e;padding:5px;cursor:pointer}
.bottom-nav span{font-size:1.25rem;height:24px}
.bottom-nav b{font-size:.58rem}
.bottom-nav button.active{color:var(--primary2)}
.modal{position:fixed;z-index:100;inset:0;display:flex;align-items:end;justify-content:center}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,4,10,.72);backdrop-filter:blur(6px)}
.modal-sheet{position:relative;width:min(100%,680px);max-height:88vh;overflow:auto;background:#0d1b2d;border:1px solid var(--line);border-radius:30px 30px 0 0;padding:26px 20px calc(24px + var(--safe-bottom));animation:sheetIn .32s cubic-bezier(.18,.85,.3,1)}
.grabber{width:46px;height:4px;border-radius:9px;background:#40506a;position:absolute;top:9px;right:50%;transform:translateX(50%)}
.modal-close{position:absolute;left:16px;top:16px;width:34px;height:34px;border:0;border-radius:12px;background:var(--track-bg);font-size:1.3rem}
.modal-sheet h2{font-size:1.15rem;margin-top:6px}
.modal-sheet p{font-size:.75rem;line-height:1.8;color:var(--muted)}
.qr-image{display:block;width:min(260px,80vw);height:auto;background:white;padding:12px;border-radius:22px;margin:18px auto}
.config-box{direction:ltr;text-align:left;word-break:break-all;background:#06101d;border:1px solid var(--line);padding:14px;border-radius:14px;font:12px/1.7 Consolas,monospace;color:#a9e6ef;max-height:180px;overflow:auto}
.toast-region{position:fixed;z-index:200;top:calc(80px + var(--safe-top));right:50%;transform:translateX(50%);width:min(calc(100% - 28px),480px);display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{background:#172942;border:1px solid var(--line);border-radius:15px;padding:12px 14px;box-shadow:var(--shadow);font-size:.74rem;animation:toastIn .3s}
.toast.error{border-color:rgba(255,100,124,.35);color:#ffc1cb}
.skeleton{min-height:110px;border-radius:22px;background:linear-gradient(90deg,var(--card) 25%,rgba(255,255,255,.06) 40%,var(--card) 60%);background-size:300% 100%;animation:shimmer 1.4s infinite}
.empty-box{text-align:center;color:var(--muted);padding:35px 15px;font-size:.77rem}
.status-state{grid-column:1/-1;min-height:110px;display:grid;place-items:center;align-content:center;gap:12px;padding:28px 18px;border:1px solid var(--line);border-radius:20px;background:var(--surface-raised);color:var(--text-muted);text-align:center}
.status-state p{max-width:56ch;margin:0;line-height:1.8;overflow-wrap:anywhere}
.status-state--loading p::before{content:"";display:inline-block;width:.75em;height:.75em;margin-inline-end:8px;border:2px solid currentColor;border-inline-start-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
.status-state--error{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger)}
.status-state .mini-button{min-width:112px;color:var(--text);background:var(--surface)}
.ltr{direction:ltr}
.danger-text{color:var(--danger)}
@media(max-width:640px){.hero{min-height:340px;padding:24px}
.hero-copy{max-width:75%}
.orbital{left:-40px;opacity:.7}
.plan-grid{grid-template-columns:1fr}
.guide-grid{grid-template-columns:1fr}
.admin-metrics{grid-template-columns:1fr 1fr}
.form-grid{grid-template-columns:1fr}
.quick-grid{gap:9px}
.quick-grid button{padding:14px}
.page-title h1{font-size:1.75rem}
}
/* 2026 visual system: locally bundled Persian fonts, metallic dark and pastel light. */
@font-face{font-family:Vazirmatn;src:url('/fonts/Vazirmatn.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Lalezar;src:url('/fonts/Lalezar-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
body{background:radial-gradient(circle at 82% -8%,rgba(141,116,255,.14),transparent 32%),radial-gradient(circle at 5% 62%,rgba(69,202,199,.07),transparent 30%),linear-gradient(145deg,#030405 0%,#0b0d10 48%,#050608 100%)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background:repeating-linear-gradient(115deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 9px)}
h1,h2,.hero h1,.page-title h1,.profile-hero h1{font-family:Lalezar,"B Titr",Vazirmatn,sans-serif;font-weight:400;letter-spacing:0}
.topbar{background:linear-gradient(to bottom,rgba(5,6,8,.97),rgba(5,6,8,.77),transparent)}
.glass{background:linear-gradient(145deg,rgba(30,33,39,.9),rgba(14,16,20,.82));border-color:rgba(226,232,242,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.045),var(--shadow)}
.quick-grid button{background:linear-gradient(145deg,rgba(28,31,37,.94),rgba(15,17,21,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 34px rgba(0,0,0,.22)}
.modal-sheet{background:linear-gradient(155deg,#1a1d22,#0d0f13 65%);box-shadow:0 -28px 80px rgba(0,0,0,.52)}
.bottom-nav{background:linear-gradient(to top,rgba(5,6,8,.99) 62%,rgba(5,6,8,.86))}
.field input,.field textarea,.field select,.compose-card textarea{background:rgba(3,4,6,.68)}
.ticket-card p,.prose{color:#d8dde5}
.ui-icon{width:1.35rem;height:1.35rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
.metric-icon .ui-icon,.quick-grid span .ui-icon{width:1.45rem;height:1.45rem}
.bottom-nav .ui-icon{width:1.3rem;height:1.3rem}
.gift .ui-icon{width:2.5rem;height:2.5rem}
.modal-close .ui-icon{width:1.1rem;height:1.1rem;margin:auto}
.avatar{overflow:hidden}
.avatar.has-photo{padding:0}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.payment-actions{display:grid;gap:10px;margin-top:15px}
.payment-actions .button{width:100%}
.wallet-pay{color:#13271e;background:linear-gradient(135deg,#86f0c0,#48d89e);box-shadow:0 12px 30px rgba(64,211,149,.2)}
.stars-pay{color:#fff;background:linear-gradient(135deg,#9b74ff,#506df4);box-shadow:0 12px 30px rgba(107,91,244,.24)}
.payment-actions button:disabled{cursor:not-allowed;filter:grayscale(.45);opacity:.62;box-shadow:none}
.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}
.modal-actions .button{width:100%}
body.light{color-scheme:light;background:radial-gradient(circle at 90% 3%,rgba(255,191,220,.52),transparent 30%),radial-gradient(circle at 4% 31%,rgba(178,232,255,.55),transparent 32%),radial-gradient(circle at 72% 78%,rgba(195,246,221,.48),transparent 28%),linear-gradient(145deg,var(--bg) 0%,var(--surface-2) 52%,var(--surface-1) 100%)}
body.light:before{opacity:.28;background-image:radial-gradient(rgba(110,91,150,.12) .7px,transparent .7px);background-size:15px 15px}
body.light .ambient{opacity:.2;filter:blur(110px)}
body.light .ambient-a{background:#ff9dca}
body.light .ambient-b{background:#80dff0}
body.light .topbar{background:linear-gradient(to bottom,rgba(255,250,253,.97),rgba(255,250,253,.84),transparent)}
body.light .glass{background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(251,248,255,.84));border-color:rgba(91,70,126,.14);box-shadow:inset 0 1px 0 #fff,var(--shadow)}
body.light .hero{background:linear-gradient(135deg,rgba(255,238,248,.96),rgba(235,247,255,.94) 55%,rgba(235,255,246,.9));border-color:rgba(116,91,197,.16)}
body.light .hero h1 em{color:#7657c7;background:none}
body.light .planet{background:radial-gradient(circle at 35% 30%,#e9fffc,#78d7da 38%,#a78adf 76%);box-shadow:0 0 45px rgba(110,112,201,.2)}
body.light .quick-grid button{border-color:rgba(87,67,121,.13);box-shadow:0 13px 32px rgba(84,68,110,.1);color:var(--text)}
body.light .quick-grid button:nth-child(1){background:linear-gradient(135deg,#fff0f7,#f6eaff)}
body.light .quick-grid button:nth-child(2){background:linear-gradient(135deg,#e9f8ff,#edf2ff)}
body.light .quick-grid button:nth-child(3){background:linear-gradient(135deg,#eafff5,#effaf5)}
body.light .quick-grid button:nth-child(4){background:linear-gradient(135deg,#fff8dc,#fff1e6)}
body.light .quick-grid span{background:rgba(105,79,178,.1);color:#664ab8}
body.light .quick-grid small,body.light .metric small{color:#655d74}
body.light .order-card,body.light .ticket-card,body.light .admin-row{background:rgba(255,255,255,.86);box-shadow:0 12px 32px rgba(84,68,110,.08)}
body.light .modal-sheet{background:linear-gradient(155deg,#fffefd,#f7f2ff 68%,#eefaff);border-color:rgba(88,68,121,.16);box-shadow:0 -24px 65px rgba(74,54,105,.2)}
body.light .modal-backdrop{background:rgba(42,35,57,.38)}
body.light .modal-close{background:rgba(96,75,132,.1)}
body.light .field input,body.light .field textarea,body.light .field select,body.light .compose-card textarea{background:rgba(255,255,255,.88);color:#282238;border-color:rgba(82,62,115,.2)}
body.light .bottom-nav{background:linear-gradient(to top,rgba(255,252,254,.99) 62%,rgba(255,252,254,.89));box-shadow:0 -12px 35px rgba(85,68,111,.09)}
body.light .bottom-nav button{color:#746d82}
body.light .bottom-nav button.active{color:#6549b7}
body.light .prose,body.light .ticket-card p{color:#4e475d}
body.light .ticket-reply{color:#315a4b;background:rgba(43,157,113,.08)}
body.light .notice.info{background:rgba(85,180,192,.1);border-color:rgba(39,139,151,.18);color:#315d65}
body.light .notice.info span{background:rgba(34,145,158,.12)}
body.light .button.secondary{color:#5e43aa;background:rgba(109,81,188,.1);border-color:rgba(109,81,188,.18)}
body.light .chip{color:#5d566a;background:rgba(255,255,255,.5)}
body.light .toast{background:#fff;border-color:rgba(86,66,119,.17);color:#29243b}
body.light .config-box{background:#f2f7f8;color:#245c65}
@media(max-width:640px){.modal-actions{grid-template-columns:1fr}
.payment-actions{gap:9px}
.hero h1{font-size:2rem}
.profile-chip b{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:390px){.hero-copy{max-width:82%}
.hero h1{font-size:1.65rem}
.orbital{left:-70px}
.viewport{padding-inline:12px}
.balance-pill{display:none}
.empty-state{align-items:stretch;flex-direction:column}
.metric{padding:13px}
.admin-metrics{gap:7px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}
body.light{color-scheme:light}
.light .glass{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(246,250,255,.88))}
.light .hero{color:#f7faff;background:linear-gradient(145deg,#263b58,#162941)}
.light .hero p{color:#b9c7d9}
.light .hero .eyebrow{color:#56e8ef}
.light .topbar{background:linear-gradient(to bottom,rgba(238,244,251,.96),rgba(238,244,251,.75),transparent)}
.light .bottom-nav{background:linear-gradient(to top,rgba(238,244,251,.98) 60%,rgba(238,244,251,.78))}
.light .modal-sheet{background:#f4f8fd}
.light .field input,.light .field textarea,.light .field select,.light .compose-card textarea{background:rgba(255,255,255,.8)}
.admin-nav{scrollbar-width:none}
.admin-nav::-webkit-scrollbar{display:none}
.admin-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.toolbar-select,.toolbar-search{min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);padding:12px;outline:none}
.toolbar-select{flex:1 1 220px}
.toolbar-search{width:100%;margin-bottom:12px}
.check-field{display:flex;align-items:center;gap:10px;padding:13px;margin:12px 0;border:1px solid var(--line);border-radius:14px;background:var(--card);font-size:.76rem}
.check-field input{width:18px;height:18px;accent-color:var(--primary)}
.config-preview{direction:ltr;text-align:left;word-break:break-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Consolas,monospace}
.modal-actions{display:flex;gap:10px;margin-top:16px}
.modal-actions .button{flex:1}
.form-hint{color:var(--muted);font-size:.68rem}
.light .toolbar-select,.light .toolbar-search{background:rgba(255,255,255,.84)}
/* Final light-theme precedence over legacy compatibility declarations. */
body.light .glass{background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(251,248,255,.84))}
body.light .hero{color:var(--text);background:linear-gradient(135deg,rgba(255,238,248,.96),rgba(235,247,255,.94) 55%,rgba(235,255,246,.9))}
body.light .hero p{color:var(--muted)}
body.light .hero .eyebrow{color:var(--cyan)}
body.light .topbar{background:linear-gradient(to bottom,rgba(255,250,253,.97),rgba(255,250,253,.84),transparent)}
body.light .bottom-nav{background:linear-gradient(to top,rgba(255,252,254,.99) 62%,rgba(255,252,254,.89))}
body.light .modal-sheet{background:linear-gradient(155deg,#fffefd,#f7f2ff 68%,#eefaff)}
body.light .field input,body.light .field textarea,body.light .field select,body.light .compose-card textarea{background:rgba(255,255,255,.88);color:#282238}
@media(max-width:640px){.modal-actions{display:grid;grid-template-columns:1fr}
.modal-actions .button{width:100%}
}
.quick-grid .chance-entry{grid-column:1/-1;background:linear-gradient(135deg,rgba(111,80,208,.22),rgba(35,174,177,.13))}
.quick-grid .chance-entry span{background:linear-gradient(145deg,rgba(255,203,100,.2),rgba(152,105,255,.18));color:#ffd37d}
body.light .quick-grid .chance-entry{background:linear-gradient(135deg,#fff0cf,#f3eaff 52%,#e6fbfa)}
.wallet-card>*{position:relative;z-index:2}
.wallet-card .wallet-shine{z-index:1}
.wallet-charge-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.wallet-charge{color:#273046;background:rgba(255,255,255,.92);box-shadow:0 10px 28px rgba(31,47,91,.18)}
.wallet-charge.manual{color:#fff;background:rgba(10,22,45,.32);border:1px solid rgba(255,255,255,.25)}
.payment-destination{display:grid;grid-template-columns:1fr auto;gap:7px 10px;align-items:center;margin:12px 0;padding:14px;border-radius:16px;background:rgba(36,183,181,.08);border:1px solid rgba(36,183,181,.18)}
.payment-destination span,.payment-destination small{color:var(--muted);font-size:.68rem}
.payment-destination code{grid-column:1/-1;direction:ltr;text-align:left;word-break:break-all;padding:9px;border-radius:10px;background:rgba(0,0,0,.18);color:var(--text)}
.payment-destination .mini-button{grid-column:2;grid-row:1}
.field input[type="file"]{padding:8px}
.field input[type="file"]::file-selector-button{border:0;border-radius:10px;padding:8px 11px;margin-left:9px;background:var(--primary);color:#fff;font-weight:800}
body.light .payment-destination{background:rgba(36,183,181,.08)}
body.light .payment-destination code{background:rgba(255,255,255,.7)}
.checkout-tools{margin-top:14px}
.discount-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin:12px 0}
.discount-row input{min-width:0;border:1px solid var(--line);border-radius:13px;background:rgba(4,5,7,.62);color:var(--text);padding:11px;direction:ltr;text-align:left;text-transform:uppercase;outline:none}
.discount-row input:focus{border-color:var(--primary)}
.discount-summary{padding:11px 13px;margin-bottom:10px;border-radius:13px;color:#aaf2d1;background:rgba(70,215,160,.1);border:1px solid rgba(70,215,160,.2);font-size:.72rem;line-height:1.8}
body.light .discount-row input{background:rgba(255,255,255,.88);color:#282238}
body.light .discount-summary{color:#27664e;background:rgba(53,177,130,.09)}
.wheel-card{padding:24px;border-radius:30px;text-align:center;overflow:hidden}
.spin-meta{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:0 auto 14px}
.spin-meta span{padding:8px 12px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.045);color:var(--muted);font-size:.68rem}
.spin-meta b{color:var(--text);font-size:.85rem}
.wheel-stage{width:min(100%,430px);max-width:100%;aspect-ratio:1;margin:0 auto 22px;position:relative;display:grid;place-items:center}
.chance-wheel{width:100%;height:100%;filter:drop-shadow(0 20px 30px rgba(0,0,0,.3));transition:transform 3.8s cubic-bezier(.12,.72,.12,1);will-change:transform}
.wheel-svg{display:block;width:100%;height:100%}
.wheel-label{fill:#fff;font:800 13px Vazirmatn,Tahoma,sans-serif;paint-order:stroke;stroke:rgba(15,17,22,.42);stroke-width:2.5px;letter-spacing:-.2px}
.wheel-hub{fill:#11151c;stroke:rgba(255,255,255,.5);stroke-width:7}
.wheel-pointer{position:absolute;z-index:3;top:-4px;left:50%;transform:translateX(-50%);width:36px;height:38px;border:0;background:#ffd166;clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 5px 7px rgba(0,0,0,.35))}
.spin-button{width:min(100%,360px);background:linear-gradient(135deg,#ffb14c,#e95d82 52%,#8a67ed);color:white;box-shadow:0 16px 38px rgba(221,91,126,.25)}
.spin-button:disabled{opacity:.58;filter:grayscale(.35);box-shadow:none}
.spin-status{color:var(--muted);font-size:.74rem;line-height:1.8}
.spin-prize{margin:16px auto 0;padding:16px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(255,185,74,.14),rgba(125,91,220,.14));border:1px solid rgba(255,201,112,.25)}
.spin-prize strong{font-size:.9rem}
.spin-prize small{color:var(--muted)}
body.light .wheel-card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(255,245,253,.9))}
body.light .wheel-hub{fill:#fff;stroke:rgba(80,62,113,.35)}
body.light .spin-meta span{background:rgba(255,255,255,.72);border-color:rgba(86,66,119,.14)}
.usage-updated{text-align:center;margin:-4px 0 18px!important}
.usage-rings{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.usage-ring{position:relative;min-width:0;padding:17px 8px;border-radius:24px;text-align:center;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));border:1px solid var(--line)}
.usage-ring:before{content:"";position:absolute;top:17px;left:50%;transform:translateX(-50%);width:min(34vw,150px);aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--ring-color) var(--ring),rgba(255,255,255,.075) 0);box-shadow:0 15px 35px rgba(0,0,0,.2)}
.usage-ring-core{position:relative;width:min(27vw,118px);aspect-ratio:1;margin:16px auto 34px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#171b22,#0c0e12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.usage-ring-core strong{font-size:1.35rem}
.usage-ring-core small{max-width:90px;margin-top:3px;color:var(--muted);font-size:.58rem;line-height:1.45}
.usage-ring>b{display:block;margin-top:12px;font-size:.75rem}
.usage-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.usage-date{margin-top:12px;padding:12px 14px;border-radius:14px;background:rgba(36,183,181,.08);border:1px solid rgba(36,183,181,.16);text-align:center;color:var(--muted);font-size:.7rem}
.light .usage-ring{background:rgba(255,255,255,.72)}
.light .usage-ring:before{background:conic-gradient(var(--ring-color) var(--ring),rgba(83,64,114,.09) 0)}
.light .usage-ring-core{background:linear-gradient(145deg,#fff,#f5effb);box-shadow:inset 0 1px 0 #fff,0 8px 22px rgba(86,66,119,.12)}
.admin-nav{overscroll-behavior-x:contain;scroll-behavior:smooth;touch-action:pan-x;outline:none}
.admin-nav:focus-visible{box-shadow:0 0 0 2px var(--primary),var(--shadow)}
.home-pending{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin:14px 0 2px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--warning) 42%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--warning) 10%,var(--surface-raised));box-shadow:var(--shadow-1)}
.home-pending .status-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--warning);color:var(--primary-ink);font-weight:900}.home-pending b,.home-pending small{display:block}.home-pending small{margin-top:3px;color:var(--text-muted);font-size:.68rem}.home-pending button,.home-wallet-strip,.home-promotion,.home-guide-card{font:inherit;cursor:pointer}
.home-pending button{border:0;border-radius:10px;padding:8px 11px;background:var(--surface-raised);color:var(--primary);font-size:.7rem;font-weight:800}
.home-action-heading{margin-top:22px}.empty-state h3{margin:5px 0}.empty-state p{margin:0;color:var(--text-muted);font-size:.72rem;line-height:1.8}
.home-wallet-strip,.home-guide-card{width:100%;border:1px solid var(--border);border-radius:20px;margin-top:12px;padding:16px;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:right;background:var(--surface-raised);box-shadow:var(--shadow-1);color:var(--text)}
.home-wallet-strip>span:first-child,.home-guide-card>span:first-child{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--primary)}.home-wallet-strip small,.home-guide-card small{display:block;color:var(--text-muted);font-size:.66rem}.home-wallet-strip b,.home-guide-card b{display:block;margin-top:3px;font-size:.84rem}.home-wallet-strip strong,.home-guide-card strong{color:var(--primary);font-size:.7rem}
.home-promotions{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}.home-promotion{min-width:0;border:1px solid var(--border);border-radius:20px;padding:15px;display:grid;grid-template-columns:auto 1fr;gap:10px;text-align:right;background:var(--surface-1);color:var(--text);box-shadow:var(--shadow-1)}.home-promotion>span:first-child{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--secondary) 14%,transparent);color:var(--secondary)}.home-promotion small,.home-promotion b{display:block}.home-promotion small{font-size:.63rem;color:var(--text-muted)}.home-promotion b{margin-top:4px;font-size:.75rem;line-height:1.65}.home-promotion i{grid-column:2;color:var(--primary);font-style:normal;font-size:.68rem;font-weight:800}
.plan-card.plan-row{display:grid;align-content:start}.plan-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:13px 0}.plan-meta span{min-width:0;padding:8px 7px;border-radius:11px;background:color-mix(in srgb,var(--surface-raised) 82%,transparent);border:1px solid color-mix(in srgb,var(--border) 70%,transparent)}.plan-meta small,.plan-meta b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.plan-meta small{font-size:.57rem;color:var(--text-muted)}.plan-meta b{margin-top:4px;font-size:.62rem;color:var(--text)}
.purchase-summary{margin-top:16px;border:1px solid var(--border);border-radius:18px;padding:14px;background:color-mix(in srgb,var(--surface-raised) 94%,var(--primary) 6%)}.purchase-summary-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--border) 72%,transparent)}.purchase-summary-head small{color:var(--text-muted);font-size:.64rem}.purchase-summary-head b{font-size:.77rem}.purchase-summary dl{margin:10px 0 0}.purchase-summary dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:5px 0}.purchase-summary dt{color:var(--text-muted);font-size:.66rem}.purchase-summary dd{margin:0;text-align:left;font-size:.7rem;font-weight:800}.payment-method{display:grid;gap:7px;margin-top:12px;color:var(--text-muted);font-size:.68rem}.payment-method select{width:100%;border:1px solid var(--border);border-radius:13px;padding:11px;background:var(--surface-raised);color:var(--text);outline:none}.payment-method select:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 34%,transparent)}.purchase-submit{width:100%;margin-top:12px}.purchase-submit:disabled{cursor:not-allowed;opacity:.62;filter:grayscale(.35);box-shadow:none}.payment-hint{min-height:2.8em;margin:8px 2px 0;color:var(--text-muted);font-size:.67rem;line-height:1.65}
.usage-visual{margin-top:4px}.usage-text{margin-top:14px}.usage-visual:focus-visible,.usage-text:focus-visible{outline:3px solid color-mix(in srgb,var(--focus) 55%,transparent);outline-offset:4px}
@media(max-width:520px){.home-promotions{grid-template-columns:1fr}.home-wallet-strip,.home-guide-card{padding:14px}.plan-grid{grid-template-columns:1fr}.plan-card h3{min-height:0}.purchase-summary dl>div{align-items:flex-start;flex-direction:column;gap:2px}.purchase-summary dd{text-align:right}}
.hero-emblem{position:absolute;left:5%;top:50%;width:190px;height:190px;transform:translateY(-50%);display:grid;place-items:center;z-index:1}
.emblem-halo{position:absolute;inset:9px;border-radius:50%;border:1px solid rgba(118,229,238,.28);box-shadow:inset 0 0 42px rgba(113,74,224,.15),0 0 45px rgba(35,193,209,.13);animation:emblemOrbit 12s linear infinite}
.emblem-halo:before,.emblem-halo:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(155,123,255,.26)}
.emblem-halo:before{inset:20px -8px;transform:rotate(52deg)}
.emblem-halo:after{inset:-8px 28px;transform:rotate(-38deg)}
.emblem-core{position:relative;width:100px;height:100px;border-radius:32px;display:grid;place-items:center;background:linear-gradient(145deg,#6e4de0,#237eb4 58%,#19b7b3);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 18px 55px rgba(66,86,218,.4);transform:rotate(-8deg)}
.emblem-core:before{content:"";position:absolute;inset:8px;border-radius:25px;border:1px solid rgba(255,255,255,.22)}
.emblem-core span{font:900 2.3rem/1 Vazirmatn,Tahoma,sans-serif;color:#fff;text-shadow:0 8px 20px rgba(0,0,0,.25);transform:rotate(8deg)}
.emblem-core>i{position:absolute;width:12px;height:12px;border-radius:50%;top:7px;right:8px;background:#8cf5eb;box-shadow:0 0 18px #63e9e1}
.emblem-signal{display:none}
.hero-emblem:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;top:25px;right:31px;background:#ffd56e;box-shadow:0 0 15px #ffc84b;animation:pulse 1.8s infinite}
body[data-logo-style="shield"] .emblem-halo{inset:18px;border-radius:36px;transform:rotate(45deg);animation:shieldFloat 5s ease-in-out infinite}
body[data-logo-style="shield"] .emblem-halo:before,body[data-logo-style="shield"] .emblem-halo:after{display:none}
body[data-logo-style="shield"] .emblem-core{width:108px;height:122px;border-radius:0;clip-path:polygon(50% 0,92% 15%,86% 70%,50% 100%,14% 70%,8% 15%);transform:none;background:linear-gradient(160deg,#35dcb8,#2875d6 55%,#6545c8)}
body[data-logo-style="shield"] .emblem-core:before{inset:10px;clip-path:inherit;border-radius:0;background:rgba(255,255,255,.08)}
body[data-logo-style="shield"] .emblem-core span{transform:none}
body[data-logo-style="pulse"] .emblem-halo{inset:15px;border-style:dashed;animation:emblemOrbit 18s linear infinite}
body[data-logo-style="pulse"] .emblem-core{border-radius:50%;transform:none;background:radial-gradient(circle at 35% 28%,#9ef4ff,#257da8 43%,#452d91 80%)}
body[data-logo-style="pulse"] .emblem-core span{transform:none}
body[data-logo-style="pulse"] .emblem-signal{display:block;position:absolute;inset:0}
body[data-logo-style="pulse"] .emblem-signal i{position:absolute;border:2px solid rgba(66,222,211,.36);border-radius:50%;animation:pulse 2.4s ease-out infinite}
body[data-logo-style="pulse"] .emblem-signal i:nth-child(1){inset:35px;animation-delay:0s}
body[data-logo-style="pulse"] .emblem-signal i:nth-child(2){inset:20px;animation-delay:.5s}
body[data-logo-style="pulse"] .emblem-signal i:nth-child(3){inset:5px;animation-delay:1s}
body[data-logo-style="crystal"] .emblem-halo{inset:20px;border-radius:30px;transform:rotate(45deg);animation:crystalGlow 4s ease-in-out infinite}
body[data-logo-style="crystal"] .emblem-halo:before,body[data-logo-style="crystal"] .emblem-halo:after{display:none}
body[data-logo-style="crystal"] .emblem-core{width:94px;height:94px;border-radius:24px;transform:rotate(45deg);background:linear-gradient(135deg,#a88cff,#4e79e4 52%,#32d6cf);box-shadow:inset 10px 10px 28px rgba(255,255,255,.24),0 18px 60px rgba(100,73,221,.48)}
body[data-logo-style="crystal"] .emblem-core span{transform:rotate(-45deg)}
body.light .emblem-core{box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 18px 50px rgba(98,79,168,.24)}
.logo-picker{border:1px solid var(--line);border-radius:20px;padding:16px;margin:0 0 18px}
.logo-picker legend{padding:0 8px;font-weight:900;font-size:.8rem}
.logo-picker>p{margin:0 0 12px;color:var(--muted);font-size:.68rem}
.logo-option-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.logo-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:10px 5px;border:1px solid var(--line);border-radius:15px;background:var(--card);cursor:pointer}
.logo-option input{position:absolute;opacity:0}
.logo-option:has(input:checked){border-color:var(--primary);box-shadow:0 0 0 2px rgba(124,92,255,.15);background:rgba(124,92,255,.08)}
.logo-option strong{font-size:.6rem}
.logo-mini{position:relative;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#6e4de0,#1cb7b2);box-shadow:0 8px 20px rgba(82,76,190,.24)}
.logo-mini b{color:#fff}
.logo-mini i{position:absolute;inset:4px;border:1px solid rgba(255,255,255,.35);border-radius:10px}
.logo-mini[data-logo-preview="shield"]{clip-path:polygon(50% 0,92% 15%,86% 70%,50% 100%,14% 70%,8% 15%);border-radius:0}
.logo-mini[data-logo-preview="pulse"]{border-radius:50%;background:radial-gradient(circle at 35% 28%,#9ef4ff,#257da8 45%,#452d91 82%)}
.logo-mini[data-logo-preview="crystal"]{transform:rotate(45deg);border-radius:12px}
.logo-mini[data-logo-preview="crystal"] b{transform:rotate(-45deg)}
@keyframes emblemOrbit{to{transform:rotate(360deg)}
}
@keyframes shieldFloat{0%,100%{transform:rotate(45deg) translateY(0)}
50%{transform:rotate(45deg) translateY(-5px)}
}
@keyframes crystalGlow{0%,100%{transform:rotate(45deg) scale(.95);opacity:.65}
50%{transform:rotate(45deg) scale(1.04);opacity:1}
}
@media(pointer:fine){.admin-nav{scrollbar-width:thin;scrollbar-color:var(--primary) transparent;padding-bottom:12px}
.admin-nav::-webkit-scrollbar{display:block;height:6px}
.admin-nav::-webkit-scrollbar-track{background:transparent}
.admin-nav::-webkit-scrollbar-thumb{background:var(--primary);border-radius:99px}
}
@media(max-width:640px){.wheel-card{padding:18px 10px}
.wheel-stage{width:100%;max-width:370px}
.wheel-label{font-size:12px}
.discount-row{grid-template-columns:1fr auto}
.wallet-charge{width:100%}
.usage-ring{padding:13px 5px}
.usage-ring-core strong{font-size:1.05rem}
.usage-ring>b{font-size:.68rem}
.hero-emblem{left:-28px;opacity:.82}
.logo-option-grid{grid-template-columns:1fr 1fr}
}
@keyframes pulse{0%,100%{transform:scale(.7);opacity:.15}
50%{transform:scale(1);opacity:.8}
}
@keyframes spin{to{transform:rotate(360deg)}
}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}
to{opacity:1;transform:none}
}
@keyframes sheetIn{from{transform:translateY(100%)}
to{transform:none}
}
@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}
to{opacity:1;transform:none}
}
@keyframes shimmer{to{background-position:-300% 0}
}
/* Compatibility aliases are defined by the authoritative Rahyab skin blocks. */
.ambient{display:none}
h1,h2,.hero h1,.page-title h1,.profile-hero h1,.public-site h1,.public-site h2{
  font-family:var(--font-display);font-weight:400;letter-spacing:0
}
.ui-icon{width:1.35em;height:1.35em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
button,a,input,textarea,select{outline-offset:3px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.glass,.light .glass{
  background:linear-gradient(155deg,color-mix(in srgb,var(--card) 96%,white 4%),var(--card));
  border:1px solid var(--line);box-shadow:none;backdrop-filter:none
}
.button{
  min-height:44px;border-radius:13px;padding:11px 18px;transition:transform .18s var(--ease),background .18s,color .18s,border-color .18s;
  position:relative;isolation:isolate
}
.button:before{content:"";position:absolute;inset:3px;border:1px solid rgba(255,255,255,.12);border-radius:9px;pointer-events:none}
.button.glow,.button.primary{
  color:#fff;background:linear-gradient(180deg,#2b63b4,#174d9a);border:1px solid #5a91dc;
  box-shadow:0 7px 0 #0e3f85,0 11px 22px rgba(9,42,84,.22)
}
.button.glow:active,.button.primary:active{transform:translateY(3px);box-shadow:0 4px 0 #0e3f85,0 7px 14px rgba(9,42,84,.18)}
.button.secondary{color:var(--text);background:var(--card);border:1px solid var(--line);box-shadow:none}
.button.admin{color:#fff;background:linear-gradient(180deg,#b46c42,#8f4d2d);box-shadow:0 7px 0 #66331f}
/* Public browser surface */
.public-site{position:relative;z-index:2;min-height:100vh}
.public-nav{
  width:min(1180px,calc(100% - 40px));height:84px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--line)
}
.public-brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none}
.public-brand>span:last-child{display:flex;flex-direction:column}
.public-brand b{font:400 1.05rem Lalezar,"B Titr",sans-serif}
.public-brand small{color:var(--muted);font-size:.65rem}
.signal-seal{
  width:46px;height:46px;border:2px solid var(--copper);border-radius:50%;position:relative;display:grid;place-items:center;
  background:var(--ink);box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--copper) 24%,transparent),0 7px 16px rgba(0,0,0,.14)
}
.signal-seal:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(121,208,167,.13)}
.signal-seal i{position:absolute;width:2px;background:var(--copper);bottom:9px;right:50%;transform-origin:bottom}
.signal-seal i:nth-child(1){height:10px;transform:translateX(50%) rotate(0)}
.signal-seal i:nth-child(2){height:16px;transform:translateX(50%) rotate(48deg)}
.signal-seal i:nth-child(3){height:16px;transform:translateX(50%) rotate(-48deg)}
.signal-seal.large{width:72px;height:72px;flex:0 0 auto}
body[data-logo-style="shield"] .signal-seal{border-radius:12px;clip-path:polygon(50% 0,92% 15%,86% 70%,50% 100%,14% 70%,8% 15%)}
body[data-logo-style="pulse"] .signal-seal{border-style:dashed}
body[data-logo-style="crystal"] .signal-seal{border-radius:10px;transform:rotate(45deg)}
body[data-logo-style="crystal"] .signal-seal i{transform-origin:bottom}
.public-nav-actions,.public-cta-row{display:flex;align-items:center;gap:12px}
.public-nav .button{min-height:42px;padding:9px 16px;text-decoration:none}
.public-hero{
  width:min(1180px,calc(100% - 40px));min-height:650px;margin:0 auto;padding:72px 0 64px;
  display:grid;grid-template-columns:minmax(0,.86fr) minmax(470px,1.14fr);gap:72px;align-items:center
}
.public-hero-copy{max-width:510px}
.public-hero h1{font-size:clamp(3rem,5.8vw,5.65rem);line-height:1.03;margin:20px 0 24px}
.public-hero h1 em{font-style:normal;color:var(--primary)}
.public-hero-copy>p{font-size:1rem;line-height:2;color:var(--muted);max-width:48ch;margin:0 0 28px}
.public-cta-row a{text-decoration:none}
.public-cta-row .primary{padding-inline:24px}
.public-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:30px;color:var(--muted);font-size:.72rem}
.public-trust span{display:flex;align-items:center;gap:7px}
.public-trust i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 13%,transparent)}
.public-instrument{
  position:relative;padding:18px 24px 24px;border:1px solid color-mix(in srgb,var(--copper) 55%,var(--line));
  border-radius:22px;background:linear-gradient(165deg,#1f2528,#0c0f11 72%);color:#f3f1e9;
  box-shadow:0 24px 70px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.08)
}
.public-instrument:before,.public-instrument:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#6d4a39;border:1px solid #d7a17c;top:10px}
.public-instrument:before{right:10px}
.public-instrument:after{left:10px}
.instrument-head{display:flex;justify-content:space-between;align-items:center;padding:4px 3px 17px;border-bottom:1px solid rgba(231,190,154,.18)}
.instrument-head span{display:flex;align-items:center;gap:9px;font-weight:800}
.instrument-head span i{width:9px;height:9px;border-radius:50%;background:#79d0a7;box-shadow:0 0 0 4px rgba(121,208,167,.12)}
.instrument-head>b{font:600 .62rem/1 Consolas,monospace;color:#d6a07c;letter-spacing:.16em}
.instrument-row{display:grid;grid-template-columns:175px 1fr;gap:20px;align-items:center;padding:26px 2px;border-bottom:1px solid rgba(231,190,154,.12)}
.instrument-row>div:first-child{display:flex;flex-direction:column}
.instrument-row small{color:#9eaaab;font-size:.72rem}
.instrument-row strong{font-size:2.25rem;margin-top:5px}
.instrument-row strong em{font-style:normal;font-size:.68rem;color:#aab4b4}
.instrument-track{height:8px;border:1px solid #b87953;border-radius:2px;position:relative;background:#07090a;box-shadow:inset 0 2px 4px #000}
.instrument-track>i{display:block;width:var(--level);height:100%;background:#4e8ee7;box-shadow:inset 0 1px rgba(255,255,255,.35)}
.instrument-track.mint>i{background:#79d0a7}
.instrument-track>b{position:absolute;width:14px;height:20px;right:calc(var(--level) - 7px);top:50%;transform:translateY(-50%);border:1px solid #e2aa84;background:linear-gradient(90deg,#6e3825,#d48658,#6e3825)}
.instrument-track span{position:absolute;top:15px;font-size:.55rem;color:#7f8d8e}
.instrument-track span:first-of-type{right:0}
.instrument-track span:last-child{left:0}
.instrument-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.instrument-actions span{text-align:center;padding:10px 5px;border:1px solid rgba(231,190,154,.18);border-radius:10px;font-size:.66rem;background:#171b1d}
.public-route{
  width:min(1180px,calc(100% - 40px));margin:0 auto 100px;display:grid;grid-template-columns:repeat(3,1fr);
  border-block:1px solid var(--line);position:relative
}
.public-route:before{content:"";position:absolute;top:50%;right:0;left:0;height:2px;background:var(--copper);opacity:.65}
.public-route article{position:relative;z-index:1;display:flex;gap:15px;align-items:center;padding:27px;background:var(--bg)}
.public-route article+article{border-right:1px solid var(--line)}
.public-route article>span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;border:2px solid var(--copper);font-size:.72rem}
.public-route article div{display:flex;flex-direction:column}
.public-route b{font-size:.86rem}
.public-route small{color:var(--muted);font-size:.66rem;margin-top:4px}
.public-capabilities{
  width:min(1180px,calc(100% - 40px));margin:0 auto 110px;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:90px;align-items:start
}
.public-section-copy{position:sticky;top:30px}
.public-section-copy h2,.public-close h2{font-size:clamp(2rem,3.6vw,3.6rem);line-height:1.15;margin:15px 0}
.public-section-copy p,.public-close p{color:var(--muted);line-height:1.9;max-width:48ch}
.capability-list{border-top:1px solid var(--line)}
.capability-list article{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:26px 4px;border-bottom:1px solid var(--line)}
.capability-list article>span{color:var(--primary);font-size:1.35rem;padding-top:2px}
.capability-list b{font-size:1rem}
.capability-list p{margin:7px 0 0;color:var(--muted);line-height:1.8;font-size:.77rem}
.public-close{
  width:min(1180px,calc(100% - 40px));margin:0 auto 46px;padding:42px;display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center;
  border:1px solid var(--line);background:var(--card)
}
.public-close:before{content:"";position:absolute;right:0;top:24px;bottom:24px;width:3px;background:var(--copper)}
.public-close{position:relative}
.public-close small{color:var(--copper)}
.public-close h2{font-size:2rem;margin:5px 0}
.public-close p{margin:0;font-size:.75rem}
.public-close a{text-decoration:none}
.public-admin-access{
  width:min(980px,calc(100% - 40px));margin:0 auto 70px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);
  gap:0;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow)
}
.admin-access-copy{padding:42px;min-width:0}
.admin-access-copy>.signal-seal{margin-bottom:26px}
.admin-access-copy>small{display:block;color:var(--copper);margin-bottom:6px}
.admin-access-copy h2{font-size:clamp(2rem,3.6vw,3.35rem);line-height:1.12;margin:0 0 14px}
.admin-access-copy p{max-width:52ch;color:var(--muted);line-height:1.95;font-size:.82rem}
.admin-access-copy ul{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:10px;color:var(--muted);font-size:.74rem}
.admin-access-copy li{display:flex;align-items:center;gap:10px}
.admin-access-copy li:before{content:"";width:8px;height:8px;border:2px solid var(--green);border-radius:50%;flex:0 0 auto}
.admin-access-form{
  padding:30px;background:linear-gradient(155deg,#1d2326,#0d1012);color:#f3f1e9;
  border-inline-start:1px solid rgba(231,190,154,.18);display:flex;flex-direction:column;justify-content:center
}
.access-form-head{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:center;margin-bottom:28px;color:#d6a07c}
.access-form-head>span{width:9px;height:9px;border-radius:50%;background:#79d0a7;box-shadow:0 0 0 4px rgba(121,208,167,.12)}
.access-form-head b{font:600 .68rem/1 Consolas,monospace;letter-spacing:.13em}
.access-form-head i{width:42px;height:2px;background:#c4774c}
.admin-access-form>label{font-size:.72rem;margin:0 0 7px;color:#d7dddd}
.admin-access-form>input,.password-control{width:100%;min-height:48px;margin-bottom:18px;border:1px solid rgba(231,190,154,.25);border-radius:10px;background:#0a0d0f;color:#f3f1e9}
.admin-access-form>input{padding:11px 13px}
.password-control{display:flex;overflow:hidden}
.password-control input{flex:1;min-width:0;border:0;background:transparent;color:inherit;padding:11px 13px;outline:none}
.password-control button{min-width:64px;border:0;border-inline-start:1px solid rgba(231,190,154,.2);background:#171c1f;color:#d6a07c;cursor:pointer}
.password-control:focus-within,.admin-access-form>input:focus{border-color:#d6a07c;box-shadow:0 0 0 3px rgba(196,119,76,.16)}
.admin-access-form>.button{width:100%;margin-top:6px}
.admin-access-form>small{color:#9eaaab;line-height:1.8;margin-top:14px}
.access-form-status{min-height:24px;margin:0 0 6px;color:#ff9c8d;font-size:.72rem;line-height:1.7}
.public-footer{width:min(1180px,calc(100% - 40px));margin:auto;padding:30px 0 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:.7rem}
/* Private Mini App */
.app{max-width:1240px}
.topbar{
  height:calc(80px + var(--safe-top));padding:calc(15px + var(--safe-top)) 22px 10px;
  background:linear-gradient(to bottom,color-mix(in srgb,var(--bg) 96%,transparent),color-mix(in srgb,var(--bg) 72%,transparent),transparent);
  backdrop-filter:blur(10px)
}
.profile-chip b{font-size:.82rem}
.avatar{border-radius:50%;background:var(--ink);box-shadow:none;border:2px solid var(--copper)}
.icon-button,.balance-pill{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.icon-button{width:44px;height:44px;border-radius:12px}
.balance-pill{border-radius:12px}
.viewport{padding:12px 22px calc(106px + var(--safe-bottom))}
.page{animation:pageIn .28s var(--ease)}
.hero{
  min-height:300px;padding:38px 40px;border-radius:16px;align-items:center;
  background:linear-gradient(110deg,var(--card) 0 62%,color-mix(in srgb,var(--primary) 18%,var(--card)))!important;
  border:1px solid var(--line);box-shadow:none
}
.hero:before{content:"";position:absolute;right:0;left:0;bottom:28px;height:2px;background:linear-gradient(90deg,transparent,var(--copper) 13% 87%,transparent);opacity:.7;animation:railWake .7s var(--ease) both}
.hero:after{display:none}
.hero-copy{max-width:66%}
.eyebrow{color:var(--copper);letter-spacing:0;font-size:.7rem}
.eyebrow i{background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 13%,transparent)}
.hero h1,.page-title h1{font-size:clamp(2rem,6.4vw,3.6rem);line-height:1.18;margin:14px 0 8px;letter-spacing:0}
.hero h1 em{color:var(--primary2);background:none}
.hero p,.page-title p{max-width:62ch;color:var(--muted);font-size:.8rem}
.hero-emblem{left:5%;width:170px;height:170px}
.emblem-halo{border-color:var(--copper);box-shadow:none}
.emblem-halo:before,.emblem-halo:after{border-color:color-mix(in srgb,var(--copper) 45%,transparent)}
.emblem-core,.light .emblem-core{border-radius:50%;transform:none;background:var(--ink);border:3px solid var(--copper);box-shadow:inset 0 0 0 5px rgba(255,255,255,.04)}
.emblem-core span{transform:none;font-family:Lalezar,"B Titr",sans-serif}
.emblem-core>i{background:var(--green);box-shadow:0 0 0 5px rgba(121,208,167,.12)}
.section-head{margin-top:30px}
.section-head h2{font-size:1.12rem}
.text-button{color:var(--primary2);font-weight:800}
.metric-grid{gap:10px}
.metric{border-radius:15px;padding:14px;background:var(--card)!important;box-shadow:none}
.metric-icon{width:38px;height:38px;border-radius:50%;background:transparent!important;border:1px solid var(--line);color:var(--primary2)!important}
.metric b{font-family:Lalezar,"B Titr",sans-serif}
.quick-grid{position:relative;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:20px;padding-block:20px}
.quick-grid:before{content:"";position:absolute;right:2%;left:2%;top:50%;height:3px;background:var(--copper);opacity:.72}
.quick-grid button,.quick-grid .chance-entry{
  position:relative;z-index:1;min-height:94px;padding:14px 10px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:none
}
.quick-grid button:hover{transform:translateY(-3px);border-color:var(--copper)}
.quick-grid span,.quick-grid .chance-entry span{grid-row:auto;width:34px;height:34px;border-radius:50%;background:var(--ink);border:1px solid var(--copper);color:#fff}
.quick-grid b{margin-top:7px}
.quick-grid small{font-size:.61rem}
.page-title{padding-top:34px;border-bottom:1px solid var(--line);margin-bottom:18px}
.page-title h1{font-size:2.35rem}
.filter-row{position:sticky;top:80px;z-index:11;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px)}
.filter-row button,.admin-nav button{border-radius:10px;background:var(--card);min-height:44px}
.filter-row button.active,.admin-nav button.active{background:var(--world-accent);color:var(--world-accent-ink);border-color:var(--copper);box-shadow:inset 4px 0 var(--copper)}
.plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.plan-card{border-radius:17px;padding:20px}
.plan-card:before{display:none}
.plan-card .plan-panel{color:var(--copper)}
.plan-card h3{font-size:1.02rem}
.chip{border-radius:7px}
.order-card,.ticket-card,.admin-row{border-radius:15px;background:var(--card);box-shadow:none}
.status{border-radius:7px;border:1px solid currentColor;background:transparent!important}
.order-actions button,.mini-button{border-radius:9px;min-height:44px}
.progress{height:10px;border:1px solid var(--line);border-radius:3px;background:var(--bg)}
.progress i{border-radius:1px;background:var(--primary)}
.wallet-card{
  border-radius:16px;background:linear-gradient(110deg,#123561,#174d87 65%,#163a50);border:1px solid #5d8ebe;box-shadow:none
}
.wallet-shine{display:none}
.notice{border-radius:12px}
.notice span{border-radius:50%}
.compose-card,.referral-card,.prose,.settings-list,.chart-card,.wheel-card{border-radius:16px}
.guide-grid article{border-radius:15px}
.guide-grid span{border-radius:50%;background:var(--ink);border:1px solid var(--copper);color:#fff}
.profile-hero .avatar.large{border-radius:50%}
.settings-list button{min-height:52px}
.admin-metrics{gap:8px}
.admin-metric{border-radius:13px}
.bar-chart i{background:var(--primary);border-radius:2px 2px 0 0}
.admin-nav{position:sticky;top:78px;z-index:12;background:var(--bg);border-radius:12px;box-shadow:0 10px 24px color-mix(in srgb,var(--bg) 86%,transparent)}
.toolbar-select,.toolbar-search,.field input,.field textarea,.field select,.compose-card textarea,.search-box input,.discount-row input{
  border-radius:10px;background:var(--card);color:var(--text)
}
.check-field{border-radius:10px;background:var(--card)}
.copy-field{border-radius:10px}
.copy-field button{background:var(--ink)}
.modal-sheet,.light .modal-sheet{border-radius:22px 22px 0 0;background:var(--card-solid);border-color:var(--line)}
.bottom-nav{
  background:color-mix(in srgb,var(--bg) 96%,transparent);border-top:1px solid var(--line);backdrop-filter:blur(12px)
}
.bottom-nav button{color:var(--muted)}
.bottom-nav button.active{color:var(--primary2)}
.bottom-nav button.active:after{content:"";width:22px;height:2px;background:var(--copper);position:absolute;bottom:2px}
.bottom-nav button{position:relative}
.toast{border-radius:11px;background:var(--card-solid);border-color:var(--line)}
.modal-close{width:44px;height:44px}
body small{font-size:max(.72rem,12px)!important}
.bottom-nav b,.logo-option strong{font-size:max(.66rem,11px)}
.browser-credentials{grid-column:1/-1;margin-bottom:12px;padding:22px;border:1px solid var(--line);background:var(--card)}
.credential-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.credential-heading h2{margin:4px 0 0;font-size:1.18rem}
.credential-heading small{color:var(--copper)}
.credential-explainer,.credential-hint{color:var(--muted);line-height:1.9;font-size:.74rem}
.credential-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.credential-form>label{display:flex;flex-direction:column;gap:7px;font-size:.72rem}
.credential-form input{min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);padding:11px 13px}
.credential-form input:focus{border-color:var(--copper)}
.credential-hint{grid-column:1/-1;margin:0}
.credential-form>.button{align-self:end}
.credential-disable{color:var(--danger)!important}
body.light .hero{color:var(--text);background:linear-gradient(110deg,#fffdf7 0 62%,#dcefee)!important}
body.light .hero p{color:var(--muted)}
body.light .hero .eyebrow{color:var(--copper)}
body.light .quick-grid .chance-entry,body.light .quick-grid button,body.light .glass,body.light .order-card,body.light .ticket-card,body.light .admin-row{background:var(--card)}
body.light .topbar{background:linear-gradient(to bottom,rgba(243,241,234,.98),rgba(243,241,234,.8),transparent)}
body.light .bottom-nav{background:rgba(243,241,234,.96)}
body.light .field input,body.light .field textarea,body.light .field select,body.light .compose-card textarea,body.light .discount-row input{background:var(--card);color:var(--text)}
body.light .notice.info{background:#e3f3ef;border-color:#bbdcd2;color:#28594c}
body.light .button.secondary{color:var(--text);background:var(--card);border-color:var(--line)}
body.light .wheel-card{background:var(--card)}
@media(min-width:980px){
  .app{padding-right:108px}
.topbar{padding-right:24px}
.bottom-nav{
    top:112px;bottom:auto;right:max(18px,calc((100vw - 1240px)/2));transform:none;width:78px;
    grid-template-columns:1fr;padding:10px 7px;border:1px solid var(--line);border-radius:17px;gap:5px
  }
.bottom-nav button{min-height:62px;border-radius:10px}
.bottom-nav button.active{background:var(--ink);color:#fff}
.bottom-nav button.active:after{right:5px;top:50%;bottom:auto;width:3px;height:24px;transform:translateY(-50%);background:var(--copper)}
.bottom-nav b{font-size:.57rem}
.viewport{padding-left:28px}
.admin-page{max-width:none}
.admin-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.admin-content>.admin-row{margin:0}
.admin-content>form,.admin-content>.empty-box,.admin-content>.section-head,.admin-content>.admin-toolbar,.admin-content>.toolbar-search,.admin-content>.logo-picker{grid-column:1/-1}
}
@media(max-width:979px){
  .public-hero{grid-template-columns:1fr;gap:42px;padding-top:50px}
.public-hero-copy{max-width:650px}
.public-capabilities{grid-template-columns:1fr;gap:30px}
.public-section-copy{position:static;max-width:620px}
.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.public-admin-access{grid-template-columns:1fr}
.admin-access-form{border-inline-start:0;border-top:1px solid rgba(231,190,154,.18)}
}
@media(max-width:700px){
  .public-nav{width:calc(100% - 28px);height:72px}
.public-nav .public-bot-link{display:none}
.public-hero{width:calc(100% - 28px);padding:42px 0 46px;grid-template-columns:1fr}
.public-hero h1{font-size:clamp(2.65rem,13vw,4.2rem)}
.public-hero-copy>p{font-size:.85rem}
.public-cta-row{align-items:stretch;flex-direction:column}
.public-cta-row a{text-align:center}
.public-instrument{padding:16px}
.instrument-row{grid-template-columns:1fr;padding:19px 0;gap:14px}
.instrument-row>div:first-child{flex-direction:row;align-items:end;justify-content:space-between}
.instrument-row strong{font-size:1.7rem}
.instrument-actions{grid-template-columns:1fr 1fr}
.public-route{width:calc(100% - 28px);grid-template-columns:1fr;margin-bottom:72px}
.public-route:before{top:20px;bottom:20px;right:47px;left:auto;width:2px;height:auto}
.public-route article{padding:20px 14px;background:transparent}
.public-route article+article{border-right:0;border-top:1px solid var(--line)}
.public-capabilities{width:calc(100% - 28px);margin-bottom:72px}
.capability-list article{grid-template-columns:42px 1fr}
.public-close{width:calc(100% - 28px);grid-template-columns:1fr;padding:28px;gap:16px}
.public-close .signal-seal{display:none}
.public-close a{text-align:center}
.public-admin-access{width:calc(100% - 28px);margin-bottom:48px}
.admin-access-copy,.admin-access-form{padding:26px 22px}
.public-footer{width:calc(100% - 28px)}
.hero{min-height:310px;padding:28px 24px}
.hero-copy{max-width:76%}
.hero-emblem{left:-38px;opacity:.58}
.hero h1{font-size:2.15rem}
.quick-grid{display:flex;overflow-x:auto;gap:8px;margin-inline:0;padding-inline:16px;scroll-snap-type:x mandatory}
.quick-grid:before{right:0;left:0}
.quick-grid button,.quick-grid .chance-entry{min-width:142px;scroll-snap-align:start}
.plan-grid{grid-template-columns:1fr}
.admin-metrics{grid-template-columns:1fr 1fr}
.guide-grid{grid-template-columns:1fr}
.credential-form{grid-template-columns:1fr}
.credential-form>.button{width:100%}
}
@media(max-width:390px){
  .hero-copy{max-width:84%}
.hero h1{font-size:1.85rem}
.hero-emblem{left:-62px}
.public-trust{gap:11px}
.public-brand small{display:none}
.instrument-actions{font-size:.6rem}
}
@media(prefers-reduced-motion:reduce){
  .quick-grid button:hover{transform:none}
}
@keyframes railWake{from{clip-path:inset(0 100% 0 0)}
to{clip-path:inset(0 0 0 0)}
}
/* Detector hardening for legacy base rules; these are the production-computed values. */
.hero h1 em,body.light .hero h1 em{color:var(--primary2);background:none;background-clip:border-box}
.progress i{transition:none}
.ticket-reply{border:1px solid color-mix(in srgb,var(--green) 32%,transparent);border-right-width:1px}
.wheel-pointer{
  width:36px;height:38px;border:0;background:#ffd166;
  clip-path:polygon(0 0,100% 0,50% 100%)
}


/* ──────────────────────────────────────────────────────────────────────────
   BORDERLESS WORLDS — white-label visual system
   Three production skins share one accessible interaction and layout model.
   ────────────────────────────────────────────────────────────────────────── */
body {
  background:
    radial-gradient(circle at 12% 2%, var(--world-glow), transparent 28rem),
    var(--world-bg);
  color: var(--world-ink);
  transition: background-color .45s var(--world-ease), color .3s ease;
}
.glass,
.topbar,
.bottom-nav,
.public-nav {
  color: var(--world-ink);
  border-color: var(--world-line);
  background-color: var(--world-panel);
  backdrop-filter: blur(24px) saturate(125%);
}
.button.primary,
.button.glow,
.button.admin {
  color: var(--world-accent-ink);
  background: var(--world-accent);
  border-color: color-mix(in srgb, var(--world-accent) 72%, white);
  box-shadow: 0 12px 32px var(--world-glow);
}
.button.primary:hover,
.button.glow:hover,
.button.admin:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 44px var(--world-glow);
}
.button.secondary,
.mini-button {
  color: var(--world-ink);
  border-color: var(--world-line);
  background: color-mix(in srgb, var(--world-panel-solid) 82%, transparent);
}
.eyebrow,
.text-button,
.public-brand small,
.page-title p,
.admin-command-head p,
.browser-account-card p,
.settings-intro p {
  color: var(--world-muted);
}
.eyebrow i,
.live-chip i {
  background: var(--world-accent);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--world-accent) 18%, transparent);
}

/* Cinematic threshold shared by the public site and signed-in home. */
.brand-stage {
  isolation: isolate;
  position: relative;
  overflow: clip;
  border: 1px solid var(--world-line);
  background: var(--world-panel-solid);
}
.private-stage-backdrop {
  position: absolute;
  z-index: -2;
  inset: -20px;
  background:
    radial-gradient(circle at 18% 24%, color-mix(in srgb,var(--primary) 32%,transparent), transparent 34%),
    linear-gradient(145deg,var(--surface-2),var(--bg));
  background-position: center;
  background-size: cover;
  transform: translate3d(var(--pointer-x, 0), var(--pointer-y, 0), 0) scale(1.035);
  transition:transform .8s var(--world-ease);
  animation: world-reveal 1.15s var(--world-ease) both;
}
.brand-stage::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(4, 6, 8, .14), rgba(4, 6, 8, .76) 54%, rgba(4, 6, 8, .94)),
    linear-gradient(0deg, rgba(4, 6, 8, .62), transparent 58%);
}
[dir="rtl"] .brand-stage::after {
  background:
    linear-gradient(270deg, rgba(4, 6, 8, .14), rgba(4, 6, 8, .76) 54%, rgba(4, 6, 8, .94)),
    linear-gradient(0deg, rgba(4, 6, 8, .62), transparent 58%);
}
.brand-stage .public-hero-copy,
.brand-stage .hero-copy {
  position: relative;
  z-index: 2;
  color: #fff;
}
.brand-stage .eyebrow,
.brand-stage p {
  color: rgba(255, 255, 255, .76);
}
.boundary-lines {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
}
.boundary-lines i {
  position: absolute;
  top: -20%;
  bottom: -20%;
  width: 1px;
  background: linear-gradient(transparent, color-mix(in srgb, var(--world-accent) 86%, white), transparent);
  box-shadow: 0 0 22px var(--world-glow);
  transform: rotate(13deg);
  opacity: .58;
  animation: boundary-drift 7s ease-in-out infinite alternate;
}
.boundary-lines i:nth-child(1) { right: 37%; }
.boundary-lines i:nth-child(2) { right: 42%; animation-delay: -2s; opacity: .3; }
.boundary-lines i:nth-child(3) { right: 48%; animation-delay: -4s; opacity: .18; }
.public-hero {
  min-height: min(720px, 78vh);
  padding: clamp(2rem, 7vw, 6.75rem);
  border-radius: 0;
}
.public-hero-copy {
  width: min(650px, 62%);
  align-self: end;
  padding-block: clamp(2rem, 8vh, 6rem);
}
.public-hero h1 {
  max-width: 11ch;
  font-size: clamp(3.1rem, 7.2vw, 7.4rem);
  line-height: .97;
  letter-spacing: -.055em;
}
.public-hero h1 em {
  color: var(--world-accent);
  text-shadow: 0 0 42px var(--world-glow);
}
.public-instrument {
  align-self: end;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(4,7,8,.66);
  backdrop-filter: blur(20px);
  color: #fff;
}
.public-route article,
.capability-list article,
.public-admin-access,
.public-close {
  border-color: var(--world-line);
  background: var(--world-panel);
  color: var(--world-ink);
}
.public-route article:hover,
.capability-list article:hover {
  border-color: color-mix(in srgb, var(--world-accent) 60%, var(--world-line));
  transform: translateY(-4px);
}
.public-admin-access {
  position: relative;
  overflow: hidden;
}
.public-admin-access::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(var(--world-accent), var(--world-accent-2));
}
.admin-access-form,
.browser-account-card,
.browser-credentials,
.brand-settings-form,
.brand-banner-control {
  border-color: var(--world-line);
  background: color-mix(in srgb, var(--world-panel-solid) 90%, transparent);
  color: var(--world-ink);
}

/* Account handoff: credentials are legible, copyable and intentionally sober. */
.browser-account-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1.4rem;
  border: 1px solid var(--world-line);
  border-radius: 18px;
}
.browser-account-card code {
  padding: .72rem 1rem;
  color: var(--world-accent);
  border: 1px dashed color-mix(in srgb, var(--world-accent) 42%, transparent);
  background: color-mix(in srgb, var(--world-accent) 7%, transparent);
}
.browser-account-card .button { grid-column: 1 / -1; justify-self: start; }
.credential-reveal { display: grid; gap: 1rem; }
.credential-reveal label { display: grid; gap: .45rem; }
.credential-reveal code {
  overflow-wrap: anywhere;
  padding: 1rem;
  border: 1px solid var(--world-line);
  background: var(--world-panel-solid);
  color: var(--world-accent);
  font-size: 1rem;
}

/* Admin command deck: persistent rail on wide screens, swipeable tabs on mobile. */
.admin-page { max-width: 1500px; }
.admin-command-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--world-line);
}
.admin-command-head h1 {
  margin: .25rem 0;
  font-size: clamp(2.1rem, 4vw, 4.3rem);
  letter-spacing: -.045em;
}
.admin-command-head h1 b { color: var(--world-accent); }
.live-chip {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .6rem .85rem;
  border: 1px solid var(--world-line);
  border-radius: 999px;
  color: var(--world-muted);
}
.live-chip i { width: .45rem; height: .45rem; border-radius: 50%; animation: live-pulse 1.8s ease-out infinite; }
.admin-metrics {
  margin-bottom: 1.25rem;
  border-top: 1px solid var(--world-line);
  border-bottom: 1px solid var(--world-line);
}
.admin-metric {
  background: transparent;
  border: 0;
  border-inline-start: 1px solid var(--world-line);
}
.admin-metric strong { color: var(--world-ink); font-size: clamp(1.25rem, 2vw, 2rem); }
.admin-workspace {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  align-items: start;
  gap: 1.25rem;
}
.admin-nav-toggle { display: none; }
.admin-nav {
  position: sticky;
  top: 96px;
  display: grid;
  gap: .8rem;
  max-height: calc(100vh - 120px);
  overflow-x: clip;
  overflow-y: auto;
  padding: .55rem;
  border-radius: 16px;
}
.admin-nav-group { display: grid; gap: .2rem; min-width: 0; }
.admin-nav-group-label { padding: .35rem .55rem .15rem; color: var(--world-muted); font-size: .64rem; font-weight: 800; letter-spacing: .04em; }
.admin-nav button {
  display: grid;
  grid-template-columns: 2rem 1fr;
  align-items: center;
  min-width: 0;
  width: 100%;
  padding: .72rem .8rem;
  color: var(--world-muted);
  border: 1px solid transparent;
  border-radius: 11px;
  text-align: start;
}
.admin-nav button span {
  display: grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  color: var(--world-accent);
  border: 1px solid var(--world-line);
  border-radius: 8px;
}
.admin-nav button.active {
  color: var(--world-ink);
  border-color: color-mix(in srgb, var(--world-accent) 38%, var(--world-line));
  background: color-mix(in srgb, var(--world-accent) 10%, transparent);
}
.admin-main-column { min-width: 0; display: grid; gap: 1rem; }
.chart-card,
.admin-content {
  border: 1px solid var(--world-line);
  border-radius: 18px;
  background: var(--world-panel);
}
.admin-content { min-height: 240px; padding: clamp(1rem, 2vw, 1.5rem); }
.admin-row {
  border-color: var(--world-line);
  background: color-mix(in srgb, var(--world-panel-solid) 76%, transparent);
}
.admin-row:hover { border-color: color-mix(in srgb, var(--world-accent) 42%, var(--world-line)); }

/* White-label studio. */
.brand-settings-form,
.brand-banner-control {
  display: grid;
  gap: 1.1rem;
  margin-bottom: 1rem;
  padding: clamp(1rem, 2.5vw, 1.75rem);
  border: 1px solid var(--world-line);
  border-radius: 18px;
}
.settings-intro {
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--world-line);
}
.visual-template-picker { padding: 0; border: 0; }
.visual-template-picker legend { margin-bottom: .45rem; font-weight: 800; }
.visual-template-picker > p { margin: 0 0 1rem; color: var(--world-muted); }
.visual-template-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.visual-template-option {
  position: relative;
  display: grid;
  gap: .5rem;
  padding: .55rem;
  border: 1px solid var(--world-line);
  border-radius: 14px;
  background: var(--world-panel-solid);
  cursor: pointer;
  transition: transform .3s var(--world-ease), border-color .2s ease;
}
.visual-template-option:hover { transform: translateY(-3px); }
.visual-template-option:has(input:checked) {
  border-color: var(--world-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--world-accent) 14%, transparent);
}
.visual-template-option:has(input:focus-visible) {
  outline:3px solid var(--focus);
  outline-offset: 3px;
}
.visual-template-option input { position: absolute; opacity: 0; }
.template-preview {
  display: block;
  aspect-ratio: 2 / 1;
  border-radius: 9px;
  background:linear-gradient(135deg,#f8f7fc,#f0eefb 62%,#5146c8);
}
.template-preview.relay { background:linear-gradient(135deg,#080a0f,#181f2b 62%,#7c8cff); }
.template-preview.madar { background:linear-gradient(135deg,#f5f7f8,#eaf0f5 62%,#145fd7); }
.template-preview.tech { background:linear-gradient(135deg,#101010,#080808 60%,#ffffff); }
.template-preview.techday { background:linear-gradient(135deg,#f2ede0,#fbf8ef 60%,#1a1712); }
.visual-template-option small { color: var(--world-muted); line-height: 1.65; }
.brand-banner-control input[type="file"] {
  padding: .7rem;
  border: 1px dashed var(--world-line);
  background: color-mix(in srgb, var(--world-accent) 5%, transparent);
}

@keyframes world-reveal {
  from { opacity: 0; clip-path: inset(0 0 0 100%); transform: translate3d(40px,0,0) scale(1.08); }
  to { opacity: 1; clip-path: inset(0); transform: translate3d(var(--pointer-x,0),var(--pointer-y,0),0) scale(1.035); }
}
@keyframes boundary-drift { to { transform: translateX(18px) rotate(13deg); opacity: .8; } }
@keyframes live-pulse { 70%, 100% { box-shadow: 0 0 0 10px transparent; } }

@media (max-width: 900px) {
  .public-hero { min-height: 660px; padding: 1.4rem; align-items: end; }
  .public-hero-copy { width: 100%; padding-block: 9rem 1rem; }
  .public-hero h1 { font-size: clamp(2.8rem, 13vw, 5.2rem); }
  .public-instrument { width: 100%; }
  .admin-workspace { grid-template-columns: 1fr; }
  .admin-nav-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: .85rem 1rem;
    border: 1px solid var(--world-line);
    border-radius: 14px;
    background: var(--world-panel-solid);
    color: var(--world-ink);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
  }
  .admin-nav-toggle::after { content: "⌄"; color: var(--world-accent); font-size: 1.1rem; }
  .admin-nav-toggle[aria-expanded="true"]::after { transform: rotate(180deg); }
  .admin-nav {
    position: static;
    display: none;
    grid-template-columns: 1fr;
    gap: .45rem;
    max-height: none;
    overflow-x: clip;
    overflow-y: visible;
    border-radius: 14px;
  }
  .admin-nav.is-expanded { display: grid; }
  .admin-nav-group {
    display: grid;
    align-content: start;
    gap: .25rem;
    min-width: 0;
    padding: .45rem;
    border: 1px solid var(--world-line);
    border-radius: 12px;
    background: var(--world-panel-solid);
  }
  .admin-nav-group-label { padding: .25rem .35rem .4rem; }
  .admin-nav button {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .65rem;
    width: 100%;
    min-width: 0;
    white-space: normal;
    text-align: start;
  }
  .admin-nav button span { flex: 0 0 1.8rem; }
  .admin-nav button b {
    flex: 1;
    min-width: 0;
    line-height: 1.6;
    text-align: start;
    overflow-wrap: anywhere;
  }
  .visual-template-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .private-stage-backdrop { background-position: 36% center; }
  .public-hero::after,
  [dir="rtl"] .public-hero::after {
    background: linear-gradient(0deg, rgba(4,6,8,.96) 12%, rgba(4,6,8,.62) 58%, rgba(4,6,8,.12));
  }
  .public-hero-copy { padding-top: 14rem; }
  .browser-account-card { grid-template-columns: 1fr; }
  .browser-account-card code { width: 100%; }
  .admin-command-head { align-items: start; }
  .admin-command-head .live-chip { display: none; }
  .admin-nav { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .private-stage-backdrop,
  .boundary-lines i,
  .live-chip i { animation: none !important; transform: none !important; }
}

/* Public Rahyab threshold — CSS geometry only; authenticated surfaces remain unchanged. */
body.public-mode {
  background: var(--bg);
  background-image: none;
  color: var(--text);
  padding-left: var(--safe-left);
  padding-right: var(--safe-right);
}
body.public-mode::before {
  content: none;
  background: none;
}
body[data-visual-template="madar"].public-mode {
  --border: #7b909d;
}
.public-mode .public-nav {
  min-height: 84px;
  height: auto;
  gap: 1rem;
  padding-block: max(.75rem, var(--safe-top)) .75rem;
  background: transparent;
  backdrop-filter: none;
}
.public-mode .public-brand {
  min-width: 0;
}
.public-mode .public-brand > span:last-child {
  min-width: 0;
}
.public-mode .public-brand b,
.public-mode .public-brand small {
  overflow-wrap: anywhere;
}
.public-mode .public-nav-actions {
  flex: 0 0 auto;
}
.public-threshold {
  position: relative;
  isolation: isolate;
  width: min(1180px, calc(100% - 40px));
  min-height: min(720px, calc(100svh - 84px));
  margin: 0 auto;
  padding: clamp(3rem, 8vw, 7rem) clamp(1rem, 4vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: clamp(2.5rem, 7vw, 7rem);
  overflow: hidden;
  border-block-end: 1px solid var(--border);
}
.public-threshold::before,
.public-threshold::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}
.threshold-copy {
  min-width: 0;
}
.threshold-copy {
  position: relative;
  z-index: 1;
  max-width: 650px;
}
.threshold-eyebrow {
  width: fit-content;
  margin: 0 0 1.25rem;
  color: var(--text-muted);
  font-size: clamp(.83rem, 1.4vw, 1rem);
  font-weight: 850;
  line-height: 1.8;
}
.public-threshold h1 {
  max-width: 10ch;
  margin: 0;
  color: var(--text);
  font-size: clamp(3.2rem, 7.4vw, 7rem);
  line-height: 1.04;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.public-threshold h1 em {
  color: var(--primary);
  font-style: normal;
}
.threshold-summary {
  max-width: 52ch;
  margin: 1.75rem 0 0;
  color: var(--text-muted);
  font-size: clamp(.95rem, 1.45vw, 1.08rem);
  line-height: 2;
  overflow-wrap: anywhere;
}
.threshold-summary b {
  color: var(--text);
}
.public-threshold .public-cta-row {
  margin-top: 2rem;
  flex-wrap: wrap;
}
.public-threshold .public-cta-row a {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  line-height: 1.6;
  text-align: center;
}
.public-threshold .public-cta-row .button.secondary {
  background: var(--surface-raised);
}
.public-threshold .public-bot-link:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 3px var(--primary-ink);
}
.public-threshold .public-cta-row .button.secondary:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 3px var(--focus);
}
.public-threshold .public-bot-link {
  padding: 11px 24px;
  color: var(--primary-ink);
  border: 1px solid color-mix(in srgb, var(--primary) 72%, white);
  border-radius: var(--radius-control);
  background: var(--primary);
  box-shadow: 0 7px 0 color-mix(in srgb, var(--primary) 76%, black), 0 11px 22px var(--world-glow);
  font-weight: 800;
  text-decoration: none;
}
.public-threshold .public-bot-link:active {
  transform: translateY(3px);
  box-shadow: 0 4px 0 color-mix(in srgb, var(--primary) 76%, black), 0 7px 14px var(--world-glow);
}
.threshold-capabilities {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem 1.25rem;
  margin: 2.25rem 0 0;
  padding: 1.2rem 0 0;
  border-top: 1px solid var(--border);
  color: var(--text-muted);
  font-size: .83rem;
  line-height: 1.8;
  list-style: none;
}
.threshold-capabilities li {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
}
.threshold-capabilities li::before {
  content: "";
  width: .5rem;
  height: .5rem;
  flex: 0 0 auto;
  border: 2px solid var(--success);
  border-radius: 50%;
}
.profile-service-card {
  position: relative;
  z-index: 1;
  align-self: center;
  padding: clamp(1.25rem, 3vw, 2rem);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--surface-raised);
}
.profile-service-card .instrument-head {
  padding: 0 0 1.25rem;
  gap: 1rem;
  border-bottom: 1px solid var(--border);
}
.profile-service-card .instrument-head > div {
  min-width: 0;
}
.profile-service-card .instrument-head small {
  display: block;
  color: var(--text-muted);
  font-size: .74rem;
  line-height: 1.75;
}
.profile-service-card .instrument-head h2 {
  margin: .2rem 0 0;
  color: var(--text);
  font: 400 clamp(1.5rem, 3vw, 2.15rem)/1.35 var(--font-display);
}
.instrument-status {
  min-height: 32px;
  padding: .25rem .7rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  flex: 0 0 auto;
  color: var(--text-muted);
  border: 1px solid color-mix(in srgb, var(--text-muted) 55%, var(--border));
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
}
.instrument-status i {
  width: .48rem;
  height: .48rem;
  border-radius: 50%;
  background: currentColor;
}
.profile-service-card .instrument-status--active {
  color: var(--success);
  border-color: color-mix(in srgb, var(--success) 58%, var(--border));
}
.profile-service-card .instrument-status--warning {
  color: var(--warning);
  border-color: color-mix(in srgb, var(--warning) 58%, var(--border));
}
.profile-service-card .instrument-status--danger {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 58%, var(--border));
}
.profile-service-card .instrument-status--muted {
  color: var(--text-muted);
  border-color: color-mix(in srgb, var(--text-muted) 58%, var(--border));
}
.profile-service-card .instrument-status--active i,
.profile-service-card .instrument-status--warning i,
.profile-service-card .instrument-status--danger i,
.profile-service-card .instrument-status--muted i {
  background: currentColor;
}
.instrument-reading {
  padding: 1.5rem 0;
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(150px, 1.28fr);
  align-items: center;
  gap: 1.25rem;
  border-bottom: 1px solid var(--border);
}
.instrument-reading > div:first-child {
  min-width: 0;
}
.instrument-reading span {
  color: var(--text-muted);
  font-size: .78rem;
  line-height: 1.75;
}
.instrument-reading strong {
  display: block;
  margin-top: .2rem;
  color: var(--text);
  font-size: clamp(2rem, 5vw, 3.35rem);
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}
.instrument-reading strong small {
  color: var(--text-muted);
  font-size: .8rem;
}
.instrument-meter {
  position: relative;
  width: 100%;
  height: 12px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
}
.instrument-meter span {
  display: block;
  width: 51%;
  height: 100%;
  background: var(--primary);
}
.instrument-time {
  grid-template-columns: 1fr auto;
  padding-block: 1.1rem;
}
.instrument-time strong {
  margin: 0;
  font-size: 1.2rem;
}
.profile-service-card .instrument-actions {
  margin-top: 1.25rem;
}
.profile-service-card .instrument-actions span {
  min-width: 0;
  padding: .7rem .35rem;
  color: var(--text-muted);
  border: 1px solid var(--border);
  background: var(--surface-2);
  font-size: max(.8rem, 13px);
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.profile-service-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .65rem;
}
.profile-service-card .instrument-head h2 {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.profile-service-card .instrument-reading small {
  display: block;
  margin-top: .4rem;
  color: var(--text-muted);
  line-height: 1.7;
}
.profile-service-card .instrument-meter--unlimited {
  min-height: 44px;
  height: auto;
  display: grid;
  place-items: center;
  overflow: visible;
  border-style: dashed;
}
.profile-service-card .instrument-meter--unlimited span {
  width: auto;
  height: auto;
  color: var(--text);
  background: transparent;
  font-weight: 800;
}
.profile-service-card .instrument-actions button {
  min-width: 0;
  min-height:44px;
  padding-inline: .65rem;
  white-space: normal;
  line-height: 1.55;
  overflow-wrap:anywhere;
}
.profile-service-updated {
  margin: .9rem 0 0;
  color: var(--text-muted);
  font-size: .74rem;
  line-height: 1.75;
  text-align: center;
}
.profile-service-card > .profile-service-error {
  margin-block: 1rem 0;
}
.profile-service-skeleton {
  min-height: 250px;
  border-radius: calc(var(--radius-card) - 6px);
}
.profile-service-status > .status-state {
  margin-block: .25rem;
}
.profile-service-status .status-state .mini-button {
  min-height: 44px;
}
.public-mode .public-admin-access {
  border-radius: var(--radius-card);
  box-shadow: none;
}
.public-mode .admin-access-form {
  color: var(--text);
  background: var(--surface-2);
}
.public-mode .access-form-head {
  color: var(--primary);
}
.public-mode .access-form-head i {
  background: var(--primary);
}
.public-mode .admin-access-form > label {
  color: var(--text);
}
.public-mode .admin-access-form > input,
.public-mode .password-control {
  color: var(--text);
  border-color: var(--border);
  background: var(--surface-1);
}
.public-mode .password-control button {
  min-width: 72px;
  min-height: 48px;
  color: var(--primary);
  border-inline-start-color: var(--border);
  background: var(--surface-raised);
}
.public-mode .password-control:focus-within,
.public-mode .admin-access-form > input:focus {
  border-color: var(--focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 25%, transparent);
}
.public-mode .admin-access-form > small {
  color: var(--text-muted);
}
.public-mode .access-form-status {
  color: var(--danger);
}
.public-mode .public-footer {
  gap: .75rem 1.5rem;
  flex-wrap: wrap;
  padding-block-end: calc(40px + var(--safe-bottom));
}
.public-mode .public-footer [data-brand-name],
.public-mode .public-footer [data-brand-tagline] {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Sobh: an open horizon and two quiet, solid pastel regions. */
body[data-visual-template="sobh"].public-mode .public-threshold::before {
  width: clamp(420px, 62vw, 850px);
  aspect-ratio: 2 / 1;
  inset-inline-end: -18%;
  inset-block-end: -16%;
  border: clamp(34px, 6vw, 76px) solid #e5e0ff;
  border-inline-start-color: transparent;
  border-block-start-color: transparent;
  border-radius: 0 0 50% 50%;
  transform: rotate(-7deg);
  animation: sobh-horizon var(--motion-page) var(--easing-standard) both;
}
body[data-visual-template="sobh"].public-mode .public-threshold::after {
  width: clamp(180px, 25vw, 340px);
  aspect-ratio: 1;
  inset-inline-end: 3%;
  inset-block-start: 8%;
  border-radius: 42% 58% 55% 45%;
  background: #dff4ea;
}

/* Relay: one bounded signal seam, held inside an obsidian field. */
body[data-visual-template="relay"].public-mode .public-threshold {
  background: #080a0f;
}
body[data-visual-template="relay"].public-mode .public-threshold::before {
  width: min(54%, 620px);
  height: 3px;
  inset-inline-end: 4%;
  inset-block-start: 22%;
  background: linear-gradient(90deg, transparent 0 8%, #7c8cff 8% 54%, #34d7c5 54% 82%, transparent 82%);
  transform: rotate(-18deg);
  transform-origin: center;
  animation: relay-seam var(--motion-page) var(--easing-standard) both;
}
body[data-visual-template="relay"].public-mode .public-threshold::after {
  display: none;
}

/* Madar: a deliberately incomplete orbit; solid color remains the fallback. */
body[data-visual-template="madar"].public-mode .public-threshold::before {
  width: clamp(300px, 46vw, 620px);
  aspect-ratio: 1;
  inset-inline-end: -13%;
  inset-block-start: 6%;
  border-radius: 50%;
  border: clamp(24px, 4vw, 52px) solid #145fd7;
  border-block-start-color: transparent;
  border-inline-start-color: #f07a64;
  animation: madar-orbit var(--motion-page) var(--easing-standard) both;
}
body[data-visual-template="madar"].public-mode .public-threshold::after {
  width: clamp(110px, 17vw, 220px);
  aspect-ratio: 1;
  inset-inline-end: 7%;
  inset-block-end: 11%;
  border: 1px solid #16806f;
  border-radius: 50%;
}
@supports (background: conic-gradient(#000, transparent)) and (mask: radial-gradient(circle, #000, transparent)) {
  body[data-visual-template="madar"].public-mode .public-threshold::before {
    border: 0;
    background: conic-gradient(from 28deg, #145fd7 0 61%, #f07a64 61% 76%, transparent 76% 100%);
    -webkit-mask: radial-gradient(circle, transparent 0 61%, #000 61.5% 72%, transparent 72.5%);
    mask: radial-gradient(circle, transparent 0 61%, #000 61.5% 72%, transparent 72.5%);
  }
}

@keyframes sobh-horizon {
  from { opacity: .35; transform: translateY(28px) rotate(-7deg); }
  to { opacity: 1; transform: translateY(0) rotate(-7deg); }
}
@keyframes relay-seam {
  from { opacity: .2; clip-path: inset(0 100% 0 0); }
  to { opacity: 1; clip-path: inset(0); }
}
@keyframes madar-orbit {
  from { opacity: .3; transform: rotate(-18deg); }
  to { opacity: 1; transform: rotate(0); }
}

@media (max-width: 860px) {
  .public-threshold {
    min-height: auto;
    padding-block: clamp(3rem, 10vw, 5rem);
    grid-template-columns: minmax(0, 1fr);
    gap: 3rem;
  }
  .threshold-copy {
    max-width: 720px;
  }
  .public-threshold h1 {
    max-width: 12ch;
  }
  .profile-service-card {
    width: min(100%, 640px);
    justify-self: center;
  }
}
@media (max-width: 560px) {
  .public-mode .public-nav {
    width: calc(100% - 24px);
    min-height: 76px;
    gap: .6rem;
  }
  .public-mode .public-nav-actions {
    gap: .4rem;
  }
  .public-mode .public-nav .button {
    padding-inline: .8rem;
  }
  .public-threshold {
    width: calc(100% - 24px);
    padding: 2.75rem 4px 3.25rem;
    gap: 2.5rem;
  }
  .public-threshold h1 {
    font-size: clamp(2.8rem, 15.3vw, 4.2rem);
    line-height: 1.08;
  }
  .threshold-summary {
    font-size: .95rem;
  }
  .public-threshold .public-cta-row {
    align-items: stretch;
    flex-direction: column;
  }
  .public-threshold .public-cta-row a {
    width: 100%;
  }
  .threshold-capabilities {
    gap: .45rem 1rem;
  }
  .profile-service-card {
    padding: 1rem;
  }
  .profile-service-card .instrument-head {
    align-items: flex-start;
  }
  .instrument-reading {
    grid-template-columns: 1fr;
    gap: .85rem;
  }
  .instrument-time {
    grid-template-columns: 1fr auto;
  }
  .profile-service-card .instrument-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body[data-visual-template="sobh"].public-mode .public-threshold::before {
    inset-inline-end: -65%;
  }
  body[data-visual-template="madar"].public-mode .public-threshold::before {
    inset-inline-end: -62%;
    inset-block-start: 18%;
  }
}
@media (max-width: 360px) {
  .public-mode .public-brand small {
    display: none;
  }
  .public-mode .public-nav .icon-button {
    width: 44px;
    height: 44px;
  }
  .public-mode .public-nav .button {
    min-height: 44px;
    padding-inline: .65rem;
    font-size: .78rem;
  }
  .public-threshold h1 {
    font-size: clamp(2.55rem, 14vw, 3.2rem);
  }
  .instrument-status {
    padding-inline: .55rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .public-threshold::before,
  .public-threshold::after {
    animation: none !important;
  }
}

/* Task 7: accessible focus, bounded content, and compact-view safety rails. */
html, body {
  max-width: 100%;
  overflow-x: clip;
}
.bottom-nav button:focus-visible,
.admin-nav-toggle:focus-visible,
.admin-nav button:focus-visible,
.modal-close:focus-visible,
.field input:focus-visible,
.field textarea:focus-visible,
.field select:focus-visible,
.button.primary:focus-visible,
.button.secondary:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.bottom-nav button,
.admin-nav-toggle,
.admin-nav button,
.modal-close,
.field input,
.field textarea,
.field select {
  min-height: 44px;
}
.overflow-guard,
.plan-card,
.admin-row,
.ticket-card,
.purchase-summary,
.order-card,
.browser-account-card {
  min-width: 0;
}
.overflow-guard,
.plan-card h3,
.plan-card p,
.admin-row h3,
.admin-row p,
.ticket-card h3,
.ticket-card p,
.purchase-summary dd,
.browser-account-card code {
  overflow-wrap: anywhere;
  word-break: normal;
}
.config-box, .config-preview {
  max-width: 100%;
  overflow: auto;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
}
.modal-sheet,
.public-footer,
.bottom-nav {
  padding-inline-start: calc(20px + var(--safe-right));
  padding-inline-end: calc(20px + var(--safe-left));
}
@media (max-width: 390px) {
  .viewport {
    padding-inline: calc(12px + var(--safe-right)) calc(12px + var(--safe-left));
  }
  .plan-card .button,
  .admin-row-actions .button,
  .modal-actions .button {
    min-width: 0;
    white-space: normal;
    line-height: 1.55;
  }
}

@media (max-width: 390px) {
  .profile-service-section {
    padding: 14px;
  }
  .profile-service-card {
    padding: 1rem;
  }
  .profile-service-card .instrument-head,
  .profile-service-card .instrument-reading {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .profile-service-card .instrument-head {
    flex-direction: column;
  }
  .profile-service-head-actions {
    justify-content: space-between;
  }
  .profile-service-card .instrument-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (prefers-reduced-motion: reduce) {
  .chance-wheel {
    animation: none !important;
    transition: none !important;
  }
  .private-stage-backdrop,
  .boundary-lines i,
  .live-chip i,
  .public-threshold::before,
  .public-threshold::after {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}
@media (max-width: 767px), (prefers-reduced-motion: reduce) {
  .glass,
  .topbar,
  .bottom-nav,
  .public-nav,
  .modal-backdrop {
    backdrop-filter: none;
  }
}

/* Task 8: light Rahyab skins retain semantic hero contrast and compact priority. */
body[data-visual-template="sobh"] .brand-stage::after,
body[data-visual-template="madar"] .brand-stage::after {
  background:
    linear-gradient(270deg, color-mix(in srgb, var(--surface-raised) 97%, transparent), color-mix(in srgb, var(--surface-raised) 88%, transparent) 58%, color-mix(in srgb, var(--surface-2) 88%, transparent)),
    linear-gradient(0deg, color-mix(in srgb, var(--surface-raised) 84%, transparent), transparent 62%);
}
body[data-visual-template="sobh"] .brand-stage .hero-copy,
body[data-visual-template="madar"] .brand-stage .hero-copy {
  color: var(--text);
}
body[data-visual-template="sobh"] .brand-stage .eyebrow,
body[data-visual-template="sobh"] .brand-stage p,
body[data-visual-template="madar"] .brand-stage .eyebrow,
body[data-visual-template="madar"] .brand-stage p {
  color: var(--text-muted);
}
body[data-visual-template="sobh"] .brand-stage .hero h1 em,
body[data-visual-template="madar"] .brand-stage .hero h1 em {
  color: var(--primary);
}
@media(max-width:700px){
  .hero{min-height:210px;padding:22px 20px;align-items:stretch}
  #homePending:not(.hidden) + .hero{min-height:190px}
  .hero-copy{max-width:100%}
  .hero h1{margin:8px 0 6px;font-size:clamp(1.72rem,8.8vw,2.15rem);line-height:1.18}
  .hero p{margin:0 0 12px;font-size:.76rem;line-height:1.7}
  .hero-emblem{display:none}
}
/* ── Tech skins v3: ابسیدینِ سرمقاله‌ای (dark) + سنگ‌آهکِ آتشی (light) ─────────
   Evidence: Hyperstudio (obsidian/hairline/white-pill/pulse-dot) + warm brutalist
   editorial (limestone/forge-fire). Same token contract; older skins untouched.
   No shadows anywhere — elevation is hairlines + contrast only. Zero purple. */
@font-face{
  font-family:"Shabnam";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/Shabnam.woff2") format("woff2");
}
@font-face{
  font-family:"Shabnam";font-style:normal;font-weight:500;font-display:swap;
  src:url("fonts/Shabnam-Medium.woff2") format("woff2");
}
@font-face{
  font-family:"Shabnam";font-style:normal;font-weight:700;font-display:swap;
  src:url("fonts/Shabnam-Bold.woff2") format("woff2");
}
body[data-visual-template="tech"]{
  --bg:#101010;--surface-1:#080808;--surface-2:#141414;--surface-raised:#1a1a1a;
  --text:#f3f3f3;--text-muted:#9c9c9c;--border:#636363;--primary:#ffffff;
  --primary-hover:#e8e8e8;--primary-ink:#101010;--secondary:#6f6759;--success:#98ff38;
  --warning:#e8b34b;--danger:#ff7a7a;--info:#c1c1c1;--focus:#ffffff;
  --font-ui:"Shabnam",Tahoma,Arial,sans-serif;--font-display:"Shabnam",Tahoma,Arial,sans-serif;
  --font-mono:ui-monospace,"Cascadia Mono","JetBrains Mono",Consolas,Menlo,monospace;
  --radius-card:8px;
  --shadow-1:none;--shadow-2:none;
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--secondary);--copper-deep:var(--secondary);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(243,243,243,.10);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
}
body[data-visual-template="techday"]{
  --bg:#f2ede0;--surface-1:#fbf8ef;--surface-2:#e8e1cb;--surface-raised:#fbf8ef;
  --text:#1a1712;--text-muted:#6b6257;--border:#3a352c;--primary:#1a1712;
  --primary-hover:#000000;--primary-ink:#fbf8ef;--secondary:#e4572e;--success:#4d7c0f;
  --warning:#b45309;--danger:#b91c1c;--info:#57534e;--focus:#1a1712;
  --font-ui:"Shabnam",Tahoma,Arial,sans-serif;--font-display:"Shabnam",Tahoma,Arial,sans-serif;
  --font-mono:ui-monospace,"Cascadia Mono","JetBrains Mono",Consolas,Menlo,monospace;
  --radius-card:8px;
  --shadow-1:none;--shadow-2:none;
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--secondary);--copper-deep:var(--secondary);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(26,23,18,.10);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
}
/* Tech: flat canvas — kill ambient blobs and gradients inherited from base */
body[data-visual-template="tech"] .ambient,body[data-visual-template="techday"] .ambient{display:none}
body[data-visual-template="tech"],body[data-visual-template="techday"]{background-image:none}
/* Tech: hairline section architecture */
body[data-visual-template="tech"] .sec,body[data-visual-template="techday"] .sec,
body[data-visual-template="tech"] .metric,body[data-visual-template="techday"] .metric,
body[data-visual-template="tech"] .admin-row,body[data-visual-template="techday"] .admin-row{
  border:1px solid var(--line);border-radius:8px;box-shadow:none;
}
body[data-visual-template="tech"] .sec-h,body[data-visual-template="techday"] .sec-h{border-bottom:1px solid var(--line)}
body[data-visual-template="tech"] .sub,body[data-visual-template="techday"] .sub{border-bottom:1px solid var(--line)}
/* Tech: hero console — carbon band, hairline frame, oversized weight-400 numerals */
body[data-visual-template="tech"] .hero,body[data-visual-template="techday"] .hero{
  border:1px solid var(--line);border-radius:8px;box-shadow:none;
  background:var(--surface-1);
}
body[data-visual-template="tech"] .hero h1,body[data-visual-template="techday"] .hero h1{
  font-weight:400;letter-spacing:-.02em;
}
body[data-visual-template="tech"] .eyebrow,body[data-visual-template="techday"] .eyebrow{
  font-family:var(--font-mono);letter-spacing:.14em;font-size:.66rem;
}
/* Tech: white/black pill primary, ghost secondary — no fills beyond the pill */
body[data-visual-template="tech"] .button.glow,body[data-visual-template="tech"] .button.primary,
body[data-visual-template="techday"] .button.glow,body[data-visual-template="techday"] .button.primary{
  background:var(--primary);color:var(--primary-ink);
  border:1px solid var(--primary);border-radius:9999px;box-shadow:none;
  font-weight:400;letter-spacing:.02em;
}
body[data-visual-template="tech"] .button.secondary,body[data-visual-template="techday"] .button.secondary{
  background:transparent;color:var(--text);border:1px solid var(--text);border-radius:8px;box-shadow:none;
}
body[data-visual-template="tech"] .button:active,body[data-visual-template="techday"] .button:active{transform:scale(.98)}
/* Tech: usage rings + pulse-dot status pills */
body[data-visual-template="tech"] .usage-ring,body[data-visual-template="techday"] .usage-ring{
  border:1px solid var(--line);border-radius:8px;background:transparent;
}
body[data-visual-template="tech"] .usage-ring:before,body[data-visual-template="techday"] .usage-ring:before{box-shadow:none}
body[data-visual-template="tech"] .usage-ring-core,body[data-visual-template="techday"] .usage-ring-core{background:var(--surface-1);box-shadow:none}
body[data-visual-template="tech"] .usage-ring-core strong,body[data-visual-template="techday"] .usage-ring-core strong{
  font-weight:400;font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}
body[data-visual-template="tech"] .pill,body[data-visual-template="techday"] .pill{border-radius:4px}
body[data-visual-template="tech"] .pill.ok,body[data-visual-template="techday"] .pill.ok{border-color:var(--line)}
body[data-visual-template="tech"] .pill.ok i,body[data-visual-template="techday"] .pill.ok i{
  background:var(--success);box-shadow:0 0 8px var(--success);animation:pulse-dot 2s infinite;
}
@keyframes pulse-dot{50%{opacity:.4}}
/* Tech: compass-gold icon strokes, mono micro-labels */
body[data-visual-template="tech"] .cut .ic,body[data-visual-template="techday"] .cut .ic{
  background:transparent;border:1px solid var(--secondary);border-radius:8px;
}
body[data-visual-template="tech"] .cut svg{stroke:var(--secondary)}
body[data-visual-template="techday"] .cut svg{stroke:var(--secondary)}
body[data-visual-template="tech"] .sec-h .idx,body[data-visual-template="techday"] .sec-h .idx,
body[data-visual-template="tech"] .kicker,body[data-visual-template="techday"] .kicker{
  font-family:var(--font-mono);letter-spacing:.14em;color:var(--secondary);
}
body[data-visual-template="tech"] [dir="ltr"],body[data-visual-template="techday"] [dir="ltr"]{
  font-family:var(--font-mono),var(--font-ui);
}
/* Tech: topbar + bottom nav as hairline chrome */
body[data-visual-template="tech"] .topbar,body[data-visual-template="techday"] .topbar{
  border-bottom:1px solid var(--line);background:var(--bg);
}
body[data-visual-template="tech"] .bottom-nav,body[data-visual-template="techday"] .bottom-nav{
  border-top:1px solid var(--line);background:var(--bg);
}
body[data-visual-template="tech"] .topbar .avatar,body[data-visual-template="techday"] .topbar .avatar{
  border-radius:8px;background:var(--surface-2);border:1px solid var(--line);box-shadow:none;
}
/* Tech: public-mode threshold signatures (kept distinct per skin convention) */
body[data-visual-template="tech"].public-mode .public-threshold::before{
  /* Tech: */ background:linear-gradient(90deg,transparent,rgba(243,243,243,.22),transparent);
}
body[data-visual-template="techday"].public-mode .public-threshold::before{
  /* TechDay: */ background:linear-gradient(90deg,transparent,rgba(228,87,46,.30),transparent);
}
/* Tech: legacy .light toggle (sun/moon button + Telegram colorScheme) flips the
   tech skin to the limestone presentation. Same tokens as techday. */
body[data-visual-template="tech"].light{
  --bg:#f2ede0;--surface-1:#fbf8ef;--surface-2:#e8e1cb;--surface-raised:#fbf8ef;
  --text:#1a1712;--text-muted:#6b6257;--border:#3a352c;--primary:#1a1712;
  --primary-hover:#000000;--primary-ink:#fbf8ef;--secondary:#e4572e;--success:#4d7c0f;
  --warning:#b45309;--danger:#b91c1c;--info:#57534e;--focus:#1a1712;
  --font-ui:"Shabnam",Tahoma,Arial,sans-serif;--font-display:"Shabnam",Tahoma,Arial,sans-serif;
  --font-mono:ui-monospace,"Cascadia Mono","JetBrains Mono",Consolas,Menlo,monospace;
  --radius-card:8px;
  --shadow-1:none;--shadow-2:none;
  --bg2:var(--surface-2);--card:var(--surface-1);--card-solid:var(--surface-raised);--muted:var(--text-muted);--line:var(--border);
  --primary2:var(--primary);--cyan:var(--info);--green:var(--success);--amber:var(--warning);--copper:var(--secondary);--copper-deep:var(--secondary);
  --enamel:var(--surface-1);--ink:var(--text);--steel:var(--border);--shadow:var(--shadow-2);--radius:var(--radius-card);--ease:var(--easing-standard);
  --world-bg:var(--bg);--world-panel:var(--surface-1);--world-panel-solid:var(--surface-raised);--world-ink:var(--text);--world-muted:var(--text-muted);
  --glow:rgba(26,23,18,.10);--world-line:var(--border);--world-accent:var(--primary);--world-accent-2:var(--secondary);--world-accent-ink:var(--primary-ink);--world-glow:var(--glow);--world-ease:var(--easing-standard);
  background-image:radial-gradient(640px 320px at 85% -60px,rgba(26,23,18,.08),transparent 60%),linear-gradient(rgba(26,23,18,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(26,23,18,.055) 1px,transparent 1px);
  background-size:auto,30px 30px,30px 30px;
}
body[data-visual-template="tech"].light.public-mode .public-threshold::before{
  /* TechLight: */ background:linear-gradient(90deg,transparent,rgba(228,87,46,.30),transparent);
}
/* Tech v3.1: readability guarantee — every surface follows tokens in both modes.
   High-specificity overrides beat legacy hard-coded gradients (.glass navy,
   .wallet-card blue, .topbar/bottom-nav dark fades). */
body[data-visual-template="tech"]{background-color:var(--bg)}
body[data-visual-template="tech"].light{background-color:var(--bg)}
body[data-visual-template="tech"] .glass,
body[data-visual-template="tech"].light .glass,
body[data-visual-template="techday"] .glass{background:var(--card);border-color:var(--line);box-shadow:none;backdrop-filter:none}
body[data-visual-template="tech"] .topbar,
body[data-visual-template="tech"].light .topbar,
body[data-visual-template="techday"] .topbar{background:var(--bg);backdrop-filter:none}
body[data-visual-template="tech"] .bottom-nav,
body[data-visual-template="tech"].light .bottom-nav,
body[data-visual-template="techday"] .bottom-nav{background:var(--bg)}
body[data-visual-template="tech"] .wallet-card,
body[data-visual-template="tech"].light .wallet-card,
body[data-visual-template="techday"] .wallet-card{background:var(--surface-1);border:1px solid var(--line);box-shadow:none}
body[data-visual-template="tech"] .filter-row,
body[data-visual-template="tech"].light .filter-row,
body[data-visual-template="techday"] .filter-row{background:var(--bg)}
body[data-visual-template="tech"] .viewport,
body[data-visual-template="tech"] .page,
body[data-visual-template="tech"].light .viewport,
body[data-visual-template="tech"].light .page,
body[data-visual-template="techday"] .viewport,
body[data-visual-template="techday"] .page{background:transparent}
/* Tech v3.2: remaining surfaces — wheel, prize, timeline, plans, notices.
   Evidence: Hyperstudio status-dot + white-pill language; forge-fire light. */
body[data-visual-template="tech"]{
  --wheel-1:#7961d8;--wheel-2:#20a6ad;--wheel-3:#e99a50;--wheel-4:#d85d86;--wheel-5:#397bd4;
  --wheel-ink:#ffffff;
}
body[data-visual-template="techday"],body[data-visual-template="tech"].light{
  --wheel-1:#7961d8;--wheel-2:#20a6ad;--wheel-3:#e99a50;--wheel-4:#d85d86;--wheel-5:#397bd4;
  --wheel-ink:#ffffff;
}
body[data-visual-template="tech"] .wheel-label,
body[data-visual-template="techday"] .wheel-label,
body[data-visual-template="tech"].light .wheel-label{fill:var(--wheel-ink);font-family:var(--font-ui)}
body[data-visual-template="tech"] .wheel-hub,
body[data-visual-template="techday"] .wheel-hub,
body[data-visual-template="tech"].light .wheel-hub{fill:var(--surface-1);stroke:var(--secondary);stroke-width:3}
body[data-visual-template="tech"] .spin-button,
body[data-visual-template="techday"] .spin-button,
body[data-visual-template="tech"].light .spin-button{
  background:var(--primary);color:var(--primary-ink);border:1px solid var(--primary);
  border-radius:9999px;box-shadow:none;
}
body[data-visual-template="tech"] .spin-prize,
body[data-visual-template="techday"] .spin-prize,
body[data-visual-template="tech"].light .spin-prize{background:var(--surface-1);border:1px solid var(--line)}
body[data-visual-template="tech"] .spin-meta span,
body[data-visual-template="techday"] .spin-meta span,
body[data-visual-template="tech"].light .spin-meta span{background:transparent;border:1px solid var(--line);border-radius:4px}
body[data-visual-template="tech"] .timeline article:before,
body[data-visual-template="techday"] .timeline article:before,
body[data-visual-template="tech"].light .timeline article:before{background:var(--success);box-shadow:0 0 8px var(--success)}
body[data-visual-template="tech"] .plan-card,
body[data-visual-template="techday"] .plan-card,
body[data-visual-template="tech"].light .plan-card{border:1px solid var(--line);border-radius:8px}
body[data-visual-template="tech"] .plan-card:before,
body[data-visual-template="techday"] .plan-card:before,
body[data-visual-template="tech"].light .plan-card:before{display:none}
body[data-visual-template="tech"] .notice,
body[data-visual-template="techday"] .notice,
body[data-visual-template="tech"].light .notice{border:1px solid var(--line);border-radius:8px}

/* ── Tokens v2: semantic surface/state colors (no hardcoded hex in components) ── */
:root{
  --glass-1:rgba(22,44,71,.82);--glass-2:rgba(13,27,47,.72);
  --topbar-1:rgba(7,17,31,.96);--topbar-2:rgba(7,17,31,.72);
  --wallet-1:#7657ff;--wallet-2:#315edd;--wallet-3:#168fac;
  --quick-bg:rgba(16,32,57,.72);--field-bg:rgba(4,12,24,.46);
  --track-bg:rgba(255,255,255,.06);--ghost-bg:rgba(255,255,255,.03);
  --primary-soft:rgba(124,92,255,.14);--secondary-soft:rgba(40,215,228,.13);
  --success-soft:rgba(53,223,162,.1);--warning-soft:rgba(255,182,77,.1);--danger-soft:rgba(255,100,124,.1);
  --info-ink:#b6eaf0;--text-soft:#cbd7e8;--glow-2:rgba(40,215,228,.25);
  --admin-1:#f5ad43;--admin-2:#e8734e;--admin-ink:#23160a;
}
body[data-visual-template="sobh"]{
  --glass-1:rgba(255,255,255,.9);--glass-2:rgba(240,238,251,.8);
  --topbar-1:rgba(248,247,252,.97);--topbar-2:rgba(248,247,252,.84);
  --wallet-1:#5146c8;--wallet-2:#315edd;--wallet-3:#168fac;
  --quick-bg:rgba(255,255,255,.85);--field-bg:rgba(240,238,251,.75);
  --track-bg:rgba(25,33,58,.08);--ghost-bg:rgba(25,33,58,.04);
  --primary-soft:rgba(81,70,200,.12);--secondary-soft:rgba(47,127,116,.12);
  --success-soft:rgba(23,121,94,.12);--warning-soft:rgba(139,88,0,.12);--danger-soft:rgba(173,49,74,.12);
  --info-ink:#245bb3;--text-soft:#3c465e;--glow-2:rgba(47,127,116,.18);
}
body[data-visual-template="relay"]{
  --glass-1:rgba(30,40,58,.82);--glass-2:rgba(20,26,40,.72);
  --topbar-1:rgba(8,10,15,.96);--topbar-2:rgba(8,10,15,.72);
  --wallet-1:#7c8cff;--wallet-2:#345edd;--wallet-3:#1a9fb5;
  --quick-bg:rgba(17,22,32,.72);--field-bg:rgba(5,8,14,.5);
  --track-bg:rgba(255,255,255,.07);--ghost-bg:rgba(255,255,255,.04);
  --primary-soft:rgba(124,140,255,.14);--secondary-soft:rgba(52,215,197,.13);
  --success-soft:rgba(88,214,141,.12);--warning-soft:rgba(255,196,107,.12);--danger-soft:rgba(255,132,152,.12);
  --info-ink:#cfe6ff;--text-soft:#d7deea;--glow-2:rgba(52,215,197,.25);
}
body[data-visual-template="madar"]{
  --glass-1:rgba(255,255,255,.9);--glass-2:rgba(234,240,245,.8);
  --topbar-1:rgba(245,247,248,.97);--topbar-2:rgba(245,247,248,.84);
  --wallet-1:#145fd7;--wallet-2:#315edd;--wallet-3:#16806f;
  --quick-bg:rgba(255,255,255,.85);--field-bg:rgba(234,240,245,.75);
  --track-bg:rgba(16,40,58,.08);--ghost-bg:rgba(16,40,58,.04);
  --primary-soft:rgba(20,95,215,.12);--secondary-soft:rgba(22,128,111,.12);
  --success-soft:rgba(22,128,111,.12);--warning-soft:rgba(152,96,0,.12);--danger-soft:rgba(155,63,74,.12);
  --info-ink:#145fd7;--text-soft:#3b4f5f;--glow-2:rgba(22,128,111,.16);
}

/* techday (light tech) token overrides for the v2 semantic tokens */
body[data-visual-template="techday"]{
  --glass-1:rgba(251,248,239,.92);--glass-2:rgba(232,225,203,.82);
  --topbar-1:rgba(242,237,224,.97);--topbar-2:rgba(242,237,224,.85);
  --wallet-1:#1a1712;--wallet-2:#3a352c;--wallet-3:#57534e;
  --quick-bg:rgba(251,248,239,.9);--field-bg:rgba(232,225,203,.7);
  --track-bg:rgba(26,23,18,.08);--ghost-bg:rgba(26,23,18,.04);
  --primary-soft:rgba(26,23,18,.08);--secondary-soft:rgba(228,87,46,.1);
  --success-soft:rgba(77,124,15,.12);--warning-soft:rgba(180,83,9,.12);--danger-soft:rgba(185,28,28,.12);
  --info-ink:#57534e;--text-soft:#4a443a;--glow-2:rgba(228,87,46,.15);
}