@font-face { font-family: 'Vazirmatn'; src: url('fonts/Vazirmatn.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root {
  --bg:#0a0e1a; --card:rgba(20,28,48,.66); --card2:rgba(30,40,66,.75); --line:rgba(140,165,220,.16); --line2:rgba(140,165,220,.32);
  --tx:#eaf0ff; --tx2:#b3bfdf; --tx3:#7684a8; --pri:#5e9bff; --pri2:#3d7dff; --ok:#3adc84; --danger:#ff4d6d; --amber:#f7b32b;
  --glass:rgba(255,255,255,.06); --radius:20px;
}
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; }
body { background:var(--bg); color:var(--tx); font-family:'Vazirmatn', system-ui, sans-serif; font-size:14px; line-height:1.75; position:relative; }
/* one calm backdrop: two soft glows, no banding */
.bg { position:fixed; inset:0; z-index:-1; background:
  radial-gradient(900px 520px at 85% -10%, rgba(94,155,255,.22), transparent 60%),
  radial-gradient(700px 500px at 0% 100%, rgba(176,124,255,.14), transparent 60%),
  var(--bg); }
a { color:var(--pri); text-decoration:none; }
/* header */
.top { display:flex; align-items:center; justify-content:space-between; padding:14px 28px; position:sticky; top:0; z-index:5;
  background:rgba(10,14,26,.55); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--line); }
.brand { font-weight:900; font-size:16px; display:flex; align-items:center; gap:10px; color:var(--tx); }
.brand.big { font-size:21px; margin-bottom:4px; }
.dot { width:12px; height:12px; border-radius:50%; background:linear-gradient(135deg,var(--pri),#8fd3ff); box-shadow:0 0 16px var(--pri); display:inline-block; }
nav { display:flex; gap:6px; }
nav a { padding:8px 14px; border-radius:12px; font-weight:800; color:var(--tx2); }
nav a:hover { background:var(--glass); color:var(--tx); }
nav a.on { background:rgba(94,155,255,.16); color:var(--pri); }
nav a.muted { color:var(--tx3); }
.wrap { max-width:1080px; margin:28px auto 60px; padding:0 20px; }
.head { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; gap:12px; }
h1 { font-size:24px; margin:0; font-weight:900; letter-spacing:-.2px; }
h3 { margin:0 0 14px; font-size:15px; font-weight:800; }
.muted { color:var(--tx3); } .small { font-size:12px; } .center { text-align:center; padding:20px 0; }
/* glass cards */
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:22px 24px; margin-bottom:16px;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:0 20px 50px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.05); }
.card.empty { text-align:center; color:var(--tx3); padding:46px; }
.card.table { padding:0; overflow:auto; }
table { width:100%; border-collapse:collapse; }
th, td { padding:13px 16px; text-align:right; border-bottom:1px solid var(--line); vertical-align:middle; }
th { color:var(--tx3); font-weight:700; font-size:12px; letter-spacing:.2px; }
tr:last-child td { border-bottom:0; }
tr.off td { opacity:.5; }
.tag { display:inline-block; padding:3px 11px; border-radius:999px; font-size:12px; font-weight:800; }
.tag.notice { background:rgba(94,155,255,.16); color:var(--pri); }
.tag.ad { background:rgba(247,179,43,.16); color:var(--amber); }
/* buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 18px; border-radius:14px; border:1px solid var(--line2);
  background:var(--glass); color:var(--tx); font-weight:800; cursor:pointer; font-family:inherit; font-size:13.5px; transition:.18s; backdrop-filter:blur(10px); }
.btn:hover { transform:translateY(-1px); border-color:rgba(140,165,220,.5); }
.btn.small { padding:6px 12px; font-size:12px; border-radius:11px; }
.btn.primary { background:linear-gradient(135deg, rgba(94,155,255,.95), rgba(61,125,255,.95)); border-color:rgba(255,255,255,.22); color:#fff; box-shadow:0 10px 30px rgba(94,155,255,.35), inset 0 1px 0 rgba(255,255,255,.35); }
.btn.primary.glass { background:linear-gradient(135deg, rgba(94,155,255,.45), rgba(61,125,255,.35)); }
.btn.ghost { background:transparent; }
.btn.danger { color:var(--danger); border-color:rgba(255,77,109,.4); background:rgba(255,77,109,.08); }
.actions { white-space:nowrap; } .actions form, .inline { display:inline; }
.switch { width:44px; height:25px; border-radius:999px; border:1px solid var(--line2); background:var(--glass); position:relative; cursor:pointer; }
.switch::after { content:''; position:absolute; top:3px; inset-inline-start:3px; width:17px; height:17px; border-radius:50%; background:var(--tx3); transition:.2s; }
.switch.on { background:rgba(58,220,132,.22); border-color:var(--ok); }
.switch.on::after { inset-inline-start:22px; background:var(--ok); }
/* forms */
label { display:flex; flex-direction:column; gap:6px; font-weight:700; color:var(--tx2); font-size:13px; }
input:not([type=checkbox]):not([type=color]):not([type=range]):not([type=file]), select, textarea {
  font-family:inherit; font-size:14px; padding:11px 13px; border-radius:13px; border:1px solid var(--line2); background:rgba(8,12,24,.65); color:var(--tx); outline:none; transition:.15s; }
