/* Controller guide only. The radio and speed keep their own footer columns.
   Container widths select exactly two rows; narrow screens retain essentials. */
.xbox-key svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.xbox-key svg text{fill:currentColor;stroke:none;text-anchor:middle;font:700 7px/1 sans-serif}
.xbox-key svg .xbox-direction{fill:#f6f5e8;stroke:none}
.xbox-key svg .xbox-click-arrow{stroke-width:2}
.xbox-key:is(.xbox-stick,.xbox-dpad,.xbox-menu,.xbox-view){padding:0;min-width:27px;width:27px}
.xbox-key:is(.xbox-stick,.xbox-menu,.xbox-view){border-radius:50%}
.xbox-key.xbox-trigger{border-radius:5px 5px 10px 10px}
.xbox-key.xbox-shoulder{border-radius:9px 9px 4px 4px}
.xbox-key-pair{display:inline-flex;align-items:center;gap:3px;flex:none}
.xbox-visibility-tip{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;line-height:1.5;color:#d5e0e7;margin:12px 0}
.xbox-visibility-tip>span{font-size:10px;letter-spacing:.035em}
.xbox-connected #xbox-guide:not([hidden]){display:block;container-type:inline-size;min-height:0;max-width:100vw;padding:6px 10px;font-size:10px;line-height:1.15;box-sizing:border-box}
#xbox-guide .xbox-strip-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px 8px;width:100%;max-width:100%;min-width:0}
#xbox-guide .xbox-binding{display:flex;gap:6px;min-width:0;min-height:25px;line-height:1.15;align-items:center}
#xbox-guide .xbox-binding-label{min-width:0;white-space:normal;overflow-wrap:normal;font-size:inherit}
#xbox-guide .xbox-key{height:23px;min-width:24px;padding:0 4px;font-size:10px;box-shadow:0 1px 0 #0008}
#xbox-guide .xbox-key:is(.xbox-a,.xbox-b,.xbox-x,.xbox-y){width:23px;min-width:23px;padding:0;font-size:13px}
#xbox-guide .xbox-key:is(.xbox-stick,.xbox-dpad,.xbox-menu,.xbox-view){width:25px;min-width:25px;padding:0}
#xbox-guide .xbox-key svg{width:23px;height:23px}
#xbox-guide .xbox-key-pair .xbox-key{min-width:22px;padding:0 2px}
#xbox-guide .xbox-tier-2{display:none}
#xbox-guide .xbox-arming{display:block;text-align:center;padding:9px 4px;line-height:1.4}
@container(max-width:619px){
 #xbox-guide .xbox-strip-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px 7px}
 #xbox-guide .xbox-tier-1{display:none}
 #xbox-guide .xbox-binding{gap:4px}
}
@container(min-width:1040px){
 #xbox-guide .xbox-strip-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px 12px}
 #xbox-guide .xbox-tier-2{display:flex}
}
@media(min-width:1900px) and (min-height:700px){
 .xbox-connected #xbox-guide:not([hidden]){padding:8px 12px;font-size:14px}
 #xbox-guide .xbox-binding{gap:7px;min-height:30px}
 #xbox-guide .xbox-key{height:28px;min-width:29px;font-size:12px}
 #xbox-guide .xbox-key:is(.xbox-a,.xbox-b,.xbox-x,.xbox-y){width:28px;min-width:28px;font-size:16px}
 #xbox-guide .xbox-key:is(.xbox-stick,.xbox-dpad,.xbox-menu,.xbox-view){width:30px;min-width:30px}
 #xbox-guide .xbox-key svg{width:28px;height:28px}
}
/* Context sheets have at most eight actions; use the available two rows. */
#xbox-guide[data-mode="map"] .xbox-strip-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#xbox-guide[data-mode="radio"] .xbox-strip-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#xbox-guide:is([data-mode="menu"],[data-mode="display"]) .xbox-strip-grid{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Brief hold feedback stays readable even when the driving guide is hidden. */
#controller-hold[hidden]{display:none}
#controller-hold{position:fixed;left:50%;top:max(135px,calc(var(--drive-header-bottom,100px) + 12px));transform:translateX(-50%);z-index:859;max-width:80vw;padding:10px 16px;border:1px solid #92c4b650;border-radius:12px;background:#142a2ff2;color:#e8fff4;font:13px/1.4 system-ui;pointer-events:none;box-sizing:border-box}
#controller-hold>div{height:3px;margin-top:7px;border-radius:3px;background:#a2c7bc35;overflow:hidden}
#controller-hold i{display:block;height:100%;background:#a6ead3;transform:scaleX(var(--hold-progress,0));transform-origin:left}