:root {
  --bg: #08131b;
  --surface: #101923;
  --surface-2: #152231;
  --surface-3: #1d3143;
  --text: #f7fbff;
  --muted: #a9b8c7;
  --accent: #21b77a;
  --accent-2: #48b9d9;
  --danger: #ff6d6d;
  --line: rgba(182, 204, 224, 0.16);
  --shadow: 0 22px 54px rgba(2, 8, 16, 0.36);
}
html[data-theme="light"] {
  --bg: #f5f8fb;
  --surface: #ffffff;
  --surface-2: #eef4f8;
  --surface-3: #e6eff5;
  --text: #07111f;
  --muted: #51657f;
  --line: rgba(15, 23, 42, 0.10);
  --shadow: 0 20px 48px rgba(15, 23, 42, 0.08);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 10% 10%, rgba(40,201,137,0.12), transparent 28%),
    radial-gradient(circle at 90% 0%, rgba(103,232,249,0.10), transparent 22%),
    linear-gradient(180deg, rgba(6,16,30,0.98), var(--bg));
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  min-height: 100vh;
}
html[data-theme="light"] body {
  background: linear-gradient(180deg, #f7fbff, var(--bg));
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
img { max-width: 100%; display: block; }
main { padding: 0 clamp(16px, 3vw, 40px) 48px; }
.shell-gradient {
  position: fixed; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 20% 20%, rgba(40,201,137,0.08), transparent 32%), radial-gradient(circle at 80% 0%, rgba(103,232,249,0.08), transparent 26%);
}
.site-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 18px clamp(16px, 3vw, 40px);
  background: rgba(6, 13, 23, 0.68);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}
