.bar-page{background:#090a0a url('../textures/lyft-training-room.png') center top/cover fixed no-repeat;color:#f4f4ef}
.bar-page .bar-main.la-page{width:100%;max-width:none;margin:0;padding:0}
.bar-page .bar-main{margin:0;padding:0;min-width:0}
.bar-page .bar-container{width:calc(100% - 64px);max-width:1240px;margin:0 auto}
.bar-page .bar-hero.la-page-hero{padding:46px 0 24px;margin:0;border:0;border-radius:0;background:linear-gradient(90deg,#090a0ae6,#090a0ad6);box-shadow:none}
.bar-page .bar-hero-copy.la-page-hero__panel{background:none;border:0;border-radius:0;padding:0;box-shadow:none;max-width:680px}
.bar-page .bar-main h1{margin:0;padding-bottom:.2em;color:#f4f4ef;font:700 84px/1.12 'Bebas Neue',Impact,sans-serif;text-transform:uppercase;letter-spacing:0;overflow-wrap:anywhere}
.bar-page .bar-main h1 span{display:block;color:#ff263e;font-size:112px}
.bar-page .bar-main .bar-lede{font:600 20px/1.45 'DM Sans',sans-serif;color:#f4f4ef;max-width:530px;margin:20px 0}
.bar-page .bar-actions{display:flex;align-items:stretch;flex-wrap:wrap;gap:12px;margin:24px 0 30px}
.bar-page .bar-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;max-width:100%;padding:11px 17px;border:1px solid #818b87;border-radius:5px;background:#101514;color:#f4f4ef;text-decoration:none;font-size:14px;font-weight:700;line-height:1.4;text-align:center;overflow-wrap:anywhere}
.bar-page .bar-button-primary{background:#ce102b;border-color:#ff5468;color:#fff}
.bar-page .bar-button:hover{background:#252f2b;border-color:#d8dedb}
.bar-page .bar-button-primary:hover{background:#ac0820}
.bar-page .bar-main .icon{width:25px;height:25px;flex-shrink:0}
.bar-page .bar-product-states{display:grid;gap:18px;max-width:1080px;margin:0 auto}
.bar-page .bar-product-state{position:relative;margin:0;display:grid;grid-template-columns:minmax(0,1fr) 135px;align-items:center;gap:14px}
.bar-page .bar-illustration{display:block;position:relative;width:100%;aspect-ratio:10/1;min-width:0;overflow:hidden;align-self:center}
/* Remove only transparent padding; preserve the full length and both ends. */
.bar-page .bar-illustration img{position:absolute;display:block;top:50%;left:0;width:100%;height:auto;max-width:none;transform:translateY(-46%)}
.bar-page .bar-illustration-angled{width:94%;margin:10px auto;transform:rotate(5deg)}
.bar-page .bar-main .bar-art-caption{max-width:1080px;margin:12px auto 0;color:#c6ceca;font-size:12px}
.bar-page .bar-card .bar-illustration{margin-top:14px;aspect-ratio:7/1}
.bar-page .bar-card-direction{display:flex;justify-content:center;gap:30px;color:#ff5266;margin-top:-10px}
.bar-page .bar-card-direction .icon{width:24px;height:18px}
.bar-page .bar-card-direction .icon:first-child{transform:rotate(180deg)}
.bar-page .bar-step>.bar-illustration{grid-column:1/-1;aspect-ratio:8/1;margin-top:12px}
.bar-page .bar-product-state figcaption{font:16px/1.25 'Bebas Neue',Impact,sans-serif;text-transform:uppercase;color:#f4f4ef}
.bar-page .bar-pull-direction{grid-column:1;display:flex;justify-content:center;gap:100px;color:#ff5266;margin:-8px 0 0}
.bar-page .bar-pull-direction .icon{width:36px;height:24px}
.bar-page .bar-pull-direction .icon:first-child{transform:rotate(180deg)}
.bar-page .bar-band.la-section{margin:0;padding:27px 0;border-top:1px solid #39423d;background:#0b100ff5;border-radius:0}
.bar-page .bar-section-head{display:grid;grid-template-columns:1.05fr 1fr;align-items:start;gap:36px;margin-bottom:20px}
.bar-page .bar-main .bar-eyebrow{margin:0 0 4px;color:#ff6b7b;text-transform:uppercase;font:600 14px/1.3 'Oswald',sans-serif;letter-spacing:0}
.bar-page .bar-main h2{margin:0;padding-bottom:.15em;font:32px/1.2 'Bebas Neue',Impact,sans-serif;color:#f4f4ef;letter-spacing:0;overflow-wrap:anywhere}
.bar-page .bar-main h3{margin:0;font:21px/1.2 'Bebas Neue',Impact,sans-serif;color:#f4f4ef;letter-spacing:0;overflow-wrap:anywhere}
.bar-page .bar-main p{font-size:14px;line-height:1.55;color:#c6ceca;overflow-wrap:anywhere}
.bar-page .bar-section-head>p{margin:0}
.bar-page .bar-features,.bar-page .bar-uses,.bar-page .bar-connections{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.bar-page .bar-card.la-chalk-card,.bar-page .bar-card{border:1px solid #3e4842;border-radius:5px;padding:20px 18px;background:#101715;box-shadow:none;min-width:0;display:grid;grid-template-columns:1fr;align-content:start;gap:10px}
.bar-page .bar-card>.icon{color:#ff4058;width:36px;height:36px;margin-bottom:3px}
.bar-page .bar-card p{margin:0}
.bar-page .bar-card a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;margin-top:10px;color:#ff7d8c;font-size:14px;font-weight:600;text-decoration:none;line-height:1.4;overflow-wrap:anywhere}
.bar-page .bar-card a:hover{text-decoration:underline;color:#ffabb5}
.bar-page .bar-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;list-style:none;margin:0;padding:0}
.bar-page .bar-step{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;border:1px solid #3e4842;border-radius:5px;background:#101715;padding:20px 18px;min-width:0}
.bar-page .bar-step-number{display:grid;place-items:center;width:36px;height:36px;border:1px solid #ff5468;border-radius:50%;background:#bc1230;color:#fff;font:600 22px/1 'Oswald',sans-serif}
.bar-page .bar-step p{margin:9px 0 0}
.bar-page .bar-step-arrow{position:absolute;right:-32px;top:calc(50% - 12px);color:#f4f4ef}
.bar-page .bar-main .bar-safety{margin:18px 0 0;color:#b9c4bd;font-size:13px}
.bar-page .bar-library-status{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:20px 0 0;margin-top:22px;border-top:1px solid #39423d}
.bar-page .bar-library-status p{margin:8px 0 0;max-width:680px}
.bar-page .bar-library-controls{display:grid;gap:10px;min-width:220px}
.bar-page .bar-mode-toggle{display:flex;border:1px solid #77847b;border-radius:4px;overflow:hidden;background:#111715}
.bar-page .bar-mode-toggle button{flex:1;min-width:0;min-height:44px;padding:10px 12px;border:0;background:transparent;color:#d1d9d4;font-size:13px;font-weight:700;line-height:1.4;overflow-wrap:anywhere}
.bar-page .bar-mode-toggle button[aria-pressed=true]{background:#8f192c;color:#fff;box-shadow:inset 0 -3px #ff6b7b}
.bar-page .bar-empty{display:flex;align-items:center;gap:20px;border:1px solid #465149;border-radius:5px;background:#101715;padding:24px}
.bar-page .bar-empty>.icon{width:34px;height:34px;color:#ff6b7b}
.bar-page .bar-empty p{margin:8px 0 0}
.bar-page .bar-main :is(section,[id=bar-movements]){scroll-margin-top:115px}
.bar-page .bar-main :focus-visible{outline:2px solid #ffb0ba;outline-offset:4px}
@media(max-width:1100px){
 .bar-page .bar-container{width:calc(100% - 40px)}
 .bar-page .bar-features,.bar-page .bar-uses,.bar-page .bar-connections{grid-template-columns:repeat(2,minmax(0,1fr))}
 .bar-page .bar-section-head{gap:24px;grid-template-columns:1fr 1fr}
 .bar-page .bar-steps{gap:26px}
 .bar-page .bar-step{padding:16px 12px;grid-template-columns:1fr;gap:12px}
 .bar-page .bar-step-arrow{right:-25px}
 .bar-page .bar-library-status{grid-template-columns:1fr}
 .bar-page .bar-library-controls{grid-template-columns:1fr 1fr}
}
@media(max-width:599px){
 .bar-page .bar-container{width:calc(100% - 32px)}
 .bar-page .bar-hero.la-page-hero{padding:12px 0}
 .bar-page .bar-main h1{font-size:48px}
 .bar-page .bar-main h1 span{font-size:68px}
 .bar-page .bar-main .bar-lede{font-size:18px;margin:12px 0}
 .bar-page .bar-actions{display:grid;gap:10px;margin:14px 0}
 .bar-page .bar-product-states{gap:10px}
 .bar-page .bar-product-state{grid-template-columns:1fr;gap:6px}
 .bar-page .bar-product-state figcaption{grid-row:1;font-size:16px}
 .bar-page .bar-pull-direction{margin:0;gap:80px}
 .bar-page .bar-section-head{grid-template-columns:1fr;gap:12px;margin-bottom:18px}
 .bar-page .bar-band.la-section{padding:24px 0}
 .bar-page .bar-main h2{font-size:30px}
 .bar-page .bar-features,.bar-page .bar-uses,.bar-page .bar-connections{grid-template-columns:1fr;gap:12px}
 .bar-page .bar-card.la-chalk-card,.bar-page .bar-card{padding:18px}
 .bar-page .bar-steps{grid-template-columns:1fr;gap:24px}
 .bar-page .bar-step{grid-template-columns:36px minmax(0,1fr);padding:18px;gap:12px}
 .bar-page .bar-step-arrow{right:calc(50% - 12px);top:auto;bottom:-25px;transform:rotate(90deg)}
 .bar-page .bar-library-controls{grid-template-columns:1fr}
 .bar-page .bar-library-status{gap:18px}
 .bar-page .bar-empty{padding:20px;align-items:flex-start;gap:14px}
 .bar-page .bar-main :is(section,[id=bar-movements]){scroll-margin-top:95px}
}