/* V6.38: five distinct instruments; the SL media frame keeps its original black. */
html body :is(#navigation-gps,#nav-custom-gps) :is(#gps-guidance,.gps-mini){position:relative;isolation:isolate;display:grid!important;grid-template-columns:72px minmax(0,1fr);grid-template-rows:1fr auto auto;align-content:center;align-items:center;gap:8px 10px;width:100%;min-height:155px;margin:0;padding:14px!important;border:1px solid var(--nav-edge)!important;border-radius:12px;background:linear-gradient(160deg,#26343f,#0b1117 52%,#080b0e)!important;box-shadow:inset 0 2px 1px #ffffff24,inset 0 -4px 8px #0009,0 5px 12px #0006!important;color:var(--nav-ink)!important;overflow:hidden;text-align:center}
html body :is(#navigation-gps,#nav-custom-gps) :is(#gps-arrow,.gps-preview-arrow){position:relative;z-index:1;grid-column:1;grid-row:1;justify-self:center;align-self:center;display:grid;place-items:center;width:64px;height:64px;margin:0;padding:0;border-radius:0;background:none;color:var(--nav-accent)!important;filter:drop-shadow(0 2px 0 #0009) drop-shadow(0 5px 4px #0008)}
.gps-preview-arrow svg{width:100%;height:100%}
html body :is(#navigation-gps,#nav-custom-gps) :is(#gps-distance,.gps-preview-distance){grid-column:2;grid-row:1;font-size:30px!important;line-height:1.1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;text-shadow:0 2px 1px #000;z-index:1}
html body :is(#navigation-gps,#nav-custom-gps) :is(#gps-instruction,.gps-preview-instruction){grid-column:1/-1;grid-row:2;font-size:16px!important;line-height:1.3;z-index:1;overflow-wrap:anywhere;color:var(--nav-ink)}
html body :is(#navigation-gps,#nav-custom-gps) :is(#gps-remaining,.gps-preview-remaining){grid-column:1/-1;grid-row:3;font-size:12px!important;z-index:1;color:var(--nav-muted)}
body #gps-hint{grid-row:5;color:var(--nav-muted)}
/* Digital: blue glass and engraved edge. */
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=modern] :is(#gps-guidance,.gps-mini){border-top:3px solid #63c7ff!important;background:linear-gradient(160deg,#263c4e,#101c29 48%,#080f17)!important}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=modern] :is(#gps-guidance,.gps-mini)::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 5px,#8ad6ff06 5px 6px);pointer-events:none}
/* Classic: raised brass bezel around a round arrow dial. */
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=heritage] :is(#gps-guidance,.gps-mini){grid-template-columns:1fr;grid-template-rows:1fr auto auto auto;background:radial-gradient(ellipse at 30% 0,#3c3423,#13120e 70%)!important;border:3px double #a68950!important;border-radius:18px;gap:6px;padding:12px!important}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=heritage] :is(#gps-arrow,.gps-preview-arrow){grid-column:1;grid-row:1;width:88px;height:88px;padding:17px;border:4px solid #b79961;border-radius:50%;background:radial-gradient(circle at 35% 20%,#494431,#15140f 70%);box-shadow:inset 0 2px 5px #000c,0 2px 0 #ead5a2,0 6px 7px #000b;filter:none}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=heritage] :is(#gps-distance,.gps-preview-distance){grid-column:1;grid-row:2;font-size:25px!important;font-family:Georgia,serif}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=heritage] :is(#gps-instruction,.gps-preview-instruction){grid-row:3}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=heritage] :is(#gps-remaining,.gps-preview-remaining){grid-row:4}
/* Dashboard: separate inset arrow and distance gauges, copper trim. */
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=luxury] :is(#gps-guidance,.gps-mini){grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;background:linear-gradient(135deg,#39312f,#151315 50%,#292224)!important;border-top:2px solid #d99a7b!important;border-radius:8px;gap:12px}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=luxury] :is(#gps-arrow,.gps-preview-arrow){grid-row:2;width:74px;height:74px;padding:12px;border:1px solid #9a7668;border-radius:50%;background:radial-gradient(circle,#2f2623,#0e0d0d);box-shadow:inset 0 4px 5px #000b,0 1px 1px #e7ba9566;filter:none}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=luxury] :is(#gps-distance,.gps-preview-distance){grid-row:2;font-size:32px!important;padding:14px 4px;border-block:1px solid #976e57;background:linear-gradient(#070606,#271c18);border-radius:6px;box-shadow:inset 0 3px 7px #0009}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=luxury] :is(#gps-instruction,.gps-preview-instruction){grid-row:1}
/* Compact: raised silver edge, generous numeric readout. */
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=minimal] :is(#gps-guidance,.gps-mini){grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto 1fr auto;background:linear-gradient(145deg,#34393e,#1a1d20)!important;border-left:4px solid #ced2d5!important;border-radius:6px;gap:8px;padding:14px!important}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=minimal] :is(#gps-arrow,.gps-preview-arrow){grid-column:1;grid-row:1;width:36px;height:36px}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=minimal] :is(#gps-instruction,.gps-preview-instruction){grid-column:2;grid-row:1;text-align:left;font-size:14px!important}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=minimal] :is(#gps-distance,.gps-preview-distance){grid-column:1/-1;grid-row:2;padding:8px 0;font-size:44px!important;font-weight:400}
/* Navigator: perspective road, raised luminous arrow, green head-up readout. */
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-guidance,.gps-mini){grid-template-columns:1fr;grid-template-rows:auto 1fr auto auto;background:linear-gradient(#101a16,#050b08)!important;border:1px solid #426d50!important;border-radius:10px;gap:5px}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-guidance,.gps-mini)::before{content:"";position:absolute;inset:25% -30% -35%;background:linear-gradient(90deg,transparent 28%,#75d89855 28% 29%,transparent 29% 49%,#b2f5c288 49% 51%,transparent 51% 71%,#75d89855 71% 72%,transparent 72%),repeating-linear-gradient(0deg,transparent 0 30px,#82c69616 30px 31px);transform:perspective(150px) rotateX(53deg);transform-origin:center top;pointer-events:none}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-arrow,.gps-preview-arrow){grid-row:2;grid-column:1;width:76px;height:76px;transform:perspective(150px) rotateX(20deg);filter:drop-shadow(0 5px 0 #2a6140) drop-shadow(0 8px 8px #69d98b55)}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-instruction,.gps-preview-instruction){grid-row:1}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-distance,.gps-preview-distance){grid-row:3;grid-column:1;font-size:30px!important;color:#bbf5c9}
html body :is(#navigation-gps,#nav-custom-gps)[data-nav-theme=neon] :is(#gps-remaining,.gps-preview-remaining){grid-row:4}
body #navigation-customizer .custom-preview{gap:16px;align-items:center}
body #navigation-customizer #nav-custom-gps{min-width:0;width:220px;max-width:100%}
body #navigation-customizer .gps-mini{min-height:210px}
.custom-marker{margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid #ffffff20}
body[data-navigation-panel=gps] #navigation-customizer .custom-preview{display:flex}
body[data-navigation-panel=gps] #nav-custom-compass{display:none}
/* Expanded options scroll vertically; they never crush or clip the instrument. */
html body[data-navigation-panel=gps] :is(.map-workspace,#navigation-gps){overflow-x:hidden!important}
html body[data-navigation-panel=gps] #navigation-gps #gps-guidance{min-height:220px}
html body[data-navigation-panel=gps] #navigation-gps[data-nav-theme=heritage] #gps-guidance{min-height:230px}
html body[data-navigation-panel=gps] #navigation-gps #gps-start{font-size:11px!important;letter-spacing:0;padding-inline:3px!important;min-width:0}