.brand-lockup { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 48px; height: 48px; border-radius: 16px; }
.brand-lockup strong { display:block; font-size: 1.1rem; }
.brand-lockup span { color: var(--muted); font-size: 0.92rem; }
.site-nav { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.site-nav a, .theme-toggle {
  padding: 10px 14px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); background: transparent; cursor: pointer;
}
.site-nav a:hover, .theme-toggle:hover { color: var(--text); border-color: rgba(255,255,255,0.25); }
.hero { display:grid; gap: 28px; grid-template-columns: 1.15fr 0.85fr; padding: 42px 0; align-items:center; }
.hero-narrow { grid-template-columns: 1.2fr .8fr; }
.hero-copy h1 { font-size: clamp(2.3rem, 6vw, 4.8rem); line-height: 1.02; letter-spacing: -0.04em; margin: 0 0 16px; }
.hero-copy p { color: var(--muted); font-size: 1.05rem; line-height: 1.75; max-width: 64ch; }
.eyebrow { display:inline-flex; border-radius:999px; padding:10px 14px; background: rgba(40,201,137,0.10); border:1px solid rgba(40,201,137,0.24); color:#b8f4db; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; font-weight: 700; }
.glass-card, .glass-subcard {
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow);
}
.glass-card { padding: 22px; }
.glass-subcard { padding: 18px; }
.portal-hero-extended { grid-template-columns: 1.05fr 0.95fr; }
.portal-summary-card { display:grid; gap:18px; }
.summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.summary-grid > div { padding:16px; border-radius:20px; background: rgba(255,255,255,0.04); border:1px solid var(--line); }
.summary-grid small { display:block; color: var(--muted); margin-bottom:8px; }
.summary-grid strong { font-size: 1.5rem; }
.mini-map-card { border-radius:22px; overflow:hidden; border:1px solid var(--line); min-height: 240px; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg, rgba(40,201,137,0.08), rgba(103,232,249,0.06)); }
.portal-shell { display:grid; grid-template-columns: 280px minmax(0,1fr); gap: 22px; align-items:start; }
.portal-sidebar { position: sticky; top: 88px; display:grid; gap:8px; }
.portal-sidebar a {
  padding: 14px 16px; border-radius: 18px; color: var(--muted); border:1px solid transparent;
}
.portal-sidebar a:hover, .portal-sidebar a.is-active { color: var(--text); background: rgba(255,255,255,0.05); border-color: var(--line); }
.portal-main { display:grid; gap: 18px; }
.portal-panel { display:none; }
.portal-panel.is-active { display:block; }
.portal-shell[data-portal-mode="overview"] .portal-panel[data-portal-panel="overview"],
.portal-shell[data-portal-mode="login"] .portal-panel[data-portal-panel="login"],
.portal-shell[data-portal-mode="forgot"] .portal-panel[data-portal-panel="forgot"],
.portal-shell[data-portal-mode="reset"] .portal-panel[data-portal-panel="reset"],
.portal-shell[data-portal-mode="register"] .portal-panel[data-portal-panel="register"],
.portal-shell[data-portal-mode="onboarding"] .portal-panel[data-portal-panel="onboarding"],
.portal-shell[data-portal-mode="search"] .portal-panel[data-portal-panel="search"],
.portal-shell[data-portal-mode="jobs"] .portal-panel[data-portal-panel="jobs"],
.portal-shell[data-portal-mode="inbox"] .portal-panel[data-portal-panel="inbox"],
.portal-shell[data-portal-mode="notifications"] .portal-panel[data-portal-panel="notifications"],
.portal-shell[data-portal-mode="wallet"] .portal-panel[data-portal-panel="wallet"],
.portal-shell[data-portal-mode="receipts"] .portal-panel[data-portal-panel="wallet"],
.portal-shell[data-portal-mode="escrow"] .portal-panel[data-portal-panel="escrow"],
.portal-shell[data-portal-mode="communications"] .portal-panel[data-portal-panel="communications"],
.portal-shell[data-portal-mode="admin"] .portal-panel[data-portal-panel="admin"],
.portal-shell[data-portal-mode="addresses"] .portal-panel[data-portal-panel="addresses"],
.portal-shell[data-portal-mode="favorites"] .portal-panel[data-portal-panel="favorites"],
.portal-shell[data-portal-mode="business"] .portal-panel[data-portal-panel="business"],
.portal-shell[data-portal-mode="referrals"] .portal-panel[data-portal-panel="referrals"],
.portal-shell[data-portal-mode="settings"] .portal-panel[data-portal-panel="settings"],
.portal-shell[data-portal-mode="account"] .portal-panel[data-portal-panel="account"],
.portal-shell[data-portal-mode="security"] .portal-panel[data-portal-panel="security"],
.portal-shell[data-portal-mode="content"] .portal-panel[data-portal-panel="content"],
.portal-shell[data-portal-mode="upgrade"] .portal-panel[data-portal-panel="upgrade"],
.portal-shell[data-portal-mode="feed"] .portal-panel[data-portal-panel="feed"],
.portal-shell[data-portal-mode="market"] .portal-panel[data-portal-panel="market"],
.portal-shell[data-portal-mode="profile"] .portal-panel[data-portal-panel="profile"],
.portal-shell[data-portal-mode="verification"] .portal-panel[data-portal-panel="verification"],
.portal-shell[data-portal-mode="logout"] .portal-panel[data-portal-panel="logout"],
.portal-shell[data-portal-mode="support"] .portal-panel[data-portal-panel="support"],
.portal-shell[data-portal-mode="help"] .portal-panel[data-portal-panel="help"] { display:block; }
.panel-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom: 16px; }
.panel-header p { color: var(--muted); max-width: 60ch; }
.portal-form { display:grid; gap:14px; }
.portal-form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.portal-form-dynamic { grid-column: 1 / -1; display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:14px; }
.portal-form input, .portal-form select, .portal-form textarea, .landing-search-form input, .landing-search-form select, .thread-compose input {
  border-radius: 16px; border:1px solid var(--line); background: var(--surface-2); color: var(--text); padding: 14px 16px;
}
select { color-scheme: dark; }
html[data-theme="light"] select { color-scheme: light; }
.result-card h3, .category-card-home h3, .trade-selector-card h3 { color: var(--text); }
.result-card p, .category-card-home p, .trade-selector-card p { color: var(--muted); }
.checkbox-row { display:flex; align-items:center; gap:12px; color: var(--muted); border:1px dashed var(--line); padding: 12px 14px; border-radius: 16px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: 12px 15px; border-radius: 12px; border:1px solid transparent; font-weight:800; cursor:pointer;
  min-width: 0;
  line-height: 1.2;
}
.btn-primary { background: linear-gradient(135deg, var(--accent), #67f0bc); color:#06131b; }
.btn-secondary { background: var(--surface-2); border-color: var(--line); color: var(--text); }
.btn-danger { background: rgba(240,68,56,.18); border-color: rgba(240,68,56,.42); color:#ffd1cc; }
.inline-actions { display:flex; flex-wrap: wrap; gap:12px; }
.status-text { margin-top: 12px; color: var(--muted); min-height: 20px; }
.results-grid, .wallet-summary, .policy-grid { display:grid; gap:14px; }
.result-card, .job-card, .wallet-card, .passkey-card, .metric-card, .policy-card {
  background: rgba(255,255,255,0.035); border:1px solid var(--line); border-radius: 16px; padding: 16px; display:grid; gap:10px;
}
.result-card h3, .job-card h3, .wallet-card h3, .passkey-card h3 { margin:0; }
.result-head { display:flex; justify-content:space-between; gap:16px; }
.result-thumb { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); background: var(--surface-2); }
.result-meta { color: var(--muted); line-height: 1.55; }
.badge-row { display:flex; flex-wrap:wrap; gap:8px; }
.badge-row span { border-radius:999px; padding:8px 11px; background: rgba(255,255,255,0.05); border:1px solid var(--line); font-size:.84rem; }
.profile-dashboard { display:grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr); gap: 14px; align-items:start; }
.profile-summary-dashboard { grid-template-columns: 1fr; }
.profile-hero-card { grid-column: 1 / -1; }
.profile-selfie-card { grid-column: 1 / -1; }
.profile-next-card { grid-column: 1 / -1; }
.profile-dashboard .result-head { align-items:flex-start; justify-content:flex-start; }
.profile-dashboard .timeline-item { min-width: 0; }
.profile-dashboard .timeline-item a { margin-top: 8px; }
.profile-detail-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:10px; }
.profile-detail-grid div { border:1px solid var(--line); border-radius:14px; padding:12px; background:rgba(255,255,255,.035); display:grid; gap:4px; min-width:0; }
.profile-detail-grid strong { color: var(--text); }
.profile-detail-grid span { color: var(--muted); overflow-wrap:anywhere; }
.verification-center-shell { display:grid; gap:16px; }
.verification-steps { margin-bottom:2px; }
.verification-step-card { max-width: 980px; }
.step-kicker { color: var(--accent); font-weight:900; letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; }
.verification-section-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:14px; }
.verification-field-card { border:1px solid var(--line); border-radius:18px; padding:16px; background:rgba(255,255,255,.035); display:grid; gap:10px; }
.verification-field-card strong { color:var(--text); }
.verification-field-card span, .verification-field-card em { color:var(--muted); font-style:normal; overflow-wrap:anywhere; }
.otp-row { display:grid; grid-template-columns: minmax(0, 1fr) auto; gap:10px; align-items:center; }
.portal-form label { display:grid; gap:8px; color:var(--text); font-weight:800; min-width:0; }
.verification-video-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:12px; margin-top:12px; }
.verification-video-grid video { width:100%; min-height:220px; border-radius:16px; background:#050816; border:1px solid rgba(255,255,255,0.12); object-fit:cover; }
.verification-actions { align-items:center; }
.role-card-grid, .plan-lock-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.authenticator-setup-card { gap: 16px; }
.authenticator-qr { width: min(220px, 100%); background:#fff; border-radius:16px; padding:14px; margin:8px 0; border:1px solid rgba(255,255,255,.2); }
.authenticator-qr svg { width:100%; height:auto; display:block; }
.manual-key-box { display:grid; gap:8px; border:1px dashed var(--line); border-radius:16px; padding:12px; background:rgba(255,255,255,.035); overflow-wrap:anywhere; }
.manual-key-box code, .recovery-code-grid code { color:var(--text); background:rgba(7,14,24,.72); border:1px solid var(--line); border-radius:12px; padding:10px 12px; font-weight:900; letter-spacing:.06em; overflow-wrap:anywhere; }
.otp-box-row { display:grid; grid-template-columns: repeat(6, minmax(38px, 52px)); gap:8px; align-items:center; }
.otp-box-row input { width:100%; aspect-ratio:1; text-align:center; border-radius:14px; border:1px solid rgba(148,163,184,.42); background:rgba(9,20,38,.86); color:var(--text); font-weight:900; font-size:1.2rem; }
.otp-box-row input:focus { border-color:var(--accent); outline:2px solid rgba(40,201,137,.24); }
.recovery-code-card { border-color:rgba(40,201,137,.38); }
.recovery-code-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap:10px; }
.support-chat-bubble { border:1px solid var(--line); border-radius:18px; padding:12px 14px; background:rgba(255,255,255,.045); display:grid; gap:4px; }
.support-chat-bubble p { margin:0; color:var(--muted); }
.support-chat-bubble-bot { border-color:rgba(40,201,137,.28); }
.support-quick-replies { display:flex; flex-wrap:wrap; gap:8px; }
.support-context-card { display:grid; gap:5px; padding:12px; border-radius:16px; border:1px solid rgba(96,165,250,.34); background:rgba(96,165,250,.08); }
.support-context-card span { color:var(--muted); }
.role-card { border:1px solid var(--line); border-radius:16px; padding: 14px; background: rgba(255,255,255,.035); display:grid; gap:8px; min-width:0; }
.role-card span { color: var(--muted); line-height:1.5; }
.role-card.is-active, .subscription-plan-card.is-current { border-color: rgba(40,201,137,.5); background: rgba(40,201,137,.08); }
.subscription-overview-card, .subscription-checkout-card { grid-column: 1 / -1; }
.subscription-plan-card { align-content:start; }
.plan-benefit-columns { display:grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap:12px; }
.plan-benefit-columns > div { border:1px solid var(--line); border-radius:16px; padding:14px; background:rgba(255,255,255,.025); min-width:0; }
.plan-benefit-columns strong { color:var(--text); }
.plan-benefit-columns ul { margin:8px 0 0; padding-left:18px; color:var(--muted); line-height:1.55; }
.subscription-checkout-step { border:1px solid var(--line); border-radius:18px; padding:16px; background:rgba(255,255,255,.03); display:grid; gap:12px; }
.subscription-checkout-step h4 { margin:0; color:var(--text); }
.wallet-hero-card { grid-column: 1 / -1; }
.wallet-balance-large { font-size: clamp(2rem, 4vw, 3.4rem); line-height:1; margin: 4px 0; color: var(--text); font-weight:900; }
.wallet-warning-card { grid-column: 1 / -1; border:1px solid rgba(250,204,21,.35); border-radius:18px; padding:16px; background:rgba(250,204,21,.08); display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.wallet-warning-card strong { color: var(--text); }
.wallet-warning-card span { color: var(--muted); flex:1 1 320px; }
.crypto-address { word-break: break-all; border: 1px dashed var(--line); border-radius: 14px; padding: 12px; background: rgba(255,255,255,.035); }
.crypto-qr, .crypto-qr-placeholder { width:180px; height:180px; border-radius:16px; border:1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,.035); object-fit:cover; display:grid; place-items:center; text-align:center; color: var(--muted); }
.crypto-qr-placeholder span { font-size:2rem; font-weight:900; color:var(--text); }
.crypto-qr-placeholder small { max-width: 130px; line-height:1.4; }
.escrow-step-review { grid-column: 1 / -1; }
.escrow-wizard-actions { grid-column: 1 / -1; }
.escrow-action-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0;
}
.escrow-tab-panel {
  display: none;
}
.escrow-tab-panel.is-active {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 16px;
  align-items: start;
}
.portal-panel[data-portal-panel="escrow"] .escrow-tab-panel[data-escrow-panel="create"].is-active {
  position: fixed;
  inset: 86px 18px calc(86px + env(safe-area-inset-bottom)) 18px;
  z-index: 95;
  overflow: auto;
  padding: 14px;
  border: 1px solid rgba(103, 232, 249, .22);
  border-radius: 20px;
  background: rgba(3, 10, 18, .78);
  backdrop-filter: blur(18px);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .45);
}
.escrow-modal-card {
  border: 1px solid rgba(103, 232, 249, .18);
  border-radius: 18px;
  background: rgba(8, 20, 34, .94);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .34);
  padding: 18px;
}
.escrow-type-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.escrow-empty-state {
  grid-column: 1 / -1;
}
.escrow-availability-card {
  position: sticky;
  top: 96px;
}
.chat-widget-panel { position: fixed; right: 24px; bottom: 150px; z-index: 46; width:min(380px, calc(100vw - 32px)); border:1px solid var(--line); border-radius:24px; background: rgba(12,20,32,.96); box-shadow: 0 24px 80px rgba(0,0,0,.42); padding:16px; display:grid; gap:12px; }
.chat-widget-panel[hidden] { display:none; }
.chat-widget-header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.chat-widget-body { display:grid; gap:12px; }
.chat-unread-dot { width:10px; height:10px; border-radius:999px; background:#ef4444; display:inline-block; margin-right:8px; }
.staging-chip { border-color: rgba(250,204,21,.45) !important; color:#fde68a !important; }
.soft-launch-card { border-style:dashed; }
.presence-dot { width: 14px; height: 14px; border-radius:999px; margin-top: 4px; }
.presence-dot.online { background: #34d399; box-shadow: 0 0 0 6px rgba(52,211,153,0.16); }
.presence-dot.offline { background: #94a3b8; box-shadow: 0 0 0 6px rgba(148,163,184,0.12); }
.overview-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.metric-card small { color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.metric-card strong { font-size: 2rem; line-height:1; }
.metric-card span { color: var(--muted); line-height:1.55; }
.overview-panels { display:grid; gap:14px; grid-template-columns: .8fr 1.2fr; }
.timeline-list { display:grid; gap:12px; }
.timeline-item { padding: 12px 14px; border-radius: 16px; border:1px solid var(--line); background: rgba(255,255,255,0.03); }
.timeline-item strong { display:block; margin-bottom:4px; }
.timeline-item span { color: var(--muted); }
.schema-field-list { display:flex; flex-wrap:wrap; gap:8px; }
.schema-field-pill { border:1px solid var(--line); border-radius:999px; padding:8px 11px; color:var(--text); background:rgba(255,255,255,0.04); font-size:.84rem; }
.schema-field-pill small { color:var(--muted); margin-left:6px; }
.inbox-shell { display:grid; grid-template-columns: 320px minmax(0,1fr); gap: 14px; }
.thread-list { display:grid; gap:10px; }
.thread-item {
  display:grid; gap:6px; text-align:left; padding:14px 16px; border-radius:18px; border:1px solid var(--line); background: rgba(255,255,255,0.03); color: var(--text); cursor:pointer;
}
.thread-item span { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thread-item.is-active { border-color: rgba(40,201,137,0.35); background: rgba(40,201,137,0.08); }
.thread-view { min-height: 560px; display:grid; grid-template-rows: auto 1fr auto; gap: 14px; }
.thread-header { font-weight:800; font-size: 1.05rem; }
.thread-messages { overflow:auto; max-height: 440px; display:grid; gap:12px; padding-right: 4px; }
.thread-message { max-width: 78%; padding: 14px 16px; border-radius: 18px; border:1px solid var(--line); background: rgba(255,255,255,0.04); }
.thread-message.mine { margin-left:auto; background: rgba(40,201,137,0.12); }
.thread-message strong { display:block; margin-bottom: 6px; }
.thread-message p { margin: 0; line-height: 1.6; }
.thread-compose { display:grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
.thread-compose[hidden], .inline-actions[hidden], .empty-state[hidden] { display: none; }
.thread-compose { grid-template-columns: auto minmax(0,1fr) auto; }
.empty-state {
  border: 1px dashed var(--line);
  border-radius: 18px;
  padding: 18px;
  color: var(--muted);
  background: rgba(255,255,255,0.03);
}
.unread-card { border-color: rgba(40,201,137,0.35); }
.policy-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.policy-card strong { font-size: 1.05rem; }
.policy-card span { color: var(--muted); line-height: 1.7; }
.profile-avatar {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(40,201,137,0.12);
  border: 1px solid rgba(40,201,137,0.28);
  color: var(--text);
  font-weight: 900;
}
.footer-top { display:grid; gap:16px; grid-template-columns: 1fr minmax(0, 1.2fr); border-top: 1px solid var(--line); padding-top: 24px; }
.footer-links { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.site-footer { padding: 34px clamp(16px, 4vw, 42px) 24px; }
.footer-meta { color: var(--muted); margin-top: 20px; }
@media (max-width: 1160px) {
  .hero, .portal-shell, .overview-grid, .overview-panels, .inbox-shell, .footer-top { grid-template-columns: 1fr; }
  .profile-dashboard { grid-template-columns: 1fr; }
  .portal-sidebar { position: static; }
}
@media (max-width: 820px) {
  .site-header { flex-direction: column; align-items: flex-start; }
  .portal-form-grid { grid-template-columns: 1fr; }
  .portal-form-dynamic { grid-template-columns: 1fr; }
  .summary-grid { grid-template-columns: 1fr; }
  .hero-copy h1 { font-size: clamp(2.1rem, 10vw, 3.5rem); }
}
.trade-selector-card {
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.trade-selector-card.is-selected {
  border-color: rgba(40,201,137,0.55);
  background: rgba(40,201,137,0.12);
}

.artisan-search-form {
  gap: 12px !important;
}

.artisan-search-main {
  display: grid !important;
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1fr) auto !important;
  gap: 12px !important;
  align-items: end !important;
}

.artisan-search-main .field-group {
  margin: 0 !important;
}

.artisan-search-submit {
  min-height: 52px !important;
  white-space: nowrap !important;
}

.artisan-search-submit.is-loading::before {
  content: "" !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  border: 2px solid rgba(6,19,27,.28) !important;
  border-top-color: #06131b !important;
  animation: spin 0.75s linear infinite !important;
}

.artisan-search-refine {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.artisan-search-advanced {
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  background: rgba(255,255,255,.025) !important;
}

.artisan-search-advanced summary {
  cursor: pointer !important;
  font-weight: 800 !important;
  color: var(--text) !important;
}

.artisan-search-advanced[open] summary {
  margin-bottom: 10px !important;
}

.artisan-service-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 12px 0 2px !important;
}

.trade-chip-button {
  width: auto !important;
  text-align: center !important;
}

.search-loading-card {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 980px) {
  .artisan-search-main,
  .artisan-search-refine {
    grid-template-columns: 1fr !important;
  }
  .artisan-search-submit {
    width: 100% !important;
  }
}
.hero-summary {
  color: var(--muted);
}
.hero-home-updated {
  margin-bottom: 22px;
}
.trust-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.trust-stat-card {
  text-align: center;
}
.trust-stat-card strong {
  display: block;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 1;
}
.trust-stat-card span {
  display: block;
  color: var(--muted);
  margin-top: 10px;
}
.how-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.how-card h2 {
  margin: 0;
  font-size: 1.1rem;
}
.how-card p {
  color: var(--muted);
  line-height: 1.7;
  margin: 0;
}
.how-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(40,201,137,0.12);
  color: #b8f4db;
  text-transform: uppercase;
  font-size: 0.78rem;
  letter-spacing: .08em;
  font-weight: 800;
}
.category-grid-home {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
  align-items: stretch;
}
.category-card-home {
  min-height: 0;
  align-content: start;
  grid-template-rows: auto auto auto 1fr auto;
}
.category-card-icon {
  width: 56px;
  height: 56px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(40,201,137,0.12);
  color: #b8f4db;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.category-card-home h3 {
  line-height: 1.16;
}
.category-card-home .result-meta {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.category-card-home p {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
  margin: 0;
}
.category-card-home .btn {
  width: 100%;
  margin-top: 4px;
}
.testimonials-home {
  margin-top: 22px;
}
.testimonial-card {
  gap: 12px;
}
.testimonial-card p {
  margin: 0;
  color: var(--text);
  line-height: 1.8;
}
.testimonial-rating {
  color: #fbbf24;
  font-size: 1rem;
  letter-spacing: 0.16em;
}
@media (max-width: 1160px) {
  .trust-strip,
  .how-grid {
    grid-template-columns: 1fr;
  }
}

.brand-wordmarks {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wordmark {
  height: 22px;
  width: auto;
}
.wordmark-dark { display: none; }
[data-theme="light"] .wordmark-light { display: none; }
[data-theme="light"] .wordmark-dark { display: block; }
[data-theme="dark"] .wordmark-dark { display: none; }
.hero-panel {
  display: grid;
  gap: 16px;
}
.hero-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}
.hero-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.mini-card {
  padding: 16px;
  border-radius: 18px;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--line);
}
.mini-card h3 {
  margin: 0 0 8px;
  font-size: 1rem;
}
.mini-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
.hero-actions,
.hero-pills,
.contact-grid,
.content-stack,
.cta-grid,
.help-grid,
.feature-band {
  display: grid;
  gap: 14px;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}
.hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.hero-pills span {
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.88rem;
}
.feature-band {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 22px 0;
}
.feature-column h2,
.content-card h2,
.help-card h2 {
  margin: 0 0 10px;
}
.feature-column ul,
.content-card ul {
  padding-left: 18px;
  margin: 0;
  display: grid;
  gap: 10px;
  color: var(--muted);
  line-height: 1.7;
}
.content-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}
.content-stack {
  margin-top: 18px;
}
.cta-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 22px 0;
}
.cta-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
  border: 1px solid var(--line);
  color: var(--text);
  box-shadow: var(--shadow);
}
.cta-card span {
  color: var(--muted);
  line-height: 1.7;
}
.search-input,
.help-card .search-input,
.portal-form textarea {
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--text);
}
.portal-form textarea {
  min-height: 140px;
  resize: vertical;
}
.help-grid,
.contact-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.help-item {
  padding: 14px 0;
  border-top: 1px solid var(--line);
}
.help-item:first-of-type {
  border-top: 0;
  padding-top: 0;
}
.help-item h3 {
  margin: 0 0 8px;
  font-size: 1rem;
}
.help-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}
.contact-grid {
  margin-top: 18px;
}
.portal-badges {
  margin-top: 18px;
}
.policy-grid,
.results-grid,
.wallet-summary {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
main {
  padding: 0 clamp(16px, 4vw, 42px) 42px;
}
@media (max-width: 1160px) {
  .feature-band,
  .hero-card-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 820px) {
  .hero-actions,
  .hero-pills {
    flex-direction: column;
    align-items: stretch;
  }
  .brand-wordmarks {
    width: 100%;
  }
  .wordmark {
    max-width: 150px;
  }
}


.site-header-v8 { gap: 20px; }
.site-nav-primary { justify-content: flex-end; }
.site-auth-badge { padding: 8px 12px; border-radius: 999px; background: rgba(40,201,137,0.12); border: 1px solid rgba(40,201,137,0.25); color: var(--text); font-size: .85rem; font-weight: 700; }
.left-drawer-toggle { position: fixed; left: 14px; top: 18px; z-index: 80; width: 48px; height: 48px; border-radius: 18px; border: 1px solid var(--line); background: rgba(6,13,23,0.72); color: var(--text); backdrop-filter: blur(14px); cursor: pointer; font-size: 1.7rem; line-height: 1; }
.left-drawer { position: fixed; inset: 0 auto 0 0; width: min(320px, 86vw); transform: translateX(-104%); transition: transform .24s ease; z-index: 90; padding: 18px; }
.left-drawer.is-open { transform: translateX(0); }
.left-drawer-card { height: 100%; border-radius: 28px; border: 1px solid var(--line); background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03)); box-shadow: var(--shadow); padding: 20px; display: grid; grid-template-rows: auto 1fr; gap: 18px; }
.left-drawer-head { display:flex; align-items:center; justify-content:space-between; gap: 12px; }
.left-drawer-head strong { display:block; font-size: 1.1rem; }
.left-drawer-head span { color: var(--muted); font-size: .92rem; }
.drawer-close { width: 40px; height: 40px; border-radius: 14px; border:1px solid var(--line); background: transparent; color: var(--text); cursor:pointer; font-size: 1.6rem; line-height: 1; }
.left-drawer-nav { display:grid; gap: 10px; align-content:start; overflow:auto; }
.left-drawer-nav a { padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: rgba(255,255,255,0.03); color: var(--text); }
.drawer-scrim { position: fixed; inset: 0; background: rgba(2,6,23,.52); opacity: 0; pointer-events: none; transition: opacity .24s ease; z-index: 85; }
.drawer-scrim.is-open { opacity: 1; pointer-events: auto; }
.quick-nav-strip { display:grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 14px; margin: 0 0 22px; }
.quick-nav-card { display:flex; align-items:center; justify-content:center; min-height: 64px; border-radius: 22px; border:1px solid var(--line); background: rgba(255,255,255,0.04); font-weight: 800; }
.subscription-card-home ul { margin: 8px 0 0; padding-left: 18px; color: var(--muted); line-height: 1.6; }
.subscription-card-home li { margin: 2px 0; }
.hero-card-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-top: 16px; }
.mini-card { border:1px solid var(--line); border-radius: 20px; padding: 14px; background: rgba(255,255,255,0.04); }
.mini-card h3 { margin:0 0 6px; font-size: 1rem; }
.mini-card p { margin:0; color: var(--muted); line-height: 1.5; }
@media (max-width: 960px) { .quick-nav-strip { grid-template-columns: repeat(2, minmax(0,1fr)); } .site-nav-primary { gap: 8px; } }
@media (max-width: 720px) { .site-nav-primary { display:none; } .left-drawer-toggle { display:block; } }
@media (min-width: 721px) { .left-drawer-toggle { display:none; } }

