/* Loft's light cube surfaces, proportions and request/result hierarchy. */
.page-home .cube-capabilities{background:#fff;padding-top:28px}
.cube-capabilities .dc-section{background:var(--dc-bg)}
.dc-section:has(.dc-graph[data-variant="depth"]){
 --dc-bg:#fff;--dc-surface:#f8f8f5;--dc-card:#fdfdfa;--dc-card-back:#fdfdfa;
 --dc-border:#d5d5ce;--dc-line:#e0ded6;--dc-text:#2e2a27;--dc-muted:#625e58;
 --dc-soft:#77736b;--dc-accent:#416e95;--dc-accent-ink:#2e2a27;--dc-signal:#35312e;--dc-dot:#bebbB2;
 --dc-font:'Instrument Sans','DM Sans',Arial,sans-serif; color-scheme:light;
}
.dc-section .dc-graph[data-variant="depth"]{background:var(--dc-surface);border:1px solid #e0ded6;border-radius:11px}
.dc-graph[data-variant="depth"] .dc-canvas{border-radius:11px}
.dc-graph[data-variant="depth"] .dc-node,.dc-graph[data-variant="depth"] .dc-focus{
 height:38px;padding:0 15px;border:1px solid #e0ded6;border-radius:9px;background:#fdfdfa;
 color:#2e2a27;font-size:14px;font-weight:500;letter-spacing:0;
 box-shadow:0 1px 1px #2824210a,0 8px 16px -10px #28242138;
}
.dc-graph[data-variant="depth"] :is(.dc-node,.dc-focus)::before{display:none}
.dc-graph[data-variant="depth"] .dc-node.is-back{background:#fdfdfa;color:#57524d;box-shadow:0 6px 12px -10px #28242133}
.dc-graph[data-variant="depth"] .dc-node[aria-pressed="true"],.dc-graph[data-variant="depth"] .dc-focus{
 border-color:#416e95;background:#fffffe;color:#2e2a27;
 box-shadow:0 0 0 3px #416e9521,0 10px 20px -10px #233c5a52;
 outline:1px solid #416e95;outline-offset:1px;
}
.dc-graph[data-variant="depth"] .dc-node:focus-visible{outline:2px solid #275e4d;outline-offset:4px}
.dc-graph[data-variant="depth"] .dc-hub{
 width:92px;height:100px;display:flex;flex-direction:column;justify-content:center;gap:6px;
 border:0;border-radius:0;background:transparent;box-shadow:none;
}
.dc-graph[data-variant="depth"] .dc-hub img{width:48px;height:48px;filter:brightness(.27)}
.dc-graph[data-variant="depth"] .dc-hub::after{content:'Prompt';padding:6px 15px 7px;border:1px solid #d8d6cd;border-radius:9px;background:#fdfdfa;box-shadow:0 6px 14px -9px #2824214d;font:500 17px/1 'Manrope',sans-serif;color:#2e2a27}
.dc-graph[data-variant="depth"] .dc-example{min-height:26px;height:26px;padding:0 10px;border:1px solid #cfd9cf;border-radius:7px;background:#fffffd;box-shadow:0 6px 12px -9px #2d463252;font-size:12.5px;font-weight:450;letter-spacing:0;color:#35312e}
.dc-graph[data-variant="depth"] .dc-edge{stroke:#c5c3ba;stroke-width:1.2;stroke-opacity:1}
.dc-graph[data-variant="depth"] .dc-dot:not(.is-on){opacity:1}
.dc-graph[data-variant="depth"] .dc-face{fill:#fff;fill-opacity:.12}
.dc-graph[data-variant="depth"] .dc-spoke{stroke:#c4c2b9;stroke-width:1;stroke-opacity:1;stroke-dasharray:3 4}
.dc-graph[data-variant="depth"] .dc-spoke.is-on{stroke:#416e95;stroke-width:1.3;stroke-dasharray:3 3}
.dc-graph[data-variant="depth"] .dc-branch{stroke:#65836f;stroke-width:1.2;stroke-dasharray:3 4}
.dc-graph[data-variant="depth"] .dc-port{fill:#f8f7f2;stroke:#b6b4ab;stroke-width:1}
.dc-graph[data-variant="depth"] .dc-port.is-on{fill:#fffffd;stroke:#416e95}
.dc-graph[data-variant="depth"] .dc-controls{left:16px;top:14px;border-color:#dddbd2;border-radius:8px;background:#fdfdfa;box-shadow:0 4px 10px -8px #28242140}
.dc-graph[data-variant="depth"] .dc-controls .dc-reset{border-color:#e5e3db;font-size:13px}
.dc-graph[data-variant="depth"] .dc-controls output{font-size:12px}
.dc-graph[data-variant="depth"] .dc-caption{left:18px;bottom:14px;font-size:11px;line-height:1.4}
.dc-graph[data-variant="depth"] .dc-panel{right:20px;top:20px;width:252px;padding:16px 16px 14px;border:1px solid #e0ded6;border-radius:12px;background:#fdfdfa;box-shadow:0 1px 1px #2824210a,0 18px 34px -22px #28242159}
.dc-graph[data-variant="depth"] .dc-panel-top{font-size:11px;line-height:1.4;letter-spacing:.02em}
.dc-graph[data-variant="depth"] .dc-panel h2{margin-top:8px;font-family:var(--dc-font);font-size:18px;font-weight:500;line-height:1.25;letter-spacing:-.1px}
.dc-graph[data-variant="depth"] .dc-request-group{margin-top:10px;padding:8px 10px;border-radius:8px 8px 8px 2px;background:#f0efe9}
.dc-graph[data-variant="depth"] .dc-field-label{font-size:10px;line-height:1.4;letter-spacing:.08em}
.dc-graph[data-variant="depth"] .dc-request{margin-top:3px;font-size:13px;line-height:1.45}
.dc-graph[data-variant="depth"] .dc-result-group{margin-top:12px;padding:0;border:1px solid #dcdfd4;border-radius:8px;background:#fffffc;overflow:hidden}
.dc-graph[data-variant="depth"] .dc-result-group .dc-field-label{padding:6px 10px;border-bottom:1px solid #ebece4;font-size:11px}
.dc-graph[data-variant="depth"] .dc-result{margin:0;padding:10px 11px;font-size:13px;line-height:1.5}
.dc-graph[data-variant="depth"] .dc-result-marker{color:#496b5a}
.dc-graph[data-variant="depth"] .dc-panel-note{margin-top:12px;font-size:11px;line-height:1.45;color:#4f6551}
.dc-graph[data-variant="depth"][data-mode="stacked"] .dc-panel{position:static;width:auto;margin:0 16px 16px;padding:18px 20px 14px;column-gap:24px}
.dc-graph[data-variant="depth"][data-mode="stacked"] .dc-result-group{margin-top:0;padding:0;align-self:start}
.dc-section .dc-graph[data-variant="depth"][data-mode="branch"] .dc-panel{margin:0 16px 16px;padding:16px;border:1px solid #e0ded6}
.dc-section .dc-graph[data-variant="depth"][data-mode="branch"] .dc-hub{width:48px;height:48px;background:transparent;border:0;box-shadow:none}
.dc-graph[data-variant="depth"][data-mode="branch"] .dc-hub::after{display:none}
.dc-section .dc-graph[data-variant="depth"][data-mode="branch"] .dc-hub img{width:32px;height:32px}
.dc-graph[data-variant="depth"][data-mode="branch"] .dc-node{padding-inline:12px}
@media(hover:hover){
 .dc-graph[data-variant="depth"] .dc-node[aria-pressed="false"]:hover{border-color:#c9c7bd;background:#fffffd;color:#2e2a27}
 .dc-graph[data-variant="depth"] .dc-controls button:not([aria-disabled="true"]):hover{background:#eeeDE7;color:#2e2a27}
}

.cube-capabilities .cube-comparison-intro :is(span,p){color:#625e58}
.dc-graph[data-variant="depth"] .dc-node.is-back{border-color:#e0ded6}
/* Keep Loft's 26px normal chips while allowing enlarged text to grow naturally. */
.dc-graph[data-variant="depth"] .dc-example{height:auto;padding-block:5px}