.backplane-board-demo{border:1px solid var(--val-border);border-radius:var(--radius-card);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#ffffff0a,#ffffff03);flex-direction:column;gap:1.25rem;padding:clamp(1.1rem,2.5vw,1.75rem);display:flex}.backplane-board-demo__agent{align-items:center;gap:.95rem;display:flex}.backplane-board-demo__figure{border:1px solid color-mix(in srgb,var(--demo-role-accent,var(--val-signal))55%,var(--val-border));background:color-mix(in srgb,var(--demo-role-accent,var(--val-signal))14%,transparent);border-radius:999px;flex-shrink:0;width:3rem;height:3rem;transition:border-color .35s,background .35s;position:relative}.backplane-board-demo__head{background:#00000059;border-radius:.45rem;justify-content:center;align-items:center;gap:.35rem;display:flex;position:absolute;inset:.85rem .7rem .6rem}.backplane-board-demo__eye{background:var(--demo-role-accent,var(--val-signal));border-radius:999px;width:.24rem;height:.24rem;animation:4.2s step-end infinite backplane-board-demo-blink}.backplane-board-demo__hat{background:var(--demo-role-accent,var(--val-signal));transition:width .3s,height .3s,border-radius .3s,background .35s;position:absolute;top:.05rem;left:50%;translate:-50%}.backplane-board-demo__hat[data-role=planner]{border-radius:.1rem .1rem .4rem .4rem;width:1.5rem;height:.42rem}.backplane-board-demo__hat[data-role=coder]{border-radius:.6rem .6rem 0 0;width:1.35rem;height:.6rem}.backplane-board-demo__hat[data-role=reviewer]{border-radius:999px;width:1.7rem;height:.3rem}.backplane-board-demo__hat[data-role=validator]{clip-path:polygon(50% 0,100% 100%,0 100%);border-radius:.2rem .2rem 0 0;width:.95rem;height:.72rem}.backplane-board-demo__agent-meta{flex-direction:column;justify-content:center;gap:.25rem;min-width:0;min-height:3.5rem;display:flex}.backplane-board-demo__role{font-family:var(--val-font-mono),monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--demo-role-accent,var(--val-signal));font-size:.68rem}.backplane-board-demo__role[data-idle=true]{color:var(--val-muted-deep)}.backplane-board-demo__role[data-role=planner]{--demo-role-accent:#7aa2f7}.backplane-board-demo__role[data-role=coder]{--demo-role-accent:#e0af68}.backplane-board-demo__role[data-role=reviewer]{--demo-role-accent:#bb9af7}.backplane-board-demo__role[data-role=validator]{--demo-role-accent:#4f8a67}.backplane-board-demo__hint{color:var(--val-muted);font-size:.82rem;line-height:1.5}.backplane-board-demo__telemetry{flex-direction:column;gap:.2rem;display:flex}.backplane-board-demo__telemetry-main{color:var(--val-foreground-soft);font-size:.82rem;line-height:1.4}.backplane-board-demo__telemetry-row{font-family:var(--val-font-mono),monospace;letter-spacing:.06em;color:var(--val-muted-deep);font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.68rem;display:flex}.backplane-board-demo__figure[data-complete=true]{animation:.9s ease-out backplane-agent-celebrate;box-shadow:0 0 0 3px #4f8a672e}.backplane-board-demo__figure[data-complete=true] .backplane-board-demo__hat{opacity:0}@keyframes backplane-agent-celebrate{0%{transform:translateY(0)scale(1)}35%{transform:translateY(-9px)scale(1.06)}60%{transform:translateY(0)scale(.98)}to{transform:translateY(0)scale(1)}}.backplane-board-demo__agent[data-complete=true] .backplane-board-demo__role{color:var(--demo-role-accent)}.backplane-board-demo__board{grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;display:grid}.backplane-board-demo__column{border:1px solid var(--val-border);border-radius:var(--radius-button);background:#00000038;flex-direction:column;gap:.6rem;height:21.5rem;padding:.7rem;display:flex}.backplane-board-demo__column[data-drop-target=true]{border-color:var(--val-foreground-soft);background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff14}.backplane-board-demo__column-head{font-family:var(--val-font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--val-muted-deep);justify-content:space-between;align-items:center;gap:.5rem;font-size:.62rem;display:flex}.backplane-board-demo__count{border:1px solid var(--val-border);color:var(--val-muted);border-radius:999px;padding:.05rem .4rem;font-size:.6rem}.backplane-board-demo__stack{flex-direction:column;flex:1;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.backplane-board-demo__card{border:1px solid var(--val-border-strong);color:#ffffffc7;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:#121316eb;border-radius:.7rem;flex-direction:column;gap:.3rem;padding:.6rem .7rem;font-size:.78rem;line-height:1.35;transition:border-color .25s,background-color .25s,box-shadow .25s;display:flex}.backplane-board-demo__card:focus-visible{outline:2px solid var(--val-signal-bright);outline-offset:2px}@media (hover:hover){.backplane-board-demo__card:not([data-agent=true]):not([data-held=true]):hover{border-color:var(--val-foreground-soft);background:#1e2024f2;box-shadow:0 2px 10px #00000059}}.backplane-board-demo__card[data-agent=true]{border-color:color-mix(in srgb,var(--demo-role-accent,var(--val-signal))70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--demo-role-accent,var(--val-signal))35%,transparent)}.backplane-board-demo__card[data-held=true]{z-index:30;cursor:grabbing;box-shadow:var(--shadow-soft);border-color:var(--val-foreground-soft);transition:none}.backplane-board-demo__card-title{color:var(--val-foreground-soft);font-weight:500}.backplane-board-demo__card-role{font-family:var(--val-font-mono),monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--demo-role-accent,var(--val-signal));font-size:.56rem}@keyframes backplane-board-demo-blink{0%,92%{opacity:1}94%,97%{opacity:.15}to{opacity:1}}@media (max-width:720px){.backplane-board-demo__board{scroll-snap-type:x proximity;overscroll-behavior-x:contain;padding-bottom:.4rem;display:flex;overflow-x:auto}.backplane-board-demo__column{scroll-snap-align:start;flex:0 0 11.5rem}.backplane-board-demo__agent-meta{min-height:4.6rem}}.backplane-board-demo__card[data-landed=true]{animation:.46s ease-out backplane-drop-pulse}@keyframes backplane-drop-pulse{0%{border-color:var(--val-foreground);box-shadow:0 0 #ffffff38}to{border-color:var(--val-border-strong);box-shadow:0 0 0 10px #fff0}}.backplane-board-demo__board{position:relative}.backplane-board-demo__column{transition:opacity .6s}.backplane-board-demo__board[data-phase=clearing] .backplane-board-demo__column,.backplane-board-demo__board[data-phase=loading] .backplane-board-demo__column{opacity:0;pointer-events:none}.backplane-board-demo__board[data-phase=loading] .backplane-board-demo__loader{opacity:1}.backplane-board-demo__loader{z-index:5;opacity:0;font-family:var(--val-font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--val-muted);flex-direction:column;justify-content:center;align-items:center;gap:.75rem;font-size:.7rem;transition:opacity .4s .2s;display:flex;position:absolute;inset:0}.backplane-board-demo__loader-bar{background:linear-gradient(90deg,transparent,var(--val-foreground-soft),transparent);background-repeat:no-repeat;background-size:60% 100%;border-radius:999px;width:7rem;height:2px;animation:1.1s ease-in-out infinite backplane-loader-sweep}@keyframes backplane-loader-sweep{0%{background-position:-60% 0}to{background-position:160% 0}}@media (prefers-reduced-motion:reduce){.backplane-board-demo__figure,.backplane-board-demo__hat,.backplane-board-demo__card{transition:none}.backplane-board-demo__eye,.backplane-board-demo__loader-bar{animation:none}.backplane-board-demo__card[data-landed=true]{border-color:var(--val-foreground);animation:none}.backplane-board-demo__figure[data-complete=true]{animation:none}.backplane-board-demo__column{transition:opacity .2s}}