.site-auth-badge { padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(40,201,137,0.25); background: rgba(40,201,137,0.12); color: var(--text); font-weight: 700; }
.left-drawer-toggle { position: fixed; left: 18px; top: 18px; z-index: 60; width: 48px; height: 48px; border-radius: 16px; border:1px solid var(--line); background: rgba(6, 13, 23, 0.88); color: var(--text); backdrop-filter: blur(16px); }
.portal-split-actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
#feed-compose-card, #market-create-card { margin-top: 16px; }
textarea { min-height: 140px; border-radius: 16px; border:1px solid var(--line); background: var(--surface-2); color: var(--text); padding: 14px 16px; }
input[readonly] { color: var(--muted); }
.hero-copy h1 { max-width: 14ch; }
@media (max-width: 820px) { .left-drawer-toggle { top: 12px; left: 12px; } }

.admin-shell {
  display: grid;
  gap: 18px;
}
.admin-ops-intro {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(40,201,137,0.08);
  margin-bottom: 14px;
}
.admin-ops-intro span { color: var(--muted); line-height: 1.5; }
.admin-env-banner {
  display:none;
  gap:6px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 14px;
}
.admin-env-banner:not(:empty) { display:grid; }
.admin-env-banner span { color: var(--muted); }
.admin-env-banner.is-staging { border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.08); }
.admin-env-banner.is-production { border-color: rgba(248,113,113,.45); background: rgba(248,113,113,.08); }
.admin-ops-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.admin-ops-nav-group {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,0.03);
}
.admin-ops-nav-group div { display:flex; flex-wrap:wrap; gap:6px; }
.admin-ops-nav-group span {
  font-size: .82rem;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(255,255,255,0.03);
}
.admin-topbar {
  position: sticky;
  top: 88px;
  z-index: 6;
}
.admin-chip-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.admin-chip {
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.04);
  color: var(--muted);
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 700;
}
.admin-chip.is-active,
.admin-chip:hover {
  color: var(--text);
  border-color: rgba(40,201,137,0.35);
  background: rgba(40,201,137,0.10);
}
.admin-tab-panel { display: none; }
.admin-tab-panel.is-active { display: grid; gap: 16px; }
.admin-panel-header h3 { margin: 0 0 6px; }
.admin-panel-header p { margin: 0; color: var(--muted); line-height: 1.7; }
.admin-module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}
.admin-module-card { gap: 10px; }
.admin-card-list {
  display: grid;
  gap: 4px;
  color: var(--muted);
  line-height: 1.55;
}
.admin-card-list strong { color: var(--text); }
.admin-alert-critical { border-color: rgba(248,113,113,.45); background: rgba(248,113,113,.08); }
.admin-alert-warning { border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.08); }
.admin-alert-watch { border-color: rgba(96,165,250,.45); background: rgba(96,165,250,.08); }
.admin-alert-clear { opacity: .78; }
.admin-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.admin-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.admin-mini-button {
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--text);
  border-radius: 12px;
  padding: 8px 12px;
  cursor: pointer;
  font-weight: 700;
}
.admin-mini-button:hover { border-color: rgba(40,201,137,0.35); }
.admin-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px 12px;
}
.admin-kv div {
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.03);
}
.admin-kv small {
  display: block;
  color: var(--muted);
  margin-bottom: 4px;
}
.admin-inline-note {
  color: var(--muted);
  font-size: .92rem;
}
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.05);
  font-size: .84rem;
  font-weight: 700;
}
.status-pill.ok,
.status-pill.active,
.status-pill.completed,
.status-pill.online,
.status-pill.verified,
.status-pill.succeeded { border-color: rgba(34,197,94,.35); }
.status-pill.warning,
.status-pill.pending,
.status-pill.processing,
.status-pill.review,
.status-pill.in_progress { border-color: rgba(250,204,21,.35); }
.status-pill.critical,
.status-pill.suspended,
.status-pill.cancelled,
.status-pill.disputed,
.status-pill.rejected,
.status-pill.failed { border-color: rgba(248,113,113,.35); }
@media (max-width: 1160px) {
  .admin-split-grid { grid-template-columns: 1fr; }
  .admin-topbar { position: static; }
}
@media (max-width: 820px) {
  .admin-kv { grid-template-columns: 1fr; }
}

