.avatar-picker {
  display: grid;
  width: 76px;
  height: 76px;
  flex: 0 0 76px;
  place-items: center;
  cursor: pointer;
}

.avatar-upload {
  display: flex;
  gap: 14px;
  align-items: center;
  margin: 18px 0;
}

.upload-copy {
  min-width: 0;
  flex: 1;
}

.upload-copy small {
  display: block;
  margin: 5px 0 9px;
  color: var(--muted);
}

.avatar-click { position: relative; display: block !important; flex: 0 0 76px; margin: 0 !important; cursor: pointer; }
.avatar-click input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.avatar-click::after { content: "✎"; position: absolute; left: -4px; bottom: -4px; display: grid; width: 25px; height: 25px; place-items: center; border: 2px solid #111622; border-radius: 9px; background: var(--violet); color: #fff; font-size: 12px; }

.upload-status {
  display: block;
  margin-top: 6px;
  color: var(--cyan);
  font-size: 11px;
}

.link-form-status {
  margin: 5px 0 0;
}

.branding-toggle { display: flex !important; align-items: center; justify-content: space-between; gap: 15px; margin-top: 20px !important; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: #ffffff06; }
.branding-toggle[hidden] { display: none !important; }
.onboarding[hidden] { display: none !important; }
.branding-toggle span { text-align: right; }
.branding-toggle small { display: block; margin-top: 4px; color: var(--muted); }
.branding-toggle input { width: 22px !important; height: 22px; flex: 0 0 22px; accent-color: var(--violet); }

.add-link-button { width: 100%; margin: 14px 0 4px; border: 1px dashed #8068ff88; border-radius: 14px; padding: 13px; background: #8068ff12; color: #cfc7ff; font-weight: 900; }
.link-editor { margin-top: 14px; padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: #090d17; }
.link-editor[hidden] { display: none; }
.link-editor label { margin-top: 0; text-align: right; }
.link-editor textarea { resize: vertical; }
.link-editor .small-primary { margin-top: 6px; }
.cancel-link { margin-right: 7px; border: 0; border-radius: 10px; padding: 9px 13px; background: #ffffff0b; color: #b8c1cf; }

/* Keep mobile forms stable: iOS zooms focused fields smaller than 16px. */
input, textarea, select { font-size: 16px !important; }
.dashboard-body { overflow-x: hidden; }

.auto-save-note { color: var(--cyan); font-size: 11px; }
.color-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.color-controls input[type="color"] { height: 52px; padding: 5px; cursor: pointer; }
.theme-choice { position: relative; display: grid; place-items: center; gap: 3px; overflow: hidden; }
.theme-choice small { display: block; font-size: 9px; font-weight: 800; }
.theme-choice.locked { filter: saturate(.45) brightness(.7); }
.plans, .dash-plans { grid-template-columns: repeat(4, 1fr); }
.free-plan-label { margin-top: auto; border: 1px solid var(--line); border-radius: 11px; padding: 10px; color: var(--cyan); text-align: center; font-size: 12px; font-weight: 800; }
@media (max-width: 900px) { .plans, .dash-plans { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .plans, .dash-plans { grid-template-columns: 1fr; } }

/* Guided onboarding and clearer navigation. */
.guided-onboarding{align-items:stretch}.onboarding-progress{display:flex;gap:7px;margin:24px 0 0;padding:0;list-style:none}.onboarding-progress li{display:flex;flex:1;align-items:center;gap:6px;color:#667084;font-size:10px;font-weight:800}.onboarding-progress li b{display:grid;width:24px;height:24px;place-items:center;border:1px solid #ffffff16;border-radius:50%;background:#101520}.onboarding-progress li.active{color:#d8d2ff}.onboarding-progress li.active b{border-color:#8a74ff;background:#7961f4;color:#fff;box-shadow:0 0 18px #7961f440}.guided-form{min-height:365px}.onboarding-step{display:none;animation:guidedStepIn .3s ease both}.onboarding-step.active{display:block}.onboarding-step>small{color:#9d8cff;font-weight:900}.onboarding-step h2{margin:7px 0 18px}.onboarding-step textarea{width:100%;border:1px solid #ffffff16;border-radius:13px;background:#090d17;color:#fff;padding:13px;font:inherit;resize:vertical}.step-actions{display:grid;grid-template-columns:.7fr 1.3fr;gap:8px;margin-top:15px}.step-actions button{margin:0}.create-summary{border:1px solid #ffffff12;border-radius:17px;padding:17px;background:#0b101a}.create-summary b,.create-summary span{display:block}.create-summary b{font-size:20px}.create-summary span{margin-top:5px;color:#9d8cff;direction:ltr;text-align:right}.create-summary p{margin:13px 0 0;color:#98a2b4;line-height:1.7}.editor-tabs button i{display:block;margin-bottom:3px;font-size:14px;font-style:normal}.editor-tabs button{transition:background .2s,color .2s,transform .2s}.editor-tabs button:active{transform:scale(.96)}button,.public-url,#ownerPanelBtn{touch-action:manipulation}@keyframes guidedStepIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}@media(max-width:720px){.guided-onboarding{margin-top:4vh}.guided-form{min-height:340px}.onboarding-progress{margin-top:15px}.editor-tabs button{min-width:74px}}

.upgrade-guide{position:relative;overflow:hidden;margin-bottom:14px;border:1px solid #8067ff55;border-radius:22px;padding:21px;background:radial-gradient(circle at 90% 0,#8067ff35,transparent 42%),linear-gradient(145deg,#191d2c,#10141f);box-shadow:0 18px 50px #0004}.upgrade-guide>small{color:#a99cff;font-weight:900}.upgrade-guide>div{display:flex;align-items:center;gap:10px;margin:13px 0}.upgrade-guide>div span{display:flex;flex-direction:column;gap:3px;color:#858fa1;font-size:10px}.upgrade-guide>div b{color:#fff;font-size:17px}.upgrade-guide>div i{color:#8f7cff;font-size:22px;font-style:normal}.upgrade-guide>p{margin:0 0 14px;color:#aab3c3}.upgrade-next{width:100%;border:0;border-radius:13px;padding:13px;background:linear-gradient(135deg,#8268ff,#5d45dc);color:#fff;font-weight:900;box-shadow:0 10px 25px #654ee33a}.upgrade-next:disabled{background:#253044;color:#75d6b5;box-shadow:none}.upgrade-back{position:absolute;top:14px;left:14px;border:1px solid #ffffff16;border-radius:10px;padding:8px 10px;background:#ffffff08;color:#d7dce5;font-size:10px;font-weight:800}.dash-plans article.completed{opacity:.62}.dash-plans article.completed:after{content:'✓ تمت ترقيتها';color:var(--cyan);font-size:10px;font-weight:800}
.dash-plans article.wanted{border-color:#b3a5ff;box-shadow:0 0 0 2px #8067ff55,0 18px 45px #5c45d52c;animation:wantedPlanPulse 1.8s ease-in-out 2}@keyframes wantedPlanPulse{50%{transform:translateY(-4px);filter:brightness(1.14)}}