.portal-body{ background:#07090d; min-height:100vh; text-rendering:optimizeLegibility; }
.portal-loading{ min-height:100vh; display:grid; place-items:center; align-content:center; gap:10px; color:rgba(255,255,255,.55); }
.portal-loading span{ width:38px; height:38px; border-radius:50%; border:3px solid rgba(255,255,255,.12); border-top-color:var(--cyan); animation:portalSpin .8s linear infinite; }
.portal-loading strong{ color:#fff; font-size:15px; }
.portal-loading small{ color:rgba(255,255,255,.38); }
@keyframes portalSpin{ to{ transform:rotate(360deg); } }
.portal-shell{ position:relative; z-index:2; display:grid; grid-template-columns:250px minmax(0,1fr); min-height:100vh; }
.portal-sidebar{ position:sticky; top:0; height:100vh; padding:28px 20px; border-right:1px solid var(--panel-border); background:rgba(8,10,14,.98); }
.portal-logo{ display:block; margin:0 8px 36px; }
.portal-logo img{ height:34px; width:auto; }
.portal-nav{ display:grid; gap:6px; }
.portal-nav a{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:8px; color:rgba(255,255,255,.62); font-size:14px; font-weight:600; }
.portal-nav a:hover,.portal-nav a.active{ background:rgba(1,230,248,.09); color:#fff; }
.portal-nav .icon{ color:var(--cyan); }
.portal-sidebar-foot{ position:absolute; left:20px; right:20px; bottom:24px; }
.portal-main{ min-width:0; padding:30px clamp(22px,4vw,56px) 60px; }
.portal-topbar{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:42px; }
.portal-title{ font-size:clamp(1.8rem,4vw,2.6rem); font-weight:800; letter-spacing:0; }
.portal-subtitle{ color:rgba(255,255,255,.52); margin-top:8px; }
.portal-user{ display:flex; align-items:center; gap:12px; }
.avatar{ width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--gold),var(--cyan)); color:#07090d; display:grid; place-items:center; font-weight:800; }
.portal-grid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; }
.portal-card{ border:1px solid var(--panel-border); background:rgba(255,255,255,.045); border-radius:8px; padding:22px; min-width:0; box-shadow:0 18px 50px rgba(0,0,0,.12); }
.portal-card h2,.portal-card h3{ letter-spacing:0; }
.span-8{ grid-column:span 8; }.span-7{ grid-column:span 7; }.span-6{ grid-column:span 6; }.span-5{ grid-column:span 5; }.span-4{ grid-column:span 4; }.span-12{ grid-column:span 12; }
.metric-label{ font-size:12px; color:rgba(255,255,255,.46); margin-bottom:8px; }
.metric-value{ font-size:1.7rem; font-weight:800; font-variant-numeric:tabular-nums; }
.status{ display:inline-flex; align-items:center; gap:7px; padding:6px 9px; border-radius:999px; font-size:11px; font-weight:700; text-transform:capitalize; background:rgba(1,230,248,.1); color:#71eff8; border:1px solid rgba(1,230,248,.25); }
.status::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.progress-meter{ height:8px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.progress-meter span{ display:block; height:100%; background:linear-gradient(90deg,var(--gold),var(--cyan)); border-radius:inherit; }
.portal-table{ width:100%; border-collapse:collapse; font-size:13px; }
.portal-table th{ color:rgba(255,255,255,.4); text-align:left; font-size:11px; text-transform:uppercase; padding:12px 10px; }
.portal-table td{ border-top:1px solid rgba(255,255,255,.08); padding:15px 10px; color:rgba(255,255,255,.7); }
.portal-form{ display:grid; gap:16px; }
.portal-form label{ display:grid; gap:7px; font-size:12px; color:rgba(255,255,255,.58); }
.portal-form input,.portal-form select,.portal-form textarea{ width:100%; padding:12px 14px; border-radius:8px; }
.portal-form input,.portal-form select,.portal-form textarea{ min-height:46px; font-size:16px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-message{ display:none; padding:12px 14px; border-radius:8px; font-size:13px; }
.form-message.show{ display:block; }
.form-message.error{ color:#fecaca; background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.3); }
.form-message.success{ color:#a7f3d0; background:rgba(52,211,153,.1); border:1px solid rgba(52,211,153,.3); }
.timeline{ display:grid; gap:0; }
.timeline-step{ position:relative; padding:0 0 26px 34px; color:rgba(255,255,255,.42); }
.timeline-step::before{ content:""; position:absolute; left:7px; top:7px; bottom:-7px; width:1px; background:rgba(255,255,255,.13); }
.timeline-step::after{ content:""; position:absolute; left:2px; top:4px; width:11px; height:11px; border-radius:50%; background:#31343c; border:2px solid #07090d; box-shadow:0 0 0 1px rgba(255,255,255,.15); }
.timeline-step.done{ color:#fff; }.timeline-step.done::after{ background:var(--cyan); box-shadow:0 0 0 3px rgba(1,230,248,.14); }
.auth-shell{ position:relative; z-index:2; min-height:100vh; display:grid; grid-template-columns:minmax(300px,1fr) minmax(420px,620px); }
.auth-visual{ padding:48px clamp(30px,7vw,100px); display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(180deg,rgba(1,230,248,.04),rgba(222,161,29,.04)); }
.auth-panel{ padding:40px clamp(28px,6vw,72px); background:#0b0d12; display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--panel-border); }
.auth-card{ max-width:440px; width:100%; margin:auto; }
.auth-logo img{ height:38px; width:auto; }
.auth-note{ color:rgba(255,255,255,.48); font-size:13px; }
.help-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.help-item{ padding:18px; border:1px solid var(--panel-border); border-radius:8px; background:rgba(255,255,255,.03); }
.quick-prompts{ display:flex; flex-wrap:wrap; gap:8px; }
.quick-prompts button{ border:1px solid rgba(54,231,231,.22); background:rgba(54,231,231,.08); color:rgba(238,255,255,.72); border-radius:999px; padding:8px 10px; font-size:12px; font-weight:700; line-height:1.2; transition:.2s ease; }
.quick-prompts button:hover{ border-color:rgba(54,231,231,.48); color:#fff; background:rgba(54,231,231,.14); }
.quick-action-grid{ display:grid; grid-template-columns:1fr; gap:10px; }
.quick-action{ display:flex; align-items:center; gap:10px; min-height:46px; padding:11px 12px; border-radius:8px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); color:rgba(255,255,255,.72); font-size:13px; font-weight:800; transition:.18s ease; }
.quick-action:hover{ border-color:rgba(1,230,248,.35); color:#fff; background:rgba(1,230,248,.08); }
.quick-action .icon{ color:var(--cyan); }
.notification-list{ display:grid; gap:10px; }
.notification-row{ border:1px solid rgba(255,255,255,.09); border-radius:8px; background:rgba(255,255,255,.035); padding:12px; }
.notification-row strong,.notification-row span{ display:block; }
.notification-row strong{ color:#fff; font-size:13px; margin-bottom:4px; }
.notification-row span{ color:rgba(255,255,255,.48); font-size:12px; line-height:1.5; }
.chat-action-link{ display:inline-flex; margin-top:8px; color:#67e8f9; font-weight:800; }
.notice{ display:flex; align-items:flex-start; gap:12px; padding:14px; border:1px solid rgba(222,161,29,.28); background:rgba(222,161,29,.07); border-radius:8px; color:rgba(255,255,255,.68); font-size:13px; line-height:1.6; }
.checklist{ display:grid; gap:10px; }
.checklist li{ display:flex; gap:10px; align-items:flex-start; color:rgba(255,255,255,.58); font-size:13px; }
.checklist li .icon{ color:var(--cyan); margin-top:2px; }
.empty-state{ padding:34px 20px; text-align:center; border:1px dashed rgba(255,255,255,.14); border-radius:8px; color:rgba(255,255,255,.46); }
.mobile-portal-toggle{ display:none; }
.portal-scrim{ display:none; }
@media(max-width:900px){
  .portal-shell{ grid-template-columns:1fr; }
  .portal-sidebar{ position:fixed; z-index:50; left:0; top:0; width:min(82vw,280px); transform:translateX(-100%); transition:transform .22s ease; box-shadow:30px 0 80px rgba(0,0,0,.36); }
  .portal-sidebar.open{ transform:translateX(0); }
  .mobile-portal-toggle{ display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--panel-border); border-radius:8px; }
  .portal-main{ padding:calc(16px + env(safe-area-inset-top)) 16px calc(48px + env(safe-area-inset-bottom)); }
  .portal-topbar{ margin-bottom:28px; }
  .span-8,.span-7,.span-6,.span-5,.span-4{ grid-column:span 12; }
  .auth-shell{ grid-template-columns:1fr; }
  .auth-visual{ min-height:250px; padding:30px 24px; }
  .auth-panel{ padding:42px 22px; border-left:0; border-top:1px solid var(--panel-border); }
}
@media(max-width:640px){
  .form-row,.help-grid{ grid-template-columns:1fr; }
  .portal-user .user-copy{ display:none; }
  .portal-card{ padding:18px 14px; overflow:visible; }
  .portal-grid{ gap:14px; }
  .portal-title{ font-size:1.55rem; line-height:1.15; }
  .portal-subtitle{ font-size:13px; line-height:1.45; }
  .metric-value{ font-size:1.35rem; }
  .portal-topbar{ align-items:flex-start; }
  .quick-action-grid{ grid-template-columns:1fr 1fr; }
  .quick-action{ min-height:54px; align-items:flex-start; flex-direction:column; gap:6px; }
  .portal-table{ border-collapse:separate; border-spacing:0 10px; }
  .portal-table thead{ display:none; }
  .portal-table,.portal-table tbody,.portal-table tr,.portal-table td{ display:block; width:100%; }
  .portal-table tr{ border:1px solid rgba(255,255,255,.1); border-radius:8px; background:rgba(255,255,255,.035); padding:8px; }
  .portal-table td{ border-top:0; padding:8px 6px 8px 42%; min-height:34px; position:relative; color:rgba(255,255,255,.76); }
  .portal-table td::before{ content:attr(data-label); position:absolute; left:6px; top:8px; width:34%; color:rgba(255,255,255,.42); font-size:10px; text-transform:uppercase; font-weight:800; }
  .timeline-step{ padding-left:30px; padding-bottom:20px; }
  .notice{ padding:12px; }
}
@media(max-width:380px){
  .portal-main{ padding-left:12px; padding-right:12px; }
  .portal-card{ padding:16px 12px; }
  .quick-action-grid{ grid-template-columns:1fr; }
  .portal-table td{ padding-left:6px; padding-top:25px; }
  .portal-table td::before{ width:auto; left:6px; top:6px; }
}
@media (prefers-reduced-motion: reduce){
  .portal-sidebar,.quick-action{ transition:none; }
  .portal-loading span{ animation:none; }
}
