/* C-015. One shared light canvas. White lifts functioning concept UI only.
   Layers: scene 0, native screen 1, control/focus 2; no scroll pinning. */
.aios-section { padding-bottom:72px; }
.agent-section,.cloud-section { padding-top:88px; }
.product-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:24px; }
.product-toolbar>strong { font-size:24px; letter-spacing:-.025em; }
.view-switch { border:0; padding:0; margin:0; display:flex; gap:24px; }
.view-switch label { position:relative; cursor:pointer; }
.view-switch input { position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.view-switch span { display:flex; align-items:center; min-height:48px; border-bottom:2px solid transparent; color:var(--muted); }
.view-switch input:checked+span { color:var(--ink); border-bottom-color:var(--accent); }
.view-switch input:focus-visible+span { outline:2px solid var(--accent); outline-offset:4px; }
.cockpit-product { position:relative; aspect-ratio:2; border-radius:28px; overflow:hidden; isolation:isolate; }
.cockpit-hardware { width:100%; height:100%; object-fit:cover; }
.hmi-live-screen { position:absolute; left:24.1%; top:24.8%; width:64.5%; height:53.6%; padding:16px; border-radius:6px; overflow:hidden; background:var(--surface); display:flex; flex-direction:column; }
.screen-homebar { display:flex; justify-content:space-between; align-items:center; font-size:16px; margin-bottom:12px; gap:16px; }
.screen-homebar>span:first-child { display:flex; align-items:center; gap:8px; font-size:16px; }
.screen-homebar .icon { width:20px; height:20px; }
.screen-homebar>span:last-child { color:var(--muted); }
.hmi-live-grid { display:grid; grid-template-columns:1.8fr 1fr; gap:12px; min-height:0; flex:1; }
.hmi-navigation,.hmi-content { position:relative; overflow:hidden; border-radius:12px; min-width:0; }
.hmi-content img { width:100%; height:100%; object-fit:cover; }
.hmi-content>div { position:absolute; inset:0; color:#fff; background:linear-gradient(transparent 30%,#070b10d9); display:flex; flex-direction:column; justify-content:flex-end; padding:20px; }
.hmi-content strong { font-size:24px; line-height:1.3; }
.hmi-content span { margin-top:4px; }
.map-art { position:absolute; inset:0; background:var(--canvas); overflow:hidden; }
.map-art>img,.map-art>.map { position:absolute; inset:0; width:100%; height:100%; }
.map-art>img { object-fit:cover; }
.destination-callout { position:absolute; left:18px; bottom:18px; display:flex; align-items:center; gap:12px; background:#fff; padding:12px 18px; border-radius:12px; box-shadow:0 4px 16px #1717170d; }
.destination-callout strong,.destination-callout span { display:block; }
.destination-callout span { color:var(--muted); font-size:16px; }
.hmi-assistant { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:12px; font-size:16px; }
.hmi-assistant>span:first-child { display:flex; align-items:center; gap:10px; }
.hmi-assistant>span:last-child { color:var(--muted); font-size:16px; }
.cockpit-experience:has([value=content]:checked) .hmi-live-grid { grid-template-columns:1fr 1.8fr; }
.cockpit-experience:has([value=content]:checked) .hmi-content { grid-column:1; grid-row:1; }
.cockpit-experience:has([value=content]:checked) .hmi-navigation { grid-column:2; grid-row:1; }
.product-caption { display:flex; justify-content:space-between; gap:24px; margin-top:20px; color:var(--muted); }
.product-caption>span { font-size:16px; flex:none; padding-top:2px; }
.aios-explanation { display:grid; grid-template-columns:1.1fr 1fr; gap:16px 72px; margin-top:48px; }
.aios-explanation h3 { font-size:24px; line-height:1.4; }
.aios-explanation p { color:var(--muted); margin-top:12px; }
.aios-explanation ul { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.aios-explanation li { display:flex; gap:14px; align-items:center; }
.agent-experience { position:relative; padding-top:16px; }
.task-device { position:relative; border:1px solid #17171738; border-radius:28px; overflow:hidden; background:var(--surface); box-shadow:0 12px 36px #1717170a; }
.device-top { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 28px; }
.device-top>span:first-child { display:flex; gap:10px; align-items:center; }
.device-top>span:last-child { font-size:16px; color:var(--muted); }
.charge-body { position:relative; display:flow-root; min-height:400px; }
.charge-map { position:absolute; inset:0; min-width:0; overflow:hidden; }
.charge-map .map-routes { opacity:0; }
.task-device[data-state=navigate] .charge-map .map-routes { opacity:1; }
.task-device[data-state=remind] .station-marker,.task-device[data-state=dismiss] .station-marker { visibility:hidden; }
.station-marker { position:absolute; top:40%; left:44%; background:#fff; padding:8px 12px; border-radius:12px; box-shadow:0 4px 12px #1717170a; display:flex; align-items:center; gap:8px; font-size:16px; }
.station-marker .icon { width:20px; height:20px; }
.map-current { position:absolute; top:74%; left:19%; display:flex; gap:8px; align-items:center; font-size:16px; }
.map-current>.icon { width:20px; height:20px; color:var(--accent); }
.charge-assistant { position:relative; margin:28px 28px 28px auto; width:40%; min-width:0; padding:28px; background:#fff; border-radius:18px; border:1px solid #1717171a; box-shadow:0 8px 24px #1717170a; min-height:300px; }
.experience-enhanced .charge-assistant { display:grid; }
.experience-enhanced .charge-state { grid-area:1 / 1; }
/* Reserve the tallest state's intrinsic size; hidden states remain inert and aria-hidden. */
.experience-enhanced .charge-state[hidden] { display:block!important; visibility:hidden; pointer-events:none; }
.assistant-symbol { display:block; margin-bottom:16px; }
.assistant-symbol>.icon { width:32px; height:32px; stroke-width:1.3; }
.charge-state h3 { font-size:24px; line-height:1.4; letter-spacing:-.02em; }
.charge-state>p { color:var(--muted); margin-top:12px; }
.charge-actions { margin-top:24px; display:flex; align-items:flex-start; flex-wrap:wrap; gap:8px 12px; }
.charge-actions .button { padding:11px 18px; gap:10px; min-height:46px; border:0; }
.subtle-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:46px; padding:10px 12px; border:0; background:transparent; border-radius:12px; }
.subtle-button .icon { width:18px; height:18px; }
.station-selection { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 20px; padding-block:18px; margin-top:10px; border-bottom:1px solid var(--line); }
.station-selection>span { color:var(--muted); }
.experience-condition { color:var(--muted); margin-top:24px; }
html:not(.experience-enhanced) .charge-state[data-charge-state=dismiss],html:not(.experience-enhanced) .charge-state button { display:none; }
html:not(.experience-enhanced) .charge-state + .charge-state { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
html:not(.experience-enhanced) .charge-map .map-routes { opacity:1; }
.agent-roles { display:grid; grid-template-columns:1fr 1fr 1.5fr; align-items:start; gap:40px; margin-top:48px; }
.agent-roles h3 { font-size:24px; line-height:1.4; }
.agent-roles p { color:var(--muted); margin-top:8px; }
.agent-roles>p { margin:0; }
.intelligence-story { display:grid; grid-template-columns:1.1fr 1fr; gap:64px; align-items:center; margin-top:88px; }
.intelligence-image { position:relative; overflow:hidden; border-radius:28px; }
.intelligence-image img { width:100%; height:340px; object-fit:cover; object-position:25% center; }
.intelligence-image>span { position:absolute; left:20px; bottom:20px; font-size:16px; color:#fff; padding:6px 10px; background:#070b10bf; border-radius:8px; }
.intelligence-copy h3 { font-size:24px; line-height:1.4; }
.intelligence-copy p { color:var(--muted); margin-top:18px; }
.intelligence-copy .foundation { padding-top:20px; border-top:1px solid var(--line); }
.foundation strong { display:block; color:var(--ink); }
.foundation span { display:block; margin-top:4px; }
.cloud-editorial { display:grid; grid-template-columns:1fr 1.15fr; gap:72px; align-items:center; }
.cloud-introduction h2 { line-height:1.16; }
.cloud-introduction h2>span { display:block; }
.cloud-introduction .lead { margin-top:24px; }
.cloud-concept-note { margin-top:24px; color:var(--muted); }
.cloud-product { background:var(--surface); border:1px solid #17171724; border-radius:28px; box-shadow:0 12px 36px #1717170a; overflow:hidden; min-width:0; }
.cloud-product>header { display:flex; align-items:center; justify-content:space-between; padding:24px 28px; border-bottom:1px solid var(--line); gap:16px; }
.cloud-product>header>strong { display:flex; align-items:center; gap:10px; font-size:18px; }
.cloud-product>header>span { color:var(--muted); font-size:16px; }
.cloud-service-heading { display:flex; align-items:center; gap:16px; margin:28px 28px 24px; }
.service-glyph { padding:12px; border:1px solid var(--line); border-radius:14px; }
.service-glyph>.icon { width:32px; height:32px; }
.cloud-service-heading>div>span { color:var(--muted); font-size:16px; }
.cloud-service-heading h3 { font-size:24px; line-height:1.4; }
.connection-form { padding:0 28px 28px; }
.connection-form fieldset { border:0; padding:0; margin:0 0 24px; }
.connection-form legend { padding:0; margin-bottom:12px; font-weight:550; }
.connection-method { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.connection-method label { display:block; cursor:pointer; position:relative; }
.connection-method input { position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.connection-method label>span { border:1px solid #17171740; border-radius:12px; display:flex; align-items:center; justify-content:center; gap:12px; padding:12px; min-height:48px; }
.connection-method input:checked+span { border-color:var(--ink); box-shadow:inset 0 0 0 1px var(--ink); }
.connection-method input:focus-visible+span { outline:2px solid var(--accent); outline-offset:4px; }
.connection-scope { display:flex; gap:24px; }
.connection-scope label { display:flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; }
.connection-scope input { width:18px; height:18px; accent-color:var(--ink); }
.connection-summary { padding:20px 0; border-block:1px solid var(--line); }
.connection-summary>span { color:var(--muted); font-size:16px; }
.connection-summary>p { margin-top:8px; }
.connection-summary>p strong { margin-right:8px; }
.scope-preview { display:flex; flex-wrap:wrap; gap:16px; }
.connection-summary>.mcp-preview,.scope-empty { display:none; }
.connection-form:has([value=mcp]:checked) .api-preview { display:none; }
.connection-form:has([value=mcp]:checked) .mcp-preview { display:block; }
.connection-form:not(:has([value=model]:checked)) .scope-model,.connection-form:not(:has([value=business]:checked)) .scope-business { display:none; }
.connection-form:not(:has(.connection-scope input:checked)) .scope-empty { display:inline; color:var(--accent); }
.text-action { border:0; background:transparent; display:flex; align-items:center; gap:12px; min-height:48px; padding:8px 0; margin-top:12px; font-weight:550; }
.connection-result { margin-top:12px; padding-left:16px; border-left:2px solid var(--ink); color:var(--muted); }
.connection-result[data-error=true] { border-left-color:var(--accent); color:var(--accent); }
html:not(.experience-enhanced) .connection-form .text-action { display:none; }
.cloud-product-footer { display:flex; align-items:flex-start; gap:12px; padding:20px 28px; border-top:1px solid var(--line); color:var(--muted); }
.cloud-product-footer .icon { margin-top:2px; width:20px; height:20px; }
.cloud-followthrough { margin-top:48px; display:grid; grid-template-columns:1fr 1.6fr; gap:8px 48px; }
.cloud-followthrough h3 { font-size:24px; line-height:1.4; }
.cloud-followthrough p,.cloud-followthrough>span { color:var(--muted); }
.cloud-followthrough>span { grid-column:2; }
/* SOL-046: one directory grammar; existing task palettes are limited to icon wells. */
.catalog-section { border-top:1px solid var(--line); padding-block:48px 64px; }
.catalog-intro h2 { font-size:24px; line-height:1.4; letter-spacing:-.02em; }
.catalog-intro p { color:var(--muted); margin-top:8px; }
.catalog-directory { margin-top:32px; }
.catalog-band { display:grid; grid-template-columns:144px minmax(0,1fr); gap:40px; padding-block:24px; }
.catalog-band:first-child { padding-top:0; }
.catalog-band + .catalog-band { border-top:1px solid var(--line); }
.catalog-band>h3 { font-size:16px; line-height:1.5; font-weight:550; color:var(--muted); padding-top:4px; }
.catalog-entries { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:start; }
.catalog-entry { display:grid; grid-template-columns:40px minmax(0,1fr); align-items:start; gap:16px; min-width:0; }
.catalog-entry h4 { font-size:16px; line-height:1.5; letter-spacing:0; font-weight:600; }
.catalog-entry p { font-size:18px; line-height:1.7; color:var(--muted); margin-top:4px; }
.catalog-mark { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; flex:none; }
.catalog-mark>.icon { width:24px; height:24px; }
.catalog-mark.task-surface { padding:0; border-radius:12px; }
.catalog-mark.task-surface::before { width:100%; height:100%; background-size:100px 56px; }
.catalog-core .catalog-entry h4 { font-size:16px; }
.catalog-core .catalog-mark { border:1px solid #17171740; }
.scenario-index .catalog-entries { row-gap:8px; }
.scenario-group,.scenario-group ul { display:contents; }
.scenario-group h4 { display:none; }
.scenario-group .catalog-entry { align-items:center; min-height:32px; font-size:16px; line-height:1.5; }
.scenario-group .catalog-mark { height:32px; color:var(--muted); }
.scenario-group .icon { width:20px; height:20px; }
.index-condition { color:var(--muted); font-size:18px; margin-top:20px; max-width:920px; }
@media (hover:hover) and (pointer:fine) {
 .view-switch label:hover span,.subtle-button:hover,.text-action:hover { color:var(--accent); }
 .connection-method label:hover>span { border-color:var(--ink); }
}
@media (max-width:1100px) {
 .hmi-live-screen { padding:12px; }
 .hmi-content>div { padding:12px; }
 .hmi-assistant>span:last-child { display:none; }
 .cloud-editorial { gap:40px; }
 .agent-roles { gap:24px; }
 .intelligence-story { gap:40px; }
}
@media (max-width:900px) {
 .catalog-band { grid-template-columns:112px minmax(0,1fr); gap:24px; }
 .catalog-entries { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; }
 .catalog-intro h2 { font-size:22px; }
 .catalog-entry { gap:12px; }

 .product-toolbar>strong,.hmi-content strong,.aios-explanation h3,.charge-state h3,.agent-roles h3,.intelligence-copy h3,.cloud-service-heading h3,.cloud-followthrough h3 { font-size:22px; }
 .cockpit-product { aspect-ratio:auto; overflow:visible; }
 .cockpit-hardware { display:none; }
 .hmi-live-screen { position:relative; top:auto; left:auto; width:100%; height:360px; margin:0; padding:20px; border:6px solid #171717; border-radius:20px; }
 .product-caption { display:block; }
 .product-caption>span { display:block; margin-top:8px; }
 .aios-explanation { gap:16px 32px; }
 .charge-assistant { width:49%; margin:24px 24px 24px auto; padding:24px; }
 .station-marker { font-size:16px; padding:8px; }
 .station-marker>.icon { display:none; }
 .charge-state .button { padding:11px 14px; }
 .agent-roles { grid-template-columns:1fr 1fr; }
 .agent-roles>p { grid-column:1/-1; }
 .intelligence-story { grid-template-columns:1fr; gap:28px; }
 .intelligence-image img { height:auto; aspect-ratio:1.9; object-position:center; }
 .cloud-editorial { grid-template-columns:1fr; gap:40px; }
 .cloud-introduction h2>span { display:inline; }
 .cloud-product { width:100%; }
 .cloud-followthrough { grid-template-columns:1fr; gap:12px; }
 .cloud-followthrough>span { grid-column:1; }
}
@media (max-width:620px) {
 .catalog-section { padding-block:40px; }
 .catalog-directory { margin-top:24px; }
 .catalog-band { display:block; padding-block:20px; }
 .catalog-band>h3 { margin-bottom:16px; padding:0; }
 .catalog-entries { gap:20px 16px; }
 .catalog-entry { grid-template-columns:24px minmax(0,1fr); gap:8px; }
 .catalog-entry h4,.catalog-core .catalog-entry h4 { font-size:16px; }
 .catalog-entry p { margin-top:4px; }
 .catalog-mark { width:24px; height:24px; border-radius:8px; }
 .catalog-mark>.icon { width:20px; height:20px; }
 .catalog-mark.task-surface { border-radius:8px; }
 .catalog-core .catalog-mark { border:0; }
 .scenario-index .catalog-entries { row-gap:8px; }
 .scenario-group .catalog-mark { height:28px; }
 .scenario-group .icon { width:18px; height:18px; }
 .additional-index .catalog-entry:last-child { grid-column:1/-1; }
 .index-condition { margin-top:16px; }

 .aios-section { padding-bottom:56px; }
 .agent-section,.cloud-section { padding-top:72px; }
 .product-toolbar { display:block; margin-bottom:20px; }
 .view-switch { margin-top:12px; gap:24px; }
 .cockpit-hardware { aspect-ratio:1.5; border-radius:18px; }
 .hmi-live-screen { width:100%; height:332px; margin:0; padding:16px; border-radius:18px; border-width:4px; }
 .hmi-live-grid { grid-template-columns:1.25fr 1fr; }
 .cockpit-experience:has([value=content]:checked) .hmi-live-grid { grid-template-columns:1.25fr 1fr; }
 .hmi-content>div { padding:14px; }
 .hmi-content strong { font-size:22px; }
 .hmi-content span { font-size:16px; }
 .destination-callout { left:8px; right:8px; bottom:10px; padding:10px; display:block; }
 .destination-callout>.icon { width:20px; height:20px; margin-bottom:8px; }
 .destination-callout span { display:none; }
 .hmi-assistant { font-size:16px; padding-top:16px; }
 .hmi-assistant .icon { width:20px; }
 .product-caption { margin-top:20px; }
 .aios-explanation { display:block; margin-top:32px; }
 .aios-explanation ul { margin-top:24px; gap:16px; }
 .agent-experience { padding-top:0; }
 .task-device { margin:0; padding:0; border-radius:18px; box-shadow:none; }
 .device-top { display:block; padding:20px; }
 .device-top>span:last-child { display:block; margin-top:8px; }
 .charge-body { display:flex; flex-direction:column; gap:0; min-height:0; }
 .charge-map { position:relative; inset:auto; min-height:156px; width:100%; border-radius:0; }
 .station-marker { left:42%; top:30%; }
 .map-current { top:74%; left:19%; }
 .charge-assistant { width:100%; min-height:244px; margin:0; padding:24px 20px; border:0; border-radius:0; box-shadow:none; }
 .assistant-symbol { margin-bottom:12px; }
 .assistant-symbol>.icon { width:28px; height:28px; }
 .charge-state h3 { font-size:22px; }
 .charge-actions { margin-top:20px; gap:4px 8px; }
 .charge-state .button { padding:11px 14px; }
 .subtle-button { padding:10px 8px; }
 .experience-condition { margin-left:0; margin-top:20px; }
 .agent-roles { margin-top:32px; gap:20px 24px; }
 .agent-roles h3 { font-size:16px; }
 .intelligence-story { display:block; margin-top:56px; }
 .intelligence-image { border-radius:18px; }
 .intelligence-image img { height:260px; aspect-ratio:auto; object-position:25% center; }
 .intelligence-copy { margin-top:24px; }
 .intelligence-copy p { margin-top:16px; }
 .cloud-editorial { gap:32px; }
 .cloud-product { border-radius:18px; }
 .cloud-product>header { padding:20px; gap:12px; }
 .cloud-product>header>strong { font-size:16px; }
 .cloud-product>header .icon { width:20px; height:20px; }
 .cloud-service-heading { margin:24px 20px; gap:12px; }
 .service-glyph { padding:10px; }
 .service-glyph>.icon { width:24px; height:24px; }
 .connection-form { padding:0 20px 20px; }
 .connection-method { gap:12px; }
 .connection-method label>span { gap:8px; padding:10px; }
 .connection-method .icon { width:20px; height:20px; }
 .connection-scope { gap:16px; }
 .cloud-product-footer { padding:20px; }
 .cloud-followthrough { margin-top:32px; }
}
.experience-background :is(#solution-offerings,#agent-matrix-b,#ai-cloud) .icon { transition:none; }
@media (prefers-reduced-motion:reduce) { .experience-enhanced .map-routes { transition:none; } }