/* Scoped to the robot card. Outer deck geometry and animation remain owned by style.css. */
agibot-blueprint {
    --blueprint-ink: #263e50;
    --blueprint-line: #ffffff;
    display: block;
    position: absolute;
    left: 22px;
    top: 58px;
    width: 760px;
    aspect-ratio: 1150 / 633;
    z-index: 2;
    color: var(--blueprint-ink);
    container-type: inline-size;
}

agibot-blueprint .blueprint-scene { position: relative; width: 100%; height: 100%; isolation: isolate; }
agibot-blueprint img { display: block; width: 100%; height: 100%; object-fit: contain; }
agibot-blueprint .blueprint-main { position: absolute; z-index: 2; }
agibot-blueprint .blueprint-heading { position: absolute; }
agibot-blueprint .blueprint-heading-logos { width: max-content; height: 4.8cqw; display: flex; align-items: center; gap: 1cqw; padding: 0 1.4cqw; background: rgba(255, 255, 255, .72); border-radius: 999px; box-sizing: border-box; }
/* Align the visible artwork, compensating for unequal transparent PNG margins.
   Both wrappers inherit the card's skew; no independent rotation is applied. */
agibot-blueprint .blueprint-logo-symbol, agibot-blueprint .blueprint-logo-wordmark { position: relative; display: block; overflow: hidden; flex: none; }
agibot-blueprint .blueprint-logo-symbol { width: 3cqw; height: 3.206cqw; }
agibot-blueprint .blueprint-logo-wordmark { width: 18cqw; height: 2.016cqw; }
agibot-blueprint .blueprint-logo-symbol img { position: absolute; width: 111.964%; height: 104.762%; left: -8.75%; top: -4.762%; }
/* Visible wordmark bounds (alpha > 50): x 68..2104, y 223..451.
   Exclude the nearly invisible lower fringe from optical centering. */
agibot-blueprint .blueprint-logo-wordmark img { position: absolute; width: 106.68%; height: 317.544%; left: -3.34%; top: -97.807%; }
agibot-blueprint .blueprint-model { position: relative; top: .16cqw; font: 300 2.55cqw/1.2 'Arial', sans-serif; letter-spacing: .06em; }
agibot-blueprint .blueprint-heading small { display: block; margin-top: 1.25cqw; font: 1.5cqw/1.4 'Consolas', monospace; letter-spacing: .08em; white-space: nowrap; }

agibot-blueprint .blueprint-engineering { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; overflow: visible; }
agibot-blueprint .blueprint-leader { stroke: var(--blueprint-line); stroke-width: 1.3; }
agibot-blueprint .blueprint-leader path, agibot-blueprint .blueprint-leader circle { vector-effect: non-scaling-stroke; }
agibot-blueprint .blueprint-anchor-point { opacity: .55; stroke-width: .75; }
agibot-blueprint .blueprint-anchor-axis { opacity: .35; stroke-width: .6; }
agibot-blueprint .blueprint-guides { stroke: var(--blueprint-line); stroke-width: .7; opacity: .38; stroke-dasharray: 3 6; }

agibot-blueprint .blueprint-view {
    position: absolute;
    margin: 0;
    padding: 3.4% 1.2% 1.2%;
    border: .8px solid rgba(255, 255, 255, .65);
    border-radius: 10px;
    background: rgba(244, 247, 248, .78);
    box-sizing: border-box;
    z-index: 4;
}
agibot-blueprint .blueprint-view::before, agibot-blueprint .blueprint-view::after {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    pointer-events: none;
}
agibot-blueprint .blueprint-view::before { left: 4px; top: 4px; border-left: 1px solid #9ca6af; border-top: 1px solid #9ca6af; }
agibot-blueprint .blueprint-view::after { right: 4px; bottom: 4px; border-right: 1px solid #9ca6af; border-bottom: 1px solid #9ca6af; }
agibot-blueprint figcaption { position: absolute; top: 8%; left: 5%; font: 1.45cqw/1.2 'Consolas', monospace; letter-spacing: .12em; white-space: nowrap; }
agibot-blueprint .blueprint-detail-art { position: relative; width: 100%; height: 100%; }
agibot-blueprint .blueprint-detail-sketch { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; stroke: #304e64; stroke-width: .95; }
agibot-blueprint .blueprint-detail-sketch * { vector-effect: non-scaling-stroke; }
agibot-blueprint .blueprint-detail-contours { opacity: .8; stroke-dasharray: 18 10 3 10; }

/* The existing site hides this carousel below 1024px; these rules also support standalone reuse. */
@media (max-width: 1400px) { agibot-blueprint { width: 740px; left: 18px; } }
@media (max-width: 1024px) { agibot-blueprint { width: 92%; left: 4%; top: 48px; } }
@media (max-width: 600px) {
    agibot-blueprint .blueprint-part--knee, agibot-blueprint .blueprint-part--foot { display: none; }
}