.approval-workspace { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px; margin-bottom:14px; }
.approval-column h4 { margin:0 0 12px; }
.approval-list { display:grid; gap:10px; max-height: 480px; overflow:auto; }
.approval-ticket { text-align:left; padding:14px 16px; border-radius:18px; border:1px solid var(--line); background: rgba(255,255,255,0.03); display:grid; gap:6px; cursor:pointer; }
.approval-ticket:hover, .approval-ticket.is-active { border-color: rgba(40,201,137,0.35); background: rgba(40,201,137,0.08); }
.approval-ticket small { color: var(--muted); }
.approval-detail-shell { display:grid; gap:12px; }
.approval-detail-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:14px; }
.approval-detail-stack { display:grid; gap:12px; }
.approval-hero { display:grid; gap:8px; padding:16px; border-radius:20px; border:1px solid var(--line); background: rgba(255,255,255,0.04); }
.approval-evidence-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap:10px; }
.approval-evidence-card { border:1px solid var(--line); border-radius:18px; padding:10px; background: rgba(255,255,255,0.03); display:grid; gap:8px; }
.approval-evidence-card img, .approval-evidence-card video { width:100%; height:110px; object-fit:cover; border-radius:14px; }
.approval-action-card { display:grid; gap:10px; padding:16px; border-radius:20px; border:1px solid var(--line); background: rgba(255,255,255,0.04); }
.approval-action-card textarea, .approval-action-card input, .approval-action-card select { width:100%; border-radius:16px; border:1px solid var(--line); background: var(--surface-2); color: var(--text); padding: 12px 14px; }
.approval-button-row { display:flex; flex-wrap:wrap; gap:10px; }
.signing-tier-card { border:1px solid rgba(40,201,137,0.26); background: rgba(40,201,137,0.08); border-radius:20px; padding:16px; display:grid; gap:8px; }
.kv-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; }
.kv-grid > div { padding:12px; border-radius:16px; border:1px solid var(--line); background: rgba(255,255,255,0.03); }
.kv-grid small { display:block; color: var(--muted); margin-bottom:4px; }
@media (max-width: 1160px) { .approval-workspace, .approval-detail-grid { grid-template-columns: 1fr; } }

