/* Ergonomie : les commandes occupent leur place réelle, sans recouvrir leurs voisines. */
:root{--on-accent:#182a35}
#app{min-height:0}
button,summary,.file-label{-webkit-tap-highlight-color:transparent}
textarea:focus-visible,.file-label:focus-within{outline:3px solid #3279d5;outline-offset:3px}
.round,.small-button,.mini-button,.text-button{min-height:44px;min-width:44px;flex-shrink:0}
.brand-icon,.route-number,.choice-button.go,.dark .choice-button.go{color:var(--on-accent)}
a.primary,a.secondary{display:flex;align-items:center;justify-content:center;text-decoration:none}
a.primary,a.primary:visited{color:var(--on-accent)}
a.secondary,a.secondary:visited{color:var(--ink)}
a:focus-visible{outline:3px solid #3279d5;outline-offset:3px}
.brand{right:32px;max-width:375px}
.brand #home{margin-left:auto}
.panel{padding:22px;scroll-padding:16px}
.panel h1{font-size:32px;margin:12px 0;letter-spacing:-1px}
.setup-intro{margin:8px 0}
.route-card{margin-top:16px;padding:12px}
.route-card small{font-size:12px}
.stats{padding:16px 0;justify-content:space-between;gap:16px}
.stats span{font-size:12px}
.zone-help{font-size:13px;color:var(--muted);line-height:1.4;margin:8px 0}
.zone-button[aria-pressed="true"],.dark .zone-button[aria-pressed="true"]{color:var(--on-accent);border-color:#182a35}
.zone-button[aria-pressed="true"] small{color:#34434a}
.zone-button.add[aria-pressed="true"],.dark .zone-button.add[aria-pressed="true"]{color:#fff;background:#1f4fa3;border-color:#92b4ef}
.zone-button.add[aria-pressed="true"] small{color:#fff}
.import-section{padding:0}
.import-section summary{min-height:44px;align-items:center;gap:8px}
.import-section[open]{padding-bottom:12px}
.file-label{position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}
.file-label input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.setup-actions{position:sticky;bottom:-22px;background:var(--paper);padding:8px 0 12px;display:flex;flex-direction:column;border-top:1px solid var(--border)}
.setup-actions .primary,.setup-actions .secondary{margin-top:6px}
#resume:not([hidden]){order:-2;background:var(--accent);color:var(--on-accent)}
.setup-actions:has(#resume:not([hidden])) #start{background:#eef1e9;color:#182a35}
#update{order:-3}
#start-demo{font-size:13px;margin:2px auto 0;line-height:1.4}
.local-note{font-size:11px;margin:4px 0 0}
.notice{font-size:12px}
#navigation{position:absolute;inset:0;display:grid;grid-template-rows:auto minmax(80px,1fr) auto;gap:8px;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow-y:auto;pointer-events:none;scrollbar-width:thin}
.nav-top,.nav-bottom{position:static;transform:none;width:min(460px,100%);min-width:0;justify-self:center;pointer-events:auto}
.nav-top{grid-row:1}
.nav-bottom{grid-row:3}
.map-tools{position:static;grid-row:2;justify-self:end;align-self:start;display:flex;gap:8px;z-index:4;pointer-events:auto}
.mode-label{font-size:11px;letter-spacing:.5px;line-height:1.4;padding:7px 10px}
.guidance{margin-top:6px;padding:10px 14px;gap:12px}
.guidance b{font-size:26px}
.guidance p{font-size:13px;line-height:1.3}
.search-pill{font-size:15px;margin-top:6px;padding:10px 14px}
.above-card{font-size:12px;margin-bottom:6px;gap:6px}
.above-card>span{max-width:none;min-width:0;line-height:1.35}
.above-card .mini-button{font-size:13px;padding:10px;white-space:nowrap}
.destination{padding:12px 14px 9px}
.destination>.row{align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.eyebrow{font-size:11px;letter-spacing:1px}
.counter{font-size:12px}
.address-row{gap:10px;margin:8px 0}
.address-row>strong{font-size:32px;max-width:90px;flex-shrink:0}
.address-row h2{font-size:20px;line-height:1.25}
.address-title{flex-wrap:wrap}
#stop-meta{font-size:12px;line-height:1.4}
.destination .round{width:44px;min-width:44px}
.badge{font-size:12px}
.destination-actions{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px;margin-top:8px;padding-top:8px}
.destination-actions button{font-size:15px;white-space:nowrap;padding:10px}
#trip-summary{grid-column:2 / -1;margin:0;justify-content:center;min-height:44px}
.large-type #trip-summary{grid-column:1}
.swipe-hint{font-size:11px;padding-top:6px}
.footer-row{font-size:10px;margin:5px 2px 0;gap:6px}
.vehicle{z-index:2}
#toast{background:#182a35;color:white;width:max-content;max-width:calc(100% - 32px);line-height:1.5}
dialog{max-width:100%;max-height:calc(100dvh - max(12px,env(safe-area-inset-top)));padding:0;overflow:hidden}
dialog[open]{display:flex;flex-direction:column}
.sheet-head{flex-shrink:0;margin:0;padding:14px 16px 10px;border-bottom:1px solid var(--border);background:var(--paper)}
.sheet-head h2{font-size:21px;overflow-wrap:anywhere;line-height:1.3;min-width:0}
#sheet-body{padding:8px 16px max(24px,env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;min-height:0;scroll-padding:12px}
#sheet-body input,#sheet-body select,#sheet-body textarea{font-size:16px}
#sheet-body label{display:block;font-size:14px;font-weight:600;margin-top:10px}
#sheet-body .list-scroll{max-height:none;overflow:visible}
#sheet-body:has(#stop-search){display:flex;flex-direction:column;overflow:hidden}
#stop-search,.choice-legend,#search-count{flex-shrink:0}
#sheet-body #stop-list{overflow-y:auto;min-height:0;overscroll-behavior:contain}
.stop-choice{gap:8px;padding:12px 2px}
.stop-choice b{overflow-wrap:anywhere;line-height:1.35}
.stop-rank{min-width:26px;font-size:12px}
.choice-legend{font-size:13px;gap:6px}
#search-count{font-size:12px;color:var(--muted);margin:8px 0}
.list-row{flex-wrap:wrap}
.list-row>div{min-width:0;overflow-wrap:anywhere}
.dark #unlock-phrase{background:var(--paper)}
@media(max-width:600px){
 .brand{top:max(16px,env(safe-area-inset-top));left:20px;right:20px}
 .panel{top:max(82px,calc(env(safe-area-inset-top) + 66px));bottom:max(12px,env(safe-area-inset-bottom));padding:18px}
 .setup-actions{bottom:-18px}
}
@media(max-width:360px){
 .back-label{display:none}
 .destination-actions .back-button{width:44px}
 .address-row>strong{font-size:28px;max-width:72px}
 .address-row h2{font-size:18px}
 .destination{padding:12px}
 .panel h1{font-size:28px}
 .zone-button small{font-size:11px}
}
@media(max-height:690px){
 .panel h1{font-size:26px;margin:8px 0}
 .setup-intro{display:none}
 .route-card{margin-top:10px;padding:8px}
 .route-number{padding:8px}
 .stats{padding:10px 0}
 .stats b{font-size:24px}
 .section{padding-top:10px;padding-bottom:10px}
 .import-section{padding:0}
 .notice{margin:8px 0}
 .guidance .maneuver{font-size:30px}
 .guidance b{font-size:23px}
 .swipe-hint,.footer-row{display:none}
}
@media(min-width:650px) and (max-height:500px){
 #navigation{grid-template-columns:minmax(280px,340px) minmax(80px,1fr);grid-template-rows:auto 1fr;gap:8px 16px}
 .nav-top{grid-column:1;grid-row:1}
 .nav-bottom{grid-column:1;grid-row:2;align-self:end}
 .map-tools{grid-column:2;grid-row:1}
 .guidance{margin-top:4px;padding:6px 12px}
 .guidance p{margin:2px 0}
 .search-pill{margin-top:4px;padding:8px 12px;min-height:44px}
 .above-card{display:flex;margin-bottom:4px}
 .destination{padding:8px 12px}
 .address-row{margin:4px 0}
 .address-row h2{font-size:18px}
 .address-row>strong{font-size:27px}
 .brand{top:12px}
 .panel{top:72px;bottom:12px}
}
@media(max-height:690px){
 .greeting{display:none}
 .panel h1{font-size:22px}
 .route-card small{display:none}
 .route-card{min-height:54px}
}
/* Grand texte : ordre de lecture conservé, actions empilées et défilement possible. */
.large-type .round{width:64px;height:64px;min-width:64px}
.large-type .address-row{display:grid;grid-template-columns:minmax(0,1fr) 64px}
.large-type .address-row>strong{max-width:none;grid-column:1}
.large-type .address-row>div{grid-column:1;grid-row:2}
.large-type #details{grid-column:2;grid-row:1 / 3}
.large-type .destination-actions{grid-template-columns:1fr}
.large-type .destination-actions button{white-space:normal;overflow-wrap:anywhere}
.large-type .destination>.row{flex-direction:column}
.large-type .mode-label{max-width:calc(100% - 74px)}