/* Authenticated player and scouting workspaces. */
.portal-wrap { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 34px 0 72px; }
.portal-head { display: flex; align-items: flex-end; gap: 24px; margin-bottom: 22px; }
.portal-head h1 { font-size: 30px; }
.portal-head p { max-width: 62ch; margin-top: 7px; color: var(--muted); font-size: 14px; }
.portal-head .head-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.portal-head--scout { position: relative; min-height: 238px; padding: 158px 24px 22px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--r); background: var(--surface); }
.portal-head--scout .scout-cover { position: absolute; inset: 0 0 auto; height: 190px; background: var(--surface-2); }
.portal-head--scout .scout-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0) 45%, var(--surface) 100%); }
.portal-head--scout .scout-cover img { width: 100%; height: 100%; object-fit: cover; }
.portal-head--scout > :not(.scout-cover) { position: relative; z-index: 1; }
.account-badge { display: flex; align-items: center; gap: 9px; }
.account-badge .account-copy { line-height: 1.15; }
.account-badge b { display: block; color: var(--navy); font-size: 13px; }
.account-badge span { color: var(--muted-2); font-size: 11px; text-transform: capitalize; }
.portal-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr); gap: 18px; align-items: start; }
.portal-panel { padding: 22px 24px; }
.portal-panel + .portal-panel { margin-top: 18px; }
.panel-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.panel-head h2 { font-size: 19px; }
.panel-head p { margin-left: auto; color: var(--muted-2); font-size: 12px; }
.score-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 18px; border-block: 1px solid var(--border-hi); }
.score-cell { min-width: 0; padding: 15px 18px; }
.score-cell + .score-cell { border-left: 1px solid var(--border); }
.score-cell b { display: block; color: var(--navy); font: 600 22px/1.1 var(--font-mono); }
.score-cell span { display: block; margin-top: 5px; color: var(--muted-2); font: 600 11px/1.2 var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.score-cell { color: inherit; }
a.score-cell:hover b { color: var(--seam); }
.scout-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr); grid-template-areas: 'matches agents' 'shortlist attention' 'shortlist organisation'; gap: 18px; align-items: start; }
.scout-dashboard-grid .portal-panel { min-width: 0; }
.scout-area-matches { grid-area: matches; }
.scout-area-agents { grid-area: agents; }
.scout-area-shortlist { grid-area: shortlist; }
.scout-area-attention { grid-area: attention; }
.scout-area-organisation { grid-area: organisation; }
.scout-dashboard-grid .panel-head { align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.scout-dashboard-grid .panel-head p { margin: 4px 0 0; }
.scout-dashboard-grid .panel-head > a:not(.btn) { min-height: 44px; display: inline-flex; align-items: center; color: var(--seam); font-size: 13px; font-weight: 600; }
.panel-context { margin: -7px 0 8px; color: var(--muted-2); font-size: 12px; }
.agent-match-list, .active-agent-list { border-top: 1px solid var(--border); }
.agent-match-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--border); }
.agent-match-row:last-child, .active-agent-row:last-child { border-bottom: 0; }
.agent-match-main { min-width: 0; }
.agent-match-main h3 { overflow-wrap: anywhere; font-size: 16px; }
.agent-match-meta, .agent-match-reasons, .active-agent-meta { margin-top: 4px; color: var(--muted); font-size: 12.5px; }
.agent-match-reasons { color: var(--text); }
.agent-match-found { margin-top: 6px; color: var(--muted-2); font-size: 11.5px; }
.agent-match-actions { display: flex; align-items: center; gap: 8px; }
.agent-match-actions .btn, .active-agent-actions .btn, .scout-dashboard-grid .panel-head .btn { min-height: 44px; }
.match-new { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 8px; border-radius: 999px; background: rgba(20,123,70,.09); color: var(--ok); font-size: 11px; font-weight: 700; }
.active-agent-row { padding: 15px 0; border-bottom: 1px solid var(--border); }
.active-agent-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.active-agent-top h3 { min-width: 0; overflow-wrap: anywhere; font-size: 15px; }
.agent-state { flex: none; color: var(--ok); font-size: 11.5px; font-weight: 700; }
.agent-state.is-paused { color: var(--warn); }
.active-agent-criteria { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.active-agent-criteria span { max-width: 100%; overflow-wrap: anywhere; padding: 4px 7px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); font-size: 11px; }
.active-agent-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.active-agent-actions .btn { justify-content: center; }
.table-scroll { overflow-x: auto; }
.feature-request-head { align-items: flex-start; margin-bottom: 26px; padding-bottom: 22px; border-bottom: 1px solid var(--border-hi); }
.feature-request-head h1 { font-size: 34px; }
.feature-request-head p { max-width: 72ch; font-size: 15px; }
.feature-request-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr); gap: 18px; align-items: start; }
.feature-request-intro { color: var(--muted); font-size: 13.5px; }
.request-examples { margin: 12px 0 24px; border-block: 1px solid var(--border); list-style: none; }
.request-examples li { position: relative; padding: 9px 4px 9px 20px; border-bottom: 1px solid var(--border); color: var(--text); font-size: 13px; }
.request-examples li:last-child { border-bottom: 0; }
.request-examples li::before { content: '→'; position: absolute; left: 1px; color: var(--seam); }
.feature-request-form { display: grid; gap: 16px; }
.feature-request-form .field { margin: 0; }
.feature-request-form label { display: block; margin-bottom: 6px; color: var(--text); font-size: 13px; font-weight: 600; }
.feature-request-form textarea { min-height: 152px; resize: vertical; }
.field-support { display: flex; justify-content: space-between; gap: 16px; margin-top: 6px; color: var(--muted-2); font-size: 11.5px; }
.field-support span:first-child { max-width: 46ch; }
.feature-request-form .btn { min-height: 46px; justify-content: center; }
.feature-request-status { min-height: 22px; color: var(--muted); font-size: 13px; }
.feature-request-status b { color: var(--ok); }
.my-request-list { border-top: 1px solid var(--border); }
.my-request { border-bottom: 1px solid var(--border); }
.my-request summary { min-height: 66px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 13px 2px; cursor: pointer; list-style: none; }
.my-request summary::-webkit-details-marker { display: none; }
.my-request summary b, .my-request summary small { display: block; }
.my-request summary b { overflow-wrap: anywhere; font-size: 14px; }
.my-request summary small { margin-top: 4px; color: var(--muted-2); font-size: 11.5px; }
.request-summary-state { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.request-summary-state::after { content: '+'; width: 20px; color: var(--seam); font: 600 18px/1 var(--font-mono); text-align: center; }
.my-request[open] .request-summary-state::after { content: '−'; }
.request-update-badge { padding: 3px 7px; border-radius: 999px; background: rgba(20,123,70,.09); color: var(--ok); font-size: 10.5px; font-style: normal; font-weight: 700; }
.my-request.request-unread summary b { color: var(--navy); }
.my-request-body { padding: 3px 4px 22px; }
.my-request-body > p { max-width: 68ch; color: var(--muted); font-size: 13px; }
.request-timeline { margin: 18px 0 0; list-style: none; }
.request-timeline li { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 10px; padding: 0 0 17px; }
.request-timeline li > span { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: var(--seam); }
.request-timeline li b { font-size: 12.5px; }
.request-timeline li p { margin-top: 2px; color: var(--text); font-size: 12.5px; }
.request-timeline li small { display: block; margin-top: 3px; color: var(--muted-2); font-size: 10.5px; }
.task-list { border-top: 1px solid var(--border); }
.task-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--border); }
.task-row[hidden] { display: none; }
.task-row h3 { font-size: 15px; }
.task-row p { margin-top: 3px; color: var(--muted); font-size: 13px; }
.snapshot { display: grid; grid-template-columns: 1fr auto; gap: 10px 18px; padding: 5px 0; }
.snapshot dt { color: var(--muted-2); font-size: 12px; }
.snapshot dd { color: var(--text); font-size: 13px; font-weight: 600; text-align: right; }
.workspace-link { display: block; padding: 15px 0; border-bottom: 1px solid var(--border); }
.workspace-link:first-child { border-top: 1px solid var(--border); }
.workspace-link h3 { display: flex; align-items: center; gap: 9px; font-size: 15px; }
.workspace-link h3::after { content: '→'; margin-left: auto; color: var(--seam); }
.workspace-link p { max-width: 58ch; margin-top: 4px; color: var(--muted); font-size: 13px; }
.workspace-link:hover h3 { color: var(--seam); }
.portal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.portal-table th { padding: 9px 10px; border-bottom: 1px solid var(--border-hi); color: var(--muted-2); font: 600 11px/1.2 var(--font-display); letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.portal-table td { padding: 11px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.portal-table tr:last-child td { border-bottom: 0; }
.portal-table .num { font-family: var(--font-mono); }
.shortlist-player { display: inline-flex; align-items: center; gap: 10px; min-width: 150px; }
.shortlist-photo { width: 36px; height: 36px; display: grid; place-items: center; flex: none; overflow: hidden; border: 1px solid var(--border-hi); border-radius: 50%; background: var(--surface-2); color: var(--navy); font: 600 10px var(--font-mono); }
.shortlist-photo img { width: 100%; height: 100%; display: block; object-fit: cover; }
.empty-state { padding: 26px 0; color: var(--muted); font-size: 13px; }
.portal-note { margin-bottom: 18px; padding: 12px 15px; border: 1px solid rgba(27,91,156,.3); border-radius: var(--r); background: rgba(27,91,156,.05); color: var(--muted); font-size: 13px; }
.portal-note b { color: var(--navy); }
.portal-eyebrow { display: block; margin-bottom: 5px; color: var(--muted-2); font: 600 10.5px/1.2 var(--font-display); letter-spacing: .12em; text-transform: uppercase; }
.billing-summary .panel-head { align-items: center; }
.billing-summary .panel-head .chip { margin-left: auto; }
.billing-visibility { display: flex; gap: 11px; align-items: flex-start; margin-bottom: 14px; padding: 12px 13px; border: 1px solid rgba(20,123,70,.24); border-radius: 9px; background: rgba(20,123,70,.045); }
.billing-visibility > span { width: 7px; height: 7px; flex: none; margin-top: 5px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 4px rgba(20,123,70,.1); }
.billing-visibility.is-private { border-color: rgba(180,35,60,.24); background: rgba(180,35,60,.045); }
.billing-visibility.is-private > span { background: #B4233C; box-shadow: 0 0 0 4px rgba(180,35,60,.1); }
.billing-visibility b, .billing-visibility small { display: block; }
.billing-visibility b { color: var(--navy); font-size: 12.5px; }
.billing-visibility small { margin-top: 2px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.snapshot.compact { gap-block: 7px; }
.billing-state { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 18px; padding: 19px 22px; border: 1px solid rgba(20,123,70,.28); border-left: 3px solid var(--ok); border-radius: var(--r); background: linear-gradient(105deg, rgba(20,123,70,.05), var(--surface)); }
.billing-state > div:first-child { display: flex; align-items: center; gap: 15px; }
.billing-state h2 { font-size: 22px; }
.billing-state p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.billing-state.trial { border-color: rgba(27,91,156,.25); border-left-color: var(--seam); background: linear-gradient(105deg, rgba(27,91,156,.055), var(--surface)); }
.billing-state.warn { border-color: rgba(168,90,0,.28); border-left-color: var(--warn); background: linear-gradient(105deg, rgba(168,90,0,.055), var(--surface)); }
.billing-state.bad { border-color: rgba(180,35,60,.28); border-left-color: #B4233C; background: linear-gradient(105deg, rgba(180,35,60,.055), var(--surface)); }
.state-pulse { display: block; width: 12px; height: 12px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 6px rgba(20,123,70,.1); }
.trial .state-pulse { background: var(--seam); box-shadow: 0 0 0 6px rgba(27,91,156,.1); }
.warn .state-pulse { background: var(--warn); box-shadow: 0 0 0 6px rgba(168,90,0,.1); }
.bad .state-pulse { background: #B4233C; box-shadow: 0 0 0 6px rgba(180,35,60,.1); }
.visibility-lock { text-align: right; }
.visibility-lock small { display: block; margin-top: 5px; color: var(--muted-2); font-size: 10.5px; }
.billing-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.billing-stat-grid .card { padding: 17px 19px; }
.billing-stat-grid span, .billing-stat-grid small { display: block; color: var(--muted-2); font-size: 10.5px; }
.billing-stat-grid span { font-family: var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.billing-stat-grid b { display: block; margin: 7px 0 4px; color: var(--navy); font: 600 18px/1.1 var(--font-mono); }
.billing-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr); gap: 18px; align-items: start; }
.billing-timeline { border-top: 1px solid var(--border); }
.timeline-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 14px 2px; border-bottom: 1px solid var(--border); }
.timeline-mark { width: 9px; height: 9px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 4px rgba(20,123,70,.08); }
.timeline-row.failed .timeline-mark { background: #B4233C; box-shadow: 0 0 0 4px rgba(180,35,60,.08); }
.timeline-row b, .timeline-row small { display: block; }
.timeline-row b { font-size: 13.5px; }
.timeline-row small { margin-top: 2px; color: var(--muted-2); font-size: 11px; }
.timeline-row strong { color: var(--navy); font: 600 13px var(--font-mono); }
.timeline-empty { display: flex; gap: 16px; align-items: flex-start; padding: 25px 4px; }
.timeline-empty > span { width: 42px; height: 42px; display: grid; place-items: center; flex: none; border: 1px solid var(--border-hi); border-radius: 50%; color: var(--seam); font: 600 12px var(--font-mono); }
.timeline-empty b { font-size: 14px; }
.timeline-empty p { max-width: 58ch; margin-top: 4px; color: var(--muted); font-size: 12.5px; }
.payment-method { display: flex; align-items: flex-start; gap: 14px; }
.method-icon { width: 42px; height: 42px; display: grid; place-items: center; flex: none; border: 1px solid var(--border-hi); border-radius: 9px; background: var(--surface-2); color: var(--navy); font: 600 17px var(--font-mono); }
.payment-method b, .payment-method span, .payment-method small { display: block; }
.payment-method b { font-size: 14px; }
.payment-method span { margin-top: 3px; color: var(--muted); font: 500 11.5px var(--font-mono); }
.payment-method small { margin-top: 9px; color: var(--muted-2); font-size: 10.5px; line-height: 1.35; }
.visibility-explainer > div { display: flex; gap: 11px; padding: 10px 0; border-bottom: 1px solid var(--border); }
.rule-dot { width: 8px; height: 8px; margin-top: 4px; flex: none; border-radius: 50%; background: var(--ok); }
.rule-dot.warn { background: var(--warn); }
.rule-dot.bad { background: #B4233C; }
.visibility-explainer p { color: var(--muted); font-size: 11.5px; line-height: 1.35; }
.visibility-explainer b { display: block; margin-bottom: 2px; color: var(--text); font-size: 12.5px; }
.privacy-copy { margin-top: 13px; color: var(--muted-2); font-size: 10.5px; }

@media (max-width: 900px) {
  .portal-grid { grid-template-columns: minmax(0, 1fr); }
  .scout-dashboard-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'matches' 'agents' 'shortlist' 'attention' 'organisation'; }
  .feature-request-layout { grid-template-columns: minmax(0, 1fr); }
  .billing-layout { grid-template-columns: minmax(0, 1fr); }
  .billing-stat-grid { grid-template-columns: repeat(2, 1fr); }
  .portal-head { align-items: flex-start; flex-direction: column; }
  .portal-head .head-actions { margin-left: 0; }
}
@media (max-width: 620px) {
  .portal-wrap { width: min(100% - 32px, 520px); padding-top: 24px; }
  .score-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .score-cell:nth-child(3), .score-cell:nth-child(4) { border-top: 1px solid var(--border); }
  .score-cell:nth-child(3) { border-left: 0; }
  .task-row { grid-template-columns: minmax(0, 1fr); }
  .task-row .btn { width: 100%; }
  .portal-panel { padding: 19px 18px; }
  .portal-head--scout { min-height: 170px; padding: 90px 18px 18px; }
  .portal-head--scout .scout-cover { height: 118px; }
  .portal-head--scout .head-actions, .portal-head--scout .head-actions .btn { width: 100%; }
  .portal-head--scout .head-actions .btn { justify-content: center; }
  .agent-match-row { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .agent-match-actions { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  .agent-match-actions .btn { justify-content: center; }
  .my-request summary { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .request-summary-state { justify-content: flex-start; flex-wrap: wrap; }
  .field-support { flex-direction: column; gap: 4px; }
  .billing-state { align-items: flex-start; flex-direction: column; padding: 17px 18px; }
  .visibility-lock { text-align: left; }
  .billing-stat-grid { grid-template-columns: minmax(0, 1fr); }
  .timeline-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .timeline-row .chip { grid-column: 2 / -1; justify-self: start; }
}

@media (min-width: 621px) {
  .portal-head--scout { min-height: 176px; padding-top: 98px; }
  .portal-head--scout .scout-cover { height: 132px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}