/* Light CarPlay surfaces and original map control geometry. */
.screen button{transition:transform .18s cubic-bezier(.2,.8,.2,1),background .18s ease,opacity .18s ease}
.screen button:not(:disabled):active{transform:scale(.97)}
.screen .transport button:not(:disabled):hover{opacity:.7}
.screen .transport button:not(:disabled):active{transform:scale(.91);opacity:.55}
.view{animation:carplay-enter .24s cubic-bezier(.2,.8,.2,1) both}
.view-refresh{animation:carplay-refresh .18s ease-out both}
@keyframes carplay-enter{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}
@keyframes carplay-refresh{from{opacity:.65}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.screen button,.view,.view-refresh{animation:none!important;transition:none!important}.screen button:not(:disabled):active,.screen .transport button:not(:disabled):active{transform:none}}
.screen.reduced button:not(:disabled):active{transform:none}
.screen{--map-surface:#1e1e1e;--map-label:#fff;--map-secondary:#ffffff8f;--map-separator:#ffffff1f;--map-control:#64d2ff;--map-shadow:0 4px 30px #0003}
.screen.light{--blue:#007aff;--surface:#f2f2f7;--raised:#fff;--text:#1c1c1e;--secondary:#8e8e93;--line:#3c3c432e;--map-surface:#fffffff5;--map-label:#1c1c1e;--map-secondary:#8e8e93;--map-separator:#3c3c432e;--map-control:#007aff;--map-shadow:0 4px 30px #00000024}
.light .sidebar{background:rgba(246,246,250,.76);color:#1c1c1e}
.light .signal i{background:#1c1c1e}
.light .app-label{background:rgba(246,246,250,.74);color:#1c1c1e;text-shadow:none}
.light .kit-toggle{background:#1c1c1e;mask-image:var(--toggle-image);mask-size:90px 45px;mask-repeat:no-repeat;mask-position:center}
.light .kit-toggle img{opacity:0}
.light .dash-destinations,.light .dash-music{background:rgba(250,250,252,.9);color:#1c1c1e}
.light .dash-now>span:last-child{color:#8e8e93}
.light .dash-seek{background:#3c3c431f}
.light .dash-seek i{background:#1c1c1e}
.light .setting-label{color:#8e8e93}
.light .speed-options button{color:#007aff;background:#f2f2f7}
.light .speed-options button[aria-pressed=true]{background:#007aff;color:#fff}
.light .music-search input{background:#e8e8ed;color:#1c1c1e;border:0}

/* All map cards use the same native surface, labels, blue controls and separator. */
.parked-card,.drive-guidance,.destinations-button,.trip-panel,.dash-trip,.favorites-panel{background:var(--map-surface);color:var(--map-label);box-shadow:var(--map-shadow);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px)}
.parked-card span,.drive-guidance span:not(.direction-glyph),.drive-metrics span,.trip-title small,.trip-bottom>span{color:var(--map-secondary)}
.trip-title button,.trip-bottom button{color:var(--map-control)}
.trip-progress{background:var(--map-separator)}
.trip-progress i{background:var(--map-control)}
.destinations-button{letter-spacing:-.48px}
.destinations-button:hover{background:var(--map-surface)}
.light .kit-map-pin{background:#007aff;mask:url("assets/kit/map-destinations.svg") center / 23px 63.2103271484px no-repeat}
.light .kit-map-pin img{opacity:0}
#favorites-layer{position:absolute;inset:0;pointer-events:none;z-index:450}
#favorites-layer>.favorites-panel{pointer-events:auto}
.favorites-heading h2{letter-spacing:-.6px}
.favorites-heading>button{color:var(--map-secondary);background:var(--map-separator);border-radius:50%}
.favorites-tabs{gap:4px;border-bottom:1px solid var(--map-separator);margin:0 24px;padding:0 0 16px}
.favorites-tabs button{color:var(--map-secondary);background:transparent;border-radius:12px;font-weight:500}
.favorites-tabs button[aria-pressed=true]{background:var(--map-control);color:#fff}
.favorites-list{padding:0 24px 16px;scrollbar-color:var(--map-separator) transparent}
.favorite-row{background:transparent;color:var(--map-label);border-radius:0;margin-bottom:0;border-bottom:1px solid var(--map-separator);padding:20px 8px;gap:22px}
.favorite-row:last-child{border-bottom:0}
.favorite-row:hover,.favorite-row:focus-visible{background:#007aff12;outline:none;border-radius:12px}
.favorite-row .row-copy>span,.favorite-row .chevron-text,.favorite-row:is(:hover,:focus-visible) .row-copy>span,.favorite-row:is(:hover,:focus-visible) .chevron-text{color:var(--map-secondary)}
.destination-symbol{border-radius:50%;display:grid;place-items:center;color:white;background:#007aff}
.destination-symbol.Food{background:#ff9500}
.destination-symbol.Sweets{background:#ff2d55}
.destination-symbol.Outdoors{background:#34c759}
.destination-symbol.Cards{background:#af52de}
.destination-symbol:is(.Food,.Sweets,.Outdoors,.Cards){color:#fff}
.destination-symbol svg{display:block;width:43px;height:43px;fill:none}

/* Separate heading/3D, overview and zoom controls, positioned from the source kit. */
.map-controls{position:absolute;right:25px;top:24px;bottom:25px;width:84px;pointer-events:none;z-index:420}
.map-heading-control,.map-zoom-control,.map-overview-control{position:absolute;width:84px;background:var(--map-surface);color:var(--map-control);border-radius:42px;overflow:hidden;box-shadow:var(--map-shadow);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);pointer-events:auto}
.map-heading-control{top:0;height:199px}
.map-overview-control{top:294px;height:84px;padding:0}
.map-zoom-control{top:472px;height:199px}
.map-heading-control button,.map-zoom-control button{width:84px;height:99.5px;display:grid;place-items:center;padding:0;color:var(--map-control);border-radius:0}
.map-heading-control button+button,.map-zoom-control button+button{border-top:1px solid var(--map-separator)}
.map-controls button:focus-visible{outline:4px solid var(--map-control);outline-offset:-4px}
.map-controls button:is(:hover,:active){background:#007aff12}
.map-heading-control button[aria-pressed=true]{background:#007aff1c}
.kit-map-symbol{display:block;flex:none;background:var(--map-control);mask-repeat:no-repeat;mask-position:center;mask-size:100% 100%}
.compass-symbol{width:30px;height:55px;mask-image:url("assets/kit/map-heading-glyph.svg")}
.perspective-symbol{width:51.4049987793px;height:33.3515625px;mask-image:url("assets/kit/map-3d-glyph.svg")}
.overview-symbol{width:84px;height:84px;mask-image:url("assets/kit/map-overview-glyph.svg")}
.plus-symbol{width:36px;height:36px;mask-image:url("assets/kit/map-plus-glyph.svg")}
.minus-symbol{width:36px;height:4.000002861px;mask-image:url("assets/kit/map-minus-glyph.svg")}

/* A location dot while parked; a clean heading arrow while driving. */
.ajit-drive-car{background:transparent!important;border:0!important;box-shadow:none!important}
.ajit-location-dot{display:none;width:30px;height:30px;background:#007aff;border:5px solid white;border-radius:50%;box-shadow:0 0 0 7px #007aff1c,0 1px 5px #0003}
.is-parked .ajit-location-dot{display:block}
.is-parked .ajit-drive-heading{display:none}
.direction-glyph svg{display:block;width:60px;height:60px}
.dash-map .direction-glyph svg{width:48px;height:48px}
.trip-title button{display:grid;place-items:center;padding:0}
.trip-title button svg{width:32px;height:32px;fill:currentColor}

@media(max-width:680px){
 .light .kit-toggle{mask-size:33px 16.5px}
 .light .kit-map-pin{mask-size:9.66px 26.5483374023px}
 .road-map-view .drive-guidance,.road-map-view .trip-panel{right:65px}
 .direction-glyph svg{width:31px;height:31px}
 .dash-map .direction-glyph svg{width:25px;height:25px}
 .trip-title button svg{width:21px;height:21px}
 .map-controls{top:68px;right:10px;bottom:26px;width:44px}
 .map-heading-control,.map-zoom-control,.map-overview-control{width:44px;border-radius:22px}
 .map-heading-control,.map-zoom-control{height:104px}
 .map-heading-control button,.map-zoom-control button{width:44px;height:52px}
 .map-overview-control{top:calc(50% - 22px);height:44px}
 .map-zoom-control{top:auto;bottom:0}
 .compass-symbol{width:15.7142857143px;height:28.8095238095px}
 .perspective-symbol{width:26.926427932px;height:17.4698660714px}
 .overview-symbol{width:44px;height:44px}
 .plus-symbol{width:18.8571428571px;height:18.8571428571px}
 .minus-symbol{width:18.8571428571px;height:2.095239594px}
 .map-controls button:focus-visible{outline-width:2px;outline-offset:-2px}
 .favorites-tabs{margin:0 12px;padding-bottom:12px}
 .favorites-list{padding:0 10px 12px}
 .favorite-row{gap:12px;padding:14px 3px}
 .favorite-row:hover,.favorite-row:focus-visible{border-radius:9px}
 .destination-symbol svg{width:24px;height:24px}
}