/* Legal workspace uses the same component scale as the medical workspace. */
.lw-compat-nav{display:none!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell{display:grid;gap:16px;min-width:0;width:100%}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell [hidden]{display:none!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-toolbar{display:flex;align-items:start;justify-content:space-between;gap:12px;flex-wrap:wrap}
body:is(body,.ios-preview-active) #mainApp #content .lw-toolbar .modal-controls{margin:0!important;gap:8px!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-client-info>summary{cursor:pointer;font-weight:700;min-height:34px;align-content:center}
body:is(body,.ios-preview-active) #mainApp #content .lw-client-info .cc-facts{margin:12px 0!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-client-overview{max-width:800px}
body:is(body,.ios-preview-active) #mainApp #content .lw-client-overview .cc-stages-cap{margin:0 0 10px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;max-width:800px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;white-space:normal;background:var(--surface-2)!important;color:var(--text-secondary)!important;border:2px solid transparent!important;border-radius:var(--mobile-control-radius,var(--crm-radius-control,8px))!important;box-sizing:border-box}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey button.is-complete{background:var(--good-soft,#203d30)!important;color:var(--good,#a4e5bd)!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey button[aria-current=step]{border-color:var(--accent)!important;color:var(--text)!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey button.is-complete[aria-current=step]{border-color:var(--good,#91dcae)!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey b{font-size:12px;line-height:1.3}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell [data-lw-panel]{min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell h2{font-size:20px;line-height:1.3;margin:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-materials{margin-bottom:16px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell :is(.lw-materials,.lw-stage-documents,.lw-service)>summary{cursor:pointer;padding:8px 0;color:var(--text-secondary);font-size:13px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row>div{min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row b{overflow-wrap:anywhere}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row small{display:block;margin-top:4px;color:var(--text-muted);font-size:12px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell [data-lw-work]>.cf-stage{display:block;list-style:none;padding:16px!important;margin:0!important;border-radius:var(--mobile-card-radius,var(--crm-radius-card,14px))!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .cf-body{min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .cf-body>b{font-size:18px;line-height:1.4;display:block}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .cf-promise{font-size:13px;line-height:1.5;margin:8px 0 12px;color:var(--text-secondary)}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .cf-next{font-size:13px;line-height:1.5;margin-bottom:12px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .sw-panel{margin:12px 0 0!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-stage-documents{margin-top:16px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell :is(.role-assignment-form,.sd-sheet){max-width:100%;min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .lw-queue-list{display:grid;gap:12px}
body:is(body,.ios-preview-active) #mainApp #content .lw-queue-list>article{display:flex;align-items:center;justify-content:space-between;gap:16px}
body:is(body,.ios-preview-active) #mainApp #content .lw-queue-list p{margin:6px 0 0}
@media(min-width:861px){
 html body:is(body,.ios-preview-active) #mainApp #content>.detail-page.lw-unified{max-width:1120px!important}
 body:is(body,.ios-preview-active) #mainApp #content .lw-queue{max-width:1120px;margin-inline:auto}
}
@media(max-width:860px){
 body:is(body,.ios-preview-active) #mainApp #content .lw-toolbar{display:grid;gap:12px}
 body:is(body,.ios-preview-active) #mainApp #content .lw-toolbar .mini-btn{width:auto!important;min-height:40px}
 body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey{gap:6px}
 body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey button{flex-direction:column;gap:4px;padding:8px 4px!important;min-height:56px!important}
 body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-journey b{font-size:11px}
 body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row{flex-wrap:wrap}
 body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-doc-row>.mini-btn{width:auto!important}
 body:is(body,.ios-preview-active) #mainApp #content .lw-queue-list>article{align-items:start;flex-wrap:wrap}
}

body:is(body,.ios-preview-active) #mainApp #content .lw-compat-nav{display:none!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell :is(.lw-preconditions,.lw-promise)>summary{cursor:pointer;font-size:13px;line-height:1.5;padding:8px 0;color:var(--text-secondary)}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-preconditions>summary{color:var(--warning,var(--accent));font-weight:600}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .lw-preconditions{margin-bottom:12px}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .sw-check{margin:8px 0!important}

body:is(body,.ios-preview-active) #mainApp #content .lw-shell [data-lw-work] :is(.sw-panel,.sw-now){padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell [data-lw-work] .sw-head{margin-bottom:12px}

/* Both parts of a TZ case share the same layout; specialist workflows stay separate. */
html body:is(body,.ios-preview-active) #mainApp #content>.detail-page.case-workspace-page{max-width:1120px!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page .cc-head{padding:0!important;margin:0 0 16px!important;gap:8px!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page .cc-head-top{gap:12px!important;margin:0!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page .cc-head .ios-case-avatar{display:grid!important;place-items:center!important;flex-shrink:0}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace{display:grid;gap:16px!important;width:100%;min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace :is(.lw-client-overview,.mw-client-overview){width:100%;max-width:none;margin:0!important;padding:0!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace :is(.lw-client-overview,.mw-client-overview) .cc-stages-cap{margin:0 0 10px!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace>.senior-line{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0!important;min-width:0;font-size:13px}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace>.senior-line .mini-btn{min-height:40px;padding:8px 12px!important;margin:0!important;white-space:normal}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-toolbar{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;padding:0!important;margin:0!important;background:transparent!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-client-info{margin:0!important;padding:0!important;background:transparent!important;min-width:0}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-client-info>summary{padding:8px 0!important;margin:0!important;min-height:36px;box-sizing:border-box;font-size:14px;line-height:1.4;font-weight:600;cursor:pointer}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-client-facts{margin:12px 0!important;min-width:0;overflow-wrap:anywhere}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-toolbar .modal-controls{display:flex!important;align-items:center;flex-wrap:wrap;justify-content:flex-start!important;gap:8px!important;width:100%!important;margin:0!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-toolbar .modal-controls>.mini-btn{flex:0 1 auto!important;width:auto!important;min-height:40px!important;margin:0!important;padding:8px 12px!important;font-size:13px!important;line-height:1.4!important;white-space:normal}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey{display:grid!important;width:100%;max-width:none;gap:8px!important;margin:0!important}
body:is(body,.ios-preview-active) #mainApp #content .lw-shell .case-workspace-journey{grid-template-columns:repeat(4,minmax(0,1fr))}
body:is(body,.ios-preview-active) #mainApp #content .mw-shell .case-workspace-journey{grid-template-columns:repeat(5,minmax(0,1fr))}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button{display:flex;flex-direction:row!important;align-items:center;justify-content:center!important;gap:8px!important;min-width:0;min-height:44px!important;height:auto!important;padding:10px 8px!important;box-sizing:border-box;background:var(--surface-2)!important;color:var(--text-secondary)!important;border-radius:var(--mobile-control-radius,var(--crm-radius-control,8px))!important;white-space:normal;overflow-wrap:anywhere}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button.is-complete{background:var(--good-soft,#203d30)!important;color:var(--good,#a4e5bd)!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button.is-partial{background:var(--warning-soft,#61491f)!important;color:var(--warning,#ffda83)!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button[aria-current=step]{background:var(--accent)!important;color:var(--accent-ink,var(--on-accent,#242424))!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button :is(span,b){font-size:13px!important;line-height:1.3!important;color:inherit!important;overflow-wrap:anywhere}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-panel-head{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between;flex-wrap:wrap;gap:12px!important;margin:0 0 16px!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-panel-head>h2{margin:0!important;font-size:20px!important;line-height:1.4!important;min-width:0;overflow-wrap:anywhere}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-panel-head>.mini-btn{min-height:40px!important;padding:8px 12px!important;margin:0!important;white-space:normal}
/* Borderless surfaces follow the CRM's existing card design. */
body:is(body,.ios-preview-active) #mainApp #content .case-workspace :is(section,article,details,.chart-card,.note,.lw-doc-row,.cf-stage,.sd-field,.team-doc-card,button,textarea,input,select){border:0!important;box-shadow:none!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .lw-materials{padding:16px!important;border-radius:var(--mobile-card-radius,var(--crm-radius-card,14px));background:var(--surface-2)!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace :is(button,a,summary,input,textarea,select):focus-visible{outline:2px solid var(--accent)!important;outline-offset:3px}
@media(max-width:860px){
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-toolbar .modal-controls{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-toolbar .modal-controls>.mini-btn{width:100%!important;min-width:0!important;min-height:44px!important}
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey{gap:6px!important}
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button{flex-direction:column!important;gap:4px!important;min-height:56px!important;padding:8px 3px!important}
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button :is(span,b){font-size:11px!important}
 body:is(body,.ios-preview-active) #mainApp #content .case-workspace>.senior-line>span{flex-basis:100%}
}

body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button{border:0!important;box-shadow:none!important}

body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page{border:0!important;box-shadow:none!important}
body:is(body,.ios-preview-active) #mainApp #content .case-workspace .case-workspace-journey button.is-complete:not([aria-current=step]){color:var(--text)!important}

/* One scale and one containing block for both case workspaces. */
html body:is(body,.ios-preview-active) #mainApp #content .detail-page.case-workspace-page{width:100%!important;max-width:1120px!important;min-width:0!important;box-sizing:border-box!important;margin-inline:auto!important;padding:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page .cc-head-top :is(h1,.cc-client-name){font-family:'Euclid Flex',system-ui,sans-serif!important;font-size:24px!important;line-height:1.35!important;font-weight:600!important;letter-spacing:0!important;margin:0!important;min-width:0;overflow-wrap:anywhere}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace-page :is(.cc-client-meta,.cc-head-meta){font-size:13px!important;line-height:1.5!important;margin:0!important;letter-spacing:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace :is(.lw-client-overview,.mw-client-overview){width:100%!important;max-width:none!important;margin:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stages-cap{font-size:11px!important;font-weight:400!important;line-height:1.4!important;letter-spacing:.02em!important;margin:0 0 10px!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stages{display:grid!important;width:100%!important;max-width:640px!important;gap:8px!important;margin:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stage{display:grid!important;grid-template-columns:36px minmax(100px,260px) minmax(0,1fr)!important;align-items:center;gap:12px!important;margin:0!important;font-size:13px!important;line-height:1.4!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stage-name{font-size:13px!important;line-height:1.4!important;overflow-wrap:anywhere}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .mini-btn{font-family:'Euclid Flex',system-ui,sans-serif!important;font-size:13px!important;line-height:1.4!important;font-weight:500!important;letter-spacing:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button{min-height:44px!important;height:auto!important;gap:8px!important;padding:10px 8px!important;line-height:1.4!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button>b{font-family:'Euclid Flex',system-ui,sans-serif!important;font-size:13px!important;line-height:1.4!important;font-weight:600!important;letter-spacing:0!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button>span{font-family:system-ui,sans-serif!important;font-size:13px!important;line-height:1.4!important;font-weight:600!important;letter-spacing:0!important;font-variant-numeric:lining-nums tabular-nums;min-width:1ch;text-align:center}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace :is([data-mw-panel]>h2,.case-workspace-panel-head>h2,.cf-body>b){font-size:20px!important;font-weight:600!important;line-height:1.4!important;letter-spacing:0!important;margin:0 0 8px!important}
html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace :is([data-mw-panel]>.modal-hint,.cf-next,.cf-promise){font-size:13px!important;font-weight:400!important;line-height:1.5!important;letter-spacing:0!important}
@media(max-width:860px){
 html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button{min-height:60px!important;gap:4px!important;padding:8px 3px!important}
 html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button>b{font-size:11px!important}
 html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .case-workspace-journey button>span{font-size:13px!important}
}
@media(max-width:560px){
 html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stage{grid-template-columns:36px minmax(0,1fr)!important;gap:4px 8px!important}
 html body:is(body,.ios-preview-active) #mainApp #content .case-workspace.case-workspace .cc-stage-name{grid-column:1/-1!important}
}