:root {
  --portal-border: #dbe4ef;
  --portal-surface: #ffffff;
  --portal-soft: #f6f9fc;
  --portal-text: #15304b;
  --portal-muted: #667b92;
}
.portal-body { background: linear-gradient(180deg, #eff5fb 0%, #f7fafd 100%); }
.portal-top-header .nav-cta.ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.18); box-shadow: none; }
.portal-shell { padding-top: calc(var(--header-h) + 30px); width: min(1280px, calc(100% - 32px)); margin: 0 auto 48px; }
.portal-hero { display:grid; grid-template-columns: 1.45fr .95fr; gap: 24px; padding: 24px 0 30px; align-items: stretch; }
.portal-hero h1 { margin-bottom: 14px; max-width: 760px; }
.portal-hero p { max-width: 760px; }
.portal-hero-badges { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.portal-hero-badges span, .status-pill { display:inline-flex; align-items:center; padding:8px 14px; border-radius:999px; background:#fff; border:1px solid var(--portal-border); color:var(--portal-text); font-size:.85rem; font-weight:600; }
.portal-grid { display:grid; grid-template-columns: 360px 1fr; gap: 24px; align-items:start; }
.portal-card { background:var(--portal-surface); border:1px solid var(--portal-border); border-radius:24px; box-shadow: var(--shadow-sm); padding:24px; }
.card-head h2 { margin-bottom: 6px; font-size: 1.5rem; }
.card-head.split { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.auth-tabs { display:flex; gap:10px; margin:20px 0 18px; flex-wrap:wrap; }
.auth-tab, .portal-btn { border:none; border-radius:14px; transition: var(--transition); font-weight:700; }
.auth-tab { padding:11px 16px; background:#eef4fa; color:var(--portal-text); }
.auth-tab.active { background:linear-gradient(135deg, var(--amber), var(--amber-soft)); color:#fff; }
.auth-form { display:none; gap:14px; flex-direction:column; }
.auth-form.active { display:flex; }
.auth-form label, .profile-grid label, .new-conversation-form label { display:flex; flex-direction:column; gap:8px; font-size:.86rem; color:var(--portal-text); font-weight:600; }
.auth-form input, .profile-grid input, .new-conversation-form input, .new-conversation-form select, .message-form textarea {
  border:1px solid var(--portal-border); border-radius:14px; background:#fff; padding:14px 16px; color:var(--portal-text); outline:none;
}
.auth-form input:focus, .profile-grid input:focus, .new-conversation-form input:focus, .new-conversation-form select:focus, .message-form textarea:focus { border-color: var(--amber); box-shadow: 0 0 0 4px rgba(204,139,43,.12); }
.portal-btn { padding:13px 18px; }
.portal-btn.primary { background:linear-gradient(135deg, var(--amber), var(--amber-soft)); color:#fff; }
.portal-btn.secondary, .portal-btn.tiny { background:#eef4fa; color:var(--portal-text); }
.portal-btn.tiny { padding:10px 14px; font-size:.82rem; }
.alert-box { display:none; margin-bottom:16px; border-radius:14px; padding:12px 14px; font-size:.85rem; }
.alert-box.show { display:block; }
.alert-box.success { background:#ecfdf3; color:#166534; border:1px solid #9ee6b6; }
.alert-box.error { background:#fff1f2; color:#be123c; border:1px solid #fda4af; }
.how-it-works-card { background:linear-gradient(180deg, #0d2340 0%, #12345d 100%); color:#fff; border-radius:28px; padding:28px; box-shadow:var(--shadow-md); }
.how-it-works-card h3 { color:#fff; margin-bottom:16px; }
.step-item { display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-top:1px solid rgba(255,255,255,.12); }
.step-item:first-of-type { border-top:none; padding-top:6px; }
.step-item span { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.12); font-weight:700; }
.step-item p { color:rgba(255,255,255,.84); margin:0; }
.profile-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px; }
.profile-actions { display:flex; align-items:end; }
.chat-layout { display:grid; grid-template-columns: 320px 1fr; gap:20px; margin-top:18px; }
.new-conversation-form { display:grid; gap:12px; padding:18px; border-radius:20px; background:var(--portal-soft); border:1px solid var(--portal-border); margin-bottom:16px; }
.conversation-sidebar, .chat-panel { min-width:0; }
.conversation-list, .message-list { border:1px solid var(--portal-border); border-radius:18px; background:#fff; min-height:220px; max-height:560px; overflow:auto; }
.conversation-item { padding:14px 16px; border-bottom:1px solid #edf3f8; cursor:pointer; }
.conversation-item:last-child { border-bottom:none; }
.conversation-item.active { background:#fef7ea; }
.conversation-item strong, .message-bubble strong { display:block; color:var(--portal-text); }
.conversation-item small, .empty-state, .empty-state.small { color:var(--portal-muted); }
.empty-state { padding:40px 20px; text-align:center; }
.chat-panel-head { padding-bottom:14px; }
.message-list { padding:18px; display:flex; flex-direction:column; gap:12px; }
.message-bubble { max-width:78%; padding:14px 16px; border-radius:18px; background:#f3f7fb; color:var(--portal-text); }
.message-bubble.mine { margin-left:auto; background:#fff2da; }
.message-bubble small { display:block; margin-top:8px; color:var(--portal-muted); }
.message-file { display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border-radius:12px; background:#fff; margin-top:10px; border:1px solid var(--portal-border); }
.message-form { margin-top:16px; }
.message-actions { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-top:12px; }
@media (max-width: 1100px) {
  .portal-grid, .portal-hero, .chat-layout { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .portal-shell { width:min(100% - 18px, 100%); }
  .profile-grid { grid-template-columns: 1fr; }
  .portal-card { padding:18px; border-radius:20px; }
  .message-actions { flex-direction:column; align-items:stretch; }
}