/* Southport Signal — S7: Team (people, hand-outs, what changed, The Month)
 * and Data and connections.
 *
 * DISPLAY.md §6.3 token names, with the mockups' own values as the fallback
 * (`var(--found, #176ac2)`) until S0's tokens.css defines them for real in
 * all three themes. No shadows on panels (CLAUDE.md do-not / DISPLAY §6.3):
 * hairlines and tints carry hierarchy here, same as everywhere else.
 */

.w7heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:4px 0 22px}
.w7heading h2{font-size:26px;line-height:1.3;letter-spacing:-.6px;margin:6px 0}
.w7heading p{font-size:13px;line-height:1.7;color:var(--mute);margin:0;max-width:60ch}
.w7eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:1.4px;color:var(--mute)}

/* --------------------------------------------------------------- tabs -- */
.w7tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 22px;overflow-x:auto}
.w7tabs a{display:inline-flex;align-items:center;padding:11px 4px;margin-right:22px;font-size:13px;font-weight:600;color:var(--mute);text-decoration:none;white-space:nowrap;position:relative}
.w7tabs a.on{color:var(--ink)}
.w7tabs a.on:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--found,#176ac2)}
.w7pane{min-height:120px}
.w7loading{padding:40px 0;color:var(--mute);font-size:13px;text-align:center}

