:root {
  --ink: #eaf4fb;
  --muted: #8ca1b1;
  --line: rgba(188, 222, 244, .17);
  --accent: #8ec6e8;
  --accent-2: #547d9e;
  --deep: #02070c;
  --glass: rgba(7, 16, 24, .72);
  --sidebar: #07131d;
  --topbar: rgba(5, 12, 19, .82);
  font-family: Manrope, system-ui, sans-serif;
  color-scheme: dark;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { background: #02070c; color: var(--ink); }
button, input { font: inherit; }
button { color: inherit; }
.app-shell, .portal, .workspace { width: 100%; height: 100%; }

.portal { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 45%, #183147 0, #06121d 42%, #010509 100%); transition: opacity .8s ease, visibility .8s; }
.ambient { position: absolute; inset: 0; background: linear-gradient(115deg, rgba(96,145,176,.13), transparent 38%, rgba(154,200,227,.06) 62%, transparent), radial-gradient(circle at 50% 50%, transparent 15%, rgba(0,0,0,.62) 78%); mix-blend-mode: screen; pointer-events: none; z-index: 2; }
.eye-stage { position: absolute; inset: -7%; width: 114%; height: 114%; padding: 0; border: 0; background: transparent; cursor: pointer; transform: translateX(0) scale(1); transition: transform 1.15s cubic-bezier(.65,.05,.2,1), filter 1s ease; }
.eye-image { position: absolute; inset: 0; background: url('assets/cmsd-eye.png') center/cover no-repeat; filter: saturate(.67) brightness(.67) contrast(1.08); transform: scale(1.015); transition: transform 1.8s cubic-bezier(.2,.7,.1,1), filter 1.2s ease; }
.eye-stage:hover .eye-image { transform: scale(1.045); filter: saturate(.78) brightness(.75) contrast(1.1); }
.eye-stage::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 48%, transparent 0 10%, rgba(4,10,16,.04) 24%, rgba(0,4,8,.72) 73%, #010407 100%); }
.scan-line { position: absolute; left: 20%; right: 20%; top: 50%; height: 1px; z-index: 3; background: linear-gradient(90deg, transparent, rgba(190,230,255,.65), transparent); box-shadow: 0 0 18px rgba(148,207,242,.35); animation: breathe 3.7s ease-in-out infinite; }
.entry-cue { position: absolute; z-index: 4; left: 50%; bottom: 7.5%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 12px; color: rgba(234,244,251,.74); letter-spacing: .26em; text-transform: uppercase; font-size: 11px; font-weight: 600; }
.entry-cue__line { width: 1px; height: 38px; background: linear-gradient(transparent, var(--accent)); animation: breathe 2.2s ease-in-out infinite; }
.brand-mark { position: absolute; z-index: 6; top: 32px; left: 38px; display: flex; align-items: center; gap: 9px; padding:0; border:0; background:transparent; color:inherit; font:inherit; text-transform: none; }
.dev-skip { cursor:pointer; border-radius:10px; transition:filter .25s ease,transform .25s ease; }
.dev-skip:hover,.dev-skip:focus-visible { filter:brightness(1.18); transform:translateY(-1px); outline:none; }
.dev-skip:focus-visible { box-shadow:0 0 0 2px rgba(144,190,218,.7),0 0 0 6px rgba(80,132,165,.18); }
.brand-icon { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; background: linear-gradient(145deg, #b6ddf2, #416d8c); box-shadow: inset 0 0 0 1px rgba(255,255,255,.48), 0 7px 22px rgba(72,132,171,.3); }
.brand-icon span { width: 12px; height: 12px; border: 3px solid white; border-radius: 2px; opacity: .9; }
.brand-name { font-size: 23px; font-weight: 700; letter-spacing: -.05em; }
.brand-name span, .side-brand span span { font-weight: 300; opacity: .72; }
.brand-context { margin-left: 8px; padding-left: 17px; border-left: 1px solid var(--line); color: #9fb4c3; text-transform: uppercase; letter-spacing: .19em; font-size: 10px; }

.auth-panel { position: absolute; z-index: 8; top: 0; right: 0; width: min(520px, 92vw); height: 100%; padding: clamp(82px, 13vh, 140px) clamp(34px, 5vw, 72px) 40px; display: flex; flex-direction: column; background: linear-gradient(145deg, rgba(14,28,40,.94), rgba(2,8,13,.97)); border-left: 1px solid rgba(176,217,241,.18); box-shadow: -38px 0 90px rgba(0,0,0,.42), inset 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(30px); transform: translateX(105%); transition: transform 1.05s cubic-bezier(.65,.05,.2,1); }
.portal.panel-open .auth-panel { transform: translateX(0); }
.portal.panel-open .eye-stage { transform: translateX(-18%) scale(.92); filter: brightness(.7); }
.close-panel, .drawer-head button { position: absolute; right: 30px; top: 27px; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.03); font-size: 25px; font-weight: 300; cursor: pointer; }
.auth-copy { margin-bottom: 48px; }
.eyebrow { display: block; color: var(--accent); text-transform: uppercase; letter-spacing: .22em; font-size: 10px; font-weight: 700; margin-bottom: 16px; }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(42px, 5vw, 66px); line-height: .95; margin-bottom: 24px; letter-spacing: -.055em; font-weight: 300; }
.auth-copy p { max-width: 360px; color: var(--muted); line-height: 1.75; font-size: 14px; }
.auth-form { display: grid; gap: 13px; }
.auth-form label { color: #a9bbc8; font-size: 11px; text-transform: uppercase; letter-spacing: .18em; }
.auth-form input { width: 100%; min-height: 60px; padding: 0 18px; border: 1px solid rgba(174,213,237,.19); border-radius: 3px; outline: none; color: #f2f8fc; background: rgba(255,255,255,.035); transition: border-color .2s, background .2s, box-shadow .2s; }
.auth-form input:focus { border-color: rgba(151,205,238,.65); background: rgba(255,255,255,.055); box-shadow: 0 0 0 3px rgba(107,170,209,.08); }
.input-wrap { position: relative; }
.input-wrap input { padding-right: 18px; }
.primary-action { margin-top: 13px; min-height: 58px; padding: 0 21px; display: flex; align-items: center; justify-content: space-between; border: 1px solid rgba(190,225,246,.3); border-radius: 3px; background: linear-gradient(135deg, #476d8a, #7daac6); color: white; font-weight: 600; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.primary-action:hover { transform: translateY(-2px); box-shadow: 0 13px 35px rgba(47,100,135,.28); }
.form-error { min-height: 18px; margin: 0; color: #ffada5; font-size: 12px; }
.remember-option { width:max-content; display:flex; align-items:center; gap:10px; color:#8fa4b2!important; font-size:11px!important; font-weight:500; letter-spacing:0!important; text-transform:none!important; cursor:pointer; user-select:none; }
.remember-option input { position:absolute; width:1px; height:1px; min-height:0; opacity:0; pointer-events:none; }
.remember-check { width:19px; height:19px; display:grid; place-items:center; border:1px solid rgba(174,213,237,.27); border-radius:4px; background:rgba(255,255,255,.025); color:transparent; font-size:11px; transition:background .2s,border-color .2s,color .2s,box-shadow .2s; }
.remember-option:hover .remember-check { border-color:rgba(151,205,238,.62); }
.remember-option input:focus-visible + .remember-check { outline:2px solid rgba(151,205,238,.62); outline-offset:3px; }
.remember-option input:checked + .remember-check { color:#07131d; border-color:#a5d1ea; background:#a5d1ea; box-shadow:0 0 16px rgba(142,198,232,.25); }
.prototype-note { margin-top: auto; color: #607482; font-size: 10px; letter-spacing: .07em; }
.identity-pill { display: flex; align-items: center; gap: 9px; color: #9bb0bf; font-size: 12px; margin-bottom: 20px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #8dc8e8; box-shadow: 0 0 13px rgba(141,200,232,.75); }
.text-action { justify-self: start; border: 0; padding: 6px 0; background: none; color: #8fa8b9; font-size: 11px; cursor: pointer; }
.portal.password-step .eye-stage { transform: translateX(-19%) scale(1.08); }
.portal.entering .eye-stage { transform: translateX(0) scale(5.8); filter: brightness(.18); transition-duration: 1.9s; }
.portal.entering .auth-panel { transform: translateX(110%); }
.portal.entering .brand-mark, .portal.entering .entry-cue { opacity: 0; transition: opacity .3s; }
.portal.departed { opacity: 0; visibility: hidden; }

.workspace { position:absolute; inset:0; height:100%; min-height:0; display:grid; grid-template-columns:252px 1fr; overflow:hidden; background:radial-gradient(circle at 65% 70%,rgba(49,84,106,.2),transparent 42%),#061019; opacity:0; visibility:hidden; transform:scale(1.04); transition:opacity 1s ease,transform 1.2s ease,visibility 1s,grid-template-columns .42s cubic-bezier(.2,.75,.2,1); }
.workspace.visible { opacity: 1; visibility: visible; transform: scale(1); }
.workspace.nav-collapsed { grid-template-columns:76px 1fr; }
.sidebar { position:relative; z-index:4; height:100%; min-height:0; display:flex; flex-direction:column; padding:25px 17px; overflow:hidden; background:var(--sidebar); border-right:1px solid var(--line); transition:background .35s; }
.side-brand { position:relative; width:100%; min-height:58px; display:flex; align-items:center; gap:10px; margin-bottom:18px; padding:0 9px; overflow:hidden; border:1px solid rgba(212,226,235,.15); border-radius:7px; background:linear-gradient(145deg,rgba(14,27,37,.88),rgba(25,38,48,.7)); color:inherit; text-align:left; font-size:20px; font-weight:700; cursor:pointer; box-shadow:0 13px 30px rgba(0,0,0,.16); transition:background .3s,border-color .3s,box-shadow .3s; }
.side-brand::after { content:''; position:absolute; left:9px; right:9px; bottom:5px; height:1px; background:linear-gradient(90deg,#6f99b4,rgba(168,190,203,.7)); transform:scaleX(.18); transform-origin:left; transition:transform .45s ease; }
.side-brand:hover::after,.side-brand[aria-pressed="true"]::after { transform:scaleX(1); }
.side-brand[aria-pressed="true"] { background:linear-gradient(145deg,rgba(36,48,57,.96),rgba(17,29,38,.9)); border-color:rgba(183,205,218,.25); box-shadow:0 12px 35px rgba(0,0,0,.25); }
.side-brand .brand-icon { width: 27px; height: 27px; }
.side-brand:hover .brand-icon { box-shadow: inset 0 0 0 1px rgba(255,255,255,.65), 0 7px 24px rgba(111,177,217,.48); }
.brand-product-icon { width:31px; height:31px; object-fit:contain; filter:drop-shadow(0 5px 10px rgba(42,155,220,.28)); }
.sidebar nav { display: grid; gap: 7px; }
#cmsdNav { gap:4px; max-height:calc(100vh - 244px); overflow-y:auto; padding-right:3px; opacity:1; visibility:visible; scrollbar-width:thin; scrollbar-color:rgba(134,185,215,.28) transparent; transition:opacity .22s ease,visibility 0s; }
.sidebar.space-transitioning #cmsdNav,.sidebar.mirador-active #cmsdNav,.sidebar.orbit-active #cmsdNav { opacity:0; visibility:hidden; transition:opacity .22s ease,visibility 0s .22s; pointer-events:none; }
#cmsdNav .nav-item { min-height:42px; }
#cmsdNav::-webkit-scrollbar { width:3px; }
#cmsdNav::-webkit-scrollbar-thumb { background:rgba(134,185,215,.28); border-radius:3px; }
.nav-item { display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 6px; min-height: 51px; padding: 0 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; text-align: left; color: #8497a5; cursor: pointer; font-size: 12px; }
.nav-item:hover, .nav-item.active { color: #edf6fb; background: rgba(255,255,255,.055); border-color: rgba(184,219,241,.09); }
.nav-item.active::before { content: ''; position: absolute; left: 0; width: 2px; height: 30px; background: var(--accent); box-shadow: 0 0 15px var(--accent); }
.nav-glyph { color: var(--accent); font-size: 17px; }
.mirador-stack { position:absolute; z-index:5; left:17px; right:17px; top:calc(100% - 232px); display:grid; gap:7px; padding-bottom:16px; background:var(--sidebar); box-shadow:0 -20px 34px var(--sidebar); transition:top .78s cubic-bezier(.68,.02,.2,1),background .35s,box-shadow .35s; will-change:top; }
.sidebar.mirador-active .mirador-stack,.sidebar.orbit-active .mirador-stack { top:101px; }
.sidebar.mirador-active .orbit-switch { position:fixed; left:17px; bottom:76px; width:218px; z-index:7; }
.mirador-switch,.orbit-switch { position:relative; width:100%; min-height:58px; display:grid; grid-template-columns:26px 1fr 18px; align-items:center; gap:7px; padding:0 9px; overflow:hidden; border:1px solid rgba(212,226,235,.15); border-radius:7px; background:linear-gradient(145deg,rgba(14,27,37,.88),rgba(25,38,48,.7)); color:#ced9e0; cursor:pointer; text-align:left; box-shadow:0 13px 30px rgba(0,0,0,.16); transition:background .3s,border-color .3s,box-shadow .3s; }
.mirador-switch::after { content:''; position:absolute; left:9px; right:9px; bottom:5px; height:1px; background:linear-gradient(90deg,#daa927,rgba(134,185,215,.65)); transform:scaleX(.15); transform-origin:left; transition:transform .45s ease; }
.mirador-switch:hover::after,.mirador-switch.active::after { transform:scaleX(1); }
.mirador-switch.active { background:linear-gradient(145deg,rgba(36,48,57,.96),rgba(17,29,38,.9)); border-color:rgba(222,232,238,.23); box-shadow:0 12px 35px rgba(0,0,0,.25); }
.mirador-icon { width:27px; height:27px; object-fit:contain; filter:drop-shadow(0 4px 9px rgba(228,180,36,.3)); }
.mirador-name,.orbit-name { font-size:17px; font-weight:300; letter-spacing:.08em; }
.switch-arrow { color:#879aa7; transition:transform .35s; }
.mirador-switch.active .switch-arrow { transform:rotate(180deg); }
.mirador-nav,.orbit-nav { max-height:0; overflow:hidden; opacity:0; visibility:hidden; transition:max-height .65s cubic-bezier(.2,.72,.2,1),opacity .3s,visibility 0s .65s; }
.sidebar.mirador-active:not(.space-transitioning) .mirador-nav,.sidebar.orbit-active:not(.space-transitioning) .orbit-nav { max-height:620px; opacity:1; visibility:visible; transition:max-height .72s cubic-bezier(.2,.72,.2,1),opacity .35s .15s,visibility 0s; }
.sidebar.mirador-active:not(.space-transitioning) .mirador-nav { max-height:calc(100vh - 325px); overflow-y:auto; padding-right:3px; scrollbar-width:thin; scrollbar-color:rgba(229,181,45,.28) transparent; }
.sidebar.mirador-active .mirador-nav::-webkit-scrollbar { width:3px; }.sidebar.mirador-active .mirador-nav::-webkit-scrollbar-thumb { background:rgba(229,181,45,.28); border-radius:3px; }
.mirador-nav .nav-item,.orbit-nav .nav-item { min-height:38px; background:rgba(255,255,255,.065); border-color:rgba(255,255,255,.055); color:#b9c7cf; }
.mirador-nav .nav-item.active,.orbit-nav .nav-item.active { background:rgba(255,255,255,.14); color:white; }
.mirador-nav .nav-glyph { color:#e5b52d; }
.mirador-nav .compass-glyph { position:relative; display:block; width:17px; height:17px; border:1px solid #e5b52d; border-radius:50%; box-shadow:inset 0 0 0 2px rgba(229,181,45,.08),0 0 8px rgba(229,181,45,.12); }
.mirador-nav .compass-glyph::before { content:''; position:absolute; left:7px; top:2px; width:2px; height:11px; border-radius:2px; background:linear-gradient(to bottom,#f6d95f 0 48%,#7f95a2 48% 100%); transform:rotate(36deg); transform-origin:center; }
.mirador-nav .compass-glyph::after { content:''; position:absolute; left:6px; top:6px; width:3px; height:3px; border-radius:50%; background:#f6d95f; box-shadow:0 0 5px rgba(246,217,95,.65); }
.mirador-nav .compas-toggle { grid-template-columns:28px 1fr 18px; }
.compas-toggle::after { content:'+'; justify-self:end; color:#8fa0aa; font-size:15px; transition:transform .3s ease,color .3s ease; }
.compas-toggle[aria-expanded="true"]::after { color:#e5b52d; transform:rotate(45deg); }
.compas-menu { display:grid; gap:5px; max-height:0; margin-left:18px; overflow:hidden; opacity:0; transform:translateY(-8px); transition:max-height .5s cubic-bezier(.2,.72,.2,1),opacity .25s ease,transform .35s ease; }
.compas-menu.open { max-height:255px; padding-block:4px; opacity:1; transform:translateY(0); }
.mirador-nav.compas-expanded { gap:3px; }
.mirador-nav.compas-expanded > .nav-item,.mirador-nav.compas-expanded .compas-item { min-height:31px; }
.compas-item { display:grid; grid-template-columns:24px 1fr; align-items:center; gap:7px; min-height:38px; padding:0 10px; border:1px solid transparent; border-radius:8px; background:transparent; color:#9fb0ba; font:inherit; font-size:12px; text-align:left; cursor:pointer; transition:background .2s,border-color .2s,color .2s; }
.compas-item:hover,.compas-item:focus-visible,.compas-item.active { color:#f3f7f9; background:rgba(255,255,255,.055); border-color:rgba(229,181,45,.3); outline:none; }
.compas-item-glyph { color:#e5b52d; font-size:16px; text-align:center; }
.compas-item--admin { min-height:48px!important; border-top-color:rgba(229,181,45,.12); }
.compas-item--admin small { grid-column:2; margin-top:-8px; color:#7f7050; font-size:8px; letter-spacing:.08em; text-transform:uppercase; }
.orbit-switch::after { content:''; position:absolute; left:9px; right:9px; bottom:5px; height:1px; background:linear-gradient(90deg,#9c6cff,rgba(134,185,215,.65)); transform:scaleX(.15); transform-origin:left; transition:transform .45s ease; }
.orbit-switch:hover::after,.orbit-switch.active::after { transform:scaleX(1); }
.orbit-switch.active { background:linear-gradient(145deg,rgba(42,34,61,.98),rgba(19,25,38,.94)); border-color:rgba(183,145,255,.35); box-shadow:0 12px 35px rgba(62,28,112,.35); }
.orbit-icon { width:27px; height:27px; object-fit:contain; filter:drop-shadow(0 4px 9px rgba(143,92,239,.35)); }
.orbit-nav .nav-item.active { background:rgba(133,82,225,.18); border-color:rgba(173,132,246,.18); }
.orbit-nav .nav-glyph { color:#b990ff; }
.orbit-switch.active .switch-arrow { transform:rotate(180deg); }
.powered-by { position:absolute; z-index:6; left:17px; right:17px; bottom:15px; min-height:35px; display:flex; align-items:center; justify-content:center; gap:7px; color:#7f909a; font-size:10px; letter-spacing:.01em; }
.powered-brand { display:flex; align-items:center; gap:5px; color:#d5dde2; }
.powered-brand .brand-icon { width:20px; height:20px; border-radius:6px; }
.powered-brand strong { font-size:16px; font-weight:700; letter-spacing:-.04em; }
.powered-brand strong span { color:#9ba7ae; font-weight:400; }
.workspace-main { min-width:0; min-height:0; height:100%; display:grid; grid-template-rows:76px minmax(0,1fr); overflow:hidden; }
.topbar { position: relative; z-index: 3; display: flex; justify-content: space-between; align-items: center; padding: 0 28px 0 16px; background: var(--topbar); border-bottom: 1px solid var(--line); backdrop-filter: blur(20px); transition: background .35s; }
.topbar-left,.topbar-title { display:flex; align-items:center; }
.topbar-left { gap:18px; }
.topbar-title { gap:8px; }
.section-kicker { color: #728998; font-size: 12px; }
.topbar strong { text-transform: uppercase; letter-spacing: .18em; font-size: 10px; }
.nav-toggle { width:38px; height:38px; display:grid; place-content:center; gap:4px; padding:0; border:1px solid rgba(170,204,224,.13); border-radius:7px; background:rgba(255,255,255,.025); color:var(--ink); cursor:pointer; transition:background .25s,border-color .25s; }
.nav-toggle:hover,.nav-toggle:focus-visible { background:rgba(255,255,255,.07); border-color:rgba(170,204,224,.28); outline:none; }
.nav-toggle span { display:block; width:16px; height:1px; border-radius:2px; background:currentColor; }
.mobile-nav-close { display:none; }
.workspace.nav-collapsed .sidebar { padding-inline:10px; }
.workspace.nav-collapsed .side-brand > span:last-child,.workspace.nav-collapsed .nav-item > span:last-child,.workspace.nav-collapsed .mirador-name,.workspace.nav-collapsed .orbit-name,.workspace.nav-collapsed .switch-arrow { display:none; }
.workspace.nav-collapsed .side-brand { padding-inline:14px; }
.workspace.nav-collapsed .nav-item { grid-template-columns:1fr; place-items:center; }
.workspace.nav-collapsed .mirador-stack { left:10px; right:10px; }
.workspace.nav-collapsed .mirador-switch,.workspace.nav-collapsed .orbit-switch { grid-template-columns:1fr; place-items:center; padding-inline:0; }
.workspace.nav-collapsed .compas-menu { display:none; }
.workspace.nav-collapsed .sidebar.mirador-active .orbit-switch { left:10px; width:56px; }
.workspace.nav-collapsed .powered-by { left:10px; right:10px; bottom:12px; }
.workspace.nav-collapsed .powered-label,.workspace.nav-collapsed .powered-brand strong { display:none; }
.profile-button { --profile-ring:#8998a2; min-width:300px; height:58px; display:flex; align-items:center; gap:10px; padding:6px 15px 6px 7px; border:1px solid #aab7be; border-radius:999px; background:linear-gradient(180deg,#fff 0%,#f2f5f6 42%,#d0d7da 54%,#f6f8f8 100%); box-shadow:inset 0 2px 2px rgba(255,255,255,.93),inset 0 -2px 3px rgba(98,109,115,.22),0 0 0 3px color-mix(in srgb,var(--profile-ring) 55%,transparent),0 0 22px color-mix(in srgb,var(--profile-ring) 30%,transparent),0 3px 8px rgba(38,60,73,.19); color:#172e3d; text-align:left; cursor:pointer; transition:transform .15s,box-shadow .25s; }
.profile-button[data-space="cmsd"] { --profile-ring:#8c9aa3; }
.profile-button[data-space="mirador"] { --profile-ring:#e2b52f; }
.profile-button[data-space="orbit"] { --profile-ring:#a66bdb; }
.profile-button:hover { transform:translateY(-1px); box-shadow:inset 0 2px 2px #fff,inset 0 -2px 3px rgba(98,109,115,.19),0 0 0 3px color-mix(in srgb,var(--profile-ring) 78%,transparent),0 0 27px color-mix(in srgb,var(--profile-ring) 48%,transparent),0 5px 12px rgba(38,60,73,.22); }
.profile-button:focus-visible { outline:3px solid var(--profile-ring); outline-offset:5px; }
.profile-button .avatar { width:42px; height:42px; flex:0 0 42px; background:linear-gradient(180deg,#4d6270,#243d4c); color:white; font-size:10px; font-weight:800; }
.profile-button-copy { min-width:0; display:block; flex:1; }
.profile-button-copy strong,.profile-button-copy small { display:block; white-space:nowrap; }
.profile-button-copy strong { color:#172e3d; font-size:13px; }
.profile-button-copy small { margin-top:2px; color:#526b79; font-size:10px; font-weight:600; }
.profile-chevron { margin-left:auto; color:#405966; }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; color: #edf8fe; background: linear-gradient(145deg,#20384a,#0b1721); }
.home-canvas { position:relative; min-width:0; min-height:0; display:grid; grid-template-rows:auto minmax(0,1fr); gap:12px; overflow:hidden; padding:16px clamp(22px,2.6vw,42px) 14px; }
.iris-watermark { position: absolute; width: min(56vw, 740px); aspect-ratio: 1; right: -9%; bottom: -27%; border-radius: 50%; opacity: .13; pointer-events:none; background: url('assets/cmsd-eye.png') center/cover; filter: grayscale(.15) saturate(.75); mask-image: radial-gradient(circle, black 10%, transparent 66%); }
.welcome-block { position: relative; z-index: 1; }
.welcome-block h1 { margin:0 0 3px; color:#90a6b4; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.welcome-block h2 { margin:0 0 4px; font-size:clamp(25px,2.5vw,40px); font-weight:300; letter-spacing:-.05em; line-height:1.05; }
.welcome-block p { color:#8295a3; font-size:11px; }
.module-orbit { position:relative; z-index:2; width:100%; height:100%; min-width:0; min-height:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:10px; padding:10px; overflow:hidden; border:1px solid rgba(158,199,224,.1); border-radius:14px; background:linear-gradient(145deg,rgba(12,29,42,.3),rgba(44,78,99,.11)); box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
.module-orbit[data-count="8"] { grid-template-columns:repeat(4,minmax(0,1fr)); }
.module-orbit[data-count="10"] { grid-template-columns:repeat(5,minmax(0,1fr)); }
.module-card { min-width:0; min-height:0; height:auto; padding:14px 16px; overflow:hidden; display:flex; flex-direction:column; border:1px solid rgba(173,211,235,.12); border-radius:10px; background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.018)); backdrop-filter:blur(12px); text-align:left; color:var(--ink); cursor:pointer; transition:transform .25s,border-color .25s,background .25s; }
.module-card:hover { transform: translateY(-4px); border-color: rgba(163,210,239,.36); background: linear-gradient(145deg, rgba(128,180,212,.12), rgba(255,255,255,.025)); }
.module-head { min-width:0; display:grid; grid-template-columns:25px minmax(0,1fr) auto; align-items:center; gap:7px; }
.module-index { color:#6d8798; font-size:9px; letter-spacing:.14em; }
.module-card strong { min-width:0; overflow-wrap:anywhere; font-weight:500; font-size:12px; }
.module-status { display:flex; align-items:center; gap:5px; color:#8ebaa1; font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.module-status::before { content:''; width:6px; height:6px; border-radius:50%; background:#76c69a; box-shadow:0 0 9px rgba(118,198,154,.55); }
.module-card[data-state="warning"] .module-status { color:#ddbd65; }.module-card[data-state="warning"] .module-status::before { background:#e2b94d; box-shadow:0 0 9px rgba(226,185,77,.55); }
.module-card[data-state="error"] .module-status { color:#e28d86; }.module-card[data-state="error"] .module-status::before { background:#e36f65; box-shadow:0 0 9px rgba(227,111,101,.55); }
.mini-chart { height:23px; display:flex; align-items:flex-end; gap:3px; margin:10px 0 8px; padding-bottom:4px; border-bottom:1px solid rgba(164,200,222,.09); }
.mini-chart i { width:7px; height:var(--bar); border-radius:2px 2px 0 0; background:linear-gradient(180deg,color-mix(in srgb,var(--profile-accent,#80b5d3) 65%,#bfe8ff),rgba(85,139,171,.22)); opacity:.75; }
.metric-list { min-width:0; display:grid; gap:4px; margin-top:auto; }
.metric-row { min-width:0; display:flex; justify-content:space-between; gap:8px; color:#738896; font-size:8px; line-height:1.2; }
.metric-row span { min-width:0; overflow-wrap:anywhere; }
.metric-row b { flex:0 0 auto; color:#c8d6de; font-size:9px; font-weight:600; text-align:right; }
.metric-row.alert b { color:#e58c84; }.metric-row.progress b { color:#ddbd65; }

.compas-workspace { min-height:0; height:100%; margin-top:12px; overflow:hidden; border:1px solid rgba(229,181,45,.16); border-radius:12px; background:linear-gradient(145deg,rgba(14,28,38,.92),rgba(9,20,29,.76)); box-shadow:0 18px 55px rgba(0,0,0,.18); }
.compas-frame { display:block; width:100%; height:100%; min-height:600px; border:0; background:#08100d; }
.home-canvas.compas-active .compas-frame { min-height:0; }
.compas-view { min-height:100%; padding:24px; color:#dce8ee; }
.compas-view-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; }
.compas-view-head .eyebrow { color:#e5b52d; }
.compas-view-head h3 { margin:4px 0 5px; font-size:27px; font-weight:400; letter-spacing:-.03em; }
.compas-view-head p { margin:0; color:#7f95a3; font-size:11px; }
.compas-action,.compas-tool button { min-height:38px; padding:0 14px; border:1px solid rgba(229,181,45,.35); border-radius:7px; background:rgba(229,181,45,.09); color:#f2d568; cursor:pointer; font-size:10px; }
.compas-action:hover,.compas-tool button:hover { background:rgba(229,181,45,.17); }
.compas-period { display:flex; align-items:center; gap:10px; min-height:42px; margin-bottom:12px; padding:0 12px; border:1px solid rgba(255,255,255,.07); border-radius:8px; background:rgba(255,255,255,.025); color:#8ca1ad; font-size:10px; }
.compas-period b { margin-left:auto; color:#f2d568; font-size:12px; }
.compas-table { overflow:hidden; border:1px solid rgba(255,255,255,.07); border-radius:9px; }
.compas-row { display:grid; grid-template-columns:90px 1.2fr 1fr 1.5fr 100px; gap:10px; align-items:center; min-height:53px; padding:0 13px; border-top:1px solid rgba(255,255,255,.055); color:#9eafb9; font-size:10px; }
.compas-row:first-child { border-top:0; }.compas-row.head { min-height:35px; background:rgba(255,255,255,.035); color:#637b8a; font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.compas-row:not(.head) { cursor:pointer; }.compas-row:not(.head):hover,.compas-row.selected { background:rgba(229,181,45,.055); }
.compas-row b,.compas-row strong { color:#dbe7ed; font-weight:600; }.compas-row small { display:block; margin-top:3px; color:#607785; font-size:8px; }.compas-row > strong:last-child { color:#f1d05a; text-align:right; }
.compas-row.mileage { grid-template-columns:110px 1.5fr 75px 1.3fr 85px; }
.compas-inline-form { display:none; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:8px; margin:0 0 12px; padding:12px; border:1px solid rgba(229,181,45,.16); border-radius:8px; background:rgba(229,181,45,.035); }.compas-inline-form.open { display:grid; }
.compas-inline-form input,.compas-inline-form select,.compas-tool select { min-width:0; padding:9px; border:1px solid rgba(255,255,255,.1); border-radius:6px; background:#101f29; color:#cbd8df; font-size:9px; }
.compas-calendar-layout { display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:14px; }
.compas-calendar { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }.compas-day { min-height:66px; padding:8px; border:1px solid rgba(255,255,255,.07); border-radius:7px; background:rgba(255,255,255,.025); color:#7d929f; text-align:left; cursor:pointer; }.compas-day b { display:block; color:#cbd8de; }.compas-day span { display:block; margin-top:12px; color:#e5b52d; font-size:9px; }.compas-day.selected { border-color:rgba(229,181,45,.45); background:rgba(229,181,45,.09); }
.compas-summary { padding:16px; border:1px solid rgba(255,255,255,.07); border-radius:9px; background:rgba(255,255,255,.025); }.compas-summary > strong { display:block; margin:8px 0 4px; color:#f2d568; font-size:25px; font-weight:400; }.compas-summary p { margin:0 0 14px; color:#6f8491; font-size:9px; }.compas-summary div { display:flex; justify-content:space-between; padding:8px 0; border-top:1px solid rgba(255,255,255,.055); color:#91a4af; font-size:9px; }
.compas-tool { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; }.compas-tool label { display:grid; gap:5px; color:#8297a3; font-size:9px; }.compas-tool button { grid-column:1/-1; }
.compas-billing { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.7fr); gap:14px; }.billing-panel,.invoice-card { padding:16px; border:1px solid rgba(255,255,255,.07); border-radius:9px; background:rgba(255,255,255,.025); }.billing-filter { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:13px; }.billing-filter label { display:grid; gap:5px; color:#8297a3; font-size:9px; }.billing-filter select { padding:9px; border:1px solid rgba(255,255,255,.1); border-radius:6px; background:#101f29; color:#cbd8df; }
.billing-option { display:grid; grid-template-columns:20px 1fr auto; align-items:center; gap:9px; min-height:55px; border-top:1px solid rgba(255,255,255,.06); color:#a5b5be; font-size:10px; }.billing-option small { display:block; margin-top:3px; color:#617986; }.billing-option > b { color:#d9e5eb; }
.invoice-card small,.invoice-card span { color:#728895; font-size:9px; }.invoice-card > strong { display:block; margin:5px 0 18px; font-size:19px; }.invoice-total { display:flex; justify-content:space-between; padding:9px 0; border-top:1px solid rgba(255,255,255,.06); }.invoice-total.grand { margin-top:8px; color:#f2d568; font-size:15px; }.invoice-state { margin-top:16px; color:#8fa2ad; font-size:9px; }
.compas-record-dialog { width:min(600px,calc(100vw - 40px)); padding:0; border:1px solid rgba(229,181,45,.3); border-radius:12px; background:#0b1923; color:#dbe7ed; box-shadow:0 28px 90px rgba(0,0,0,.62); }.compas-record-dialog::backdrop { background:rgba(1,7,11,.7); backdrop-filter:blur(5px); }.compas-record-dialog form { padding:22px; }.dialog-head { display:flex; justify-content:space-between; align-items:flex-start; }.dialog-head h3 { margin:4px 0 0; font-size:24px; font-weight:400; }.dialog-head button { width:34px; height:34px; border:1px solid rgba(255,255,255,.12); border-radius:50%; background:transparent; color:#a9bac3; cursor:pointer; }.dialog-body { display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-top:18px; }.dialog-body label { display:grid; gap:5px; color:#7f95a3; font-size:9px; }.dialog-body label.wide { grid-column:1/-1; }.dialog-body input,.dialog-body select,.dialog-body textarea { width:100%; min-height:38px; padding:9px; border:1px solid rgba(255,255,255,.1); border-radius:6px; background:#111f29; color:#d5e2e8; }.dialog-body textarea { min-height:72px; resize:vertical; }.dialog-body input:disabled,.dialog-body select:disabled,.dialog-body textarea:disabled { opacity:.72; }.dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }.dialog-actions button { min-height:37px; padding:0 13px; border:1px solid rgba(255,255,255,.12); border-radius:6px; background:rgba(255,255,255,.04); color:#b7c7cf; cursor:pointer; }.dialog-actions #compasSaveRecord { border-color:rgba(229,181,45,.4); color:#f2d568; }

.profile-drawer { --profile-accent:#8c9aa3; position:absolute; z-index:10; top:0; right:0; width:min(720px,calc(100vw - 252px)); height:100%; padding:42px; overflow-y:auto; background:rgba(5,13,20,.96); border-left:1px solid var(--line); box-shadow:-35px 0 90px rgba(0,0,0,.4); backdrop-filter:blur(28px); transform:translateX(105%); transition:transform .65s cubic-bezier(.7,.05,.2,1); }
.profile-drawer[data-space="mirador"] { --profile-accent:#e2b52f; }
.profile-drawer[data-space="orbit"] { --profile-accent:#a66bdb; }
.profile-drawer.open { transform: translateX(0); }
.drawer-head { display: flex; align-items: flex-start; justify-content: space-between; }
.drawer-head h2 { font-size: 39px; font-weight: 300; letter-spacing: -.04em; }
.drawer-head button { position: static; }
.profile-session { margin-top:25px; padding:16px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015)); }
.profile-session__identity { display:flex; align-items:center; gap:12px; min-width:0; }
.profile-session__identity > span:last-child { min-width:0; display:grid; gap:2px; }
.profile-session__identity small { color:#718795; font-size:9px; text-transform:uppercase; letter-spacing:.16em; }
.profile-session__identity strong { overflow:hidden; color:var(--ink); font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.profile-session__identity span span { overflow:hidden; color:#718795; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.profile-session__avatar { width:38px; height:38px; flex:0 0 38px; }
.profile-session__actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:14px; }
.session-action { min-height:39px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 12px; border:1px solid rgba(164,207,233,.16); border-radius:6px; background:rgba(118,168,198,.07); color:#a9c1d0; cursor:pointer; font-size:10px; transition:border-color .2s,background .2s,color .2s,transform .2s; }
.session-action:hover,.session-action:focus-visible { border-color:rgba(164,207,233,.42); background:rgba(118,168,198,.13); color:#edf7fc; transform:translateY(-1px); outline:none; }
.session-action--signout { border-color:rgba(232,156,147,.16); background:rgba(160,75,67,.06); color:#cba29d; }
.session-action--signout:hover,.session-action--signout:focus-visible { border-color:rgba(232,156,147,.4); background:rgba(160,75,67,.13); color:#ffd6d1; }
.tabs { display:flex; gap:6px; margin:28px 0 0; border-bottom:1px solid var(--line); }
.tab { position:relative; padding:13px 20px; border:1px solid rgba(174,201,217,.16); border-bottom:0; border-radius:8px 8px 0 0; background:rgba(255,255,255,.035); color:#758997; cursor:pointer; font-size:12px; }
.tab.active { color: #e9f3f8; }
.tab.active { background:color-mix(in srgb,var(--profile-accent) 19%,rgba(255,255,255,.04)); border-color:color-mix(in srgb,var(--profile-accent) 55%,transparent); }
.tab.active::after { content:''; position:absolute; height:2px; left:0; right:0; bottom:-1px; background:var(--profile-accent); }
.profile-panel { padding:28px 2px; }
.profile-panel[hidden] { display:none; }
.profile-panel h3 { margin:0 0 8px; color:var(--ink); font-size:20px; font-weight:500; }
.profile-panel>p { margin:0 0 25px; color:#718795; font-size:12px; }
.profile-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.profile-fields label { display:grid; gap:7px; color:#8da0ad; font-size:11px; }
.profile-fields input,.profile-fields select { width:100%; padding:12px; border:1px solid rgba(169,204,225,.18); border-radius:7px; background:rgba(255,255,255,.035); color:var(--ink); }
.profile-fields input:focus { outline:2px solid var(--profile-accent); outline-offset:2px; }
.professional-company-tabs { display:flex; gap:7px; margin:0 0 18px; }
.professional-company { min-height:40px; padding:0 16px; border:1px solid rgba(229,181,45,.18); border-radius:999px; background:rgba(255,255,255,.025); color:#899ba6; cursor:pointer; font-size:11px; }
.professional-company.active { border-color:rgba(229,181,45,.5); background:rgba(229,181,45,.09); color:#f2d568; }
.professional-check { align-content:center; grid-template-columns:22px 1fr!important; min-height:68px; padding:0 13px; border:1px solid rgba(169,204,225,.18); border-radius:7px; background:rgba(255,255,255,.025); }
.professional-check input { width:18px!important; padding:0!important; accent-color:#e5b52d; }
.professional-contract { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:18px; padding:16px; border:1px solid rgba(229,181,45,.16); border-radius:9px; background:rgba(229,181,45,.035); }
.professional-contract span { min-width:0; display:grid; gap:4px; }.professional-contract strong { font-size:12px; }.professional-contract small { color:#718795; font-size:9px; }
.professional-contract button { min-height:38px; padding:0 14px; border:1px solid rgba(229,181,45,.35); border-radius:7px; background:rgba(229,181,45,.08); color:#f2d568; cursor:pointer; font-size:10px; }
.mobile-nav-backdrop { display:none; }
.connectivity-list { display:grid; gap:10px; }
.connectivity-list>div { display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; padding:15px; border:1px solid rgba(169,204,225,.13); border-radius:9px; background:rgba(255,255,255,.025); }
.connection-mark { width:38px; height:38px; display:grid; place-items:center; border-radius:9px; background:color-mix(in srgb,var(--profile-accent) 25%,#172631); color:#eef8fc; font-size:11px; font-weight:700; }
.connectivity-list strong,.connectivity-list small { display:block; }
.connectivity-list strong { font-size:12px; }.connectivity-list small { margin-top:3px; color:#718795; font-size:9px; }
.connection-state { color:var(--profile-accent); font-size:10px; }.connection-state.muted { color:#718795; }
.settings-grid { display: grid; gap: 8px; }
.setting-row { min-height: 96px; display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: rgba(255,255,255,.025); }
.setting-row strong { display: block; font-size: 13px; font-weight: 500; }
.setting-row small { display: block; margin-top: 5px; color: #667d8c; font-size: 10px; }
.swatches { display: flex; gap: 9px; }
.swatch { width: 31px; height: 31px; border: 2px solid transparent; border-radius: 50%; background: #08141e; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); }
.swatch.selected { border-color: #c6e5f5; box-shadow: 0 0 0 3px rgba(153,204,234,.13); }
.swatch.pearl { background: #edf1f2; }.swatch.iris { background: #567e9d; }.swatch.glass { background: linear-gradient(145deg,#1d3343,#02070c); }

body[data-theme="pearl"] { --ink:#172530; --muted:#60727e; --line:rgba(18,42,57,.12); --deep:#eef2f3; --glass:rgba(255,255,255,.76); color-scheme:light; }
body[data-theme="pearl"] .workspace { background: radial-gradient(circle at 67% 70%, rgba(88,143,176,.14), transparent 40%), #edf1f2; }
body[data-theme="pearl"] .profile-drawer { background: rgba(244,247,248,.97); }
body[data-theme="pearl"] .profile-session { border-color:rgba(18,42,57,.1); background:rgba(255,255,255,.55); }
body[data-theme="pearl"] .session-action { color:#4f6979; }
body[data-theme="pearl"] .session-action:hover,body[data-theme="pearl"] .session-action:focus-visible { color:#172530; }
body[data-theme="pearl"] .module-card { background: rgba(255,255,255,.58); }
body[data-theme="iris"] .workspace { background: radial-gradient(circle at 65% 70%, rgba(157,205,233,.22), transparent 40%), #10283a; }
body[data-sidebar="pearl"] { --sidebar:#edf1f2; } body[data-sidebar="pearl"] .side-brand, body[data-sidebar="pearl"] .nav-item.active { color:#14242f; }
body[data-sidebar="iris"] { --sidebar:#345c78; }
body[data-topbar="pearl"] { --topbar:rgba(241,245,247,.91); } body[data-topbar="pearl"] .topbar { color:#172530; }
body[data-topbar="iris"] { --topbar:rgba(51,86,111,.9); }

@keyframes breathe { 0%,100% { opacity:.25; transform:scaleX(.88); } 50% { opacity:.9; transform:scaleX(1); } }
@media (max-width: 1450px) and (min-width: 1101px) { .module-orbit[data-count="10"] { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(0,1fr)); } }
@media (max-width: 1100px) and (min-width: 851px) { .home-canvas { display:block; overflow-x:hidden; overflow-y:auto; }.module-orbit,.module-orbit[data-count="8"],.module-orbit[data-count="10"] { height:auto; margin-top:14px; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto; }.module-card { height:185px; }.compas-workspace { height:auto; min-height:620px; }.compas-row,.compas-row.mileage { grid-template-columns:90px 1.2fr 1fr 90px; }.compas-row > :nth-child(4) { display:none; } }
@media (max-width: 850px) {
  .module-orbit,.module-orbit[data-count="8"],.module-orbit[data-count="10"] { height:auto; margin-top:14px; grid-template-columns:1fr; grid-template-rows:auto; }.home-canvas { display:block; padding:24px 20px; overflow-x:hidden; overflow-y:auto; }.module-card { height:auto; min-height:175px; }
  .compas-workspace { height:auto; min-height:620px; }.compas-view { padding:16px; }.compas-view-head { display:grid; }.compas-row,.compas-row.mileage { grid-template-columns:76px 1fr 80px; }.compas-row > :nth-child(3),.compas-row > :nth-child(4) { display:none; }.compas-inline-form { grid-template-columns:1fr; }.compas-calendar-layout,.compas-billing { grid-template-columns:1fr; }.compas-calendar { grid-template-columns:repeat(4,1fr); }.billing-filter { grid-template-columns:1fr; }
  .profile-button { min-width:58px; width:58px; padding:7px; }
  .profile-button > span:not(.avatar) { display:none; }.profile-drawer { width:calc(100vw - 76px); }
  .profile-session__actions { grid-template-columns:1fr; }
  .profile-fields { grid-template-columns:1fr; }
}

/* Audit mobile : navigation en tiroir, zones tactiles et contenu sans débordement. */
@media (max-width:850px) {
  html,body { min-height:100%; min-height:100dvh; }
  .portal { overflow:clip; }
  .workspace,.workspace.nav-collapsed { grid-template-columns:minmax(0,1fr); }
  .sidebar { position:fixed; z-index:22; inset:0 auto 0 0; width:min(84vw,320px); padding:18px 17px max(16px,env(safe-area-inset-bottom)); transform:translateX(0); box-shadow:28px 0 70px rgba(0,0,0,.46); transition:transform .36s cubic-bezier(.2,.75,.2,1),background .35s; }
  #cmsdNav { flex:1 1 auto; min-height:0; max-height:none; margin-bottom:8px; padding-bottom:12px; scroll-padding-bottom:12px; }
  .sidebar.mirador-active #cmsdNav,.sidebar.orbit-active #cmsdNav { display:none; }
  .mirador-stack { position:relative; inset:auto; display:flex; flex:0 0 auto; flex-direction:column; min-height:0; margin-top:auto; padding-bottom:48px; background:transparent; box-shadow:none; transform:none; transition:none; }
  .sidebar.mirador-active .mirador-stack,.sidebar.orbit-active .mirador-stack { top:auto; flex:1 1 auto; margin-top:0; }
  .sidebar.mirador-active .orbit-switch { position:relative; left:auto; bottom:auto; width:100%; }
  .sidebar.mirador-active:not(.space-transitioning) .mirador-nav,.sidebar.orbit-active:not(.space-transitioning) .orbit-nav { flex:1 1 auto; min-height:0; max-height:none; overflow-y:auto; }
  .mobile-nav-close { position:absolute; z-index:2; top:25px; right:24px; display:grid; width:44px; height:44px; background:rgba(7,19,29,.88); }
  .workspace.nav-collapsed .sidebar { padding-inline:17px; transform:translateX(-105%); }
  .workspace.nav-collapsed .side-brand>span:last-child,.workspace.nav-collapsed .nav-item>span:last-child,.workspace.nav-collapsed .mirador-name,.workspace.nav-collapsed .orbit-name,.workspace.nav-collapsed .switch-arrow { display:initial; }
  .workspace.nav-collapsed .side-brand { padding-inline:9px; }.workspace.nav-collapsed .nav-item { grid-template-columns:28px 1fr; place-items:initial; }
  .workspace.nav-collapsed .mirador-stack { left:17px; right:17px; }.workspace.nav-collapsed .mirador-switch,.workspace.nav-collapsed .orbit-switch { grid-template-columns:26px 1fr 18px; place-items:initial; padding-inline:9px; }
  .workspace.nav-collapsed .compas-menu { display:grid; }.workspace.nav-collapsed .powered-label,.workspace.nav-collapsed .powered-brand strong { display:inline; }
  .workspace.nav-collapsed .powered-by { left:17px; right:17px; }
  .sidebar.mirador-active .orbit-switch { left:auto; width:100%; }
  .mobile-nav-backdrop { position:fixed; z-index:21; inset:0; display:block; border:0; background:rgba(0,5,9,.67); backdrop-filter:blur(3px); }
  .mobile-nav-backdrop[hidden] { display:none; }
  .workspace-main { grid-template-rows:64px minmax(0,1fr); }
  .topbar { padding:0 12px; }
  .topbar-left { gap:10px; }.nav-toggle { width:44px; height:44px; }
  .section-kicker { display:none; }.topbar-title strong { font-size:9px; letter-spacing:.12em; }
  .profile-button { min-width:50px; width:50px; height:50px; padding:4px; }
  .profile-button .avatar { width:40px; height:40px; flex-basis:40px; }.profile-button>span:not(.avatar) { display:none; }
  .home-canvas { padding:14px 12px 18px; gap:9px; }
  .home-canvas.compas-active { display:grid; grid-template-rows:auto minmax(0,1fr); overflow:hidden; }
  .home-canvas.compas-active .compas-workspace { height:auto; min-height:0; margin-top:0; }
  .iris-watermark { width:min(85vw,580px); right:-16%; bottom:0; }
  .welcome-block h1 { font-size:10px; }.welcome-block h2 { font-size:clamp(25px,8vw,34px); }.welcome-block p { margin-bottom:8px; }
  .module-card { min-height:138px; padding:14px; }.module-status { font-size:9px; }.metric-row { font-size:11px; }.metric-row b { font-size:11px; }
  .compas-workspace { min-height:0; height:100%; margin-top:8px; border-radius:9px; overflow:hidden; }
  .compas-frame { min-height:100%; }
  .profile-drawer { z-index:30; width:100vw; max-width:none; padding:24px max(16px,env(safe-area-inset-right)) 30px max(16px,env(safe-area-inset-left)); }
  .drawer-head h2 { margin-right:12px; font-size:30px; }.drawer-head button { width:40px; height:40px; flex:0 0 40px; }
  .tabs { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; }.tabs::-webkit-scrollbar { display:none; }.tab { flex:0 0 auto; min-height:44px; padding:12px 15px; }
  .profile-panel { padding-top:22px; }.setting-row { min-height:86px; }
  .compas-record-dialog { max-height:calc(100dvh - 24px); overflow:auto; }.dialog-body { grid-template-columns:1fr; }.dialog-body label.wide { grid-column:auto; }
  .dialog-actions { position:sticky; bottom:0; padding-top:10px; background:#0b1923; }.dialog-actions button { min-height:44px; }
  #cmsdNav .nav-item,.mirador-nav .nav-item,.orbit-nav .nav-item,.mirador-nav.compas-expanded > .nav-item,.mirador-nav.compas-expanded .compas-item,.compas-item { min-height:44px!important; }
  .auth-panel { width:100%; max-width:none; height:100dvh; overflow-y:auto; overscroll-behavior:contain; padding:78px 22px max(24px,env(safe-area-inset-bottom)); border-left:0; }
  .close-panel { right:18px; top:18px; }.auth-copy { margin-bottom:30px; }.auth-copy h1 { font-size:48px; }.brand-mark { top:22px; left:22px; }
}
@media (max-width:850px) and (max-height:520px) and (orientation:landscape) {
  .sidebar { padding-top:10px; }
  .side-brand { min-height:50px; margin-bottom:8px; }
  .mobile-nav-close { top:13px; }
  .workspace-main { grid-template-rows:56px minmax(0,1fr); }
  .home-canvas { padding-top:8px; }
  .home-canvas.compas-active .welcome-block { display:none; }
  .auth-panel { padding-top:58px; }
  .auth-copy { margin-bottom:18px; }
  .auth-copy h1 { margin-bottom:12px; font-size:38px; }
  .auth-copy p { line-height:1.45; }
}
@media (min-width:600px) and (max-width:850px) {
  .module-orbit,.module-orbit[data-count="8"],.module-orbit[data-count="10"] { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  .professional-company-tabs { overflow-x:auto; }.professional-contract,.setting-row { align-items:flex-start; flex-direction:column; }.professional-contract button { width:100%; }
  .connectivity-list>div { grid-template-columns:38px 1fr; }.connection-state { grid-column:2; }
  .entry-cue { width:calc(100% - 32px); text-align:center; }.brand-context { display:none; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }