/* Shared theme, appearance and application controls, DS 1.3. */
.brand-symbol,.demo-brand>span:first-child,.callout-number{color:var(--on-action)}
.switch-label input:checked:after{background:var(--on-action)}
.theme-trigger>svg:first-child{color:var(--action-text)}
.theme-trigger>svg:last-child,.apps-trigger>svg:last-child{width:var(--icon-sm);height:var(--icon-sm);transition:transform var(--motion-fast)}
.theme-trigger[aria-expanded="true"]>svg:last-child,.apps-trigger[aria-expanded="true"]>svg:last-child{transform:rotate(180deg)}
.lab-theme{display:flex;align-items:center;gap:12px;font-size:14px}
.lab-appearance,.appearance-demo{display:flex;align-items:center;gap:12px;font-size:14px;flex-wrap:wrap}
.appearance-demo{margin:24px 0}
.appearance-demo>small{color:var(--text-secondary);margin-left:auto}/* Icon-only visual controls in the global header; menus and examples keep labels. */
.topbar-theme>span,.topbar-theme>svg:last-child,.topbar-appearance .appearance-mode-label{display:none}
.topbar-appearance{display:flex}
.demo-topbar-actions{margin-left:auto;display:flex;flex-shrink:0}
.demo-topbar>span:not(.callout-number){min-width:0}
.demo-topbar .callout-number{top:-2px;right:-2px;pointer-events:none}
.public-demo .public-brand{flex-wrap:wrap;gap:12px}
.theme-menu,.apps-panel{position:fixed;margin:0;background:var(--surface-primary);color:var(--text-primary);border:1px solid var(--border-strong);box-shadow:var(--shadow-lg);overscroll-behavior:contain}
.theme-menu::backdrop{background:rgb(0 0 0 / .12)}
.theme-menu{inset:auto;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);padding:8px;border-radius:14px}
.theme-menu-label{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);padding:12px}
.theme-option{display:flex;align-items:center;gap:12px;width:100%;min-height:68px;padding:10px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text-primary);font-size:14px;font-weight:600;text-align:left}
.theme-option:hover{background:var(--surface-secondary)}
.theme-option[aria-checked="true"]{background:var(--action-soft);border-color:var(--action-border,var(--action-primary))}
.theme-option small{display:block;font-size:12px;font-weight:400;color:var(--text-secondary);margin-top:3px;line-height:1.45}
.theme-choice-icon{display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border-radius:10px;background:var(--preview-nav);color:var(--preview-action);border:1px solid var(--preview-line)}
.theme-selected{margin-left:auto;color:var(--action-text);visibility:hidden;display:flex}
.theme-option[aria-checked="true"] .theme-selected{visibility:visible}
/* Shared launcher cards; the floating ecosystem panel has its own composition below. */
.apps-panel{--apps-panel-sidebar:var(--layout-sidebar);--apps-panel-inset:var(--space-4);inset:calc(var(--layout-topbar) + var(--space-2)) var(--apps-panel-inset) auto calc(var(--apps-panel-sidebar) + var(--apps-panel-inset));margin-inline:auto;width:min(var(--app-launcher-panel-width),calc(100% - var(--apps-panel-sidebar) - 2 * var(--apps-panel-inset)));max-width:none;max-height:calc(100dvh - var(--layout-topbar) - var(--space-6));border-radius:var(--radius-lg);padding:var(--space-2);overflow:hidden}
.site-frame.collapsed~.apps-panel{--apps-panel-sidebar:var(--layout-sidebar-collapsed)}
.apps-panel[open]{display:flex;flex-direction:column;gap:var(--space-1)}
.apps-panel::backdrop{background:rgb(0 0 0 / .20)}
.apps-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);flex-shrink:0}
.apps-panel-title{display:flex;align-items:center;gap:var(--space-2);min-width:0}
.apps-panel-heading h2{font-size:var(--font-h4-size);line-height:var(--font-h4-line);margin:0}
.apps-panel-count{font-size:12px;line-height:16px;color:var(--text-secondary);background:var(--surface-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);padding:var(--space-1) var(--space-2)}
.login-app-grid{display:grid;grid-auto-flow:row;grid-template-columns:repeat(var(--app-launcher-columns,6),minmax(128px,1fr));grid-template-rows:repeat(2,minmax(var(--app-launcher-card-height),auto));gap:var(--app-launcher-gap);margin:0;padding:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-snap-type:x proximity}
.login-app{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--space-1);min-height:var(--app-launcher-card-height);min-width:0;border-radius:var(--radius-md);color:var(--text-primary);text-decoration:none;text-align:center;border:1px solid var(--border-subtle);background-color:var(--surface-primary);background-image:var(--ambient-panel-image);scroll-snap-align:start}
.login-app[href]:hover{background-color:var(--surface-secondary);border-color:var(--border-control);box-shadow:var(--shadow-sm)}
.login-app-unavailable{border-style:dashed}
.login-app:focus-visible{background:var(--surface-secondary);outline:3px solid var(--focus-ring);outline-offset:-3px}
.login-app img{object-fit:contain;width:var(--app-launcher-logo-size);height:var(--app-launcher-logo-size)}
.login-app-art{display:block;width:var(--app-launcher-logo-size);height:var(--app-launcher-logo-size);flex-shrink:0}
.login-app-art img{display:block}
.login-app-copy{display:block;width:100%;min-width:0;margin:0;letter-spacing:normal}
.login-app-name{display:block;font-size:var(--app-launcher-name-size);line-height:var(--app-launcher-name-line);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.login-app-subtitle{display:block;font-size:var(--app-launcher-caption-size);line-height:var(--app-launcher-caption-line);font-weight:400;color:var(--text-secondary);margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.login-app-fallback{width:var(--app-launcher-logo-size);height:var(--app-launcher-logo-size);display:grid;place-items:center;border-radius:var(--radius-lg);flex-shrink:0;border:1px solid var(--border-strong);background:var(--action-soft);color:var(--action-text)}
.login-app-fallback svg{width:calc(var(--icon-lg) * 1.2);height:calc(var(--icon-lg) * 1.2)}
.apps-panel-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-2);padding-top:var(--space-1);border-top:1px solid var(--border-subtle);font-size:12px;line-height:16px;color:var(--text-secondary);flex-shrink:0}
.apps-panel-foot>a{display:inline-flex;align-items:center;gap:var(--space-2);min-height:44px;font-size:14px;line-height:20px;font-weight:600;text-decoration:none}
.apps-panel-foot>a:hover{text-decoration:underline}
.apps-panel-foot>a svg{width:var(--icon-sm);height:var(--icon-sm)}
.theme-violet-korax{--preview-page:#FFFFFF;--preview-nav:#F3EDFF;--preview-action:#8643FC;--preview-line:#E1D6F5}
.theme-green-vida{--preview-page:#FFFFFF;--preview-nav:#D0EBE7;--preview-action:#074551;--preview-line:#B2D3CC}
.theme-blue-sky{--preview-page:#FFFFFF;--preview-nav:#E8F0FF;--preview-action:#1956C2;--preview-line:#CCD9F2}
.theme-dark-hole{--preview-page:#F4F6F8;--preview-nav:#E9EDF3;--preview-action:#303A4A;--preview-line:#B8C4D2}
[data-appearance="dark"] .theme-violet-korax{--preview-page:#14101F;--preview-nav:#282037;--preview-action:#B995FF;--preview-line:#514462}
[data-appearance="dark"] .theme-green-vida{--preview-page:#0D1D1B;--preview-nav:#1C3730;--preview-action:#53D5B3;--preview-line:#426358}
[data-appearance="dark"] .theme-blue-sky{--preview-page:#0F1B2D;--preview-nav:#1E304D;--preview-action:#80B5FF;--preview-line:#415777}
[data-appearance="dark"] .theme-dark-hole{--preview-page:#111318;--preview-nav:#232730;--preview-action:#E5E8EF;--preview-line:#434B59}
.theme-yellow-sun{--preview-page:#FFFFFF;--preview-nav:#FFF1C2;--preview-action:#795A00;--preview-fill:#F5C518;--preview-line:#D6C59B}
[data-appearance="dark"] .theme-yellow-sun{--preview-page:#211B0C;--preview-nav:#3A3017;--preview-action:#F5D86C;--preview-fill:#F7D653;--preview-line:#6B5C34}
.theme-red-live{--preview-page:#FFFFFF;--preview-nav:#FFE9EC;--preview-action:#B02132;--preview-fill:#C92D3B;--preview-line:#D9B7C0}
[data-appearance="dark"] .theme-red-live{--preview-page:#281218;--preview-nav:#472731;--preview-action:#FFADB8;--preview-fill:#FF8794;--preview-line:#77505D}
.theme-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}
.theme-card{padding:12px;text-align:left;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-primary);color:var(--text-primary);min-width:0}
.theme-card:hover{background:var(--surface-secondary);border-color:var(--action-border,var(--action-primary))}
.theme-card[aria-pressed="true"]{outline:2px solid var(--action-border,var(--action-primary));outline-offset:1px}
.theme-card-preview{display:grid;grid-template-columns:25% 1fr;height:92px;overflow:hidden;border:1px solid var(--preview-line);border-radius:8px;background:var(--preview-page);margin-bottom:14px}
.theme-card-preview>i{background:var(--preview-nav);border-right:1px solid var(--preview-line)}
.theme-card-preview>span{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 12px}
.theme-card-preview b{width:100%;height:8px;background:var(--preview-line);border-radius:3px}
.theme-card-preview b:first-child{width:60%;height:12px;background:var(--preview-fill,var(--preview-action))}
.theme-card-preview b:last-child{width:75%}
.theme-card-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600}
.theme-card>small{display:block;font-size:12px;line-height:1.5;color:var(--text-secondary);margin-top:8px}
@media(min-width:1024px) and (max-width:1250px){.theme-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.theme-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){.lab-theme{width:100%;justify-content:space-between}.theme-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.topbar .breadcrumbs{font-size:12px;min-width:0}.topbar .breadcrumbs span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar{gap:8px}.topbar-actions{flex-shrink:0}.topbar .apps-trigger>svg:last-child{display:none}.demo-topbar .apps-trigger>svg:last-child{display:none}.demo-topbar>span:not(.callout-number){font-size:12px}.theme-card{padding:10px}}
@media(max-width:360px){.theme-cards{grid-template-columns:1fr}.demo-topbar{gap:8px}.demo-topbar>span:not(.callout-number)>.muted{display:none}}
@media(max-width:767px){.lab-appearance{width:100%;justify-content:space-between}.appearance-demo>small{width:100%;margin-left:0}}
@media(max-width:560px){.topbar .breadcrumbs{display:none}}
@media(max-width:1023px){.apps-panel,.site-frame.collapsed~.apps-panel{--apps-panel-sidebar:0px}}
@media(max-width:599px){.apps-panel{--apps-panel-inset:var(--space-2);padding:var(--space-2)}}

/* Ecosystem menu: introductory column and three open app columns, in catalog order.
   Query the panel's useful width so an expanded sidebar or an embed also reflows. */
.apps-panel.apps-panel{container:korax-apps-panel / inline-size;width:min(1920px,calc(100% - var(--apps-panel-sidebar) - 2 * var(--apps-panel-inset)));padding:20px 32px;border:1px solid var(--border-subtle);border-radius:18px;background:var(--surface-primary);background-image:none;overflow:auto;scrollbar-width:thin;box-shadow:0 24px 64px rgb(15 23 42 / .16)}
.apps-panel[open]{display:block}
.apps-panel::backdrop{background:rgb(15 23 42 / .08)}
.apps-panel-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3.4fr);align-items:stretch;gap:28px;min-width:0}
.apps-panel-intro{display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0;padding-right:28px;border-right:1px solid var(--border-subtle)}
.apps-panel-eyebrow{display:inline-block;max-width:100%;padding:7px 10px;border:1px solid var(--border-control);border-radius:7px;color:var(--text-secondary);font:500 .75rem/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;overflow-wrap:anywhere}
.apps-panel-intro h2{margin:0;font:750 clamp(1.625rem,2.6cqi,2.5rem)/1.16 var(--font-family-brand);letter-spacing:-.045em;text-transform:none;color:var(--text-primary);overflow-wrap:normal}
.apps-panel-explore{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:2px;color:var(--text-primary);font:400 1rem/1.5 var(--font-family-brand);text-decoration:none}
.apps-panel-explore svg{width:20px;height:20px;flex-shrink:0;transition:transform var(--motion-fast)}
.apps-panel-explore:hover{text-decoration:underline;text-underline-offset:4px}
.apps-panel-explore:hover svg{transform:translateX(3px)}
.apps-panel-explore:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px;border-radius:4px}
.apps-panel-close{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:44px;height:44px;padding:12px;border:0;border-radius:10px;background:transparent;color:var(--text-secondary);cursor:pointer}
.apps-panel-close svg{width:16px;height:16px}
.apps-panel-close:hover{background:var(--surface-secondary);color:var(--text-primary)}
.apps-panel-close:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-4px}
.apps-panel .login-app-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:minmax(60px,auto);align-content:start;gap:6px 20px;overflow:visible;scroll-snap-type:none}
.apps-panel .login-app{flex-direction:row;justify-content:flex-start;align-items:center;gap:12px;min-height:60px;padding:6px 12px;border:0;border-radius:10px;text-align:left;background:transparent;box-shadow:none;transition:background-color var(--motion-fast)}
.apps-panel .login-app[href]:hover{background:var(--surface-secondary);box-shadow:none}
.apps-panel .login-app-unavailable{border:0;opacity:1;cursor:default}
.apps-panel .login-app:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;background:var(--surface-secondary)}
.apps-panel .login-app-art,.apps-panel .login-app img,.apps-panel .login-app-fallback{width:40px;height:40px}
.apps-panel .login-app-art{filter:drop-shadow(0 12px 18px rgb(15 23 42 / .10))}
.apps-panel .login-app-copy{flex:1;min-width:0;width:auto}
.apps-panel .login-app-name{font-size:1rem;line-height:1.4;font-weight:700;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.apps-panel .login-app-subtitle{margin-top:4px;font-size:.875rem;line-height:1.45;font-weight:400;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
@container korax-apps-panel (min-width:1400px){
 .apps-panel-layout{gap:36px}.apps-panel-intro{padding-right:36px;gap:20px}
 .apps-panel .login-app-grid{gap:6px 32px;grid-auto-rows:minmax(72px,auto)}
 .apps-panel .login-app{min-height:72px;gap:16px}
 .apps-panel .login-app-art,.apps-panel .login-app img,.apps-panel .login-app-fallback{width:48px;height:48px}
 .apps-panel .login-app-name{font-size:1.25rem}.apps-panel .login-app-subtitle{font-size:1rem}
}
@container korax-apps-panel (max-width:980px){
 .apps-panel-layout{grid-template-columns:minmax(0,1fr);gap:16px}
 .apps-panel-intro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 24px;padding:0 0 16px;border-right:0;border-bottom:1px solid var(--border-subtle)}
 .apps-panel-eyebrow{justify-self:start;grid-column:1/-1}
 .apps-panel-intro h2{font-size:1.625rem;max-width:320px}
 .apps-panel-explore{align-self:end;margin:0;font-size:.875rem}
 .apps-panel .login-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container korax-apps-panel (max-width:520px){
 .apps-panel-intro{display:flex;gap:10px;padding-bottom:14px}
 .apps-panel-intro h2{max-width:260px;font-size:1.5rem}
 .apps-panel-explore{align-self:flex-start}
 .apps-panel .login-app-grid{grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(60px,auto);gap:4px}
 .apps-panel .login-app{min-height:60px;gap:14px}
}
@media(max-width:767px){.apps-panel.apps-panel{padding:16px 20px;border-radius:16px}}
@media(prefers-reduced-motion:reduce){.apps-panel-explore svg,.apps-panel .login-app{transition:none}.apps-panel-explore:hover svg{transform:none}}
@media(forced-colors:active){.apps-panel.apps-panel{border-color:CanvasText;box-shadow:none}.apps-panel-intro{border-color:CanvasText}.apps-panel .login-app-art{filter:none}}