/* ServiceDesk: tokens, controls, shell, catalogs, dialogs, feedback, responsive. */
:root, html[data-theme="light"] {
 color-scheme:light; --font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
 --bg:#f5f7fb; --surface:#fff; --surface-raised:#f8fafc; --field:#fff;
 --text:#18263b; --muted:#61718a; --border:#dce3ee; --border-strong:#bcc9db;
 --brand:#1672d4; --brand-dark:#145fb1; --brand-hover:#105db5; --on-brand:#fff;
 --brand-soft:#eaf3ff; --accent:#986014; --teal:#147767; --danger:#bc344a;
 --danger-fill:#b4233b; --danger-hover:#961c30; --on-danger:#fff;
 --sidebar-bg:#fff; --sidebar-text:#43516a; --sidebar-muted:#718097;
 --radius:12px; --shadow:0 2px 6px rgb(24 38 59 / 3%);
 --overlay-shadow:0 16px 48px rgb(18 35 58 / 16%); --sidebar-width:256px;
 --focus:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent);
}
html[data-theme="dark"] {
 color-scheme:dark; --bg:#0e1521; --surface:#162131; --surface-raised:#1b293c; --field:#121d2c;
 --text:#e4ecf7; --muted:#a0aec3; --border:#2a394f; --border-strong:#465b76;
 --brand:#80baff; --brand-dark:#a5ceff; --brand-hover:#a1ccff; --on-brand:#0c2545;
 --brand-soft:#203a59; --accent:#e5b367; --teal:#6ed4b5; --danger:#ff91a1;
 --danger-fill:#ff91a1; --danger-hover:#ffb0bb; --on-danger:#381019;
 --sidebar-bg:#121c2b; --sidebar-text:#b4c1d4; --sidebar-muted:#8193ad;
 --shadow:0 2px 6px rgb(0 0 0 / 8%); --overlay-shadow:0 20px 60px rgb(0 0 0 / 35%);
}
*,*::before,*::after { box-sizing:border-box; }
html { font:400 14px/1.5 var(--font-family); scrollbar-gutter:stable; }
body { margin:0; background:var(--bg); color:var(--text); font:inherit; transition:background-color 160ms,color 160ms; }
button,input,select,textarea { font:inherit; }
h1,h2,h3,h4 { color:var(--text); font-weight:650; line-height:1.3; }
h1 { font-size:clamp(25px,2.4vw,32px); letter-spacing:-.7px; margin:0 0 20px; }
h2 { font-size:23px; letter-spacing:-.4px; margin:0 0 18px; }
h3 { font-size:16px; margin:0 0 14px; }
p { margin:8px 0 16px; }
small { display:block; color:var(--muted); font-size:12px; margin:3px 0; }
strong { font-weight:650; }
code,pre { font-family:Consolas,monospace; font-size:12px; overflow-wrap:anywhere; }
code { color:var(--muted); }
a,a:visited { color:var(--brand-dark); text-decoration-color:color-mix(in srgb,currentColor 40%,transparent); text-underline-offset:3px; }
a:hover { text-decoration-color:currentColor; }
button { cursor:pointer; }
button:disabled,input:disabled,select:disabled,textarea:disabled { cursor:not-allowed; opacity:.5; }
button[aria-busy="true"] { cursor:progress; opacity:.85; }
:is(button,a,input,textarea,select,summary,[tabindex]):focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
::selection { background:var(--brand-soft); color:var(--text); }
.muted { color:var(--muted); } .error,.danger-text { color:var(--danger); }
.preserve-lines { white-space:pre-wrap; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.app-icon { width:19px; height:19px; flex:0 0 19px; vertical-align:middle; }
.skip-link { position:fixed; z-index:500; top:-100px; left:16px; padding:12px 20px; background:var(--surface); border-radius:8px; }
.skip-link:focus { top:12px; }

/* Controls. Busy states do not change dimensions. */
.button,.tab,.catalog-create-button,.company-card,.icon-button,.theme-toggle,.sidebar-toggle { position:relative; font:600 13px/1.35 var(--font-family); transition:background-color 140ms,border-color 140ms,color 140ms,box-shadow 140ms,opacity 140ms; }
.button,.catalog-create-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; max-width:100%; padding:9px 16px; border:1px solid transparent; border-radius:8px; background:var(--brand); color:var(--on-brand); text-align:center; text-decoration:none; }
a.button:visited { color:var(--on-brand); }
.button:hover:not(:disabled),.catalog-create-button:hover:not(:disabled) { background:var(--brand-hover); }
.button.secondary,a.button.secondary:visited { background:var(--surface); border-color:var(--border); color:var(--text); }
.button.secondary:hover:not(:disabled) { background:var(--surface-raised); border-color:var(--border-strong); }
.button:active:not(:disabled),.icon-button:active:not(:disabled) { transform:scale(.98); }
.button-label { display:inline-flex; align-items:center; justify-content:inherit; gap:8px; min-width:0; }
.button-busy>.button-label { opacity:.25; }
.button-spinner { position:absolute; left:calc(50% - 8px); top:calc(50% - 8px); }
.button.danger-outline { color:var(--danger); background:transparent; border-color:color-mix(in srgb,var(--danger) 45%,var(--border)); }
.button.danger-outline:hover:not(:disabled) { color:var(--danger); background:color-mix(in srgb,var(--danger) 10%,var(--surface)); border-color:var(--danger); }
.button.danger-button { color:var(--on-danger); background:var(--danger-fill); }
.button.danger-button:hover:not(:disabled) { color:var(--on-danger); background:var(--danger-hover); }
.icon-button,.theme-toggle,.sidebar-toggle { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:38px; height:38px; min-height:38px; padding:0; border:1px solid var(--border); border-radius:8px; color:var(--muted); background:var(--surface); font-size:21px; line-height:1; }
.icon-button:hover,.theme-toggle:hover,.sidebar-toggle:hover { color:var(--brand-dark); background:var(--brand-soft); border-color:var(--border-strong); }
html[data-theme="light"] .theme-moon,html[data-theme="dark"] .theme-sun { display:none; }
label { color:var(--muted); font-size:12px; font-weight:600; }
input,select,textarea { width:100%; min-width:0; min-height:40px; margin:6px 0 12px; padding:9px 12px; border:1px solid var(--border); border-radius:8px; color:var(--text); background:var(--field); font:400 14px/1.45 var(--font-family); transition:border-color 140ms,box-shadow 140ms; }
input:hover,select:hover,textarea:hover { border-color:var(--border-strong); }
input:focus,select:focus,textarea:focus { border-color:var(--brand); outline:none; box-shadow:var(--focus); }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:.8; }
textarea { min-height:104px; resize:vertical; }
input[type="checkbox"],input[type="radio"] { width:17px; height:17px; min-height:17px; flex:0 0 17px; margin:0; accent-color:var(--brand); cursor:pointer; }
input[type="file"] { padding:6px; }
input::file-selector-button { border:0; border-radius:5px; background:var(--brand-soft); color:var(--brand-dark); padding:7px 12px; margin-right:10px; font:inherit; cursor:pointer; }
select { cursor:pointer; }
option { color:var(--text); background:var(--field); font:400 14px/1.5 var(--font-family); }
/* Keep native semantics and a native fallback on engines without base-select. */
@supports (appearance:base-select) {
 select:not([multiple]):not([size]),select:not([multiple]):not([size])::picker(select) { appearance:base-select; }
 select:not([multiple]):not([size]) { display:flex; align-items:center; gap:12px; }
 select::picker-icon { color:var(--muted); transition:rotate 160ms; margin-inline-start:auto; }
 select:open::picker-icon { rotate:180deg; }
 select::picker(select) { border:1px solid var(--border-strong); border-radius:10px; padding:5px; margin-block:5px; background:var(--surface); box-shadow:var(--overlay-shadow); max-height:min(320px,55dvh); overflow:auto; color:var(--text); font:400 14px/1.5 var(--font-family); }
 select option { padding:9px 12px; min-height:38px; border-radius:6px; cursor:pointer; background:transparent; color:var(--text); white-space:normal; }
 select option:hover,select option:focus-visible { background:var(--surface-raised); outline:none; }
 select option:checked { background:var(--brand-soft); color:var(--brand-dark); font-weight:600; }
 select option:disabled { opacity:.5; cursor:not-allowed; }
 select option::checkmark { color:var(--brand-dark); margin-inline-end:10px; }
}

/* Application shell. */
.shell { display:grid; grid-template-columns:var(--sidebar-width) minmax(0,1fr); min-height:100dvh; }
.shell>.sidebar { grid-column:1; grid-row:1; position:sticky; top:0; height:100dvh; overflow-y:auto; padding:22px 12px; border-right:1px solid var(--border); background:var(--sidebar-bg); color:var(--sidebar-text); scrollbar-width:thin; }
.brand { display:flex; align-items:center; gap:10px; padding:0 42px 0 4px; margin:0 0 30px; min-height:40px; color:var(--text); font-size:17px; line-height:1.2; font-weight:700; letter-spacing:-.4px; overflow-wrap:anywhere; }
.brand-symbol { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; flex:0 0 34px; border-radius:10px; background:var(--brand); color:var(--on-brand); }
.sidebar nav { display:grid; gap:3px; }
.sidebar .menu-title { color:var(--sidebar-muted); text-transform:uppercase; letter-spacing:.09em; font-size:10px; font-weight:700; padding:18px 12px 5px; }
.sidebar a,.sidebar a:visited { display:flex; align-items:center; gap:11px; min-height:40px; padding:10px 12px; border-radius:7px; text-decoration:none; color:var(--sidebar-text); font-size:13px; line-height:1.35; transition:background-color 140ms,color 140ms; }
.sidebar a:hover { color:var(--text); background:var(--surface-raised); }
.sidebar a.active { color:var(--brand-dark); background:var(--brand-soft); font-weight:600; }
.sidebar a .app-icon { opacity:.85; width:18px; height:18px; }
.sidebar-toggle { position:fixed; top:20px; left:calc(var(--sidebar-width) - 49px); z-index:32; border-color:transparent; background:transparent; }
.sidebar-scrim { display:none; }
.shell>main { grid-column:2; grid-row:1; min-width:0; padding:0 30px 32px; }
.shell>main>header { display:flex; align-items:center; justify-content:flex-end; gap:10px; height:78px; margin-bottom:14px; }
.content { display:grid; gap:22px; min-width:0; width:100%; outline:none; }
.content>* { min-width:0; animation:page-enter 170ms ease-out; }
html[data-sidebar="closed"] .shell,.shell-anonymous,html[data-sidebar="closed"] .shell-anonymous { grid-template-columns:minmax(0,1fr); }
html[data-sidebar="closed"] .shell>.sidebar { display:none; }
html[data-sidebar="closed"] .shell>main,.shell-anonymous>main { grid-column:1; }
html[data-sidebar="closed"] .sidebar-toggle { left:22px; background:var(--surface); border-color:var(--border); }
html[data-sidebar="closed"] .shell>main>header { padding-left:45px; }
.language-selector { display:inline-flex; gap:2px; padding:3px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.language-selector a,.language-selector a:visited { padding:6px 8px; border-radius:5px; color:var(--muted); text-decoration:none; font-size:11px; font-weight:600; }
.language-selector a:hover,.language-selector a[aria-current="true"] { color:var(--brand-dark); background:var(--brand-soft); }
.user-pill,a.user-pill:visited { display:inline-flex; align-items:center; gap:8px; max-width:220px; padding:8px 10px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--text); border-radius:8px; text-decoration:none; font-size:13px; }
.user-pill:hover { background:var(--surface-raised); }
.logout-form { margin:0; }
.logout-form .button { background:transparent; border-color:var(--border); color:var(--muted); }
.logout-form .button:hover { background:var(--surface); color:var(--text); }

/* Catalog surfaces and data. */
.card { padding:22px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); min-width:0; }
.catalog-view { display:flex; flex-direction:column; gap:20px; width:100%; min-width:0; }
.catalog-toolbar,.workspace-header,.section-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 16px; }
.catalog-toolbar { min-height:40px; }
.catalog-toolbar h2,.section-heading h3,.section-heading h4,.workspace-header h2 { margin:0; }
.section-heading { margin-bottom:16px; }
.section-heading>button,.section-heading>.catalog-actions,.catalog-toolbar>button,.catalog-toolbar>.catalog-actions { flex-shrink:0; margin-inline-start:auto; }
.catalog-section { margin-top:24px; }
.catalog-section+.catalog-section { padding-top:24px; border-top:1px solid var(--border); }
.catalog-toolbar>:first-child,.section-heading>:first-child { min-width:0; overflow-wrap:anywhere; }
.catalog-toolbar h2 { font-size:clamp(22px,2vw,28px); }
.catalog-toolbar p { margin:6px 0 0; }
.card>.section-heading { margin-bottom:18px; flex-wrap:wrap; }
.catalog-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.catalog-actions>.button { flex-shrink:0; }
.catalog-filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; }
.catalog-filters>label { flex:1 1 160px; margin:0; }
.catalog-filters :is(input,select) { margin:6px 0 0; }
.catalog-filters .check-item { flex:0 1 auto; min-height:40px; }
.card>.catalog-filters { margin-bottom:16px; }
.catalog-filter { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.catalog-filter input { margin:6px 0 0; max-width:580px; }
.filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr)); gap:12px; }
.filter-grid :is(input,select) { margin-bottom:0; }
.filter-grid>label { min-width:0; }
.tabs { display:flex; gap:4px; padding:4px; background:var(--surface); border:1px solid var(--border); border-radius:9px; overflow-x:auto; scrollbar-width:thin; }
.tab { flex:0 0 auto; min-height:36px; white-space:nowrap; padding:9px 14px; border:0; border-radius:6px; color:var(--muted); background:transparent; }
.tab:hover { color:var(--text); background:var(--surface-raised); }
.tab.active { background:var(--brand-soft); color:var(--brand-dark); }
.table-scroll { width:100%; max-width:100%; overflow:auto; border:1px solid var(--border); border-radius:9px; overscroll-behavior-inline:contain; scrollbar-width:thin; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th,td { text-align:left; padding:13px 16px; border-bottom:1px solid var(--border); vertical-align:middle; }
th { background:var(--surface-raised); color:var(--muted); font-size:11px; font-weight:600; white-space:nowrap; }
td { overflow-wrap:anywhere; }
tr:last-child td { border-bottom:0; } tbody tr:hover { background:var(--surface-raised); }
.table-scroll table { min-width:640px; }
.table-scroll .user-table { min-width:880px; }
.user-table td:nth-child(1) { min-width:180px; } .user-table td:nth-child(2) { min-width:220px; }
.clickable-row { cursor:pointer; } .table-scroll .organization-table { min-width:890px; } .table-scroll .ticket-table { min-width:1030px; }
.ticket-table td:last-child { width:1%; white-space:nowrap; }
.table-scroll td .button { overflow-wrap:normal; white-space:nowrap; }
.organization-name { font-weight:600; text-decoration:none; }
.pagination { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; margin-top:18px; color:var(--muted); font-size:12px; }
.catalog-empty { display:grid; place-items:center; min-height:144px; padding:28px; color:var(--muted); text-align:center; font-size:13px; }
.chip,.status-badge { display:inline-flex; align-items:center; align-self:center; width:fit-content; gap:5px; padding:4px 9px; border-radius:5px; font-size:11px; line-height:1.35; font-weight:600; white-space:nowrap; color:var(--brand-dark); background:var(--brand-soft); }
.status-active { color:var(--teal); background:color-mix(in srgb,var(--teal) 12%,var(--surface)); }
.status-blocked { color:var(--danger); background:color-mix(in srgb,var(--danger) 12%,var(--surface)); }
.status-inactive { color:var(--muted); background:var(--surface-raised); }
.notice { padding:12px 16px; border-radius:8px; border:1px solid var(--border); margin:0; background:var(--surface-raised); color:var(--muted); }
.notice-success { color:var(--teal); border-color:color-mix(in srgb,var(--teal) 35%,var(--border)); background:color-mix(in srgb,var(--teal) 7%,var(--surface)); }
.notice-error { color:var(--danger); border-color:color-mix(in srgb,var(--danger) 35%,var(--border)); background:color-mix(in srgb,var(--danger) 7%,var(--surface)); }
.notice-warning { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 35%,var(--border)); background:color-mix(in srgb,var(--accent) 7%,var(--surface)); }
.list-card,.permission-row,.metric-row,.diagnostic-row,.setting-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 0; border-bottom:1px solid var(--border); min-width:0; }
.list-card { flex-wrap:wrap; padding:16px 12px; border-radius:8px; } a.list-card,a.list-card:visited { color:var(--text); text-decoration:none; }
.list-card>div:first-child:not(.catalog-actions) { flex:1 1 220px; overflow-wrap:anywhere; }
.list-card>div>p { margin:5px 0 0; color:var(--muted); } a.list-card:hover { background:var(--surface-raised); }
.list-card>.catalog-actions { margin-inline-start:auto; justify-content:flex-end; }
.record-heading { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.table-actions { min-width:200px; }
.permission-row { flex-wrap:wrap; }
.permission-row>span:first-child { flex:1 1 220px; min-width:0; overflow-wrap:anywhere; }
.permission-row>.catalog-actions { margin-inline-start:auto; }
.list-card>div,.setting-row>div { min-width:0; } .list-card.unread { border-left:3px solid var(--brand); }
.company-card { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:14px; margin-bottom:8px; border:1px solid var(--border); border-radius:8px; color:var(--text); background:var(--surface); text-align:left; }
.company-card.selected,.company-card:hover { background:var(--brand-soft); border-color:var(--brand); }
.diagnostic-row>strong,.setting-row>span { overflow-wrap:anywhere; min-width:0; } .setting-row input { margin:0; }
.token-value { display:block; margin-top:10px; user-select:all; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr)); gap:14px; }
.grid.two-col { grid-template-columns:repeat(2,minmax(0,1fr)); } .catalog-view .grid.two-col { grid-template-columns:minmax(0,1fr); }
.kpi { padding:16px; border:1px solid var(--border); border-radius:10px; background:var(--surface-raised); }
.kpi span { display:block; color:var(--muted); font-size:12px; } .kpi strong { display:block; font-size:27px; letter-spacing:-.5px; margin-top:8px; }
.dashboard-sections { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); gap:18px; }
.resource-meter { padding:14px 0; border-bottom:1px solid var(--border); }
.resource-meter>div { display:flex; justify-content:space-between; gap:12px; margin-bottom:10px; }
.resource-meter progress { width:100%; height:6px; accent-color:var(--brand); }
.list { padding-left:20px; margin:0; } .list li { margin:8px 0; }
.home-welcome { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0; border:0; box-shadow:none; background:transparent; }
.home-welcome h1 { margin:0; }
.home-launch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:start; }
.home-launch-grid h2 { font-size:15px; margin-bottom:18px; letter-spacing:0; }
.home-links { display:grid; gap:5px; }
.home-links a,.home-links a:visited { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; min-height:46px; border:1px solid transparent; border-radius:8px; color:var(--text); background:var(--surface-raised); text-decoration:none; font-weight:500; transition:background-color 140ms,border-color 140ms; }
.home-links a:hover { border-color:var(--border); color:var(--brand-dark); background:var(--brand-soft); }
.home-links .app-icon { width:16px; height:16px; color:var(--muted); }
.queue-shortcuts { display:flex; flex-wrap:wrap; gap:8px; }
.queue-shortcuts [aria-pressed="true"] { color:var(--brand-dark); border-color:var(--brand); background:var(--brand-soft); }
.organization-activity { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.organization-picker { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:12px; }
.breadcrumb { display:inline-flex; margin-bottom:12px; font-size:12px; text-decoration:none; }
.detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; margin:18px 0; }
.detail-grid>div { padding:16px 0; border-bottom:1px solid var(--border); min-width:0; }
.detail-grid dt { color:var(--muted); font-size:12px; margin-bottom:6px; } .detail-grid dd { margin:0; overflow-wrap:anywhere; }
.profile-heading { display:flex; align-items:center; gap:20px; }
.profile-photo { width:88px; height:88px; flex:0 0 88px; border-radius:24px; object-fit:cover; border:1px solid var(--border); }
.profile-initials { display:grid; place-items:center; font-size:26px; color:var(--brand-dark); background:var(--brand-soft); }