/* Launch refresh */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  padding-bottom: env(safe-area-inset-bottom);
}

button, input, select, textarea {
  font: inherit;
}

img, video, canvas, svg {
  max-width: 100%;
}

.site-frame {
  width: min(100%, 1440px);
  margin: 0 auto;
}

.site-main {
  padding: 24px clamp(16px, 3vw, 40px) 48px;
}

.site-header {
  z-index: 80;
  padding: 12px clamp(16px, 3vw, 40px);
  background: rgba(7, 17, 31, 0.94);
  backdrop-filter: blur(10px);
}

.site-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 14px;
}

.wordmark {
  height: 22px;
  width: auto;
}

.wordmark-dark {
  display: none;
}

[data-theme="light"] .wordmark-light {
  display: none;
}

[data-theme="light"] .wordmark-dark {
  display: block;
}

.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  color: var(--text);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}

.menu-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.site-auth-actions,
.portal-header-auth {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.site-nav a,
.site-drawer-nav a,
.portal-sidebar-nav a,
.mobile-bottom-nav a,
.drawer-text-button {
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid transparent;
  color: var(--muted);
  background: transparent;
}

.site-nav a:hover,
.site-drawer-nav a:hover,
.portal-sidebar-nav a:hover,
.mobile-bottom-nav a:hover,
.portal-sidebar-nav a.is-active,
.site-drawer-nav a.is-active,
.mobile-bottom-nav a.is-active,
.drawer-text-button:hover {
  color: var(--text);
  border-color: var(--line);
  background: rgba(255,255,255,0.05);
}

.header-cta {
  padding: 10px 16px;
}

.auth-chip,
.auth-role-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.04);
  color: var(--text);
  font-size: 0.9rem;
}

.auth-role-chip {
  text-transform: capitalize;
  color: var(--muted);
}

.site-drawer {
  position: fixed;
  inset: 0 auto 0 0;
  width: min(88vw, 360px);
  z-index: 9999;
  transform: translateX(-104%);
  transition: transform 180ms ease;
  max-height: 100dvh;
  overflow: hidden;
}

.site-drawer.is-open {
  transform: translateX(0);
}

.site-drawer-card {
  height: 100%;
  max-height: 100dvh;
  background: #07111f;
  border-right: 1px solid var(--line);
  padding: 18px 18px 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow: hidden;
}

.site-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.site-drawer-nav,
.portal-sidebar-nav {
  display: grid;
  gap: 8px;
}

.site-drawer-nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 2px calc(28px + env(safe-area-inset-bottom));
  scrollbar-width: thin;
}

.drawer-close,
.drawer-text-button {
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  border-radius: 14px;
  cursor: pointer;
}

.drawer-close {
  width: 42px;
  height: 42px;
  font-size: 1.4rem;
  line-height: 1;
}

.drawer-text-button {
  text-align: left;
}

.drawer-scrim {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: rgba(2, 6, 23, 0.72);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.drawer-scrim.is-open {
  opacity: 1;
  pointer-events: auto;
}

body.drawer-open {
  overflow: hidden;
  touch-action: none;
}

.portal-main-shell {
  padding-bottom: 112px;
}

.portal-sidebar {
  top: 84px;
  padding: 14px;
}

.hero {
  padding: 28px 0 20px;
}

.hero-copy h1 {
  font-size: clamp(2.6rem, 7vw, 5rem);
}

.hero-copy p,
.section-heading p,
.result-meta,
.policy-card span,
.how-card p {
  font-size: clamp(1rem, 2vw, 1.08rem);
}

.landing-search-card,
.section-stack,
.plan-teaser-card,
.testimonials-home {
  margin-top: 24px;
}

.section-stack {
  display: grid;
  gap: 18px;
}

.section-heading {
  display: grid;
  gap: 10px;
}

.section-heading h2 {
  margin: 0;
  font-size: clamp(1.85rem, 4vw, 2.8rem);
}

.section-heading p {
  margin: 0;
}

.panel-header-stack {
  flex-direction: column;
  align-items: flex-start;
}

.landing-search-form {
  display: grid;
  gap: 14px;
}

.landing-search-form input {
  width: 100%;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--text);
  padding: 18px 20px;
}

.landing-search-actions,
.hero-actions,
.section-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.field-group {
  display: grid;
  gap: 8px;
}

.field-group label {
  font-size: 0.94rem;
}

.field-error {
  min-height: 18px;
  font-size: 0.88rem;
  color: var(--danger);
}

.portal-form input,
.portal-form select,
.portal-form textarea,
.thread-compose input,
.thread-compose select {
  width: 100%;
}

.btn-tertiary {
  background: transparent;
  color: var(--text);
}

.btn-quiet {
  padding: 10px 14px;
  font-weight: 700;
}

.inline-actions-subtle {
  margin-top: 4px;
}

.result-card,
.job-card,
.wallet-card,
.passkey-card,
.metric-card,
.policy-card,
.glass-card,
.glass-subcard {
  border-radius: 16px;
}

.glass-card {
  padding: 20px;
}

.result-card,
.job-card,
.wallet-card,
.passkey-card,
.metric-card,
.policy-card {
  padding: 20px;
}

/* Responsive hardening for dense portal panels. */
.portal-main,
.portal-panel,
.glass-card,
.glass-subcard,
.result-card,
.job-card,
.wallet-card,
.metric-card,
.policy-card,
.thread-list,
.thread-view,
.thread-item {
  min-width: 0;
}

.portal-panel {
  overflow: hidden;
}

.result-card,
.job-card,
.wallet-card,
.metric-card,
.policy-card,
.thread-item,
.thread-message,
.admin-chip,
.btn {
  overflow-wrap: anywhere;
}

.btn,
.admin-chip,
.thread-item,
.portal-sidebar a,
.left-drawer a,
.workspace-menu a {
  min-height: 44px;
}

.btn svg,
.btn img,
.admin-chip svg,
.admin-chip img,
.portal-sidebar a svg,
.left-drawer a svg,
.workspace-menu a svg,
.icon-button svg,
.icon-button img,
button svg,
button img {
  width: 1.05rem;
  height: 1.05rem;
  max-width: 1.05rem;
  max-height: 1.05rem;
  flex: 0 0 auto;
  object-fit: contain;
}

.icon-button,
button.icon-button,
.btn-icon {
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.portal-panel[data-portal-panel="favorites"] .results-grid,
#favorite-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}

.inbox-shell {
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  align-items: stretch;
}

.thread-list,
.thread-view {
  width: 100%;
}

.thread-item {
  width: 100%;
}

.thread-item strong,
.thread-item span,
.thread-header,
.thread-message p,
.result-meta {
  min-width: 0;
  overflow-wrap: anywhere;
}

.thread-compose {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}

@media (max-width: 1280px) {
  .portal-shell {
    grid-template-columns: 240px minmax(0, 1fr);
  }

  .inbox-shell {
    grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
  }
}

@media (max-width: 1080px) {
  .portal-shell,
  .inbox-shell,
  .footer-top {
    grid-template-columns: 1fr;
  }

  .portal-sidebar {
    position: static;
  }

  .thread-view {
    min-height: 0;
  }
}

@media (max-width: 640px) {
  main {
    padding-inline: 12px;
  }

  .glass-card,
  .glass-subcard,
  .result-card,
  .job-card,
  .wallet-card,
  .passkey-card,
  .metric-card,
  .policy-card {
    border-radius: 18px;
    padding: 14px;
  }

  .panel-header,
  .result-head,
  .wallet-warning-card {
    flex-direction: column;
    align-items: stretch;
  }

  .inline-actions,
  .admin-chip-row {
    gap: 8px;
  }

  .btn,
  .admin-chip {
    width: 100%;
    justify-content: center;
  }

  .thread-message {
    max-width: 100%;
  }

  .thread-compose {
    grid-template-columns: 1fr;
  }

  .thread-compose .btn {
    width: 100%;
  }
}

.how-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(40,201,137,0.12);
  color: #b8f4db;
  font-weight: 800;
}

.compact-placeholder p {
  margin: 0;
  color: var(--muted);
}

.compact-policy-grid {
  margin-top: 14px;
}

.app-download-section {
  scroll-margin-top: 96px;
}

.app-download-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.app-download-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 20px;
  align-items: center;
  overflow: hidden;
}

.app-download-copy {
  min-width: 0;
  display: grid;
  gap: 12px;
}

.app-download-card h3 {
  margin: 0;
  font-size: clamp(1.45rem, 3vw, 2rem);
}

.app-download-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.app-platform-pill {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 7px 11px;
  border-radius: 999px;
  border: 1px solid rgba(40, 201, 137, 0.24);
  background: rgba(40, 201, 137, 0.11);
  color: #b8f4db;
  font-size: 0.82rem;
  font-weight: 800;
}

.app-role-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.7;
}

.app-role-list li + li {
  margin-top: 2px;
}

.app-download-actions {
  margin-top: 2px;
}

.app-qr-panel {
  width: 100%;
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #fff;
  color: #0b1220;
  text-align: center;
  font-weight: 800;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}

.app-qr-panel:hover {
  transform: translateY(-1px);
}

.app-qr-panel img {
  width: min(180px, 100%);
  aspect-ratio: 1;
  object-fit: contain;
  border-radius: 8px;
}

.app-qr-panel span {
  overflow-wrap: anywhere;
}

.footer-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr));
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.footer-column {
  display: grid;
  gap: 10px;
  align-content: start;
}

.footer-column h3,
.footer-brand h2 {
  margin: 0;
}

.footer-brand p,
.footer-column a {
  color: var(--muted);
}

.public-footer {
  padding-bottom: 36px;
}

.portal-footer {
  padding-top: 0;
}

.portal-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  color: var(--muted);
}

.mobile-bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 70;
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  background: rgba(7, 17, 31, 0.98);
  border-top: 1px solid var(--line);
}

.mobile-bottom-nav a {
  text-align: center;
  font-size: 0.82rem;
}

@media (max-width: 1160px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .app-download-grid {
    grid-template-columns: 1fr;
  }

  .app-download-card {
    grid-template-columns: minmax(0, 1fr) 210px;
  }
}

@media (max-width: 820px) {
  .site-main {
    padding-top: 20px;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .public-header .site-nav,
  .public-header .site-auth-actions {
    display: none;
  }

  .hero {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-top: 18px;
  }

  .hero-copy h1 {
    font-size: clamp(2rem, 9vw, 2.65rem);
  }

  .section-heading h2 {
    font-size: clamp(1.75rem, 8vw, 2.15rem);
  }

  .portal-sidebar {
    display: none;
  }

  .mobile-bottom-nav {
    display: grid;
  }
}

@media (max-width: 700px) {
  .app-download-card {
    grid-template-columns: 1fr;
  }

  .app-qr-panel {
    max-width: 260px;
    justify-self: start;
  }
}

@media (max-width: 540px) {
  .site-header {
    padding: 10px 16px;
  }

  .brand-mark {
    width: 40px;
    height: 40px;
  }

  .wordmark {
    height: 18px;
  }

  .landing-search-actions,
  .hero-actions,
  .section-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .thread-compose {
    grid-template-columns: 1fr;
  }

  .app-download-card {
    padding: 18px;
  }

  .app-qr-panel {
    max-width: none;
  }

  .app-qr-panel img {
    width: 180px;
  }
}

.landing-chip-group,
.chip-row,
.public-profile-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.landing-chip-group {
  margin-top: 18px;
}

.landing-location-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.location-pill-card {
  padding: 18px 20px;
  border-radius: 24px;
  background: rgba(8, 18, 33, 0.86);
  border: 1px solid rgba(151, 168, 190, 0.12);
  display: grid;
  gap: 12px;
}

.chip-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid rgba(151, 168, 190, 0.16);
  background: rgba(14, 28, 49, 0.92);
  color: var(--text);
  text-decoration: none;
  font: inherit;
  cursor: pointer;
}

.chip-link:hover,
.chip-link:focus-visible {
  border-color: rgba(38, 194, 129, 0.5);
  color: var(--text);
}

.landing-search-form .field-group > span {
  display: block;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 0.95rem;
}

.category-hero,
.category-filter-card {
  margin-bottom: 24px;
}

.category-summary-card .hero-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.category-filter-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.category-artisan-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.public-artisan-card {
  gap: 14px;
}

.public-profile-meta {
  color: var(--muted);
  font-size: 0.96rem;
}

.onboarding-choice-grid {
  margin-bottom: 18px;
}

.onboarding-detail-card {
  min-height: 220px;
}

@media (max-width: 820px) {
  .category-summary-card .hero-card-grid,
  .category-filter-form {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   EgaFind production UI cleanup patch
   Fixes: bad logo lockup, auth header/sidebar leaks, raw nav text,
   badly formatted login/register forms, and portal footer spacing.
   ========================================================= */

.brand-lockup {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: auto !important;
  max-width: max-content !important;
}

.brand-mark {
  width: 48px !important;
  height: 48px !important;
  object-fit: contain !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.95) !important;
  padding: 6px !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;
}

.brand-text {
  display: inline-flex !important;
  align-items: center !important;
  color: var(--text) !important;
  font-weight: 900 !important;
  font-size: 1.15rem !important;
  letter-spacing: -0.03em !important;
  line-height: 1 !important;
}

.wordmark,
.brand-wordmarks {
  display: none !important;
}

.site-header {
  min-height: 84px !important;
}

.site-header-row {
  width: 100% !important;
}

.portal-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

/* Login/register/forgot/reset should not show the portal side menu or bottom nav */
.portal-auth-page .portal-sidebar,
.portal-auth-page .mobile-bottom-nav {
  display: none !important;
}

.portal-auth-page .portal-shell {
  display: block !important;
  width: min(1180px, calc(100vw - 40px)) !important;
  margin: 40px auto 80px !important;
}

.portal-auth-page .portal-main {
  display: block !important;
  width: 100% !important;
}

.portal-auth-page .portal-panel {
  display: none !important;
  width: 100% !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: clamp(24px, 4vw, 42px) !important;
  border-radius: 30px !important;
}

.portal-auth-page .portal-panel.is-active {
  display: block !important;
}

.portal-auth-page .portal-shell[data-portal-mode="login"] .portal-panel[data-portal-panel="login"],
.portal-auth-page .portal-shell[data-portal-mode="forgot"] .portal-panel[data-portal-panel="forgot"],
.portal-auth-page .portal-shell[data-portal-mode="reset"] .portal-panel[data-portal-panel="reset"],
.portal-auth-page .portal-shell[data-portal-mode="register"] .portal-panel[data-portal-panel="register"] {
  display: block !important;
}

.portal-auth-page .panel-header {
  margin-bottom: 28px !important;
}

.portal-auth-page .panel-header h2 {
  font-size: clamp(2rem, 4vw, 3.25rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.045em !important;
  margin: 0 0 12px !important;
}

.portal-auth-page .panel-header p {
  max-width: 68ch !important;
  color: var(--muted) !important;
  font-size: 1.03rem !important;
  line-height: 1.65 !important;
}

.portal-auth-page .portal-form {
  display: grid !important;
  gap: 18px !important;
}

.portal-auth-page .portal-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: end !important;
}

.portal-auth-page .portal-form .field-group {
  display: grid !important;
  gap: 9px !important;
  min-width: 0 !important;
}

.portal-auth-page .portal-form label {
  color: var(--text) !important;
  font-weight: 800 !important;
  font-size: .95rem !important;
}

.portal-auth-page .portal-form input,
.portal-auth-page .portal-form select,
.portal-auth-page .portal-form textarea {
  width: 100% !important;
  min-height: 58px !important;
  border-radius: 18px !important;
  padding: 16px 18px !important;
  background: #edf5ff !important;
  color: #07111f !important;
  border: 1px solid rgba(135,153,178,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7) !important;
}

.portal-auth-page .portal-form textarea {
  min-height: 132px !important;
  resize: vertical !important;
}

.portal-auth-page .portal-form input::placeholder,
.portal-auth-page .portal-form textarea::placeholder {
  color: #6b7a90 !important;
}

.portal-auth-page .portal-form input:focus,
.portal-auth-page .portal-form select:focus,
.portal-auth-page .portal-form textarea:focus {
  outline: none !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 4px rgba(40,201,137,.18) !important;
}

.portal-auth-page .portal-form button[type="submit"] {
  grid-column: 1 / -1 !important;
  min-height: 60px !important;
  border-radius: 18px !important;
  font-size: 1.05rem !important;
}

.portal-auth-page .inline-actions,
.portal-auth-page .auth-helper-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 14px !important;
}

.portal-auth-page .policy-grid {
  margin-top: 26px !important;
}

.portal-auth-page .policy-card {
  min-height: 150px !important;
}

