@charset "UTF-8";
/* i-industry design foundation (1. 10. 2026).
   One token scale for spacing, type, controls, icons and radii. Shell, shared components and the
   dialog frame are defined only here. Owner stylesheets (customer, admin, product, auth-entry,
   finish-previews, order-next-steps) compose screens from these tokens; there is no separate
   density override layer. Mobile (<700px) raises controls to 44px touch targets. */
:root{
 --navy:#0c1b2a;--navy-deep:#081522;--navy-raised:#13273b;--accent:#0756f7;--accent-hover:#0647ce;--accent-soft:#edf4ff;
 --ink:#152438;--ink-2:#30465f;--muted:#596d83;--subtle:#75879b;--line:#dfe7f0;--line-soft:#edf1f6;--surface:#fff;--surface-2:#f7f9fc;--background:#f2f6fb;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
 --text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:15px;--text-xl:18px;--text-2xl:22px;
 --leading-tight:1.3;--leading:1.45;
 --control-height:36px;--control-height-sm:30px;--control-pad:12px;
 --icon-sm:16px;--icon-md:18px;--icon-lg:20px;
 --radius-sm:6px;--radius-control:8px;--radius:10px;
 --sidebar:216px;--topbar-height:48px;--content-max:1680px;--gutter:20px;--space-card:14px;--space-section:12px;
 --shadow:0 1px 3px #1735540a;
 --font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--mono:"SFMono-Regular",Consolas,monospace;
}