/* Object dialogs and editor controls. */
.object-dialog-backdrop { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; background:rgb(5 15 30 / 55%); animation:fade-in 140ms ease; }
.object-dialog { width:min(860px,100%); max-height:calc(100dvh - 48px); overflow:auto; overscroll-behavior:contain; border:1px solid var(--border); border-radius:16px; padding:26px; background:var(--surface); box-shadow:var(--overlay-shadow); animation:dialog-enter 180ms ease; }
.object-dialog>.section-heading { margin-bottom:22px; flex-wrap:nowrap; align-items:flex-start; }
.object-dialog>.catalog-filters { margin-bottom:20px; }
.object-dialog>.notice { margin-bottom:14px; }
.token-scopes legend { padding-inline:6px; color:var(--text); font-weight:600; }
.token-scopes .chip { margin-left:6px; }
.token-scopes .check-grid { margin:0; }
.product-version { color:var(--muted); background:var(--surface-raised); }
.object-dialog h3 { overflow-wrap:anywhere; } .object-dialog .icon-button { flex-shrink:0; }
.dialog-open { overflow:hidden; } .organization-dialog { width:min(1000px,100%); }
.organization-dialog>header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; }
.organization-form { display:flex; flex-direction:column; gap:18px; }
.editor-section,fieldset { min-width:0; margin:0 0 18px; padding:18px; border:1px solid var(--border); border-radius:9px; }
legend { padding:0 8px; color:var(--text); font-size:13px; font-weight:600; }
.editor-section label { display:block; } .editor-section input,.editor-section textarea { margin:6px 0 4px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.form-grid.three-columns { grid-template-columns:repeat(3,minmax(0,1fr)); }
.editor-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px; padding:18px 0 0; margin-top:18px; border-top:1px solid var(--border); background:var(--surface); }
.object-dialog .editor-actions { position:sticky; bottom:-26px; padding-bottom:18px; z-index:2; }
.editor-actions>.action-start,.editor-actions>span { margin-inline-end:auto; } .editor-actions>span { font-size:12px; } .required-marker { color:var(--danger); }
.check-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); gap:8px; margin:10px 0 18px; }
.check-item,.inline { display:flex; align-items:center; gap:9px; }
.check-item { padding:10px; border:1px solid var(--border); border-radius:7px; }
.check-item:has(input:checked) { border-color:var(--brand); background:var(--brand-soft); }
.check-item input,.catalog-checkbox { margin:0; } .inline { margin-bottom:16px; }
.inline-editor { display:grid; grid-template-columns:1fr 160px auto; align-items:center; gap:10px; }
.inline-editor :is(input,select) { margin:0; }
.search-inline { display:flex; flex:1 1 240px; align-items:center; gap:12px; } .search-inline input { margin:0; min-width:0; }
.catalog-toolbar>.search-inline { max-width:480px; }
.search-inline>.button { flex-shrink:0; }
.permission-picker { max-height:360px; overflow:auto; scrollbar-width:thin; }
.permission-module { border:1px solid var(--border); border-radius:8px; margin:10px 0; overflow:hidden; }
.permission-module summary { padding:12px 16px; background:var(--surface-raised); font-weight:600; cursor:pointer; }
.permission-module .check-grid { padding:12px; margin:0; } .permission-module .check-item { align-items:flex-start; }
.coverage-product { padding:12px 0; border-bottom:1px solid var(--border); } .coverage-product>.check-grid { padding-left:24px; }
.danger-zone { border-color:color-mix(in srgb,var(--danger) 40%,var(--border)); }
.ticket-control-dialog { width:min(1180px,100%); }
.ticket-dialog-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,.8fr); gap:18px; margin-top:18px; }
.ticket-main-column,.ticket-side-column { display:flex; flex-direction:column; gap:16px; min-width:0; }
.ticket-details { margin-top:14px; } .ticket-comment-form { max-width:720px; margin-top:18px; }
.attachment-upload { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:14px; }
.attachment-upload input { flex:1 1 240px; margin:0; } .attachment-upload small { flex-basis:100%; }
.document-backdrop { z-index:120; } .document-viewer { width:min(1160px,100%); }
.document-frame { width:100%; height:65dvh; border:1px solid var(--border); border-radius:8px; background:#fff; }
.document-image { display:block; max-width:100%; max-height:65dvh; object-fit:contain; margin:18px auto; }
.document-text { white-space:pre-wrap; overflow-wrap:anywhere; max-height:65dvh; overflow:auto; padding:18px; background:var(--field); border-radius:8px; }
.timeline article { position:relative; padding:10px 0 10px 18px; border-left:2px solid var(--border); }
.timeline article::before { content:""; position:absolute; width:8px; height:8px; left:-5px; top:16px; border-radius:50%; background:var(--brand); }
.timeline article span { float:right; color:var(--muted); font-size:12px; }
.catalog-audit { margin-top:4px; }
.history-values { white-space:pre-wrap; max-width:min(70vw,700px); max-height:320px; overflow:auto; }
.audit-tools { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:12px; margin-bottom:18px; }
.audit-tools .catalog-actions { grid-column:1 / -1; }
.chat-transcript { display:flex; flex-direction:column; gap:14px; max-height:55dvh; overflow:auto; margin:18px 0; padding:4px; }
.chat-entry { max-width:min(85%,48rem); padding:14px; border:1px solid var(--border); border-radius:12px; overflow-wrap:anywhere; }
.chat-entry-own { align-self:flex-end; background:var(--brand-soft); }
.chat-entry>div { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.chat-entry time { font-size:11px; color:var(--muted); } .chat-entry p { white-space:pre-wrap; margin-bottom:0; }
.narrow { max-width:520px; margin:32px auto; } .align-start { align-items:start; }
.action-card { display:flex; align-items:center; justify-content:center; min-height:100px; }
.catalog-create-body { padding-top:16px; }

/* Contextual help: three-second delay, never on catalog records. */
.help-object { position:relative; display:inline-block; cursor:help; }
.help-tooltip { visibility:hidden; opacity:0; pointer-events:none; position:absolute; z-index:140; top:calc(100% + 8px); left:0; width:min(320px,70vw); padding:12px 14px; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:8px; box-shadow:var(--overlay-shadow); font:400 12px/1.5 var(--font-family); text-align:left; }
.help-object:is(:hover,:focus-visible,:has(:focus-visible))>.help-tooltip { animation:help-visible 0s 3s forwards; }
:is(table,.list-card,.company-card,.check-grid) .help-tooltip { display:none; }
:is(table,.list-card,.company-card,.check-grid) .object-dialog .help-tooltip { display:block; }

/* Shared provider/client sign-in, matching the two-panel service identity. */
.login-page { --brand:#45b7e2; --brand-hover:#69c9ed; --on-brand:#072c43; min-height:100dvh; display:grid; place-items:center; padding:88px 24px; background:radial-gradient(ellipse at 10% 4%,#cbeefa 0,transparent 43%),radial-gradient(ellipse at 82% 0%,#f3e8de 0,transparent 34%),radial-gradient(ellipse at 73% 95%,#d6eff0 0,transparent 40%),#f4fbff; }
html[data-theme="dark"] .login-page { --surface:#132530; --field:#0d1d28; --border:#2a4b5d; background:radial-gradient(ellipse at 7% 3%,#183c4c 0,transparent 43%),radial-gradient(ellipse at 84% 0%,#292622 0,transparent 36%),radial-gradient(ellipse at 73% 100%,#0e2d31 0,transparent 40%),#0a1821; }
.login-language { position:absolute; top:24px; right:28px; display:flex; align-items:center; gap:8px; }
.login-language .theme-toggle { border-radius:50%; width:46px; height:46px; }
.login-language .language-selector { border-radius:999px; padding:4px 8px; }
.login-language .language-selector a { border-radius:999px; }
.auth-shell { width:min(1080px,100%); min-height:482px; display:grid; grid-template-columns:1.22fr 1fr; padding:0; background:var(--surface); border-radius:30px; overflow:hidden; box-shadow:0 24px 60px rgb(24 76 108 / 8%); }
.auth-panel-brand { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:65px 58px 65px 72px; color:white; background:radial-gradient(circle at 82% 16%,#c1a26e 0,transparent 23%),linear-gradient(140deg,#027fac 0%,#3cb2dc 57%,#229dac 100%); }
.auth-panel-brand h1 { color:white; margin:24px 0; font-size:clamp(25px,2.4vw,36px); line-height:1.13; letter-spacing:-.5px; overflow-wrap:anywhere; }
.auth-kicker,.auth-intro { margin:0; font-size:18px; line-height:1.3; }
.auth-panel-form { padding:68px 72px; align-self:center; }
.auth-panel-form h2 { font-size:27px; margin-bottom:22px; } .auth-panel-form form { display:grid; }
.auth-panel-form label { font-size:16px; font-weight:400; margin-bottom:6px; }
.auth-panel-form input:not([type="checkbox"]) { min-height:46px; margin-bottom:16px; border-radius:13px; }
.auth-panel-form .inline { margin:0 0 18px; }
.auth-panel-form .inline input { margin:0; } .auth-submit { width:100%; }
@media(max-width:1000px) { .auth-panel-brand,.auth-panel-form { padding:48px 36px; } }
@media(max-width:700px) { .auth-shell { grid-template-columns:1fr; min-height:0; border-radius:22px; } .auth-panel-brand { padding:28px; } .auth-panel-brand h1 { font-size:27px; margin:14px 0; } .auth-kicker,.auth-intro { font-size:16px; } .auth-panel-form { padding:28px; } }

/* Genuine request activity, busy controls and page placeholders. */
.spinner { width:16px; height:16px; flex:0 0 16px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin 650ms linear infinite; }
.activity-indicator { position:fixed; inset:0 0 auto; height:3px; z-index:200; pointer-events:none; opacity:0; }
.activity-indicator.is-busy { opacity:1; transition:opacity 100ms 160ms; }
.activity-track { display:block; height:100%; width:35%; background:var(--brand); }
.is-busy .activity-track { animation:progress 1100ms ease-in-out infinite; }
.loading-state { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; min-height:140px; padding:26px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); color:var(--muted); font-size:13px; }
.loading-lines { display:grid; gap:8px; flex:0 0 100%; max-width:340px; }
.loading-lines span { height:7px; border-radius:6px; background:var(--surface-raised); animation:pulse 1300ms ease-in-out infinite; }
.loading-lines span:nth-child(2) { width:78%; animation-delay:150ms; } .loading-lines span:nth-child(3) { width:56%; animation-delay:300ms; }
form[data-submitting] button[type="submit"] { opacity:.6; pointer-events:none; }
form[data-submitting] button[type="submit"]::after { content:""; width:14px; height:14px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin 650ms linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes progress { from { transform:translateX(-100%); } to { transform:translateX(390%); } }
@keyframes pulse { 50% { opacity:.4; } }
@keyframes page-enter { from { opacity:.35; transform:translateY(4px); } to { opacity:1; transform:none; } }
@keyframes fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes dialog-enter { from { opacity:0; transform:translateY(8px) scale(.99); } to { opacity:1; transform:none; } }
@keyframes help-visible { to { visibility:visible; opacity:1; } }

@media(max-width:1150px) {
 .shell>main { padding-inline:22px; }
 .home-launch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .organization-activity { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:900px) {
 :root { --sidebar-width:min(296px,calc(100vw - 56px)); }
 .shell,html[data-sidebar="closed"] .shell { grid-template-columns:minmax(0,1fr); }
 .shell>main { grid-column:1; padding:0 20px 24px; }
 .shell>main>header { padding-left:42px; height:72px; gap:8px; }
 .shell-anonymous>main>header { padding-left:0; }
 .shell>.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar-width); z-index:30; box-shadow:var(--overlay-shadow); }
 .sidebar-toggle { left:calc(var(--sidebar-width) - 49px); top:20px; }
 html[data-sidebar="closed"] .sidebar-toggle { left:16px; }
 html:not([data-sidebar="closed"]) .sidebar-scrim { display:block; position:fixed; inset:0; z-index:29; border:0; background:rgb(5 15 30 / 50%); animation:fade-in 140ms; }
 .user-pill { max-width:160px; }
 .ticket-dialog-grid,.form-grid.three-columns { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:600px) {
 html { scrollbar-gutter:auto; }
 .shell>main { padding-inline:14px; }
 .shell>main>header { gap:6px; margin-bottom:10px; }
 .user-pill { max-width:96px; padding-inline:4px; font-size:12px; } .user-pill .app-icon { display:none; }
 .logout-form .button { padding-inline:9px; } .language-selector a { padding-inline:6px; }
 .card { padding:16px; } .content,.catalog-view { gap:16px; }
 .catalog-toolbar { align-items:flex-start; flex-wrap:wrap; gap:12px; } .catalog-toolbar h2 { font-size:22px; }
 .catalog-toolbar .catalog-actions { margin-left:auto; }
 .button,.icon-button,.theme-toggle,.sidebar-toggle,.tab,.sidebar a,input,select { min-height:44px; } .icon-button,.theme-toggle,.sidebar-toggle { width:44px; height:44px; } input,select,textarea { font-size:16px; }
 .home-launch-grid,.detail-grid,.grid.two-col,.form-grid,.audit-tools,.inline-editor { grid-template-columns:minmax(0,1fr); }
 .filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 10px; }
 .filter-grid>label:first-child { grid-column:1 / -1; }
 .catalog-filters>label { flex-basis:calc(50% - 6px); min-width:0; } .catalog-filters>button { flex:1 1 100%; }
 .section-heading { align-items:flex-start; flex-wrap:wrap; } .section-heading .chip { margin-left:auto; }
 .diagnostic-row,.setting-row { flex-wrap:wrap; align-items:flex-start; }
 .list-card>.catalog-actions { width:100%; justify-content:flex-start; margin-inline-start:0; }
 .list-card>.catalog-actions>.button { flex:1 1 auto; }
 .pagination { justify-content:space-between; gap:8px; }
 .object-dialog-backdrop { padding:10px; } .object-dialog { max-height:calc(100dvh - 20px); padding:18px; border-radius:12px; }
 .object-dialog .editor-actions { bottom:-18px; }
 .editor-actions .button { flex:1 1 auto; } .editor-section { padding:14px; }
 .coverage-product>.check-grid { padding-left:0; } .check-grid { grid-template-columns:minmax(0,1fr); }
 .profile-heading { align-items:flex-start; gap:16px; } .profile-photo { width:64px; height:64px; flex-basis:64px; border-radius:18px; }
 .queue-shortcuts .button { flex:1 1 45%; } .chat-entry { max-width:100%; }
 .login-page { padding:86px 14px 28px; } .login-language { top:18px; right:16px; }
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
 *:not(.help-tooltip) { animation:none!important; }
 .is-busy .activity-track { width:100%; opacity:.6; }
}

.history-backdrop { z-index:180; }
.object-history-dialog { width:min(1100px,calc(100vw - 32px)); }
.object-history-dialog .catalog-audit { border:0; padding:0; box-shadow:none; }
.audit-values { font-size:12px; min-width:440px; }

.document-video { display:block; max-width:100%; max-height:65dvh; margin:0 auto; border-radius:var(--radius); }