.portal-auth-page .status-text {
  margin-top: 14px !important;
  font-weight: 700 !important;
}

/* Stop raw-looking concatenated nav text from showing on auth pages */
.portal-auth-page .portal-sidebar-nav,
.portal-auth-page #portal-mobile-nav,
.portal-auth-page .mobile-bottom-nav {
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Footer should not look like broken inline text */
.portal-footer {
  border-top: 1px solid var(--line) !important;
  margin-top: 24px !important;
}

.portal-footer-links {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 18px !important;
  padding: 18px 0 !important;
}

.portal-footer-links a {
  color: var(--muted) !important;
  font-weight: 700 !important;
}

.portal-footer-links a:hover {
  color: var(--text) !important;
}

/* Public search forms should not fall back to raw browser layout */
.landing-search-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: end !important;
}

.landing-search-form .field-group {
  display: grid !important;
  gap: 8px !important;
}

.landing-search-form input,
.landing-search-form select,
.landing-search-form textarea {
  min-height: 56px !important;
  border-radius: 18px !important;
  padding: 15px 18px !important;
}

.landing-search-actions {
  grid-column: 1 / -1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

/* Prevent giant clipped hero from becoming unreadable on desktop */
.public-hero .hero-copy h1 {
  max-width: 11ch !important;
}

@media (max-width: 900px) {
  .portal-auth-page .portal-shell {
    width: min(100% - 24px, 760px) !important;
    margin-top: 24px !important;
  }

  .portal-auth-page .portal-form-grid,
  .landing-search-form {
    grid-template-columns: 1fr !important;
  }

  .portal-auth-page .portal-form button[type="submit"],
  .landing-search-actions {
    grid-column: auto !important;
  }

  .portal-auth-page .site-header,
  .portal-header {
    min-height: 72px !important;
  }

  .portal-auth-page .brand-text {
    font-size: 1rem !important;
  }
}


/* =========================================================
   Auth page final cleanup:
   - hide MFA/recovery fields unless backend explicitly requires MFA
   - show correct auth header CTA on login/register
   - clean auth switch buttons
   ========================================================= */

.portal-auth-page #login-mfa-form,
.portal-auth-page #login-mfa-form[hidden],
.portal-auth-page #login-mfa-form:not(.is-visible) {
  display: none !important;
}

.portal-auth-page #login-mfa-form.is-visible {
  display: grid !important;
}

.portal-auth-page .auth-switch-actions {
  margin-top: 28px !important;
  align-items: center !important;
}

.portal-auth-page .auth-switch-actions .result-meta {
  margin: 0 !important;
  color: var(--muted) !important;
  font-weight: 800 !important;
}

.portal-auth-page .portal-form button[type="submit"] {
  margin-top: 10px !important;
}

.portal-auth-page .header-cta + .header-cta {
  margin-left: 10px !important;
}

