/* 1. Header brand badge (replaces decorative robot) */
.brand-badge{display:block;flex:none;width:132px;height:52px;line-height:0}
.brand-badge svg{display:block;width:100%;height:100%;overflow:visible}
@media (max-width:900px){.brand-badge{width:99px;height:39px}}
@media (max-width:719px){.brand-badge{display:none}}
@keyframes apb-blink{0%,93%,100%{transform:scaleY(1)}95.5%{transform:scaleY(.12)}}
/* 2. Crew desk strip: honest, static status lines that cycle (no data, no quotes) */
.desk{height:30px;overflow:hidden;background:var(--black);border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.72rem;color:var(--muted);contain:layout paint}
.desk .wrap{display:flex;align-items:center;gap:10px;height:30px}
.desk-tag{flex:none;display:flex;align-items:center;gap:6px;color:var(--gold);text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;font-weight:600}
.desk-tag svg{display:block;width:14px;height:14px}
.desk-eyes{transform-box:fill-box;transform-origin:center;animation:apb-blink 5.6s 1.2s infinite}
.desk-lines{position:relative;flex:1;min-width:0;height:30px;margin:0;padding:0;list-style:none}
.desk-lines li{position:absolute;left:0;right:0;top:0;height:30px;line-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;animation:desk-cycle 16s infinite}
.desk-lines li:nth-child(1){opacity:1}
.desk-lines li:nth-child(2){animation-delay:-12s}
.desk-lines li:nth-child(3){animation-delay:-8s}
.desk-lines li:nth-child(4){animation-delay:-4s}
.desk-lines b{color:var(--text);font-weight:600}
.desk:hover .desk-lines li,.desk:focus-within .desk-lines li{animation-play-state:paused}
@keyframes desk-cycle{0%,21%{opacity:1;transform:translateY(0)}25%{opacity:0;transform:translateY(-8px)}25.1%,95.9%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
@media (max-width:520px){.desk{font-size:.66rem}.desk-tag span{display:none}.desk .wrap{padding:0 14px}}

/* 3a. Footer: a small robot sweeping the gold footer line */
.foot{position:relative}
.foot-sweep{position:absolute;left:0;right:0;top:-22px;height:20px;max-width:var(--max);margin:0 auto;overflow:hidden;pointer-events:none}
.sweep-track{width:100%;height:20px;transform:translateX(18px);animation:sweep-move 30s linear infinite}
.sweep-bot{display:block;width:30px;height:20px;animation:sweep-face 30s steps(1) infinite}
.sweep-broom{transform-box:view-box;transform-origin:8px 9px;animation:sweep-brush .6s ease-in-out infinite alternate}
@keyframes sweep-move{0%{transform:translateX(18px)}46%,50%{transform:translateX(calc(100% - 48px))}96%,100%{transform:translateX(18px)}}
@keyframes sweep-face{0%{transform:scaleX(1)}48%{transform:scaleX(-1)}98%{transform:scaleX(1)}}
@keyframes sweep-brush{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}

/* 3b. Side gridlines that draw in (wide screens only) */
.sidegrid{display:none}
@media (min-width:900px){
.sidegrid{display:block;position:fixed;top:0;bottom:0;width:44px;z-index:-1;pointer-events:none;overflow:hidden;opacity:.6;transform-origin:50% 0;animation:sg-draw 1.8s cubic-bezier(.2,.7,.2,1) .3s both;
  background:linear-gradient(to bottom,transparent,rgba(227,166,59,.30) 10%,rgba(227,166,59,.30) 90%,transparent) 10px 0/1px 100% no-repeat,
  linear-gradient(to bottom,transparent,rgba(255,255,255,.07) 15%,rgba(255,255,255,.07) 85%,transparent) 30px 0/1px 100% no-repeat,
  repeating-linear-gradient(to bottom,rgba(227,166,59,.20) 0 1px,transparent 1px 56px) 4px 0/14px 100% no-repeat}
.sg-l{left:0}
.sg-r{right:0;scale:-1 1}
.sidegrid::after{content:"";position:absolute;left:9px;top:0;width:3px;height:140px;background:linear-gradient(to bottom,transparent,rgba(243,196,107,.75),transparent);opacity:0;animation:sg-glint 12s linear 2.4s infinite}
.sg-r::after{animation-delay:8.4s}
}
@keyframes sg-draw{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes sg-glint{0%{transform:translateY(-140px);opacity:0}5%{opacity:1}45%{transform:translateY(100vh);opacity:1}46%,100%{transform:translateY(100vh);opacity:0}}

/* Reduced motion: everything static (first desk line, mascot at rest, broom parked, gridlines drawn) */
@media (prefers-reduced-motion:reduce){
.brand-badge *,.desk-eyes,.desk-lines li,.sweep-track,.sweep-bot,.sweep-broom,.sidegrid,.sidegrid::after{animation:none!important}
.apb-card>g:nth-child(1),.desk-lines li:nth-child(1){opacity:1}
.sidegrid::after{display:none}
}
@media print{.brand-badge,.desk,.foot-sweep,.sidegrid{display:none}}
