/* FlashChat purple theme  matches App.tsx StyleSheet */
:root{
  --purple:#8B5CF6;
  --purple-dark:#6D28D9;
  --purple-soft:#efe7ff;
  --purple-border:#e0d5ff;
  --text:#111;
  --text-mid:#222;
  --text-muted:#666;
  --text-dim:#999;
  --text-faint:#aaa;
  --border:#eee;
  --border-strong:#e5e5e5;
  --bg:#fff;
  --bg-soft:#f3f3f3;
  --bg-hover:#fafafa;
  --success:#22c55e;
  --danger:#E53935;
  --gold:#FFD700;
  --radius-card:22px;
  --radius-btn:14px;
  --radius-btn-lg:16px;
  --radius-pill:22px;
  --radius-photo:12px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{overflow-y:scroll;-webkit-text-size-adjust:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  background:var(--bg);color:var(--text);min-height:100vh;
  font-size:16px;line-height:1.4;-webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font-family:inherit;font-size:inherit;}
a{color:var(--purple);text-decoration:none;}

/* Brand header */
.brand-header{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 16px;background:#fff;border-bottom:1px solid var(--border);
}
.brand-header img{width:36px;height:36px;object-fit:contain;}
.brand-header .wordmark{
  display:inline-block;background:linear-gradient(135deg,#0a3d0a,#1a5a1a);
  border:2.5px solid #fff;border-radius:12px;padding:6px 20px;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
}
.brand-header .wordmark h1{
  margin:0;font-family:Georgia,'Times New Roman',serif;
  font-size:20px;font-weight:900;letter-spacing:1px;
  color:#FFD700;line-height:1.1;
}

/* Layout */
.page{max-width:520px;margin:0 auto;padding:0 16px 100px;}
.page-wide{max-width:900px;margin:0 auto;padding:0 16px 100px;}

/* Top bar */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 8px;background:#fff;border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:50;
}
.topbar-back{
  width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:none;cursor:pointer;font-size:24px;color:var(--text);
}
.topbar-title{font-size:18px;font-weight:800;color:var(--text);}

/* Cards */
.card{background:#fff;border-radius:var(--radius-card);border:1px solid var(--border);overflow:hidden;}

/* Buttons */
.btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;padding:16px;border-radius:var(--radius-btn);
  border:none;cursor:pointer;font-weight:800;font-size:16px;
  transition:transform .08s ease,opacity .15s;
}
.btn:active{transform:scale(.98);}
.btn:disabled{opacity:.6;cursor:not-allowed;}
.btn-primary{background:var(--purple);color:#fff;}
.btn-secondary{background:#fff;color:var(--purple);border:2px solid var(--purple);}
.btn-outline{background:#fff;color:var(--text);border:1px solid var(--border-strong);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-ghost{background:transparent;color:var(--text-dim);font-weight:700;padding:10px;}

/* Inputs */
.input{
  width:100%;padding:14px;border-radius:10px;
  border:1px solid var(--border-strong);background:#fff;color:var(--text);
  font-size:16px;outline:none;transition:border-color .15s;
}
.input:focus{border-color:var(--purple);}
.input-label{font-size:14px;font-weight:700;color:var(--text);margin-top:12px;margin-bottom:6px;display:block;}
.input-hint{font-size:12px;color:var(--text-dim);margin-top:6px;}

/* Photo grid */
.photo-grid{display:flex;flex-wrap:wrap;gap:10px;}
.photo-slot{
  width:calc((100% - 20px) / 3);aspect-ratio:1;
  border-radius:var(--radius-photo);overflow:hidden;
  position:relative;background:#f5f5f5;
}
.photo-slot img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-slot.add{
  border:2px dashed #ccc;background:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:#888;font-size:42px;font-weight:300;
}
.photo-slot.add input[type=file]{display:none;}
.photo-x{
  position:absolute;top:8px;right:8px;width:28px;height:28px;
  border-radius:50%;background:#fff;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:900;color:#333;box-shadow:0 1px 3px rgba(0,0,0,.15);
}
.photo-x:hover{background:#f5f5f5;}

/* Toggle */
.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:20px 0;gap:12px;}
.toggle-label{font-size:16px;font-weight:800;color:var(--text);flex:1;line-height:1.3;}
.toggle{
  position:relative;width:52px;height:32px;flex-shrink:0;
  appearance:none;background:#e5e5e5;border-radius:16px;cursor:pointer;
  transition:background .2s;
}
.toggle:checked{background:var(--purple);}
.toggle::after{
  content:'';position:absolute;top:2px;left:2px;width:28px;height:28px;
  background:#fff;border-radius:50%;transition:transform .2s;
  box-shadow:0 1px 3px rgba(0,0,0,.2);
}
.toggle:checked::after{transform:translateX(20px);}

/* Tabs */
.tabs{display:flex;background:#fff;border-bottom:1px solid var(--border);}
.tab{
  flex:1;padding:14px;text-align:center;cursor:pointer;
  border:none;background:transparent;font-size:16px;font-weight:700;color:#888;
  border-bottom:3px solid transparent;transition:color .15s,border-color .15s;
}
.tab.active{color:var(--purple);border-bottom-color:var(--purple);}

/* Menu list */
.menu-list{margin-top:12px;background:#fff;border-radius:var(--radius-btn-lg);border:1px solid var(--border);overflow:hidden;}
.menu-row{
  display:flex;align-items:center;padding:16px;border-bottom:1px solid #f0f0f0;
  cursor:pointer;background:#fff;width:100%;border-left:none;border-right:none;border-top:none;
  text-align:left;font-family:inherit;
}
.menu-row:last-child{border-bottom:none;}
.menu-row:hover{background:var(--bg-hover);}
.menu-icon{
  width:40px;height:40px;border-radius:50%;background:var(--purple-soft);
  display:flex;align-items:center;justify-content:center;
  margin-right:14px;font-size:20px;flex-shrink:0;
}
.menu-label{flex:1;font-size:17px;font-weight:700;color:var(--text);}
.menu-label.danger{color:var(--danger);}
.menu-chevron{font-size:26px;color:#bbb;font-weight:300;}

/* Profile header */
.profile-top{display:flex;flex-direction:column;align-items:center;padding:32px 16px;}
.avatar{
  width:110px;height:110px;border-radius:55px;margin-bottom:14px;
  object-fit:cover;background:var(--purple);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:36px;font-weight:900;
}
.profile-name{font-size:22px;font-weight:800;color:var(--text);}
.profile-edit{color:var(--purple);font-size:15px;font-weight:700;margin-top:6px;background:none;border:none;cursor:pointer;padding:4px 8px;}

/* Completeness */
.completeness-card{
  margin:0 16px 20px;padding:16px;border-radius:var(--radius-btn-lg);
  border:1px solid var(--border-strong);background:#fff;
}
.completeness-head{display:flex;justify-content:space-between;margin-bottom:10px;align-items:baseline;}
.completeness-title{font-size:16px;font-weight:800;color:var(--text);}
.completeness-pct{font-size:18px;font-weight:900;color:var(--purple);}
.completeness-bar{height:8px;background:#eee;border-radius:4px;overflow:hidden;}
.completeness-fill{height:8px;background:var(--purple);border-radius:4px;transition:width .3s;}
.completeness-hint{font-size:14px;color:#444;margin-top:12px;line-height:20px;}

/* Pills */
.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px;}
.pill{
  padding:10px 18px;border-radius:var(--radius-pill);
  background:var(--bg-soft);border:1px solid var(--border-strong);
  font-size:14px;font-weight:600;color:#333;cursor:pointer;
  font-family:inherit;transition:all .15s;
}
.pill.active{background:var(--purple);border-color:var(--purple);color:#fff;}
.meta-pill{
  padding:5px 10px;border-radius:12px;
  background:var(--purple-soft);border:1px solid var(--purple-border);
  color:var(--purple);font-size:12px;font-weight:700;display:inline-block;
}
.meta-pill.premium{background:#fff5cc;border-color:#ffe088;color:#a37a00;}

/* Prompt boxes */
.prompt-row{display:flex;gap:10px;margin-bottom:12px;}
.prompt-box{
  flex:1;aspect-ratio:.95;border-radius:var(--radius-photo);
  border:2px dashed #ccc;background:#fff;
  display:flex;align-items:center;justify-content:center;
  color:#888;font-size:42px;font-weight:300;cursor:pointer;
}
.big-label{font-size:20px;font-weight:900;color:var(--text);margin-top:20px;margin-bottom:6px;}
.big-hint{font-size:14px;color:var(--text-muted);line-height:20px;margin-bottom:12px;}

/* Textarea */
.textarea{
  min-height:110px;width:100%;background:#fff;border-radius:12px;
  border:1px solid #ddd;padding:14px;font-size:16px;color:var(--text);
  resize:vertical;outline:none;font-family:inherit;
}
.textarea:focus{border-color:var(--purple);}
.char-count{font-size:12px;color:#888;text-align:right;margin-top:6px;}

/* Preview */
.preview-hero{width:100%;height:55vh;object-fit:cover;background:var(--purple);}
.preview-hero-placeholder{
  width:100%;height:55vh;background:var(--purple);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:80px;font-weight:900;
}
.preview-body{padding:20px;}
.preview-name{font-size:28px;font-weight:900;color:var(--text);}
.preview-bio{font-size:16px;line-height:24px;color:#333;margin-top:12px;}

/* Discover grid */
.user-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-top:16px;}
.user-card{
  background:#fff;border-radius:var(--radius-card);overflow:hidden;
  border:1px solid var(--border);cursor:pointer;
  transition:transform .12s,box-shadow .12s;
  display:flex;flex-direction:column;
}
.user-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.06);}
.user-photo{width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--purple);}
.user-photo-placeholder{
  width:100%;aspect-ratio:3/4;background:var(--purple);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:64px;font-weight:900;
}
.user-card-body{padding:14px;display:flex;flex-direction:column;gap:8px;flex:1;}
.user-name-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;}
.user-name{font-size:20px;font-weight:900;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.user-age{font-size:18px;font-weight:700;color:var(--text-muted);flex-shrink:0;}
.user-distance{font-size:13px;color:var(--purple);font-weight:700;}
.user-bio{font-size:14px;color:var(--text-mid);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.user-meta{display:flex;flex-wrap:wrap;gap:6px;}
.user-actions{display:flex;gap:8px;margin-top:auto;padding-top:10px;}
.user-actions .btn{flex:1;padding:12px;font-size:14px;}

/* Online pill */
.online-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:20px;background:rgba(255,255,255,.95);
  font-size:12px;font-weight:800;color:var(--success);
}
.online-dot{width:8px;height:8px;border-radius:4px;background:var(--success);}

/* Conversations */
.conv-list{display:flex;flex-direction:column;}
.conv-row{
  display:flex;align-items:center;gap:14px;padding:14px 4px;
  border-bottom:1px solid var(--border);cursor:pointer;
  background:#fff;width:100%;border-left:none;border-right:none;border-top:none;
  text-align:left;font-family:inherit;
}
.conv-row:last-child{border-bottom:none;}
.conv-avatar{position:relative;flex-shrink:0;}
.conv-avatar img,.conv-avatar .ph{
  width:56px;height:56px;border-radius:28px;object-fit:cover;background:var(--purple);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;font-weight:900;
}
.conv-emoji{
  position:absolute;bottom:-2px;left:-2px;
  width:22px;height:22px;border-radius:11px;background:var(--purple);
  display:flex;align-items:center;justify-content:center;font-size:12px;
  border:2px solid #fff;
}
.conv-body{flex:1;min-width:0;}
.conv-name{font-size:17px;font-weight:900;color:var(--text);margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.conv-last{font-size:14px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.conv-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;}
.conv-time{font-size:13px;color:var(--text-faint);font-weight:600;}
.conv-turn{background:var(--purple);color:#fff;font-size:11px;font-weight:800;padding:4px 10px;border-radius:12px;letter-spacing:.3px;}

.section-title{font-size:20px;font-weight:900;color:var(--text);margin:20px 0 12px;}

/* Empty / loading */
.empty-box{text-align:center;padding:60px 20px;color:var(--text-muted);}
.empty-big{font-size:20px;font-weight:900;color:var(--text);margin-bottom:8px;}
.empty-text{font-size:15px;color:var(--text-muted);margin-bottom:20px;line-height:1.5;}
.loading{text-align:center;padding:60px 20px;color:var(--purple);font-size:15px;font-weight:700;}
.spinner{
  width:32px;height:32px;border:3px solid var(--purple-soft);border-top-color:var(--purple);
  border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px;
}
@keyframes spin{to{transform:rotate(360deg);}}

.error-banner{
  background:rgba(229,57,53,.08);border:1px solid rgba(229,57,53,.3);
  color:var(--danger);border-radius:10px;padding:12px 14px;margin:12px 0;
  font-size:14px;text-align:center;
}

.row-two{display:flex;align-items:center;gap:10px;}
.row-two .input{flex:1;}
.dash{color:var(--text);font-size:18px;font-weight:700;}

.dist-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.dist-pill{
  padding:10px 14px;border-radius:20px;background:var(--bg-soft);
  border:1px solid var(--border-strong);font-size:14px;font-weight:700;color:#333;
  cursor:pointer;font-family:inherit;
}
.dist-pill.active{background:var(--purple);border-color:var(--purple);color:#fff;}

.preview-empty{
  width:100%;aspect-ratio:1;background:var(--purple-soft);
  display:flex;align-items:center;justify-content:center;
  color:var(--purple);font-size:64px;font-weight:900;
}/* ============================================================
   DARK THEME  matches homepage look
   ============================================================ */
:root{
  --text:#ffffff !important;
  --text-mid:#e8e8ee !important;
  --text-muted:#c8c8d0 !important;
  --text-dim:#a0a0b0 !important;
  --text-faint:#8888a0 !important;
  --border:rgba(255,255,255,0.12) !important;
  --border-strong:rgba(255,255,255,0.18) !important;
  --bg:#0a0a12 !important;
  --bg-soft:rgba(255,255,255,0.05) !important;
  --bg-hover:rgba(255,255,255,0.08) !important;
}
body{
  background-color:#0a0a12 !important;
  background-image:url('/logo.png') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:cover !important;
  background-attachment:fixed !important;
  color:#fff !important;
  font-size:18px !important;
  position:relative;
}
body::before{
  content:'';
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.72);
  z-index:0;
  pointer-events:none;
}
.page, .page-wide, .topbar, .brand-header, .menu-list, .completeness-card,
.card, .photo-grid, .photo-slot, .tabs, .tab, .empty-box, .loading{
  position:relative;
  z-index:1;
}
.topbar{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.12) !important;}
.topbar-title{color:#fff !important;font-size:22px !important;font-weight:900 !important;}
.topbar-back{color:#fff !important;font-size:28px !important;}
.brand-header{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.12) !important;}
.brand-header .wordmark{background:linear-gradient(135deg,#0a3d0a,#1a5a1a) !important;border:2.5px solid #fff !important;}
.menu-list{background:rgba(0,0,0,0.55) !important;border:1px solid rgba(255,255,255,0.12) !important;}
.menu-row{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.08) !important;color:#fff !important;}
.menu-label{color:#fff !important;font-size:19px !important;}
.menu-icon{background:rgba(139,92,246,0.25) !important;}
.menu-chevron{color:rgba(255,255,255,0.5) !important;font-size:28px !important;}
.card, .completeness-card{background:rgba(0,0,0,0.55) !important;border:1px solid rgba(255,255,255,0.12) !important;color:#fff !important;}
.completeness-title{color:#fff !important;font-size:18px !important;}
.completeness-pct{color:#C4B5FD !important;font-size:20px !important;}
.completeness-hint{color:rgba(255,255,255,0.8) !important;font-size:16px !important;}
.profile-name{color:#fff !important;font-size:26px !important;}
.profile-edit{color:#C4B5FD !important;font-size:17px !important;}
.input, .textarea{background:rgba(0,0,0,0.6) !important;color:#fff !important;border:2px solid rgba(255,255,255,0.25) !important;font-size:17px !important;}
.input::placeholder, .textarea::placeholder{color:rgba(255,255,255,0.4) !important;}
.input-label{color:#fff !important;font-size:16px !important;font-weight:800 !important;}
.input-hint, .big-hint{color:rgba(255,255,255,0.7) !important;font-size:15px !important;}
.big-label{color:#fff !important;font-size:22px !important;}
.char-count{color:rgba(255,255,255,0.6) !important;font-size:14px !important;}
.section-title{color:#fff !important;font-size:22px !important;}
.btn{font-size:17px !important;padding:18px !important;}
.btn-primary{background:linear-gradient(135deg,#8B5CF6 0%,#6D28D9 100%) !important;color:#fff !important;border:2px solid #fff !important;}
.btn-secondary{background:rgba(30,40,80,0.7) !important;color:#fff !important;border:2px solid #fff !important;}
.btn-outline{background:rgba(0,0,0,0.5) !important;color:#fff !important;border:2px solid rgba(255,255,255,0.5) !important;}
.btn-danger{background:rgba(229,57,53,0.85) !important;color:#fff !important;border:2px solid #fff !important;}
.btn-ghost{color:rgba(255,255,255,0.8) !important;font-size:17px !important;}
.tabs{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.12) !important;}
.tab{color:rgba(255,255,255,0.6) !important;font-size:18px !important;}
.tab.active{color:#C4B5FD !important;border-bottom-color:#C4B5FD !important;}
.photo-slot{background:rgba(0,0,0,0.5) !important;}
.photo-slot.add{border:2px dashed rgba(255,255,255,0.3) !important;color:rgba(255,255,255,0.6) !important;background:rgba(0,0,0,0.4) !important;}
.photo-x{background:#fff !important;color:#111 !important;}
.toggle{background:rgba(255,255,255,0.2) !important;}
.toggle:checked{background:#8B5CF6 !important;}
.prompt-box{border:2px dashed rgba(255,255,255,0.3) !important;color:rgba(255,255,255,0.6) !important;background:rgba(0,0,0,0.4) !important;}
.preview-hero-placeholder{background:#8B5CF6 !important;}
.tabs-filter{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.12) !important;}
.tabs-filter .tab{color:rgba(255,255,255,0.6) !important;font-size:16px !important;}
.tabs-filter .tab.active{color:#C4B5FD !important;}
.tabs-filter .count{color:#C4B5FD !important;}
.user-card{background:rgba(0,0,0,0.55) !important;border:1px solid rgba(255,255,255,0.12) !important;}
.user-name{color:#fff !important;font-size:20px !important;}
.user-age{color:rgba(255,255,255,0.6) !important;}
.user-bio{color:rgba(255,255,255,0.75) !important;font-size:14px !important;}
.user-distance{color:#C4B5FD !important;}
.search{background:rgba(0,0,0,0.6) !important;color:#fff !important;border:2px solid rgba(255,255,255,0.25) !important;font-size:16px !important;}
.search::placeholder{color:rgba(255,255,255,0.4) !important;}
.meta-pill{background:rgba(139,92,246,0.25) !important;border-color:rgba(139,92,246,0.5) !important;color:#C4B5FD !important;}
.meta-pill.premium{background:rgba(255,215,0,0.2) !important;border-color:rgba(255,215,0,0.4) !important;color:#FFD700 !important;}
.conv-row{background:transparent !important;border-bottom:1px solid rgba(255,255,255,0.1) !important;}
.conv-name{color:#fff !important;font-size:18px !important;}
.conv-last{color:rgba(255,255,255,0.65) !important;font-size:15px !important;}
.conv-time{color:rgba(255,255,255,0.5) !important;}
.conv-turn{background:#8B5CF6 !important;color:#fff !important;}
.pill{background:rgba(0,0,0,0.5) !important;color:#fff !important;border:1px solid rgba(255,255,255,0.2) !important;font-size:15px !important;}
.pill.active{background:#8B5CF6 !important;border-color:#8B5CF6 !important;color:#fff !important;}
.dist-pill{background:rgba(0,0,0,0.5) !important;color:#fff !important;border:1px solid rgba(255,255,255,0.2) !important;}
.dist-pill.active{background:#8B5CF6 !important;border-color:#8B5CF6 !important;}
.pub-name{color:#fff !important;font-size:32px !important;}
.pub-name .age{color:rgba(255,255,255,0.7) !important;font-size:28px !important;}
.pub-bio{color:rgba(255,255,255,0.85) !important;font-size:17px !important;}
.pub-bio-muted{color:rgba(255,255,255,0.5) !important;}
.pub-section{color:#fff !important;font-size:18px !important;}
.pub-row{background:rgba(0,0,0,0.5) !important;border:1px solid rgba(255,255,255,0.12) !important;}
.pub-row .label{color:rgba(255,255,255,0.6) !important;font-size:12px !important;}
.pub-row .value{color:#fff !important;font-size:17px !important;}
.pub-distance{color:#C4B5FD !important;font-size:15px !important;}
.pub-actions{background:rgba(0,0,0,0.85) !important;border-top:1px solid rgba(255,255,255,0.12) !important;}
.age-pill{background:rgba(0,0,0,0.4) !important;border-color:rgba(255,215,0,0.4) !important;color:#FFD700 !important;}
.empty-box{color:rgba(255,255,255,0.85) !important;}
.empty-big{color:#fff !important;font-size:22px !important;}
.empty-text{color:rgba(255,255,255,0.7) !important;font-size:16px !important;}
.loading{color:#C4B5FD !important;font-size:17px !important;}
.error-banner{background:rgba(229,57,53,0.25) !important;border-color:rgba(229,57,53,0.6) !important;color:#ff9e9e !important;}


/* Force bigger brand header */
.brand-header{padding:20px 16px !important;}
.brand-header img{width:72px !important;height:72px !important;padding:10px !important;border-radius:18px !important;background:rgba(255,255,255,0.06) !important;}
.brand-header .wordmark{padding:10px 32px !important;background:linear-gradient(135deg,#0a3d0a,#1a5a1a) !important;border:2.5px solid #fff !important;border-radius:14px !important;}
.brand-header .wordmark h1{font-size:28px !important;letter-spacing:1.2px !important;margin:0 !important;color:#FFD700 !important;font-family:Georgia,serif !important;}
@media (max-width:520px){
  .brand-header img{width:64px !important;height:64px !important;}
  .brand-header .wordmark h1{font-size:24px !important;}
}

/* ============================================================
   FINAL CORRECTIONS - 2026-09-16
   ============================================================ */

/* 1. Back button (X) - force top-left position */
.back-btn,
.back-btn-home,
.admin-back-btn{
  position:fixed !important;
  top:20px !important;
  left:20px !important;
  right:auto !important;
  bottom:auto !important;
  z-index:9999 !important;
  width:44px !important;
  height:44px !important;
  border-radius:50% !important;
  background:#E53935 !important;
  color:#fff !important;
  font-size:22px !important;
  font-weight:900 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:2.5px solid #fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,0.5) !important;
  padding:0 !important;
  text-decoration:none !important;
  font-family:inherit !important;
}
.back-btn:hover,
.back-btn-home:hover,
.admin-back-btn:hover{background:#C62828 !important;}

/* 2. Bigger brand header (logo + wordmark) */
.brand-header{padding:20px 16px !important;}
.brand-header img{width:72px !important;height:72px !important;padding:10px !important;border-radius:18px !important;}
.brand-header .wordmark{padding:10px 32px !important;border-radius:14px !important;}
.brand-header .wordmark h1{font-size:28px !important;letter-spacing:1.2px !important;}

/* 3. Register / edit-profile / any page with .auth-wrap */
.auth-wrap{
  max-width:520px !important;
  margin:0 auto !important;
  padding:32px 24px 100px !important;
}
.auth-wrap .field{
  margin-bottom:18px !important;
}
.auth-wrap .field label{
  font-size:15px !important;
  font-weight:800 !important;
  letter-spacing:0.8px !important;
  color:rgba(255,255,255,0.9) !important;
  text-transform:uppercase !important;
  margin-bottom:8px !important;
}
.auth-wrap .field input,
.auth-wrap .field select,
.auth-wrap .field textarea{
  padding:18px 20px !important;
  font-size:18px !important;
  font-weight:600 !important;
  border-radius:12px !important;
  background:rgba(0,0,0,0.6) !important;
  color:#fff !important;
  border:2px solid rgba(255,255,255,0.25) !important;
}
.auth-wrap .field input::placeholder,
.auth-wrap .field textarea::placeholder{
  color:rgba(255,255,255,0.45) !important;
  font-size:17px !important;
}
.auth-wrap .field input:focus,
.auth-wrap .field select:focus,
.auth-wrap .field textarea:focus{
  border-color:#8B5CF6 !important;
}
.auth-wrap .field select{
  font-size:18px !important;
  background-color:rgba(0,0,0,0.6) !important;
}
.auth-wrap .pill{
  padding:14px 24px !important;
  font-size:16px !important;
  font-weight:700 !important;
  border-radius:26px !important;
}
.auth-wrap .check-row{
  padding:16px !important;
  font-size:16px !important;
  margin-bottom:12px !important;
}
.auth-wrap .check-row label{
  font-size:16px !important;
  font-weight:600 !important;
}
.auth-wrap .check-row input[type=checkbox]{
  width:26px !important;
  height:26px !important;
}
.auth-wrap .btn{
  padding:20px !important;
  font-size:18px !important;
  font-weight:900 !important;
  border-radius:16px !important;
  letter-spacing:0.4px !important;
}
.auth-wrap .brand-top h1{
  font-size:38px !important;
}
.auth-wrap .brand-top img{
  width:84px !important;
  height:84px !important;
}
.auth-wrap .brand-top .sub{
  font-size:16px !important;
}
.auth-wrap .step-dot{
  width:44px !important;
  height:5px !important;
}
.auth-wrap .hint{
  font-size:14px !important;
  color:rgba(255,255,255,0.6) !important;
  margin-top:6px !important;
}
.auth-wrap .back-link{
  font-size:16px !important;
  margin-top:24px !important;
}

/* Mobile tweaks */
@media (max-width:520px){
  .brand-header img{width:60px !important;height:60px !important;}
  .brand-header .wordmark h1{font-size:24px !important;}
  .auth-wrap{padding:24px 20px 100px !important;}
  .auth-wrap .field input,
  .auth-wrap .field select,
  .auth-wrap .field textarea{padding:16px 18px !important;font-size:17px !important;}
  .auth-wrap .field label{font-size:14px !important;}
}

/* ============================================================

/* Preview photo strip */
.preview-strip{display:flex;gap:10px;padding:14px 0 0;overflow-x:auto;}
.preview-thumb{width:80px;height:80px;flex-shrink:0;border-radius:14px;overflow:hidden;cursor:pointer;background:rgba(0,0,0,0.5);border:3px solid rgba(255,255,255,0.15);transition:border-color .15s,transform .15s;}
.preview-thumb.active{border-color:#C4B5FD;transform:scale(1.05);}
.preview-thumb img{width:100%;height:100%;object-fit:cover;display:block;}