html { background: #f0f2f5; }
.workspace-transitioning body { visibility: hidden; }
#workspace-transition { position: fixed; inset: 0; z-index: 2147483647; display: flex; align-items: center; justify-content: center; background: #f7f5f3; color: #111b21; font: 400 14px/1.5 "Segoe UI", Helvetica, Arial, sans-serif; opacity: 1; transition: opacity .16s ease; }
.workspace-transition-content { display: flex; flex-direction: column; align-items: center; width: min(360px, calc(100% - 48px)); text-align: center; transform: translateY(-24px); }
.workspace-transition-logo { width: 64px; height: 64px; color: #deddda; flex: none; }
.workspace-transition-title { margin-top: 20px; font-size: 24px; line-height: 32px; font-weight: 400; }
.workspace-transition-track { width: 250px; max-width: 100%; height: 4px; margin-top: 32px; overflow: hidden; border-radius: 4px; background: #d6d5d2; }
.workspace-transition-fill { display: block; width: 100%; height: 100%; border-radius: inherit; background: #008069; transform: scaleX(0); transform-origin: left center; transition: transform .35s ease-out; }
.workspace-transition-label { margin: 32px 0 0; color: #667781; font-size: 14px; line-height: 22px; overflow-wrap: anywhere; }
.workspace-transition-retry { margin-top: 18px; border: 1px solid #008069; border-radius: 20px; padding: 7px 18px; background: transparent; color: #008069; font: inherit; cursor: pointer; }
.workspace-transition-retry[hidden] { display: none; }
.workspace-transition-retry:focus-visible { outline: 2px solid #008069; outline-offset: 3px; }
#workspace-transition.workspace-transition-leaving { opacity: 0; }
@keyframes workspace-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #workspace-transition, .workspace-transition-fill { transition: none; } .workspace-option-loading::after { animation: none !important; } }
.workspace-host { position: relative; min-width: 0; max-width: 100%; }
.workspace-host[hidden], .workspace-menu[hidden], .workspace-status[hidden], .workspace-dialog-error[hidden] { display: none; }
.workspace-trigger { display: flex; align-items: center; gap: 8px; min-height: 38px; max-width: 100%; padding: 6px 10px; border: 1px solid #0080691a; border-radius: 12px; background: #00806908; color: var(--c-primary, #008069); font: inherit; font-size: 17px; font-weight: 650; cursor: pointer; transition: background .15s; }
.workspace-trigger:hover, .workspace-trigger[aria-expanded="true"] { background: #00806912; }
.workspace-current-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workspace-host svg, .workspace-create-dialog svg { width: 17px; height: 17px; flex: none; }
.workspace-menu { position: absolute; top: calc(100% + 8px); left: 0; z-index: 40; width: 308px; max-width: calc(100vw - 40px); padding: 6px; border: 1px solid var(--c-outline-variant, #d1d7db); border-radius: 16px; background: var(--c-surface-container-lowest, #fff); box-shadow: 0 16px 42px #111b211f, 0 2px 8px #111b2108; color: var(--c-on-surface, #111b21); }
.workspace-menu-heading { padding: 10px 10px 8px; color: var(--c-on-surface-variant, #667781); font-size: 12px; font-weight: 600; }
.workspace-menu-list { max-height: min(380px, 52vh); overflow-y: auto; overscroll-behavior: contain; }
.workspace-option { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 9px 10px; border: 0; border-radius: 10px; background: transparent; color: inherit; text-align: left; font: inherit; cursor: pointer; }
.workspace-option:hover { background: var(--c-surface-container-low, #f5f6f6); }
.workspace-option[aria-checked="true"] { background: #0080690d; }
.workspace-option[aria-checked="true"] > svg { color: var(--c-primary, #008069); }
.workspace-option:disabled { opacity: .5; cursor: default; }
.workspace-option-loading { opacity: 1 !important; }
.workspace-option-loading::after { content: ""; width: 16px; height: 16px; flex: none; border: 2px solid #d1dfdb; border-top-color: #008069; border-radius: 50%; animation: workspace-spin .7s linear infinite; }
.workspace-avatar { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 10px; background: #0080690e; color: var(--c-primary, #008069); font-size: 11px; font-weight: 700; }
.workspace-option-text { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 2px; }
.workspace-option-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.workspace-option-role { font-size: 11px; color: var(--c-on-surface-variant, #667781); }
.workspace-menu-footer { margin-top: 5px; padding-top: 5px; border-top: 1px solid var(--c-outline-variant, #d1d7db); }
.workspace-create-action { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 10px; border: 0; border-radius: 10px; background: transparent; color: var(--c-primary, #008069); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.workspace-create-action:hover { background: #0080690d; }
.workspace-status { margin: 5px 10px 8px; font-size: 12px; line-height: 1.45; color: var(--c-on-surface-variant, #667781); }
.workspace-trigger:focus-visible, .workspace-option:focus-visible, .workspace-create-action:focus-visible, .workspace-create-dialog button:focus-visible { outline: 2px solid var(--c-primary, #008069); outline-offset: 2px; }
.workspace-trigger:disabled, .workspace-create-dialog button:disabled { opacity: .6; cursor: wait; }
.workspace-create-dialog { width: min(420px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #dce7df; border-radius: 20px; background: #fff; color: #111b21; box-shadow: 0 24px 80px #111b2133; }
.workspace-create-dialog::backdrop { background: #111b2166; backdrop-filter: blur(3px); }
.workspace-create-card { padding: 24px; }
.workspace-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.workspace-dialog-heading h2 { margin: 0; font-size: 19px; font-weight: 650; }
.workspace-dialog-close { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 10px; background: #f5f6f6; color: #667781; cursor: pointer; }
.workspace-dialog-description { margin: 12px 0 22px; font-size: 13px; line-height: 1.55; color: #667781; }
.workspace-name-label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; }
.workspace-name-input { width: 100%; height: 44px; padding: 10px 12px; border: 1px solid #d1d7db; border-radius: 10px; background: #fff; color: #111b21; font: inherit; font-size: 14px; }
.workspace-name-input:focus { border-color: #008069; outline: 2px solid #00806912; }
.workspace-dialog-error { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: #ba1a1a; }
.workspace-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.workspace-dialog-actions button { min-height: 42px; padding: 10px 16px; border: 0; border-radius: 10px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.workspace-cancel { background: #f5f6f6; color: #667781; }
.workspace-submit { background: #008069; color: #fff; }
.workspace-management { flex:1; min-width:0; overflow:auto; background:#fff; color:var(--c-on-surface,#111b21); padding:28px 32px; }
.workspace-management[hidden] { display:none; }
.wm-header { margin-bottom:28px; padding-bottom:20px; border-bottom:1px solid #e5e9e7; }
.wm-header h1 { margin:0 0 8px; font-size:26px; font-weight:650; }
.wm-header p,.wm-muted { color:#667781; font-size:13px; line-height:1.6; margin:0; }
.wm-layout { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(320px,1.2fr); gap:28px; align-items:start; }
.wm-card { min-width:0; }
.wm-card h2 { font-size:18px; font-weight:650; margin:0 0 12px; }
.wm-form { display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-top:22px; }
.wm-form label { font-size:13px; font-weight:600; }
.wm-input { width:100%; min-width:0; border:1px solid #d1d7db; border-radius:8px; padding:11px 12px; font:inherit; font-size:14px; }
.wm-input:focus { outline:2px solid #00806922; border-color:#008069; box-shadow:none; }
.wm-button { border:0; border-radius:8px; padding:9px 13px; min-height:38px; font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.wm-button:disabled { opacity:.45; cursor:default; }
.wm-button:focus-visible { outline:2px solid #008069; outline-offset:2px; }
.wm-primary { background:#008069; color:#fff; }
.wm-secondary { background:#f0f2f5; color:#40534d; }
.wm-danger { background:#fff0ee; color:#a4271b; }
.wm-list-heading { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:8px; }
.wm-list-heading h2 { margin:0; }
.wm-company { border-bottom:1px solid #e5e9e7; padding:18px 0; }
.wm-company h3 { margin:0 0 5px; font-size:16px; font-weight:600; overflow-wrap:anywhere; }
.wm-company-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.wm-delete-reason { font-size:12px; line-height:1.5; color:#667781; margin:10px 0 0; }
.wm-error { color:#a4271b; font-size:13px; line-height:1.5; margin:12px 0; }
.wm-message { color:#006d2f; font-size:13px; line-height:1.5; margin:8px 0 0; }
.wm-delete-dialog { width:min(440px,calc(100vw - 32px)); border:1px solid #d1d7db; border-radius:14px; padding:24px; color:#111b21; background:#fff; }
.wm-delete-dialog::backdrop { background:#111b2155; }
.wm-delete-dialog h2 { font-size:20px; font-weight:650; margin:0 0 12px; }
.wm-delete-dialog p { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.wm-dialog-actions { display:flex; gap:10px; justify-content:flex-end; margin-top:24px; }
@media(max-width:1100px) { .wm-layout { grid-template-columns:1fr; }.workspace-management { padding:24px; } }
@media(max-width:767px) { .workspace-management { padding:20px 16px; }.wm-header h1 { font-size:23px; } }
#settings-workspaces-view .workspace-management { min-height:0; padding:20px 16px; }
#settings-workspaces-view .wm-layout { grid-template-columns:minmax(0,1fr); }
#settings-workspaces-view .wm-header { margin-bottom:20px; padding-bottom:16px; }
#settings-workspaces-view .wm-header h1 { display:none; }
#rail-avatar[aria-pressed="true"] { outline:2px solid var(--c-primary,#008069); outline-offset:3px; }