/* 12 Nov 2026: native Mini GOAT garage / driving UI. One canonical map. */
#goatGarageModal[hidden],#goatDriveHud[hidden],
#goatDriveHud [hidden]{display:none!important}
#goatGarageModal{position:absolute;inset:0;z-index:32;
 display:grid;place-items:center;background:rgba(12,35,43,.69);
 backdrop-filter:blur(6px);padding:14px;overflow:auto;touch-action:pan-y}
.goat-garage-card{width:min(640px,100%);max-height:min(92dvh,840px);overflow:auto;
 background:linear-gradient(145deg,#f6faf4,#e6f2e9);border:1px solid #9ccfb2;
 border-radius:22px;padding:18px;box-shadow:0 22px 75px #052c2573;color:#21493b}
.goat-garage-heading{display:flex;align-items:center;justify-content:flex-end;gap:9px}
.goat-garage-heading strong{font-size:19px;font-weight:850;letter-spacing:-.02em}
.goat-garage-heading button,.goat-garage-select button{
 display:grid;place-items:center;width:43px;height:43px;flex:none;
 background:#fffbef;border:1px solid #b2cbb9;border-radius:12px;color:#246d4e}
.goat-garage-heading svg,.goat-garage-select svg{width:23px;height:23px}
.goat-garage-select{display:flex;align-items:center;gap:8px;justify-content:space-between;margin:10px 0}
.goat-garage-details{text-align:center;min-width:0}
.goat-garage-details h2{font-size:clamp(16px,3vw,22px);margin:2px 0 4px}
.goat-garage-details p{font-size:13px;margin:0;color:#4a7c65;font-weight:700}
.goat-garage-details small{font-size:10px;color:#557865}
.goat-model-preview{height:clamp(160px,28dvh,245px);border:1px solid #afd2bd;
 border-radius:17px;background:radial-gradient(ellipse at 50% 70%,#bdded6,#86b8b5 52%,#5d8c8e);
 overflow:hidden;position:relative}
#goatPreview{display:block;width:100%;height:100%;touch-action:pan-y}
#goatPreviewStatus{position:absolute;inset:0;display:grid;place-items:center;
 padding:15px;text-align:center;background:#103f448a;color:#fff;font-size:13px}
.goat-garage-specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px}
.goat-vehicle-stat{background:#ffffffb9;border:1px solid #c3dbce;border-radius:9px;
 min-width:0;padding:8px;display:flex;flex-direction:column;gap:3px}
.goat-vehicle-stat span{font-size:10px;color:#517768}
.goat-vehicle-stat strong{font-size:12px;overflow-wrap:anywhere}
.goat-garage-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}
.goat-garage-actions button{min-height:49px;border-radius:12px;border:0;background:#168c89;
 color:white;font-size:14px;font-weight:800}
#goatAuto{background:#a56d35}
.goat-garage-actions button:disabled{opacity:.4}
#goatDriveHud{position:absolute;inset:0;z-index:17;pointer-events:none;color:#224b3a}
#goatDriveHud button{pointer-events:auto;display:grid;place-items:center;min-width:44px;
 min-height:44px;background:linear-gradient(150deg,#fff9de,#deede4);border:1px solid #a6cbb4;
 border-radius:13px;color:#286a50;box-shadow:0 5px 17px #17433337;touch-action:none;
 -webkit-tap-highlight-color:transparent;user-select:none}
#goatDriveHud button svg{width:25px;height:25px}
#goatDriveHud button.pressed,#goatDriveHud button[aria-pressed="true"]{
 background:#f6ca80;color:#715125;border-color:#b58751}
.goat-drive-speed{position:absolute;top:10px;left:50%;transform:translateX(-50%);
 background:#fffaf0e6;padding:6px 10px;border:1px solid #b5d3ba;border-radius:11px;
 font-size:12px;font-weight:900;white-space:nowrap;pointer-events:none;
 font-variant-numeric:tabular-nums}
.goat-drive-left,.goat-drive-right{position:absolute;bottom:12px;display:flex;align-items:flex-end;gap:7px}
.goat-drive-left{left:10px}
.goat-drive-right{right:10px;flex-direction:column;align-items:end;gap:5px}
.goat-drive-left button{width:60px;height:64px}
#goatPark{width:51px;height:52px!important}
.goat-drive-shift,.goat-drive-pedals{display:flex;gap:7px;align-items:center}
.goat-drive-pedals button{width:66px;height:81px}
.goat-drive-pedals [data-goat-input="brake"]{background:#ffcfbc}
.goat-drive-pedals [data-goat-input="gas"]{background:#ace4d0}
#goatGear{width:54px;height:50px;font-size:19px;font-weight:900}
#goatHorn{width:50px;height:50px}
.goat-drive-tools{position:absolute;bottom:111px;left:50%;transform:translateX(-50%);
 display:flex;gap:6px;pointer-events:auto}
.goat-drive-tools button{width:43px;height:43px}
.goat-drive-light-panel,.goat-drive-susp-panel{
 position:absolute;bottom:160px;left:50%;transform:translateX(-50%);
 display:flex;gap:6px;flex-wrap:wrap;max-width:min(340px,calc(100% - 22px));
 background:#fffdf1ed;border:1px solid #9fcbb2;border-radius:12px;padding:8px;pointer-events:auto}
.goat-drive-light-panel button{font-size:10px;min-width:43px;padding:6px}
.goat-drive-light-panel button svg{width:19px!important;height:19px!important}
.goat-drive-susp-panel{display:grid;grid-template-columns:1fr;min-width:210px;bottom:159px}
.goat-drive-susp-panel strong{font-size:12px}
.goat-drive-susp-panel label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px}
.goat-drive-susp-panel input{width:145px;accent-color:#30a884}
#goatDriveHud.is-automatic .goat-drive-left,
#goatDriveHud.is-automatic .goat-drive-pedals,
#goatDriveHud.is-automatic .goat-drive-shift{display:none}
/* Keep top-left neighborhood and clock; move capture to the third slot. */
.goat-capture-slot{position:absolute;top:clamp(10px,1.8vw,23px);
 left:calc(clamp(10px,1.8vw,23px) + 102px);z-index:18}
.goat-capture-slot #storyCapture{position:static}
.stage[data-goat-driving="active"] .zoom-controls,
.stage[data-goat-driving="active"] .bottom-controls,
.stage[data-goat-driving="active"] :is(.goat-info-marker,.goat-found-popup,#goatInfoButton),
.stage[data-goat-driving="active"] #miniShareToggle{display:none!important}
/* Radio is accessible only in manual/automatic driving, never ordinary map. */
.stage:not([data-goat-driving="active"]) .radio-controls{display:none!important}
.stage[data-goat-driving="active"] .radio-controls{z-index:19}
.stage[data-goat-driving="active"] #journeyMenuToggle.is-goat-exit{
 background:#c52f40;color:#fff;border-color:#8e1726;position:relative}
#journeyMenuToggle.is-goat-exit svg{display:none}
#journeyMenuToggle.is-goat-exit::after{content:"×";font-size:31px;line-height:1;font-weight:800}
.stage[data-goat-driving="active"] .journey-options{display:none!important}
.stage[data-goat-selecting="active"] .journey-options{display:none!important}
.radio-controls .journey-radio-panel{width:min(250px,calc(100vw - 24px));
 box-sizing:border-box;overflow:hidden;padding:10px}
.journey-radio-panel .journey-radio-volume{display:flex;align-items:center;
 gap:9px;font-size:11px;margin-top:6px}
.journey-radio-volume input{width:100%;min-width:0;accent-color:#34896a}
.journey-radio-single{max-width:100%;white-space:normal}
.stage[data-goat-selecting="active"] .journey-select-bar{z-index:20}
@media(max-width:720px){
 .goat-capture-slot{left:100px;top:9px}
 .goat-garage-card{padding:12px;border-radius:16px}
 .goat-garage-specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
 .goat-vehicle-stat{padding:7px}
 .goat-vehicle-stat strong{font-size:11px}
 .goat-drive-left,.goat-drive-right{bottom:9px;gap:4px}
 .goat-drive-left{left:5px}.goat-drive-right{right:5px}
 .goat-drive-left button{width:46px;height:53px}
 #goatPark{width:41px!important;height:45px!important;min-width:41px!important}
 .goat-drive-pedals{gap:4px}
 .goat-drive-pedals button{width:53px;height:65px}
 #goatGear,#goatHorn{width:42px;height:44px;min-width:42px!important}
 #goatDriveHud button svg{width:21px;height:21px}
 .goat-drive-tools{bottom:85px;gap:4px}
 .goat-drive-tools button{width:39px;height:39px;min-width:39px!important;min-height:39px!important}
 .goat-drive-light-panel,.goat-drive-susp-panel{bottom:132px}
 .goat-drive-speed{top:58px;font-size:10px;padding:5px 7px}
}
@media(max-height:500px) and (min-width:550px){
 #goatGarageModal .goat-model-preview{height:125px}
 .goat-garage-card{max-height:99dvh;padding:8px 12px}
 .goat-garage-specs{grid-template-columns:repeat(3,1fr);margin-top:5px}
 .goat-garage-actions{margin-top:5px}
 .goat-garage-actions button{min-height:37px}
 .goat-drive-tools{bottom:85px}
 .goat-drive-left button{height:49px}
 .goat-drive-pedals button{height:57px}
 .goat-drive-speed{top:6px;left:38%}
}
@media(prefers-reduced-motion:reduce){
 #goatGarageModal{backdrop-filter:none}
}


.goat-auto-speed{position:absolute;right:12px;bottom:112px;display:flex;
 align-items:center;flex-direction:column;gap:6px;padding:8px 5px;border-radius:12px;
 border:1px solid #accdb6;background:#fffdf1ec;pointer-events:auto}
.goat-auto-speed[hidden]{display:none!important}
.goat-auto-speed output{font-size:10px;white-space:nowrap;font-weight:750}
.goat-auto-speed input[type=range]{writing-mode:vertical-lr;direction:rtl;
 inline-size:clamp(84px,16dvh,150px);block-size:22px;touch-action:none;
 accent-color:#34896a;cursor:pointer}
.goat-auto-speed span{font-size:10px}
@media(max-width:720px){.goat-auto-speed{right:8px;bottom:90px}
 .goat-auto-speed input[type=range]{inline-size:clamp(70px,13dvh,112px)}}


/* 12 Nov GOAT driving acceptance: responsive stacked controls and credits. */
#goatPreviewStatus[hidden],#goatSourcesPanel[hidden],
#goatVolumePanel[hidden]{display:none!important}
#goatGarageModal{position:fixed;inset:0;z-index:60;
 padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));
 align-items:center;justify-items:center;overflow-y:auto}
.goat-garage-card{box-sizing:border-box;width:min(520px,calc(100vw - 24px));
 max-height:calc(100dvh - 26px);overscroll-behavior:contain;overflow-y:auto;
 margin:auto;scrollbar-width:thin}
#goatDriveHud{z-index:18}
.goat-drive-tools{top:clamp(62px,11dvh,84px);right:clamp(9px,1.8vw,23px);
 bottom:auto;left:auto;transform:none;flex-direction:column;align-items:center;gap:6px}
.goat-drive-tools button{width:43px;height:43px}
.goat-drive-tools button[aria-pressed="true"]{background:#d1eada;color:#145e4d}
.goat-drive-switches{display:flex;flex-direction:column;align-items:flex-end;gap:5px;
 margin-bottom:4px}
.goat-hazard-row,.goat-beam-row,.goat-turn-row{display:flex;gap:7px}
.goat-drive-switches button{width:46px;height:43px;min-width:46px!important;
 min-height:43px!important}
.goat-drive-right{max-width:152px}
.goat-drive-volume-panel{position:absolute;bottom:210px;right:117px;
 width:min(205px,calc(100vw - 158px));display:flex;flex-direction:column;
 padding:12px;gap:9px;border:1px solid #a6cbb4;border-radius:13px;
 background:#fffdf1f5;box-shadow:0 5px 20px #17433337;pointer-events:auto;
 font-size:12px;font-weight:750}
.goat-drive-volume-panel label{display:flex;justify-content:space-between;gap:6px}
.goat-drive-volume-panel input{width:100%;accent-color:#248a6d}
.goat-drive-susp-panel{top:clamp(156px,29dvh,200px);right:60px;bottom:auto;
 left:auto;transform:none;z-index:2}
.stage[data-goat-driving="active"] .env-toolbar{pointer-events:auto;opacity:1}
.stage[data-goat-driving="active"] .env-toolbar-buttons{gap:12px;align-items:center}
.env-toolbar-buttons #storyCapture{position:static;flex:none}
.stage[data-goat-driving="active"] #journeyMenuToggle.is-goat-exit{
 display:grid;place-items:center;padding:0}
#journeyMenuToggle.is-goat-exit::after{display:block;margin:0;line-height:1;
 position:relative;transform:translateY(-1px)}
.radio-controls .goat-source-control{display:flex;align-items:center;position:relative;flex:none}
#goatSourcesToggle{width:43px;height:43px;border:1px solid #b7d4c0;
 border-radius:13px;background:linear-gradient(145deg,#fffdfa,#dcefe5);color:#245d50;
 font-family:Georgia,serif;font-size:21px;font-weight:800;cursor:pointer}
#goatSourcesToggle[aria-expanded="true"]{background:#cde9d8}
#goatSourcesPanel{position:absolute;top:calc(100% + 9px);right:-50px;z-index:32;
 box-sizing:border-box;width:min(355px,calc(100vw - 24px));max-height:min(65dvh,510px);
 overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
 border:1px solid #a6cbb4;border-radius:14px;padding:13px;
 background:#fffcf5;box-shadow:0 12px 40px #17433358;color:#21493b;
 font-size:12px;line-height:1.5}
#goatSourcesPanel strong{font-size:14px}
#goatSourcesPanel p{font-weight:800;margin:10px 0 4px}
#goatSourcesPanel ul{margin:4px 0 8px;padding-left:18px}
#goatSourcesPanel li{margin:4px 0}
#goatSourcesPanel a,.journey-radio-official{color:#136d65;text-decoration:underline;
 text-underline-offset:2px;overflow-wrap:anywhere}
.journey-radio-panel .journey-radio-official{display:block;margin-top:10px;
 border-top:1px solid #d1dfd2;padding-top:9px;font-size:12px;font-weight:750}
.radio-controls:has(#goatSourcesPanel:not([hidden])){z-index:31}
.goat-drive-speed{min-width:70px;text-align:center}
.goat-auto-speed{right:111px;bottom:12px}
@media(max-width:720px){
 #goatGarageModal{padding:8px}
 .goat-garage-card{max-height:calc(100dvh - 16px);width:min(480px,calc(100vw - 16px))}
 .goat-drive-tools{right:9px;top:60px;gap:5px}
 .goat-drive-tools button{width:39px;height:39px;min-width:39px!important;min-height:39px!important}
 .goat-drive-switches{gap:4px;margin-bottom:2px}
 .goat-drive-switches button{width:42px;height:38px;min-width:42px!important;min-height:38px!important}
 .goat-drive-right{bottom:9px}
 .goat-drive-susp-panel{right:53px;top:133px}
 .goat-drive-volume-panel{right:100px;bottom:165px;width:min(180px,calc(100vw - 135px))}
 .env-toolbar-buttons #storyCapture{width:39px;height:39px}
 .stage[data-goat-driving="active"] .env-toolbar-buttons{gap:10px}
 #goatSourcesToggle{width:39px;height:39px;border-radius:10px}
 #goatSourcesPanel{right:-44px;max-height:68dvh}
 .goat-auto-speed{right:99px;bottom:9px}
 .goat-drive-speed{top:57px}
}
@media(max-height:530px) and (min-width:550px){
 .goat-drive-tools{top:52px;gap:3px}
 .goat-drive-switches{gap:2px}
 .goat-drive-switches button{height:33px;min-height:33px!important;width:37px;min-width:37px!important}
 .goat-drive-right{bottom:5px;gap:3px}
 .goat-drive-susp-panel{top:70px;right:62px}
 .goat-drive-volume-panel{bottom:130px}
 .goat-auto-speed{right:108px;bottom:5px}
}

.stage[data-goat-driving="active"] .goat-controls{display:none!important}

/* Mini footer is its own sibling stacking context (z-index:40).
 * The GOAT dialog's z-index:60 is INSIDE the isolated .stage and cannot
 * outrank the footer until the stage itself is elevated.
 * Scope the elevation to active GOAT UI so the normal footer disclosures
 * (Nasıl yapıldı? / Yasal bilgiler) keep working on the map screen. */
.stage:has(#goatGarageModal:not([hidden])),
.stage[data-goat-selecting="active"],
.stage[data-goat-driving="active"]{
  z-index:50;
}


/* 12 Nov second mobile road test: one authoritative close control. */
.stage[data-goat-selecting="active"] #journeyReset{display:none!important}
#journeyMenuToggle.is-goat-exit{
 display:grid!important;place-items:center!important;padding:0!important;
}
#journeyMenuToggle.is-goat-exit svg{display:none!important}
#journeyMenuToggle.is-goat-exit::after{
 content:"×";display:grid;place-items:center;position:static;
 width:100%;height:100%;line-height:1;transform:none;margin:0;
 font-size:29px;font-weight:800;
}
/* Source list stays fully within the viewport, independently of radio anchor. */
#goatSourcesPanel{
 position:fixed;top:clamp(65px,11dvh,105px);
 right:max(12px,env(safe-area-inset-right));left:auto;transform:none;
 width:min(355px,calc(100vw - 24px));
 max-height:min(68dvh,510px);
}
@media(max-width:720px){
 #goatSourcesPanel{
  left:50vw;right:auto;transform:translateX(-50%);
  width:min(355px,calc(100vw - 20px));
 }
}