input:focus, select:focus, textarea:focus { border-color:var(--pri); box-shadow:0 0 0 3px rgba(94,155,255,.18); }
select { appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--tx3) 50%), linear-gradient(135deg, var(--tx3) 50%, transparent 50%); background-position:calc(12px) 55%, calc(12px + 5px) 55%; background-size:5px 5px; background-repeat:no-repeat; padding-inline-start:26px; }
input[type=checkbox] { accent-color:var(--pri); width:18px; height:18px; }
input[type=range] { accent-color:var(--pri); width:100%; }
.color { display:flex; align-items:center; gap:10px; }
.color input[type=color] { width:52px; height:38px; padding:2px; border-radius:11px; border:1px solid var(--line2); background:rgba(8,12,24,.65); }
.swatch-label { color:var(--tx3); font-size:12px; font-weight:600; }
.row-check { flex-direction:row; align-items:center; gap:10px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:14px 18px; }
.grid.dim { opacity:.45; pointer-events:none; }
.sub { border:1px dashed var(--line2); border-radius:16px; padding:14px 16px; margin-top:14px; display:flex; flex-direction:column; gap:12px; }
.hint { color:var(--tx3); font-size:12px; font-weight:500; }
.hint.big { font-size:13px; margin-top:12px; padding:10px 14px; border-radius:12px; background:rgba(94,155,255,.08); color:var(--tx2); }
.alert { background:rgba(255,77,109,.12); border:1px solid rgba(255,77,109,.5); color:#ffb3c0; padding:11px 15px; border-radius:13px; margin-bottom:14px; }
.alert.ok { background:rgba(58,220,132,.12); border-color:rgba(58,220,132,.5); color:#bff5d6; }
hr { border:0; border-top:1px solid var(--line); margin:16px 0; }
code { background:rgba(8,12,24,.6); padding:3px 9px; border-radius:9px; color:var(--pri); direction:ltr; display:inline-block; }
/* login */
.login-body { display:grid; place-items:center; min-height:100vh; }
.login { width:min(92vw, 400px); display:flex; flex-direction:column; gap:14px; }
.login .btn { margin-top:6px; }
/* wizard */
.steps { list-style:none; display:flex; gap:6px; padding:0; margin:0 0 18px; }
.steps li { flex:1; display:flex; align-items:center; gap:8px; padding:9px 12px; border-radius:14px; border:1px solid var(--line); background:var(--card); color:var(--tx3); font-weight:800; font-size:12.5px; cursor:default; backdrop-filter:blur(10px); }
.steps li span { width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:var(--glass); font-size:12px; }
.steps li.on { color:var(--tx); border-color:rgba(94,155,255,.6); background:rgba(94,155,255,.12); }
.steps li.on span { background:var(--pri); color:#fff; }
.steps li.done { color:var(--ok); cursor:pointer; }
.steps li.done span { background:rgba(58,220,132,.2); color:var(--ok); }
.step { display:none; } .step.on { display:block; animation:rise .25s ease; }
@keyframes rise { from { opacity:0; transform:translateY(6px);} to { opacity:1; transform:none;} }
.choice-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; margin-bottom:16px; }
.choice-grid.three { grid-template-columns:repeat(3, 1fr); }
.choice { text-align:right; padding:16px 18px; border-radius:18px; border:1px solid var(--line2); background:var(--glass); color:var(--tx); cursor:pointer; font-family:inherit; display:flex; flex-direction:column; gap:4px; transition:.18s; backdrop-filter:blur(10px); }
.choice.sm { padding:12px 14px; }
.choice b { font-size:14.5px; font-weight:900; }
.choice small { color:var(--tx3); font-weight:500; line-height:1.6; }
.choice:hover { border-color:rgba(140,165,220,.5); transform:translateY(-1px); }
.choice.on { border-color:var(--pri); background:rgba(94,155,255,.14); box-shadow:0 0 0 3px rgba(94,155,255,.16); }
.only-fixed, .only-floating, .only-notice, .only-ad { display:none; }
.style-fixed .only-fixed, .style-floating .only-floating { display:block; }
.kind-notice .only-notice, .kind-ad .only-ad { display:grid; }
.kind-notice p.only-notice { display:block; }
.kind-ad label.only-ad { display:flex; }
.chips { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.chip { flex-direction:row; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; border:1px solid var(--line2); background:var(--glass); cursor:pointer; }
.chip:has(input:checked) { border-color:var(--pri); background:rgba(94,155,255,.16); color:var(--tx); }
.chip input { margin:0; }
.drop { position:relative; border:1.5px dashed var(--line2); border-radius:18px; padding:22px; background:rgba(8,12,24,.4); transition:.18s; display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; margin-bottom:6px; }
.drop.over { border-color:var(--pri); background:rgba(94,155,255,.08); }
.drop input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; }
.drop-inner { display:flex; flex-direction:column; gap:4px; color:var(--tx2); }
.drop-inner small { color:var(--tx3); }
.drop-icon { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:rgba(94,155,255,.16); color:var(--pri); font-size:20px; margin-bottom:6px; }
.drop-preview:empty { display:none; }
.drop-preview img, .drop-preview video { max-height:150px; max-width:260px; border-radius:12px; border:1px solid var(--line2); display:block; position:relative; z-index:1; }
.summary { margin-top:16px; padding:12px 14px; border-radius:14px; background:rgba(58,220,132,.08); border:1px solid rgba(58,220,132,.3); color:var(--tx2); }
.wizard-nav { display:flex; align-items:center; gap:10px; margin-top:6px; }
.grow { flex:1; }
.sizes th, .sizes td { font-size:12.5px; }
@media (max-width:720px) { .choice-grid, .choice-grid.three { grid-template-columns:1fr; } .steps li { font-size:0; gap:0; justify-content:center; } .steps li span { font-size:12px; } .drop { grid-template-columns:1fr; } .top { padding:12px 14px; } nav a { padding:6px 9px; } }
.tag.on { background:rgba(58,220,132,.16); color:var(--ok); }
.tag.off { background:rgba(255,77,109,.14); color:var(--danger); }