/* --------------------------------------------------------- freshness -- */
.w7fresh{display:flex;align-items:center;gap:8px;color:var(--mute);font-size:12px;margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.w7fresh svg{width:14px;height:14px;flex:none}

/* ------------------------------------------------------------ people -- */
.w7people{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.w7person{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:18px;min-width:0}
.w7p-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.w7p-id{display:grid;gap:2px;min-width:0;flex:1}
.w7p-id b{font-size:14px;font-weight:650}
.w7p-id small{font-size:12px;color:var(--mute)}
.w7p-id small.w7p-nosign{color:var(--guard,#936313)}
.w7p-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px 0;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);margin-bottom:12px}
.w7p-stats .w7pstat{display:grid;gap:3px;text-align:center}
.w7p-stats .w7pstat b{font-family:var(--font-num,'Rajdhani','Inter',sans-serif);font-size:18px;font-weight:700}
.w7p-stats .w7pstat b .w7guard{color:var(--guard,#936313)}
.w7p-stats .w7pstat small{font-size:12px;color:var(--mute);line-height:1.3}
.w7p-stats .w7pstat.unk b{color:var(--mute);font-weight:500}
.w7p-biggest{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:12.5px;margin-bottom:12px}
.w7p-biggest small{font-size:12px;color:var(--mute);white-space:nowrap}
.w7p-biggest span{font-weight:600;text-align:right}
.w7p-notes>small{display:block;font-size:12px;color:var(--mute);margin-bottom:8px}
.w7pn-list{display:grid;gap:8px}
.w7pn{border-left:2px solid var(--team-tint,#f3f5f8);padding-left:10px;font-size:12px;line-height:1.55}
.w7pn-who{display:block;font-weight:600;color:var(--team,#5b6b7c)}
.w7pn-who small{font-size:12px;font-weight:400;color:var(--mute)}
.w7pn-what{display:block;color:var(--ink2)}
.w7pn-co{display:block;color:var(--mute);font-size:12px;margin-top:1px}
.w7pn-empty{font-size:12px;color:var(--mute)}

/* --------------------------------------------------------- hand-outs -- */
.w7hsum{font-size:13px;color:var(--ink2);margin-bottom:16px}
.w7hlist{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.w7hrow{display:grid;grid-template-columns:1.4fr 1.2fr .9fr .6fr;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line2)}
.w7hrow:last-child{border-bottom:0}
.w7hhead{background:var(--surf2);font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--mute);font-weight:650}
.w7h-co b{display:block;font-size:13px}
.w7h-co small{color:var(--mute);font-size:12px}
.w7h-from{font-size:12px;color:var(--ink2)}
.w7h-state{font-size:12px;font-weight:600}
.w7h-picked_up{color:var(--dial,#227355)}
.w7h-waiting{color:var(--guard,#936313)}
.w7h-released,.w7h-unknown{color:var(--mute)}
.w7h-days{font-family:var(--font-num,'Rajdhani','Inter',sans-serif);font-size:13px;text-align:right}

/* ------------------------------------------------------------ changed -- */
.w7changed{display:grid;gap:2px}
.w7chrow{display:flex;gap:12px;padding:14px 4px;border-bottom:1px solid var(--line2)}
.w7chrow:last-child{border-bottom:0}
.w7chrow svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--team,#5b6b7c)}
.w7ch-who{font-size:12px;color:var(--mute);margin-bottom:3px}
.w7ch-date{color:var(--mute)}
.w7ch-sentence{font-size:13.5px;color:var(--ink);line-height:1.5}
.w7ch-quote{font-size:12.5px;color:var(--ink2);margin-top:4px;font-style:italic}

/* --------------------------------------------------------- month stub -- */
.w7monthstub{border:1px dashed var(--line);border-radius:10px;padding:32px 24px;text-align:center;color:var(--mute)}
.w7monthstub h3{font-size:15px;color:var(--ink);margin:0 0 8px}
.w7monthstub p{font-size:12.5px;line-height:1.6;margin:0;max-width:46ch;margin:0 auto}

/* ==================================================================== */
/* Data and connections                                                 */
/* ==================================================================== */
.w7conn{padding:0}
.w7c-legend{display:flex;align-items:center;gap:8px;background:var(--sample-tint,#fbeef8);border:1px solid var(--sample-line,#e8bfdd);color:var(--sample,#a0338a);border-radius:8px;padding:10px 14px;font-size:12px;margin:0 0 20px}
.w7c-legend svg{width:15px;height:15px;flex:none}
.w7c-group{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--mute);margin:22px 0 12px}
.w7c-group:first-of-type{margin-top:0}
.w7c-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.w7c-card{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:18px;min-width:0}
.w7c-card.is-pending{border-style:dashed}
.w7c-card.is-sample{border-left:3px dashed var(--sample,#a0338a)}
.w7c-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:6px}
.w7c-top h3{font-size:14.5px;font-weight:650;margin:0}
.w7c-status{font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:3px 7px;border-radius:5px;white-space:nowrap}
.w7c-status.w7c-stored{color:var(--blue);background:var(--bluetint)}
.w7c-status.w7c-pending{color:var(--mute);background:var(--surf2)}
.w7c-status.w7c-sample{color:var(--sample,#a0338a);background:var(--sample-tint,#fbeef8)}
.w7c-adds{font-size:12.5px;line-height:1.65;color:var(--ink2);margin:0 0 10px}
.w7c-fact{font-size:12px;color:var(--mute);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.w7c-dates{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.w7c-dates b{color:var(--ink2);font-weight:650}
.w7c-samplebadge{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--sample,#a0338a)}
.w7c-samplebadge svg{width:12px;height:12px}
.w7c-waits{color:var(--mute)}
.w7c-card>a{display:inline-block;font-size:12px;color:var(--found,#176ac2);margin-top:12px}
.w7c-update{margin-top:14px;padding-top:12px;border-top:1px solid var(--line2,#edf1f4)}
.w7c-update p{font-size:12px;line-height:1.55;color:var(--ink2);margin:0 0 8px}
.w7c-update small{display:block;font-size:11px;line-height:1.4;color:var(--mute);margin-bottom:8px}
.w7c-update .w7c-upload{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:6px 10px;border:1px solid var(--found-line,#cfe2fb);border-radius:6px;background:var(--found-tint,#edf5ff);color:var(--found,#176ac2);font-size:12px;font-weight:700;text-decoration:none}
.w7c-update .w7c-upload:hover,.w7c-update .w7c-upload:focus-visible{background:var(--sel,#f3f8fe);text-decoration:underline;text-underline-offset:2px}
.w7c-update .w7c-upload:focus-visible{outline:2px solid var(--found,#176ac2);outline-offset:2px}
.w7c-feednote{margin-top:12px;padding-top:10px;border-top:1px solid var(--line2,#edf1f4);color:var(--mute);font-size:11px;line-height:1.45}
.w7c-empty{padding:40px 0;text-align:center;color:var(--mute);font-size:13px}

@media (max-width:700px){
  .w7people,.w7c-grid{grid-template-columns:1fr}
  .w7p-stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}
  .w7hrow{grid-template-columns:1fr;gap:4px;padding:14px}
  .w7hhead{display:none}
  .w7h-days{text-align:left}
  .w7heading{display:block}
  .w7heading h2{font-size:24px}
}