/* Shared product shell; keep the three established palettes. */
:root { --muted:#626459; --product-photo-radius:140px 140px 4px 4px; }
[data-theme=mono] { --muted:#606060; --product-photo-radius:10px; }
[data-theme=cobalt] { --muted:#48617f; --product-photo-radius:190px 190px 16px 16px; }

.product-preview { background:var(--surface); border-bottom:1px solid var(--line); color:var(--muted); }
.product-preview-inner { min-height:41px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:5px; }
.product-preview p { margin:0; font-size:11px; white-space:nowrap; }
.product-preview-options,.product-role-preview,.product-palette { display:flex; align-items:center; gap:3px; }
.product-preview-options { gap:17px; }
.product-role-preview>span { font-size:11px; margin-right:5px; }
.product-preview-button { display:inline-flex; align-items:center; justify-content:center; gap:5px; background:transparent; border:1px solid transparent; border-radius:4px; color:var(--muted); padding:4px 7px; min-height:28px; font-size:11px; line-height:1.4; }
.product-preview-button:hover { background:var(--soft); color:var(--ink); }
.product-preview-button.selected { background:var(--paper); border-color:var(--line); color:var(--ink); }
.product-swatch { width:9px; height:9px; border-radius:50%; border:1px solid #0002; }
.product-swatch.mono { background:#222; }
.product-swatch.editorial { background:#b96645; }
.product-swatch.cobalt { background:#6391d9; }
.product-reset { padding:4px 0; background:none; color:var(--muted); font-size:11px; text-decoration:underline; text-underline-offset:3px; }
.product-header { border-bottom:1px solid var(--line); background:var(--paper); }
.product-nav { display:flex; align-items:center; gap:52px; min-height:82px; }
.product-brand { display:inline-flex; align-items:center; flex:none; }
.product-brand svg { display:block; flex:none; }
.product-brand-wordmark { width:100px; height:auto; }
[data-theme=mono] .product-brand svg { filter:grayscale(1); }
.product-public-nav { display:flex; align-items:center; gap:29px; }
.product-nav-link { display:inline-flex; align-items:center; background:none; padding:9px 0; font-size:13px; font-weight:500; white-space:nowrap; color:var(--muted); }
.product-nav-link:hover,.product-nav-link.active { color:var(--ink); }
.product-nav-link.active { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:8px; text-decoration-color:var(--brand); }
.product-workspace-entry { margin-left:auto; display:flex; align-items:center; gap:10px; border-left:1px solid var(--line); padding:8px 0 8px 27px; font-size:13px; color:var(--ink); font-weight:550; white-space:nowrap; }
.product-workspace-entry .icon { width:17px; height:17px; }
.product-workspace-entry .icon:last-child { width:15px; color:var(--muted); margin-left:5px; }
.product-workspace-entry:hover span { text-decoration:underline; text-underline-offset:4px; }
.product-workspace-bar { background:var(--panel-tint); border-top:1px solid var(--line); }
.product-workspace-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:47px; }
.product-workspace-inner>span { font-size:12px; color:var(--muted); }
.product-workspace-inner nav { display:flex; gap:28px; align-items:center; }
.product-workspace-inner nav a { display:inline-flex; align-items:center; min-height:47px; font-size:13px; border-bottom:2px solid transparent; margin-bottom:-1px; }
.product-workspace-inner nav a.active { border-color:var(--brand); color:var(--brand-deep); font-weight:600; }
.product-unread-count { display:inline-flex; align-items:center; justify-content:center; background:var(--brand); color:#fff; min-width:18px; height:18px; padding:0 5px; border-radius:9px; margin-left:7px; font-size:10px; }

.product-hero { display:grid; grid-template-columns:1.16fr 1fr; align-items:center; gap:54px; padding-top:35px; padding-bottom:38px; }
.product-hero-copy { min-width:0; }
.product-kicker { margin:0 0 19px; color:var(--brand-deep); font-size:10px; letter-spacing:1.5px; font-weight:650; }
.product-hero h1 { font:400 clamp(40px,4.2vw,52px)/1.1 var(--heading); letter-spacing:-2px; margin:0; }
.product-hero h1 em { font-weight:inherit; color:var(--brand); }
.product-hero-description { max-width:450px; color:var(--muted); font-size:15px; line-height:1.75; margin:20px 0 0; }
.product-hero-photo { margin:0 10px 0 12px; position:relative; min-width:0; align-self:center; }
/* Clip the photograph only, leaving the linked profile card and focus ring visible. */
.product-photo-frame { overflow:hidden; border-radius:var(--product-photo-radius); background:var(--hero); }
.product-photo-frame>img { width:100%; height:430px; object-fit:cover; object-position:52% center; }
.product-featured-profile { position:absolute; z-index:1; bottom:28px; left:-26px; display:flex; align-items:center; gap:14px; width:340px; max-width:calc(100% + 12px); padding:16px 18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); color:var(--ink); box-shadow:0 14px 38px #18251816; }
.product-featured-avatar { flex:none; }
.product-featured-profile .avatar { width:54px; height:54px; }
.product-featured-copy { flex:1; min-width:0; }
.product-featured-copy>span,.product-featured-copy>small { display:block; font-size:11px; line-height:1.55; color:var(--muted); }
.product-featured-copy>span:first-child { font-size:9px; letter-spacing:.8px; text-transform:uppercase; color:var(--brand-deep); margin-bottom:3px; }
.product-featured-copy>strong { display:block; font-size:15px; line-height:1.4; font-weight:600; margin-bottom:3px; overflow-wrap:anywhere; }
.product-featured-copy>small { margin-top:2px; }
.product-featured-profile>.icon { width:34px; height:34px; padding:8px; border:1px solid var(--line); border-radius:50%; }
.product-featured-profile:hover { border-color:var(--brand); }
.product-featured-profile:hover .product-featured-copy>strong { text-decoration:underline; text-underline-offset:3px; }
.product-profiles { padding-top:45px; padding-bottom:50px; border-top:1px solid var(--line); }
.product-section-heading { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:27px; }
.product-section-heading h2 { font:400 34px/1.2 var(--heading); letter-spacing:-.8px; margin:0 0 9px; }
.product-section-heading p { margin:0; color:var(--muted); font-size:13px; }
.product-section-heading>.text-link { background:none; color:var(--brand-deep); padding:6px 0; white-space:nowrap; }
.product-requests { padding-top:45px; padding-bottom:45px; border-top:1px solid var(--line); }
.product-request-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.product-request-card { display:flex; flex-direction:column; min-width:0; padding:26px; border:1px solid var(--line); border-radius:6px; background:var(--panel-tint); }
.product-request-top { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; margin-bottom:20px; }
.product-request-languages { font-size:13px; font-weight:600; color:var(--brand-deep); overflow-wrap:anywhere; }
.product-request-example { font-size:11px; color:var(--muted); }
.product-request-copy { min-width:0; flex:1; overflow-wrap:anywhere; }
.product-request-card h3 { font:600 23px/1.35 var(--sans); letter-spacing:-.4px; margin:0 0 12px; }
.product-request-card h3 a:hover { text-decoration:underline; text-underline-offset:4px; }
.product-request-summary { color:var(--muted); font-size:14px; line-height:1.7; margin:0; }
.product-request-meta { display:flex; flex-wrap:wrap; gap:7px 20px; list-style:none; margin:24px 0 0; padding:0; font-size:12px; }
.product-request-action { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:20px; padding-top:19px; border-top:1px solid var(--line); }
.product-request-action p { margin:0; }
.product-request-action strong { display:block; font-size:24px; font-weight:600; line-height:1.4; }
.product-request-action p span { display:block; font-size:11px; color:var(--muted); margin-top:3px; }
.product-request-action .text-link { font-size:13px; gap:8px; }
.product-example-note { color:var(--muted); font-size:12px; line-height:1.7; margin:18px 0 0; }
.product-how { border-top:1px solid var(--line); padding-top:45px; padding-bottom:45px; scroll-margin-top:24px; }
.product-steps { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px; padding:0; margin:31px 0 0; }
.product-steps li { border-top:1px solid var(--line); padding-top:23px; min-width:0; }
.product-step-number { display:inline-flex; width:29px; height:29px; align-items:center; justify-content:center; background:var(--soft); color:var(--brand-deep); border-radius:50%; font-size:12px; font-weight:600; }
.product-steps h3 { font:600 16px/1.5 var(--sans); margin:16px 0 10px; letter-spacing:0; }
.product-steps p { font-size:13px; line-height:1.85; color:var(--muted); margin:0; }
.product-process-note { margin:24px 0 0; padding:15px 19px; border-left:2px solid var(--brand); background:var(--panel-tint); color:var(--muted); font-size:12px; }
.product-process-starts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-top:28px; }
.product-process-path { border:1px solid var(--line); border-top:3px solid var(--brand); border-radius:var(--radius); background:var(--surface); padding:23px 27px; }
.product-process-path>h3 { font:650 19px/1.4 var(--sans); letter-spacing:0; margin:0 0 21px; color:var(--brand-deep); }
.product-process-path ul { list-style:none; padding:0; margin:0; }
.product-process-path h4,.product-shared-flow .product-steps h4 { font:600 15px/1.5 var(--sans); letter-spacing:0; margin:0 0 7px; }
.product-process-path p { font-size:13px; line-height:1.75; color:var(--muted); margin:0; }
.product-path-or { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:11px; margin:15px 0; }
.product-path-or::before,.product-path-or::after { content:""; height:1px; background:var(--line); flex:1; }
.product-process-merge { height:35px; position:relative; }
.product-process-merge::before { content:""; position:absolute; left:25%; right:25%; top:0; height:17px; border:1px solid var(--line); border-top:0; border-radius:0 0 9px 9px; }
.product-process-merge::after { content:""; position:absolute; left:50%; top:17px; height:18px; border-left:1px solid var(--line); }
.product-shared-flow { padding:23px 27px 25px; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel-tint); }
.product-shared-flow>h3 { font:600 16px/1.5 var(--sans); letter-spacing:0; margin:0; }
.product-shared-flow .product-steps { margin-top:18px; gap:28px; }
.product-shared-flow .product-steps li { padding-top:16px; }
.product-shared-flow .product-steps h4 { margin-top:12px; }
.product-how-page { padding-top:46px; }
.product-how-detail { max-width:750px; margin-top:44px; }
.product-how-detail h2 { font-size:29px; }
.product-how-detail p { font-size:15px; line-height:1.8; color:var(--muted); }
.product-how-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:25px; }
.product-footer { border-top:1px solid var(--line); }
.product-footer-main { display:flex; align-items:center; justify-content:space-between; gap:35px; padding-top:31px; padding-bottom:34px; }
.product-footer-main>div>p { margin:9px 0 0; font-size:11px; color:var(--muted); }
.product-footer nav { display:flex; align-items:center; gap:25px; }
.product-footer .product-nav-link { font-size:12px; }
.product-local-note { font-size:10px; color:var(--muted); line-height:1.8; margin:0; text-align:right; }

[data-theme=cobalt] .product-header,[data-theme=cobalt] .product-hero-surface { background:var(--hero); }
[data-theme=cobalt] .product-header { border-color:transparent; }
[data-theme=cobalt] .product-hero h1,[data-theme=mono] .product-hero h1 { font-weight:650; }
[data-theme=cobalt] .product-hero h1 em,[data-theme=mono] .product-hero h1 em { font-style:normal; }
[data-theme=cobalt] .product-photo-frame { transform:rotate(2.5deg); }
[data-theme=cobalt] .product-featured-profile { bottom:22px; transform:rotate(-2deg); box-shadow:0 14px 38px #142e5614; }
[data-theme=cobalt] .product-step-number { background:var(--brand-soft); }
[data-theme=mono] .product-photo-frame>img { filter:grayscale(1); }
[data-theme=mono] .product-section-heading h2,[data-theme=cobalt] .product-section-heading h2 { font-size:29px; font-weight:650; }

/* Clear focus and readable secondary text in the shared workspace. */
:is(button,a,input,select,textarea):focus-visible { outline:3px solid var(--brand); outline-offset:4px; }
.message.mine .message-author,.message.mine .message-time { color:inherit; opacity:.85; }
.message-time { color:var(--muted); opacity:1; }
.status.cancelled,.status.declined { background:var(--soft); color:var(--ink); }
.status.discussing { background:var(--brand-soft); color:var(--brand-deep); }
.workspace-row,.pending-row,.message-list-row { display:flex; align-items:center; gap:17px; padding:20px 22px; border:1px solid var(--line); background:var(--surface); margin-bottom:12px; border-radius:var(--panel-radius); min-width:0; }
.workspace-row>div,.pending-row>div,.message-list-row>div { min-width:0; flex:1; }
.workspace-row strong,.pending-row strong,.message-list-row strong { display:block; font-size:15px; font-weight:600; overflow-wrap:anywhere; }
.workspace-row p,.pending-row p,.message-list-row p { margin:6px 0 0; color:var(--muted); font-size:13px; line-height:1.65; }
.workspace-row small,.pending-row small,.message-list-row small { font-size:11px; color:var(--muted); }
.workspace-row h3 { font:600 17px/1.5 var(--sans); margin:6px 0; }
.workspace-row>div>.quiet { font-size:11px; }
.workspace-row .status { display:inline-flex; margin-top:12px; margin-right:8px; }
.workspace-row>.text-link { flex:none; font-size:12px; gap:8px; }
.workspace-row>.workspace-request-actions { flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-end; gap:13px; }
.workspace-request-actions .text-link,.workspace-request-actions .text-button { font-size:12px; }
.workspace-request-actions .text-button { padding:3px 0; color:var(--muted); }
.status.closed { background:#444; color:#fff; }
button[data-action="request-availability"] { color:var(--muted); }
button[data-action="request-availability"][data-open="true"] { color:var(--brand); font-weight:700; }
.workspace-row .request-recruitment-note { font-size:12px; line-height:1.7; margin-top:10px; max-width:520px; }
.request-recruitment-state { border-top:1px solid var(--line); padding-top:22px; margin-top:24px; }
.request-recruitment-state h3 { font:600 18px/1.4 var(--sans); letter-spacing:0; margin:0 0 9px; }
.request-recruitment-state p { font-size:14px; line-height:1.7; color:var(--muted); margin:0 0 16px; }
.pending-row>div>span,.message-list-row>div>span { display:block; color:var(--muted); font-size:12px; margin-top:4px; }
.pending-row small { display:block; margin-top:6px; }
.workspace-row:hover,.pending-row:hover,.message-list-row:hover { border-color:var(--brand); }
.message-list-row>time,.message-list-row time { font-size:11px; color:var(--muted); white-space:nowrap; }
.message-list-row .status { flex:none; }
.inbox .message-list-row { border:0; border-bottom:1px solid var(--line); border-radius:0; margin:0; }
.inbox .message-list-row:last-child { border-bottom:0; }
.inbox .message-list-row:hover { background:var(--panel-tint); }
.message-list-row>div:nth-last-child(2) { flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-end; gap:9px; padding-left:18px; }
.message-list-row>div:nth-last-child(2)>.status { color:var(--brand-deep); font-size:11px; }
.message-list-row>div:nth-last-child(2)>.status.confirmed,.message-list-row>div:nth-last-child(2)>.status.completed { color:var(--support-ink); }
.message-list-row>div:nth-last-child(2)>.status.cancelled,.message-list-row>div:nth-last-child(2)>.status.declined { color:var(--ink); }
.message-list-row p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.message-list-row.unread { background:var(--panel-tint); }
.unread-marker { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--brand); margin-left:9px; vertical-align:middle; }
.request-form-context { display:flex; align-items:center; gap:16px; background:var(--panel-tint); border-left:3px solid var(--brand); padding:18px 22px; margin-bottom:24px; }
.request-form-context strong { display:block; font-size:15px; }
.request-form-context p { font-size:13px; color:var(--muted); margin:6px 0 0; }
.request-languages { min-width:0; margin:0 0 22px; padding:0; border:0; }
.request-languages legend { padding:0; font-size:14px; font-weight:550; }
.request-language-pair { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); align-items:center; gap:10px; margin-top:9px; }
.request-language-pair select { margin-top:0; }
.request-language-arrow { color:var(--muted); font-size:23px; text-align:center; line-height:1; }
.request-languages .small-note { margin:9px 0 0; }
.edit-form .visibility-choice { display:flex; align-items:flex-start; gap:12px; padding:15px 17px; border:1px solid var(--line); background:var(--surface); font-size:14px; margin:14px 0 6px; border-radius:var(--radius); }
.visibility-choice input { width:17px; height:17px; min-height:0; padding:0; margin:3px 0 0; flex:none; accent-color:var(--brand); }
.visibility-choice:has(input:checked) { border-color:var(--brand); background:var(--panel-tint); }
.visibility-choice+.small-note { margin:5px 0 18px; }
.visibility-choice span { display:block; }
.visibility-choice small { display:block; color:var(--muted); font-size:12px; margin-top:4px; line-height:1.65; }
.agreement-actions { display:grid; gap:10px; padding-top:18px; margin-top:18px; border-top:1px solid var(--line); }
.agreement-actions p { margin:0; font-size:13px; color:var(--muted); line-height:1.75; }
.agreement-actions .btn { margin:0; }
.confirmation-checks { display:grid; gap:8px; padding:14px; margin-bottom:5px; border:1px solid var(--line); background:var(--paper); border-radius:var(--radius); }
.confirmation-checks p { font-size:12px; color:var(--ink); }
.page .chat-header .chat-person-name { font:600 20px/1.35 var(--sans); letter-spacing:0; margin:0 0 6px; overflow-wrap:anywhere; }
.chat-header>div { min-width:0; }
.chat-header>.status { margin-left:auto; }
.page .chat-summary h2 { font:600 20px/1.45 var(--sans); letter-spacing:0; margin:15px 0; overflow-wrap:anywhere; }
.chat-summary .detail-list { margin-block:24px; }
.chat-summary .detail-list>div { display:block; padding-block:10px; }
.chat-summary .detail-list dt { font-size:11px; margin-bottom:4px; }
.chat-summary .detail-list dd { margin:0; font-size:13px; text-align:left; }
.chat-summary .agreed-fee { display:flex; flex-wrap:wrap; gap:6px 15px; }
.chat-summary .agreed-fee strong { font-size:25px; }
.plan-header { margin-bottom:31px; }
.plan-header h1 { font:400 43px/1.15 var(--heading); margin:12px 0; letter-spacing:-1px; }
.plan-header p { margin:0; color:var(--muted); font-size:15px; }
.booking-page .confirmed-card { max-width:860px; margin:0; }
.booking-page .confirmed-card>h2 { font:600 23px/1.5 var(--sans); margin:0 0 24px; letter-spacing:0; }

@media (max-width:1100px) {
  .product-nav { gap:33px; }
  .product-public-nav { gap:20px; }
  .product-hero { gap:30px; grid-template-columns:1.2fr 1fr; }
  .product-featured-profile { left:-16px; width:320px; }
  .product-preview p>span { display:none; }
  .product-footer nav { gap:18px; }
  .product-footer-main { gap:23px; }
}
@media (max-width:800px) {
  .product-preview-inner { flex-wrap:wrap; gap:4px 15px; }
  .product-preview-options { flex-wrap:wrap; gap:10px; }
  .product-nav { min-height:75px; flex-wrap:wrap; gap:10px 24px; padding-block:17px; }
  .product-public-nav { order:3; flex:1 0 100%; }
  .product-workspace-entry { padding-left:16px; }
  .product-hero { grid-template-columns:1fr; gap:29px; padding-block:36px; }
  .product-hero-photo { width:calc(100% - 24px); max-width:560px; justify-self:center; margin:0 12px 12px; }
  .product-photo-frame>img { height:350px; }
  .product-featured-profile { left:-8px; bottom:22px; max-width:calc(100% + 16px); }
  .product-steps { gap:24px; }
  .product-footer-main { flex-wrap:wrap; }
  .product-local-note { flex:1 0 100%; text-align:left; }
}
@media (max-width:760px) {
  .product-request-grid { grid-template-columns:1fr; gap:18px; }
}
@media (max-width:600px) {
  .product-requests { padding-block:30px; }
  .product-request-card { padding:21px; }
  .product-request-card h3 { font-size:21px; }
  .product-request-meta { gap:7px 15px; }
  .product-request-action strong { font-size:22px; }
  .product-process-starts { grid-template-columns:1fr; gap:16px; margin-top:24px; }
  .product-process-path { padding:20px; }
  .product-process-path>h3 { margin-bottom:17px; }
  .product-process-merge { height:25px; }
  .product-process-merge::before { display:none; }
  .product-process-merge::after { top:0; height:25px; }
  .product-shared-flow { padding:20px; }
  .product-shared-flow .product-steps { gap:20px; }
  .product-preview-inner { padding-block:8px; }
  .product-preview p { font-size:10px; }
  .product-preview-options { gap:13px; }
  .product-preview-button { padding:4px 5px; font-size:10px; }
  .product-role-preview>span { display:none; }
  .product-nav-link { font-size:12px; }
  .product-public-nav { gap:21px; }
  .product-workspace-entry { font-size:12px; }
  .product-workspace-entry .icon:last-child { display:none; }
  .product-workspace-inner { gap:15px; }
  .product-workspace-inner>span { display:none; }
  .product-workspace-inner nav { gap:25px; }
  .product-hero h1 { font-size:32px; letter-spacing:-1px; }
  .product-hero-description { margin-top:18px; }
  .product-photo-frame { border-radius:120px 120px 4px 4px; }
  .product-photo-frame>img { height:325px; object-position:52% 43%; }
  .product-featured-profile { padding:13px; gap:11px; }
  .product-featured-profile .avatar { width:45px; height:45px; }
  .product-featured-copy>strong { font-size:14px; }
  .product-featured-copy>span,.product-featured-copy>small { font-size:10px; }
  [data-theme=mono] .product-photo-frame { border-radius:10px; }
  [data-theme=cobalt] .product-photo-frame { border-radius:150px 150px 14px 14px; transform:rotate(2deg); }
  .product-section-heading { align-items:flex-start; flex-direction:column; gap:12px; }
  .product-section-heading h2 { font-size:29px; }
  .product-profiles,.product-how { padding-top:30px; padding-bottom:34px; }
  .product-home .member-grid { grid-template-columns:1fr; }
  .product-steps { grid-template-columns:1fr; gap:25px; }
  .product-steps h3 { margin-top:12px; }
  .product-footer-main { align-items:flex-start; gap:24px; }
  .product-footer nav { flex-wrap:wrap; gap:6px 18px; }
  .workspace-row,.pending-row,.message-list-row { padding:15px; gap:12px; flex-wrap:wrap; }
  .workspace-row>div,.pending-row>div,.message-list-row>div { flex-basis:calc(100% - 70px); }
  .workspace-row>.workspace-request-actions { flex-basis:100%; flex-direction:row; align-items:center; flex-wrap:wrap; gap:20px; }
  .message-list-row>div:nth-last-child(2) { flex-direction:row; flex-basis:100%; align-items:center; padding:0 0 0 59px; }
  .message-list-row>.icon:last-child { display:none; }
}

/* Keep failed modal submissions visible in the dialog top layer. */
.modal-feedback { margin-top:20px; }
.modal-feedback[hidden],#modal-recovery[hidden] { display:none; }
.modal-feedback .form-error { color:#a22e2b; line-height:1.6; }