@media (max-width: 700px) {
  .portal-auth-page .portal-form-grid {
    grid-template-columns: 1fr !important;
  }

  .portal-auth-page .portal-panel {
    padding: 22px !important;
  }

  .portal-auth-page .panel-header h2 {
    font-size: 2rem !important;
  }

  .portal-auth-page .policy-grid {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   Final auth cleanup: password eye buttons and no MFA fields
   ========================================================= */

.portal-auth-page #login-mfa-form {
  display: none !important;
}

.business-wizard-steps .admin-chip {
  cursor: pointer;
  min-height: 42px;
}

.business-step-panel {
  display: none;
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.business-step-panel.is-active {
  display: grid;
}

.business-review-panel .result-card {
  grid-column: 1 / -1;
}

.business-wizard-actions {
  grid-column: 1 / -1;
}

@media (max-width: 640px) {
  .business-step-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .business-wizard-actions .btn {
    width: 100%;
  }
}

.password-field {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.password-field input {
  width: 100% !important;
  padding-right: 92px !important;
}

.password-toggle {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15, 23, 42, .15) !important;
  background: rgba(255,255,255,.78) !important;
  color: #07111f !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}


/* Portal header name + mobile polish */
html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea {
  letter-spacing: 0 !important;
}

.portal-header {
  min-height: 72px !important;
}

.portal-header .site-header-row {
  display: grid !important;
  grid-template-columns: 52px minmax(160px, 1fr) minmax(48px, max-content) !important;
  align-items: center !important;
  gap: 12px !important;
  overflow: hidden !important;
}

.portal-header .menu-toggle {
  justify-self: start !important;
}

.portal-header .brand-lockup {
  justify-self: center !important;
  min-width: 0 !important;
  max-width: 100% !important;
  gap: 10px !important;
}

.portal-header .brand-mark {
  width: 44px !important;
  height: 44px !important;
  flex: 0 0 auto !important;
}

.portal-header .brand-text {
  letter-spacing: 0 !important;
  max-width: 128px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.portal-header-auth {
  justify-self: end !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.workspace-switcher summary {
  min-height: 44px !important;
  max-width: min(280px, 38vw) !important;
  padding: 4px 10px 4px 4px !important;
  border: 1px solid rgba(148, 163, 184, .24) !important;
  border-radius: 999px !important;
  background: rgba(11, 24, 42, .86) !important;
  overflow: hidden !important;
}

.auth-avatar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(36, 214, 149, .95), rgba(108, 240, 191, .9)) !important;
  color: #06131f !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
}

.workspace-switcher summary .auth-chip {
  display: block !important;
  max-width: 110px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--text) !important;
  font-weight: 900 !important;
}

.portal-header-auth .auth-role-chip:not(.staging-chip) {
  display: none !important;
}

.workspace-menu {
  width: min(320px, calc(100vw - 24px)) !important;
}

.workspace-menu-profile {
  display: grid !important;
  gap: 3px !important;
  padding: 10px 12px 12px !important;
  margin-bottom: 6px !important;
  border-bottom: 1px solid rgba(148, 163, 184, .18) !important;
}

.workspace-menu-profile strong,
.workspace-menu-profile span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.workspace-menu-profile strong {
  color: var(--text) !important;
  font-size: .98rem !important;
  font-weight: 950 !important;
}

.workspace-menu-profile span {
  color: var(--muted) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
}

.dashboard-card h1,
.panel-header h2,
.section-heading h2,
.result-card h3 {
  letter-spacing: 0 !important;
}

#overview-heading {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.08 !important;
}

@media (max-width: 820px) {
  .portal-header .site-header-row {
    grid-template-columns: 46px minmax(0, 1fr) 46px !important;
  }

  .portal-header-auth {
    width: 46px !important;
    max-width: 46px !important;
  }

  .workspace-switcher summary {
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  .workspace-switcher summary .auth-chip,
  .workspace-switcher summary .staging-chip {
    display: none !important;
  }
}

@media (max-width: 640px) {
  .portal-header {
    min-height: 64px !important;
  }

  .portal-header .site-header-row {
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    gap: 6px !important;
  }

  .portal-header .menu-toggle {
    width: 42px !important;
    height: 42px !important;
  }

  .portal-header .brand-lockup {
    justify-self: center !important;
    gap: 7px !important;
  }

  .portal-header .brand-mark {
    width: 38px !important;
    height: 38px !important;
    padding: 5px !important;
    border-radius: 13px !important;
  }

  .portal-header .brand-text {
    max-width: 88px !important;
    font-size: 1rem !important;
  }

  .portal-header-auth {
    width: 44px !important;
    max-width: 44px !important;
  }

  .workspace-switcher summary {
    width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  .workspace-switcher summary .auth-chip,
  .workspace-switcher summary .staging-chip {
    display: none !important;
  }

  .auth-avatar {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
    font-size: .72rem !important;
  }

  .workspace-menu {
    right: 0 !important;
    width: min(300px, calc(100vw - 24px)) !important;
  }
}

@media (max-width: 380px) {
  .portal-header .brand-text {
    display: none !important;
  }
}

@media (max-width: 640px) {
  body { overflow-x: hidden; }

  main,
  .site-main,
  .portal-main-shell {
    padding-left: 14px !important;
    padding-right: 14px !important;
    padding-bottom: 118px !important;
  }

  .site-header,
  .portal-header,
  .public-header {
    padding: 10px 12px !important;
  }

  .site-header-row {
    width: 100%;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) minmax(92px, auto);
    align-items: center;
    gap: 8px;
  }

  .brand-lockup { min-width: 0; gap: 8px; }
  .brand-mark { width: 42px !important; height: 42px !important; border-radius: 14px !important; flex: 0 0 auto; }
  .brand-text,
  .brand-lockup strong {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
  }

  .portal-header-auth,
  .site-auth-actions {
    min-width: 0;
    justify-self: end;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
  }

  .portal-header-auth > *,
  .site-auth-actions > *,
  .auth-chip {
    max-width: 128px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .portal-header .site-header-row {
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
  }

  .portal-header-auth,
  .portal-header-auth > * {
    width: 44px !important;
    max-width: 44px !important;
    min-width: 0 !important;
  }

  .portal-header-auth .auth-chip,
  .portal-header-auth .staging-chip {
    display: none !important;
  }

  .hero,
  .public-hero {
    grid-template-columns: 1fr !important;
    padding-top: 28px !important;
  }

  .hero-copy h1,
  .section-heading h2,
  .panel-header h2 {
    font-size: 2rem !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere;
  }

  .glass-card,
  .glass-subcard,
  .result-card,
  .job-card,
  .wallet-card,
  .passkey-card,
  .metric-card,
  .policy-card {
    border-radius: 14px !important;
    padding: 14px !important;
    min-width: 0;
  }

  .results-grid,
  .policy-grid,
  .wallet-summary,
  .overview-grid,
  .plan-benefit-columns,
  .verification-section-grid,
  .verification-video-grid,
  .portal-form-grid,
  .profile-dashboard,
  .hero-card-grid,
  .app-download-grid,
  .escrow-tab-panel.is-active,
  .escrow-type-grid {
    grid-template-columns: 1fr !important;
  }

  .result-head,
  .panel-header {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .inline-actions,
  .landing-search-actions,
  .app-download-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
  }

  .btn,
  .admin-chip,
  .role-card,
  .chip-link {
    width: 100%;
    min-height: 48px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .admin-chip-row,
  .badge-row,
  .chip-row,
  .landing-chip-group,
  .escrow-action-strip {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
  }

  .escrow-modal-card {
    padding: 14px !important;
    border-radius: 16px !important;
  }

  .portal-panel[data-portal-panel="escrow"] .escrow-tab-panel[data-escrow-panel="create"].is-active {
    inset: 74px 8px calc(72px + env(safe-area-inset-bottom)) 8px;
    padding: 10px;
    border-radius: 16px;
  }

  .escrow-availability-card {
    position: static !important;
  }

  .otp-row { grid-template-columns: 1fr !important; }
  .otp-row input,
  .portal-form input,
  .portal-form select,
  .portal-form textarea,
  .landing-search-form input,
  .landing-search-form select {
    width: 100%;
    min-width: 0;
  }

  .verification-video-grid video {
    min-height: 260px;
    max-height: 360px;
  }

  .chat-floating-button {
    right: 12px !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    max-width: 132px;
    min-height: 42px !important;
    padding: 0 12px !important;
    font-size: .88rem !important;
  }

  .chat-widget-panel {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(146px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-height: calc(100vh - 210px);
    overflow: auto;
  }

  .portal-footer {
    display: none !important;
  }

  .portal-footer-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
  }

  .mobile-bottom-nav {
    overflow-x: auto;
    gap: 8px;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
  }

  .mobile-bottom-nav a {
    min-width: 68px;
    white-space: nowrap;
    font-size: .78rem !important;
  }
}

@media (max-width: 640px) {
  .landing-search-card,
  .plan-teaser-card,
  .app-download-card {
    padding: 18px !important;
  }

  .category-card-home,
  .how-card,
  .policy-card {
    gap: 10px !important;
  }

  .category-card-home .result-meta {
    font-size: .92rem !important;
  }

  .category-card-icon {
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
  }

  .app-download-section .section-heading h2 {
    font-size: 1.75rem !important;
  }
}

/* Final responsive guardrails for portal inbox, favourites, and icon controls. */
.portal-shell,
.portal-main,
.portal-panel,
.inbox-shell,
.thread-list,
.thread-view,
.results-grid,
#favorite-list {
  max-width: 100%;
}

.portal-shell {
  min-width: 0;
}

.inbox-shell {
  display: grid;
  grid-template-columns: minmax(210px, 300px) minmax(0, 1fr);
  gap: 14px;
}

#favorite-list,
.portal-panel[data-portal-panel="favorites"] .results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.thread-item,
.thread-view,
.thread-message,
.result-card,
.job-card,
.wallet-card,
.metric-card,
.policy-card {
  min-width: 0;
  max-width: 100%;
}

.thread-item strong,
.thread-item span,
.thread-header,
.thread-message,
.thread-message p,
.result-meta,
.result-card h3 {
  overflow-wrap: anywhere;
}

.btn svg,
.btn img,
.admin-chip svg,
.admin-chip img,
.icon-button svg,
.icon-button img,
button svg,
button img {
  display: block;
  width: 1.05rem;
  height: 1.05rem;
  max-width: 1.05rem;
  max-height: 1.05rem;
  object-fit: contain;
  flex: 0 0 auto;
}

.icon-button,
button.icon-button,
.btn-icon {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 1280px) {
  .portal-shell {
    grid-template-columns: minmax(210px, 240px) minmax(0, 1fr);
  }

  .inbox-shell {
    grid-template-columns: minmax(180px, 250px) minmax(0, 1fr);
  }
}

@media (max-width: 1080px) {
  .portal-shell,
  .inbox-shell {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  #favorite-list,
  .results-grid {
    grid-template-columns: 1fr;
  }

  .thread-view {
    min-height: 0;
  }

  .thread-message {
    max-width: 100%;
  }

  .thread-compose {
    grid-template-columns: 1fr;
  }
}

/* Customer portal navigation polish */
.drawer-section-label {
  display: block !important;
  margin: 18px 0 6px !important;
  color: var(--muted) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.workspace-switcher {
  position: relative !important;
}

.workspace-switcher summary {
  align-items: center !important;
  cursor: pointer !important;
  display: flex !important;
  gap: 8px !important;
  list-style: none !important;
}

.workspace-switcher summary::-webkit-details-marker {
  display: none !important;
}

.workspace-menu {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 10px) !important;
  z-index: 40 !important;
  min-width: 220px !important;
  padding: 10px !important;
  border: 1px solid rgba(148, 163, 184, .28) !important;
  border-radius: 10px !important;
  background: rgba(7, 17, 31, .98) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.3) !important;
}

.workspace-menu a {
  display: block !important;
  padding: 10px 12px !important;
  border-radius: 8px !important;
  color: var(--text) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.workspace-menu a:hover {
  background: rgba(125, 240, 180, .12) !important;
}

.portal-form-stepper {
  grid-column: 1 / -1 !important;
}

.account-wizard {
  display: grid !important;
  gap: 16px !important;
}

.portal-panel[data-portal-panel="account"] > .glass-subcard:not(.account-wizard) {
  display: none !important;
}

.search-match-card {
  align-items: center !important;
  border: 1px solid rgba(103, 232, 249, .28) !important;
  border-radius: 16px !important;
  display: flex !important;
  gap: 14px !important;
  margin: 14px 0 !important;
  padding: 14px 16px !important;
  background: rgba(103, 232, 249, .08) !important;
  color: var(--text) !important;
}

.search-match-card[hidden] {
  display: none !important;
}

.search-match-card span {
  color: var(--muted) !important;
}

.search-pulse {
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  border: 3px solid rgba(103, 232, 249, .4) !important;
  box-shadow: 0 0 0 0 rgba(103, 232, 249, .35) !important;
  animation: searchPulse 1.2s infinite !important;
  flex: 0 0 auto !important;
}

@keyframes searchPulse {
  0% { box-shadow: 0 0 0 0 rgba(103, 232, 249, .35); }
  80% { box-shadow: 0 0 0 18px rgba(103, 232, 249, 0); }
  100% { box-shadow: 0 0 0 0 rgba(103, 232, 249, 0); }
}

.chat-floating-button {
  position: fixed !important;
  right: 24px !important;
  bottom: 88px !important;
  z-index: 45 !important;
  min-height: 48px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(40, 201, 137, .35) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--accent), #67f0bc) !important;
  color: #06131b !important;
  font-weight: 900 !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.32) !important;
  cursor: pointer !important;
}

.password-toggle:hover {
  background: #ffffff !important;
}

.portal-auth-page .auth-switch-actions {
  margin-top: 26px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.portal-auth-page .auth-switch-actions .result-meta {
  margin: 0 !important;
  color: var(--muted) !important;
  font-weight: 800 !important;
}

.portal-auth-page .status-text.error,
.portal-auth-page .status-text.is-error {
  color: #ff6b6b !important;
  font-weight: 900 !important;
}


/* Password visibility controls */
.password-field {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}
.password-field input {
  width: 100% !important;
  padding-right: 92px !important;
}
.password-toggle {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15, 23, 42, .18) !important;
  background: rgba(255,255,255,.85) !important;
  color: #07111f !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}
.password-toggle:hover {
  background: #fff !important;
}
.portal-auth-page #login-mfa-form {
  display: none !important;
}


/* Login status + password eye final polish */
.status-text.is-error,
.status-text.error {
  color: #ff6b6b !important;
  font-weight: 900 !important;
}

.password-field {
  position: relative !important;
  width: 100% !important;
}

.password-field input {
  width: 100% !important;
  padding-right: 92px !important;
}

.password-toggle {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15, 23, 42, .18) !important;
  background: rgba(255,255,255,.9) !important;
  color: #07111f !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}