/* Base */
*{box-sizing:border-box}
body{margin:0;background:var(--background);color:var(--ink);font-family:var(--font);font-size:var(--text-md);line-height:var(--leading);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;transition:background .15s,border-color .15s,color .15s}
button:disabled{cursor:not-allowed;opacity:.48}
a{color:var(--accent);text-decoration:none}
svg{flex-shrink:0}
button .icon,a .icon{pointer-events:none}
.icon{display:inline-block;vertical-align:middle;flex:0 0 auto}
/* Lucide geometry with one rendered weight at every size (absolute stroke). */
.icon :is(path,circle,rect,line,polyline,polygon,ellipse){vector-effect:non-scaling-stroke;stroke-width:1.5px}
h1,h2,h3,h4,p{margin-top:0}
h1{font-size:var(--text-2xl);line-height:1.25;letter-spacing:-.4px;font-weight:700;margin-bottom:var(--space-1)}
h2{font-size:var(--text-xl);line-height:var(--leading-tight);letter-spacing:-.2px;margin-bottom:var(--space-3)}
h3{font-size:var(--text-lg);line-height:1.4;margin-bottom:var(--space-2)}
h4{font-size:var(--text-md);margin-bottom:var(--space-1)}
p{margin-bottom:var(--space-3)}
small{font-size:var(--text-xs)}
strong{font-weight:650}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #93b4ff;outline-offset:2px}
:is(button,a,input,textarea,select){scroll-margin-block:90px 25px}
.skip-link{position:fixed;z-index:200;left:16px;top:-80px;background:#fff;padding:10px 16px;border:2px solid var(--accent);border-radius:var(--radius-control)}
.skip-link:focus{top:12px}

/* Native disclosure: one chevron instead of the platform triangle. */
details>summary{cursor:pointer;list-style:none}
details>summary::-webkit-details-marker{display:none}
details>summary::before{content:"";display:inline-block;width:6px;height:6px;margin:0 9px 2px 2px;border-right:1.75px solid currentColor;border-bottom:1.75px solid currentColor;transform:rotate(-45deg);transition:transform .15s;opacity:.7;vertical-align:middle;flex-shrink:0}
details[open]>summary::before{transform:rotate(45deg) translate(-1px,-1px)}

/* Shell: sidebar */
.portal-sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar);display:flex;flex-direction:column;background:var(--navy);color:#d8e4f4;z-index:60;padding:var(--space-3) var(--space-3) 0}
.portal-sidebar[aria-hidden=true]{pointer-events:none}
.brand{display:flex;align-items:center;gap:10px;color:#fff;flex-shrink:0;text-decoration:none}
.brand img{object-fit:contain}
.portal-sidebar .product-brand{justify-content:flex-start;height:52px;gap:10px;padding:2px 6px}
.portal-sidebar .product-brand>img{width:40px;height:40px;flex:0 0 40px;border-radius:0}
/* PR-86b (O-152): on the white customer bar (700 px and up, shell-v62.css) the logo's opaque 253 to 254 background turns white (brightness)
   and blends into the bar (multiply), as on the login page (auth-entry.css:14). The dark drawer and the team bar keep the white tile. */
@media(min-width:700px){body[data-role="customer"] .product-brand-logo>img{mix-blend-mode:multiply;filter:brightness(1.012)}}
/* Role is a label, not a control: the server decides the role. */
.role-switch{display:flex;margin:var(--space-2) 0 var(--space-3);flex-shrink:0}
.role-switch>:is(span,button){display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:3px 10px 3px 8px;border:1px solid #ffffff1f;border-radius:999px;background:#ffffff0a;color:#d7e4f3;font-size:var(--text-xs);font-weight:600}
.role-switch .icon{width:var(--icon-sm);height:var(--icon-sm);color:#9dbbd9}
.nav-caption{font-size:var(--text-xs);letter-spacing:.08em;font-weight:700;color:#a9bfd7;padding-left:10px;margin-bottom:6px;flex-shrink:0}
.portal-sidebar nav{display:grid;gap:2px;overflow-y:auto;min-height:0;align-content:start}
.nav-item{position:relative;display:flex;align-items:center;gap:10px;min-height:36px;padding:7px 10px;border-radius:var(--radius-control);color:#c5d6e7;font-size:var(--text-md);line-height:1.35}
.nav-item .icon{width:var(--icon-md);height:var(--icon-md);color:#9dbbd9}
.nav-item:hover:not(.active){background:#ffffff0d;color:#fff}
.nav-item.active{background:var(--accent);color:#fff;box-shadow:0 2px 6px #00132d26}
.nav-item.active .icon{color:#fff}
.nav-item:focus-visible{outline-offset:-3px}

.sidebar-bottom{margin-top:auto;padding-top:var(--space-3)}
.sidebar-help button{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:7px 10px;border:1px solid #ffffff14;border-radius:var(--radius-control);background:var(--navy-raised);color:#c5d6e7;font-size:var(--text-sm);text-align:left}
.sidebar-help button:hover{background:#18324a;color:#fff}
.sidebar-help .icon{width:var(--icon-md);height:var(--icon-md);color:#9dbbd9}
.sidebar-profile{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff12;margin:var(--space-3) calc(-1 * var(--space-3)) 0;padding:10px var(--space-3);background:#0c2135}
.sidebar-profile>div{min-width:0}
.sidebar-profile strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm);font-weight:600;line-height:1.3;color:#eaf1fb;overflow-wrap:anywhere}
.sidebar-profile small{display:block;font-size:var(--text-xs);line-height:1.35;color:#afc3d9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-profile .icon-btn{margin-left:auto;color:#8fa9c9}
.sidebar-profile .icon-btn:hover{background:#ffffff0c;color:#fff}
.avatar{width:32px;height:32px;flex-shrink:0;border-radius:var(--radius-control);background:#dce9fa;color:#295581;font-size:var(--text-xs);font-weight:750;display:inline-grid;place-items:center;border:1px solid #cddff4}
.sidebar-profile .avatar{background:#2a486b;color:#eaf2ff;border-color:#3c5a7d}
.avatar-small{height:30px;width:30px;font-size:var(--text-xs);border-radius:50%}

/* Shell: topbar, workspace, heading, footer. The sticky topbar is opaque (--surface): page content scrolls under it (L-MOB) */
.app-frame{margin-left:var(--sidebar);min-height:100vh}
.portal-topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);height:var(--topbar-height);min-width:0;padding:0 max(var(--gutter),calc((100% - var(--content-max)) / 2 + var(--gutter)));border-bottom:1px solid var(--line);background:var(--surface)}
.topbar-context{display:flex;align-items:center;gap:8px;min-width:0;color:#627386;font-size:var(--text-sm)}
.topbar-context strong{font-weight:600;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.workspace-icon{display:grid;place-items:center;width:28px;height:28px;background:#f3f5f8;border:1px solid #e4e9ef;border-radius:7px;color:#5c7087}
.workspace-icon .icon{width:var(--icon-sm);height:var(--icon-sm)}
.breadcrumb-separator{color:#c3ccd8}
.topbar-tools{display:flex;align-items:center;gap:var(--space-2)}
.prototype-badge{display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:var(--text-xs);color:#526579;border:1px solid #dce4ed;background:#f7f9fc;padding:3px 8px;border-radius:var(--radius-sm)}
.prototype-badge>span{height:6px;width:6px;background:#5f9a86;border-radius:50%}
.topbar-tools .avatar-small{display:none}
.topbar-tools .btn{min-height:var(--control-height-sm);padding:4px 10px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;padding:6px;border:0;border-radius:var(--radius-control);background:transparent;color:var(--muted)}
.icon-btn:hover{background:#eef3f9;color:var(--ink)}
.icon-btn .icon{width:var(--icon-lg);height:var(--icon-lg)}
.mobile-toggle,.nav-scrim{display:none}
.workspace{max-width:var(--content-max);margin:auto;padding:var(--space-4) var(--gutter) var(--space-5);min-width:0}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}
.page-heading>div:first-child{min-width:0}
.page-heading h1{margin:0 0 2px;overflow-wrap:anywhere}
.page-heading>div>p:last-child:not(.eyebrow){margin:0;max-width:720px;color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.page-heading .eyebrow{display:none}
.eyebrow{font-size:var(--text-xs);letter-spacing:.08em;font-weight:700;color:#627386;line-height:1.5;margin-bottom:6px}

.page-actions{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;flex-shrink:0}
.page-content{min-width:0}
.workspace-footer{display:flex;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-6);padding:var(--space-3) 0 0;border-top:1px solid #e6eaf0;font-size:var(--text-xs);color:var(--muted)}
.workspace-footer>span:last-child{display:flex;align-items:center;gap:6px}
.workspace-footer button{display:inline-flex;align-items:center;background:none;border:0;color:inherit;padding:0}

/* Components */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0;overflow:hidden}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:42px;padding:5px var(--space-card);border-bottom:1px solid var(--line-soft)}
.panel-head :is(h2,h3){margin:0;font-size:var(--text-lg);font-weight:650;letter-spacing:-.15px;line-height:1.35}
.panel-body{padding:var(--space-card)}

.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--control-height);padding:7px 12px;border:1px solid transparent;border-radius:var(--radius-control);font-size:var(--text-sm);font-weight:600;line-height:20px;text-decoration:none;white-space:nowrap}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn .icon{width:var(--icon-sm);height:var(--icon-sm)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 1px 2px #1b4fb71f}
.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff}
.btn-secondary{background:#fff;color:#2f4a69;border-color:#d6e0eb}
.btn-secondary:hover{background:#f6f9fd;border-color:#b9cadd}
.btn-ghost{background:transparent;color:var(--muted)}
.btn-ghost:hover{background:#edf2f8;color:var(--ink)}
.btn-danger{background:#fff7f7;color:#b64e4e;border-color:#f0d9d9}
.btn-sm{min-height:var(--control-height-sm);padding:4px 10px;font-size:var(--text-xs)}
.text-link{color:var(--accent);background:none;border:0;padding:0;font-size:inherit;font-weight:600;cursor:pointer}
.text-link:hover{text-decoration:underline}
.badge{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:2px 8px;border-radius:var(--radius-sm);font-size:var(--text-xs);line-height:18px;font-weight:600;white-space:nowrap}
.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.badge-blue{background:var(--blue-bg);color:var(--blue)}.badge-green{background:var(--green-bg);color:var(--green)}.badge-amber{background:var(--amber-bg);color:var(--amber)}.badge-red{background:var(--red-bg);color:var(--red)}.badge-violet{background:var(--violet-bg);color:var(--violet)}.badge-gray{background:var(--gray-bg);color:var(--gray)}
.stack{display:flex;flex-direction:column;gap:var(--space-section)}
.cluster{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.split{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-4)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3) var(--space-4)}
.field{display:flex;flex-direction:column;gap:5px;margin:0 0 var(--space-3);min-width:0}
:where(.stack,.grid-2,.grid-3,.cluster)>:is(.field,p,h2,h3,h4,.notice,.check-row,fieldset,form){margin-block:0}
form.stack{gap:var(--space-3)}
.stack>:is(.btn,button[type=submit]){align-self:flex-start}
form.stack>h3:not(:first-child){margin-top:var(--space-2)}
fieldset{min-inline-size:0;margin:0;padding:0;border:0}
legend{padding:0;margin:0 0 var(--space-2);font-size:var(--text-sm);font-weight:650;color:var(--ink-2)}
fieldset.stack>legend+*{margin-top:0}
.field>span:first-child,.field>label:first-child{font-size:var(--text-xs);font-weight:600;color:#4a5f76}
.input,.field input:not([type=checkbox],[type=radio]),.field select,.field textarea{width:100%;min-width:0;min-height:var(--control-height);padding:7px 10px;border:1px solid #d6dfea;border-radius:var(--radius-control);background:#fff;color:var(--ink);font-size:var(--text-md);line-height:20px}
.input::placeholder,.field input::placeholder,.field textarea::placeholder{color:#8290a1}
.input:hover:not(:focus):not(:disabled){border-color:#bfcbd8}
.field input:focus,.field select:focus,.field textarea:focus,.input:focus{border-color:#8fb0ec}
.field textarea,textarea.input{resize:vertical;min-height:76px}
.field small{font-size:var(--text-xs);color:var(--muted);line-height:1.4}
.field input:not([type=checkbox],[type=radio]):disabled,.field select:disabled,.field textarea:disabled,.input:disabled{background:#f3f5f8;color:#6f8094;-webkit-text-fill-color:#6f8094;border-color:var(--line);cursor:not-allowed}
.field input:is([type=date],[type=datetime-local],[type=time]),input.input:is([type=date],[type=datetime-local],[type=time]){height:var(--control-height)}
input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:16px;height:16px;flex-shrink:0;margin:0}
.check-row{display:flex;align-items:flex-start;gap:8px;font-size:var(--text-sm);color:#4f6580;cursor:pointer}
.check-row input{margin-top:2px}
.table-wrap{overflow-x:auto;min-width:0;max-width:100%;scrollbar-width:thin;scrollbar-color:#c6d1de #f5f7fa}
.data-table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--text-md);white-space:nowrap}
.data-table th{padding:8px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);font-size:var(--text-xs);font-weight:600;color:#5d7088;text-transform:none}
.data-table td{padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle;color:#3b5068;line-height:1.4}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table tbody tr:hover{background:#f6f9fc}
.data-table td strong{color:#243c59}
.cell-secondary{display:block;margin-top:2px;font-size:var(--text-xs);color:#66788d}

.align-right{text-align:right}

.empty-state{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-6) var(--space-4);text-align:center;color:#6f7f93}
.empty-state>.icon{width:28px;height:28px;color:#a3b6cb}
.empty-state :is(h2,h3,p){margin:0}
.empty-state h3{font-size:var(--text-md);color:var(--ink-2)}
.panel-body>.empty-state:only-child,.panel>.empty-state{flex-direction:row;flex-wrap:wrap;justify-content:flex-start;gap:4px 10px;padding:var(--space-2) 0;text-align:left}
.panel>.empty-state{padding:var(--space-3) var(--space-card)}
:is(.panel-body>.empty-state:only-child,.panel>.empty-state)>.icon{width:20px;height:20px}
:is(.panel-body>.empty-state:only-child,.panel>.empty-state)>p{flex-basis:100%;padding-left:30px;font-size:var(--text-sm)}
.notice{margin-bottom:var(--space-3);padding:9px 12px;border:1px solid #d5e3fb;border-radius:var(--radius-control);background:#f2f7ff;color:var(--ink-2);font-size:var(--text-sm);line-height:1.5}
.notice-warning{background:var(--amber-bg);border-color:#f1dfb8;color:var(--ink-2)}
.tabs{display:flex;align-items:center;gap:var(--space-5);border-bottom:1px solid var(--line);overflow-x:auto}
.tab{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:9px 0 8px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font-size:var(--text-md);font-weight:600;white-space:nowrap}
.tab:hover{color:var(--ink)}
.tab.active{border-bottom-color:var(--accent);color:var(--accent)}
.metric{padding:var(--space-3) var(--space-4);min-width:0}
.metric>small{display:block;color:#6f8196;font-size:var(--text-xs)}
.metric>strong{display:block;margin-top:2px;font-size:var(--text-2xl);letter-spacing:-.4px;font-variant-numeric:tabular-nums}

.model-visual{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:1.12;background:#edf2f6;border:1px solid #e3e9f0;border-radius:var(--radius-control)}
.model-visual svg{width:92%;height:100%;max-height:230px}
.model-visual>svg.icon{width:38%;height:38%;max-width:56px;max-height:56px;color:#8ea3ba}
.model-visual.small{width:48px;height:48px;aspect-ratio:auto;border-radius:var(--radius-sm);flex-shrink:0}
.model-visual.small>svg.icon{width:55%;height:55%}

/* Dialog frame: a fixed title, one scrolling body and the form's sticky action row.
   Optional data-dialog-size="compact|form|wide|preview" selects the content width; the
   default follows existing content. Never apply a fixed height to a short confirmation. */
.portal-modal{--dialog-width:560px;--dialog-pad:16px;--dialog-pad-block:12px;width:min(var(--dialog-width),calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);box-shadow:0 20px 80px #0b23372e;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bdcad8 transparent}
.portal-modal.wide{--dialog-width:840px}
.portal-modal.wide:where(:not(:has(.data-table,table,.grid-3,.product-manual-line,[data-gls-package],.panel,.customer-part,.product-viewer,iframe,canvas))){--dialog-width:640px}
.portal-modal:has(.stl-viewer){--dialog-width:1040px}
.portal-modal[data-dialog-size=compact]{--dialog-width:520px}
.portal-modal[data-dialog-size=form]{--dialog-width:640px}
.portal-modal[data-dialog-size=wide]{--dialog-width:840px}
.portal-modal[data-dialog-size=preview]{--dialog-width:1040px}
.portal-modal::backdrop{background:#0a213e66;backdrop-filter:blur(2px)}
.portal-modal[open]{display:flex;flex-direction:column;animation:dialog-appear .16s ease-out}
.modal-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex:0 0 auto;padding:10px var(--dialog-pad);border-bottom:1px solid #e8edf2;background:#fff}
.modal-header h2{margin:0;font-size:var(--text-xl);line-height:1.35;letter-spacing:-.25px;overflow-wrap:anywhere}
.modal-header>.icon-btn{flex-shrink:0;min-width:32px;min-height:32px;background:#f4f6f9;border:1px solid #e9edf2}
.modal-header>.icon-btn:hover{background:#e9eef5;color:#243e5c}
.modal-header>.icon-btn .icon{width:var(--icon-md);height:var(--icon-md)}
.modal-body{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-padding-block:var(--space-3) 80px;padding:var(--dialog-pad-block) var(--dialog-pad);line-height:var(--leading)}
.modal-body .muted{color:#5f7287}
.modal-body>.notice:first-child{margin-bottom:var(--space-3)}
.modal-body>p:last-child{margin-bottom:0}
.portal-modal .field>span:first-child{color:#435b73}
.portal-modal :is(p,dd,h3){overflow-wrap:anywhere}
.portal-modal :is(.split,.cluster){min-width:0}
.portal-modal .panel{box-shadow:none}
.portal-modal fieldset{display:grid;gap:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--line-soft)}
.portal-modal fieldset>legend{float:left;width:100%;margin:0}
.portal-modal fieldset[hidden]{display:none}
.portal-modal .modal-body>form>.cluster:last-child,.portal-modal .modal-body>form>button[type=submit]:last-child{position:sticky;bottom:0;z-index:1;margin:var(--space-3) calc(-1 * var(--dialog-pad)) calc(-1 * var(--dialog-pad-block));padding:var(--space-2) var(--dialog-pad);border-top:1px solid var(--line);background:#fff;justify-content:flex-end}
.portal-modal .modal-body>form>button[type=submit]:last-child{display:flex;width:calc(100% + 2 * var(--dialog-pad))}
.modal-body>.cluster:last-child{justify-content:flex-end;margin-top:var(--space-3)}
.portal-modal .viewer-stage{height:clamp(220px,50dvh,520px);margin-block:var(--space-2)}
.portal-modal :is(.viewer-heading,.viewer-footer){flex-wrap:wrap;gap:var(--space-2)}
.portal-modal :is(.viewer-hint,.viewer-footer){margin-top:var(--space-2)}
.portal-toast{position:fixed;bottom:18px;left:calc(var(--sidebar) + (100vw - var(--sidebar)) / 2);transform:translateX(-50%);z-index:200;width:max-content;max-width:calc(100vw - 38px);padding:10px 14px;border:1px solid #45658c;border-radius:var(--radius-control);background:#143153;color:#f2f6fd;box-shadow:0 7px 25px #102b4e25;font-size:var(--text-sm)}
.portal-toast[hidden]{display:none}
@keyframes dialog-appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}

/* Responsive */
@media(min-width:1600px){:root{--gutter:24px}}
@media(max-width:1199px){:root{--gutter:20px}.page-heading{align-items:flex-start}.page-actions{justify-content:flex-end}}
@media(max-width:899px){
 :root{--sidebar:200px}
 .portal-sidebar{padding-inline:10px}
 .portal-sidebar .product-brand{gap:8px;padding-inline:2px}
 .portal-sidebar .product-brand>img{width:36px;height:36px;flex-basis:36px}
 .nav-item{padding-inline:9px;gap:9px;font-size:var(--text-sm)}
 .sidebar-profile{margin-inline:-10px;padding-inline:10px}
 .topbar-context>span:not(.breadcrumb-separator):not(.workspace-icon){display:none}
 .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .page-heading{flex-wrap:wrap;gap:var(--space-3)}
}
@media(max-width:699px){
 :root{--sidebar:0px;--gutter:14px;--control-height:44px;--control-height-sm:44px;--space-card:14px;--space-section:14px}
 .portal-sidebar{width:252px;padding:var(--space-3) var(--space-3) 0;overflow-y:auto;transform:translateX(-100%);transition:transform .2s;box-shadow:none}
 .portal-sidebar nav{overflow:visible;flex:0 0 auto}
 .sidebar-bottom{flex-shrink:0}
 .nav-open .portal-sidebar{transform:translateX(0);box-shadow:8px 0 30px #11283f22}
 .nav-open .nav-scrim{display:block;position:fixed;inset:0;z-index:55;border:0;background:#102b4e50}
 .portal-sidebar .product-brand>img{width:40px;height:40px;flex-basis:40px}
 .nav-item{min-height:44px;padding-inline:12px;font-size:var(--text-md)}
 .sidebar-profile{margin-inline:-12px;padding-inline:12px}
 .portal-topbar{height:auto;min-height:var(--topbar-height);padding:6px var(--gutter);gap:8px}
 .mobile-toggle{display:inline-flex;margin-left:-6px;min-width:44px;min-height:44px}
 .workspace-icon,.topbar-context .breadcrumb-separator{display:none}
 .topbar-context{gap:6px;flex:1}
 .topbar-context strong{min-width:0;font-size:var(--text-sm)}
 .prototype-badge{display:none}
 .topbar-tools{flex-shrink:0;gap:4px}
 .topbar-tools .btn{min-width:44px;min-height:44px;padding:6px}
 .topbar-tools .customer-locale-switch select{field-sizing:content;max-width:124px;min-height:44px;font-size:var(--text-sm)}
 .topbar-tools .btn-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .sidebar-help button{min-height:44px}
 .tabs{gap:var(--space-4);scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
 .tabs>:last-child{margin-right:24px}
 .workspace{padding:var(--space-4) var(--gutter) var(--space-5)}
 .page-heading{gap:var(--space-3);margin-bottom:var(--space-4)}
 .page-actions{justify-content:flex-start;max-width:100%}
 .grid-2,.grid-3{grid-template-columns:1fr;gap:var(--space-3)}
 .split{flex-wrap:wrap;gap:10px}
 .workspace-footer{flex-wrap:wrap;gap:6px 10px;margin-top:var(--space-5)}
 .btn,.btn-sm{white-space:normal}
 .stack>:is(.btn,button[type=submit]){align-self:stretch}
 .tab{min-height:44px}
 .data-table th{padding:8px 10px}
 .data-table td{padding:10px}
 .field input,.field textarea,.field select,.input{font-size:16px!important}
 .check-row{min-height:44px;align-items:center}
 .check-row input{margin-top:0}
 .portal-toast{left:50%;bottom:16px;width:calc(100vw - 32px);max-width:480px}
 .portal-modal,.portal-modal.wide{--dialog-pad:14px;--dialog-pad-block:12px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:12px}
 .modal-header{padding:8px 8px 8px var(--space-4)}
 .modal-header>.icon-btn{min-width:44px;min-height:44px}
 .modal-body{scroll-padding-bottom:100px}
 .portal-modal .modal-body>form>.cluster:last-child>.btn{flex:1 1 auto}
 .icon-btn{min-width:44px;min-height:44px}
 .sidebar-profile .icon-btn{margin-right:-6px}
}
/* High contrast: the system GrayText marks disabled controls; author opacity would dim it a second time. */
@media(forced-colors:active){button:disabled,.btn[aria-disabled="true"]{opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}