/* Client-only responsive layer. Administration keeps its existing layout and device guard. */
[hidden] { display:none !important; }
.mobile-nav-toggle,.mobile-nav-backdrop,.mobile-nav-close { display:none; }
img,video,canvas { max-width:100%; }
@media (max-width:1024px) {
  :root { --sidebar-width:0px; --user-page-padding:20px; }
  html { min-width:0; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  body { min-width:0; }
  body .app-shell,body .profile-workspace { min-width:0; width:100%; }
  body .profile-workspace { margin-left:0; border-left:0; }
  body .account-header { min-height:76px; gap:12px; padding:12px 16px; flex-wrap:wrap; }
  body .account-header.is-compact { min-height:68px; padding:10px 16px; }
  .mobile-nav-toggle { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:44px; min-height:44px; padding:10px; border:1px solid var(--line,#dbe4ef); border-radius:10px; color:var(--text,#10213e); background:var(--theme-surface,var(--surface,#fff)); font:inherit; font-size:14px; cursor:pointer; }
  body .sidebar { z-index:1561; width:min(290px,86vw); height:100vh; height:var(--client-viewport-height,100dvh); padding:24px 16px max(24px,env(safe-area-inset-bottom)); align-items:stretch; overflow-y:auto; overscroll-behavior:contain; visibility:hidden; transform:translateX(-105%); transition:transform 180ms ease,visibility 180ms; }
  body .sidebar.is-mobile-open { visibility:visible; transform:none; }
  body .sidebar .brand { padding-inline:10px; justify-content:flex-start; }
  body .sidebar .brand { padding-right:40px; }
  .mobile-nav-close { position:absolute; display:grid; place-items:center; top:16px; right:12px; width:40px; height:40px; border:1px solid rgba(255,255,255,.2); border-radius:10px; color:#fff; background:transparent; font-size:20px; cursor:pointer; }
  body .sidebar .brand-name,body .sidebar .nav-link span,body .sidebar .exit-link span { display:inline; }
  body .sidebar .sidebar-nav { margin-top:24px; width:100%; }
  body .sidebar .nav-link,body .sidebar .exit-link { justify-content:flex-start; gap:12px; min-height:48px; padding:12px; }
  .mobile-nav-backdrop:not([hidden]) { position:fixed; display:block; z-index:1560; inset:0; border:0; background:rgba(4,18,38,.6); cursor:pointer; }
  body.mobile-nav-open { overflow:hidden; }
  body .header-search-button { min-height:44px; min-width:0; padding:10px 14px; font-size:14px; white-space:normal; }
  body .online-avatars { display:none; }
  body .account-summary { min-width:0; }
  body .account-menu-list,body .notification-panel { max-width:calc(100vw - 24px); right:0; max-height:calc(var(--client-viewport-height,100vh) - 100px); overflow-y:auto; }
  body .profile-content,body .search-page,body .history-page,body .calendar-page,body .events-page,body .settings-page { min-width:0; max-width:100%; }
  body .identity-grid,body .profile-fields,body .settings-layout,body .calendar-workspace { grid-template-columns:minmax(0,1fr); min-width:0; }
  body .identity-grid > *,body .profile-section > *,body .settings-layout > * { min-width:0; }
  body .profile-section { padding:22px; }
  body .role-options,body .notification-options,body .search-results { grid-template-columns:minmax(0,1fr); }
  body .employer-search-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body .skills-tag-editor > input,body .language-tag-editor > input { min-width:0; max-width:100%; flex-basis:180px; }
  body input:not([type=checkbox]):not([type=radio]):not([type=range]),body select,body textarea { font-size:16px; }
  body .form-actions { gap:12px; flex-wrap:wrap; }
  body .form-actions button { min-height:46px; }
  body .calendar-page-heading,body .history-title-row,body .events-heading { align-items:flex-start; flex-wrap:wrap; gap:16px; }
  body .calendar-agenda { position:static; }
  body .calendar-agenda-list { grid-template-columns:minmax(0,1fr); }
  body .calendar-board { min-width:0; padding:14px; }
  body .history-person-summary { grid-template-columns:minmax(0,1fr) 40px; padding:16px; gap:12px; }
  body .history-person { grid-column:1/-1; min-width:0; padding-right:40px; }
  body .history-meeting-actions { grid-column:1/-1; grid-row:auto; width:auto; flex-wrap:wrap; }
  body .history-heading-actions { width:100%; flex-wrap:wrap; gap:8px; }
  body .history-call-row,body .history-call-info { min-width:0; flex-wrap:wrap; }
  body .history-call-row,body .history-call-list-header { grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:12px; }
  body .history-call-features,body .history-call-list-header > :last-child { grid-column:1/-1; flex-wrap:wrap; }
  body .history-call-list-header { display:none; }
  body .history-call-row time { grid-column:1; grid-row:1; font-size:13px; }
  body .history-call-row > strong { grid-column:2; grid-row:1; justify-self:end; }
  body .history-call-row .history-call-features { grid-column:1/-1; grid-row:2; }
  body .settings-tabs { display:flex; flex-direction:row; overflow-x:auto; max-width:100%; }
  body .settings-tabs .settings-tab { flex:0 0 auto; display:inline-flex; align-items:center; gap:8px; width:auto; min-height:44px; padding:12px; white-space:nowrap; font-size:14px; }
  body .settings-tabs .settings-tab-arrow { display:none; }
  body .history-person-copy,body .talent-card-copy,body .event-card > div { min-width:0; overflow-wrap:anywhere; }
  body .site-chat-dock { right:12px; bottom:max(12px,env(safe-area-inset-bottom)); }
  body .site-chat-window { width:min(420px,calc(100vw - 24px)); height:min(650px,calc(var(--client-viewport-height,100vh) - 24px)); min-height:0; }
  body .site-chat-thread-header { grid-template-columns:36px 36px minmax(0,1fr) auto 36px; gap:6px; padding:10px; }
  body .site-chat-thread-header button { min-width:36px; min-height:40px; }
  body dialog { max-width:calc(100vw - 24px); max-height:calc(var(--client-viewport-height,100vh) - 24px); overflow-y:auto; overscroll-behavior:contain; }
  body .scheduler-dialog,body .history-contacts-dialog,body .offer-dialog,body .acceptance-dialog,body .decline-dialog,body .counter-offer-dialog,body .history-block-dialog { padding:12px; }
  body .scheduler-dialog-card,body .history-contacts-dialog-card,body .offer-dialog-card,body .counter-offer-dialog-card { max-width:100%; max-height:calc(var(--client-viewport-height,100vh) - 24px); overflow-y:auto; }
  body .scheduler-picker { grid-template-columns:minmax(0,1fr); }
  body .scheduler-picked-participants { flex-wrap:wrap; }

  /* The whole call fits the visible WebView; only its content scrolls, not its controls. */
  body .conversation-panel,body .conversation-panel.has-translation-transcript {
    top:calc(var(--client-viewport-top,0px) + 8px); right:8px; bottom:auto; left:8px;
    width:calc(100% - 16px); min-width:0; height:calc(var(--client-viewport-height,100vh) - 16px);
    max-height:calc(var(--client-viewport-height,100vh) - 16px); padding:14px; transform:none;
    flex-direction:column; flex-wrap:nowrap; align-items:stretch; gap:10px; border-radius:18px; overflow:hidden;
  }
  body .conversation-panel-header { flex:0 0 auto; min-height:44px; padding-right:44px; gap:8px; align-items:center; }
  body .conversation-state { min-width:0; flex:1 1 auto; }
  body .conversation-state strong { white-space:normal; overflow-wrap:anywhere; font-size:16px; }
  body .conversation-close,body .conversation-panel.has-translation-transcript .conversation-close { top:12px; right:12px; width:40px; height:40px; }
  body .conversation-panel .conversation-people { flex:1 1 auto; width:100%; min-height:0; max-height:none; grid-template-columns:minmax(0,1fr); align-content:start; gap:12px; margin:0; overflow:auto; overscroll-behavior:contain; }
  body .conversation-person { grid-template-columns:56px minmax(0,1fr); min-height:auto; padding:12px; gap:10px; }
  body .conversation-person-main { order:0; grid-template-rows:auto auto; overflow:visible; }
  body .conversation-person-self { order:1; grid-template-columns:44px minmax(0,1fr); }
  body .conversation-person-avatar,body .conversation-person-main .conversation-person-avatar { width:56px; height:56px; }
  body .conversation-person-self .conversation-person-avatar { width:44px; height:44px; }
  body .conversation-person-copy { min-width:0; overflow-wrap:anywhere; }
  body .conversation-person-copy strong { max-width:none; white-space:normal; overflow-wrap:anywhere; }
  body .conversation-person-main .conversation-person-copy { padding-right:0; }
  body .conversation-private-tools { position:static; grid-column:1/-1; display:flex; flex-wrap:wrap; gap:8px; }
  body .conversation-private-tools > button { width:40px; height:40px; }
  body .conversation-person-details { grid-column:1/-1; overflow:visible; }
  body .conversation-person-details > p { max-height:none; overflow:visible; overflow-wrap:anywhere; }
  body .conversation-call-duration,body .conversation-balance,body .conversation-next { min-width:0; grid-column:1/-1; }
  body .conversation-transition { flex:1 1 auto; min-height:0; overflow:auto; padding:16px; flex-direction:column; text-align:center; }
  body .conversation-transition-avatar { width:72px; height:72px; flex-basis:72px; }
  body .conversation-panel .conversation-actions { flex:0 0 auto; display:flex; flex-wrap:wrap; gap:8px; width:100%; margin:0; padding:10px 0 max(0px,env(safe-area-inset-bottom)); border-radius:0; }
  body .conversation-control { flex:1 1 calc(50% - 4px); justify-content:center; min-width:0; min-height:44px; width:auto; padding:10px 8px; gap:7px; font-size:13px; white-space:normal; }
  body .conversation-control span { display:inline; }
  body #conversation-enable-audio { flex-basis:100%; }
  body .conversation-schedule { margin-right:0; }
  body .conversation-audio-notice { flex:0 0 auto; margin:0; font-size:14px; }
  body .conversation-panel .conversation-translation-transcript { position:static; flex:0 1 150px; width:100%; min-height:90px; max-height:28%; margin:0; }
  body .conversation-tool-popover { position:fixed; top:50%; right:10px; left:10px; width:auto; max-width:calc(100% - 20px); max-height:calc(var(--client-viewport-height,100vh) - 60px); overflow-y:auto; transform:translateY(-50%); }
  body .conversation-mini { right:12px; bottom:max(12px,env(safe-area-inset-bottom)); width:min(350px,calc(100vw - 24px)); }
  body .conversation-charge-notice,body .profile-toast { max-width:calc(100vw - 24px); right:12px; bottom:max(12px,env(safe-area-inset-bottom)); }
}
@media (max-width:600px) {
  :root { --user-page-padding:16px; }
  body .account-header,body .account-header.is-compact { gap:8px; padding:10px 12px; }
  body .mobile-nav-toggle span { display:none; }
  body .online-status { display:none; }
  body .account-avatar,body .notification-button { width:40px; height:40px; }
  body .account-header .account-copy,body .account-header .account-chevron { display:none; }
  body .header-search-button { flex:1 1 120px; margin-right:0; }
  body .account-menu { margin-left:auto; }
  body .profile-section { padding:20px 16px; border-radius:16px; }
  body .profile-intro h1,body .search-heading h1,body .history-heading h1,body .calendar-page-heading h1,body .events-heading h1,body .settings-heading h1 { font-size:30px; overflow-wrap:anywhere; }
  body .form-grid,body .identity-fields,body .employer-search-filter-grid,body .compensation-row { grid-template-columns:minmax(0,1fr); }
  body .avatar-field { min-width:0; max-width:100%; flex-wrap:wrap; }
  body .avatar-field-copy { min-width:0; }
  body .choice-options,body .notification-options { gap:10px; }
  body .choice-options label { min-height:44px; }
  body .history-controls { flex-wrap:wrap; }
  body .history-sort-select { flex:1 1 180px; min-width:0; max-width:100%; }
  body .history-person-summary { grid-template-columns:minmax(0,1fr); }
  body .history-person { padding-right:32px; }
  body .history-meeting-actions button { min-height:44px; }
  body .talent-card,.event-card { padding:16px; }
  body .calendar-page-heading { display:flex; flex-direction:column; gap:14px; }
  body .calendar-board { padding:10px; }
  body .calendar-toolbar { grid-template-columns:40px minmax(0,1fr) 40px; gap:6px; }
  body .calendar-toolbar button { width:40px; }
  body .calendar-toolbar h2 { font-size:15px; overflow-wrap:anywhere; }
  body .calendar-grid,body .calendar-weekdays { gap:2px; }
  body .calendar-day-number { font-size:12px; }
  body .calendar-agenda-list { padding:10px; }
  body .settings-tabs { display:flex; flex-direction:row; overflow-x:auto; max-width:100%; }
  body .settings-service-price-card,body .settings-data-preview > div { grid-template-columns:40px minmax(0,1fr); }
  body .settings-service-price-card > :last-child { grid-column:2; }
  body .site-chat-window { width:calc(100vw - 24px); }
  body .site-chat-thread-header { grid-template-columns:32px 32px minmax(0,1fr) 32px; }
  body .site-chat-thread-header .site-chat-message-cost { grid-column:2/-1; justify-self:start; }
  body .geo-suggestions { max-height:min(250px,35vh); }
  body .mini-shell { padding-inline:16px; min-height:var(--client-viewport-height,100dvh); }
  body dialog { width:calc(100vw - 24px); margin:auto; border-radius:16px; }
  body dialog form,body dialog section { padding:24px 18px; }
  body .avatar-crop-stage { width:min(280px,calc(100vw - 96px)); height:min(280px,calc(100vw - 96px)); }
  body .avatar-editor-header,body .avatar-editor-actions { padding:16px; gap:10px; flex-wrap:wrap; }
  body .avatar-editor-body { padding:0 18px 18px; }
  body .avatar-editor-actions button { flex:1 1 100px; min-height:44px; }
  body .form-field > span,body .skills-editor-hint,body .language-editor-hint { font-size:14px; }
  body .shell { max-width:calc(100% - 32px); }
  body .header { height:auto; min-height:78px; gap:12px; flex-wrap:wrap; padding-block:16px; }
  body .header nav { order:3; width:100%; overflow-x:auto; gap:18px; white-space:nowrap; }
  body .hero h1 { font-size:clamp(32px,10vw,44px); overflow-wrap:anywhere; }
  body .hero .actions { width:100%; }
  body .hero .actions .button { min-height:46px; }
  body .visual { overflow:hidden; }
  body .roles,body .roles-copy,body .role-grid,body .role-grid article { min-width:0; }
  body .roles { grid-template-columns:minmax(0,1fr); }
  body .roles h2 { font-size:28px; overflow-wrap:anywhere; }
  body .account-header,body .conversation-backdrop,body .site-chat-window { -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media (max-width:360px) {
  body .conversation-control { padding:8px 5px; font-size:12px; }
  body .conversation-person { grid-template-columns:44px minmax(0,1fr); padding:10px; }
  body .conversation-person-main .conversation-person-avatar { width:44px; height:44px; }
  body .site-chat-thread-header { grid-template-columns:30px 30px minmax(0,1fr) 30px; padding:8px; gap:4px; }
}
@media (prefers-reduced-motion:reduce) { .sidebar,.conversation-panel { transition:none !important; } }
@media (max-width:1024px) and (max-height:480px) {
  body .conversation-panel .conversation-actions { gap:6px; }
  body .conversation-control,body #conversation-enable-audio { flex:1 1 44px; min-height:44px; padding:8px; }
  body .conversation-control span { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
}
@supports not (height:100dvh) { .mini-shell { min-height:100vh; } }