:root{--navy:#0b2448;--red:#d60025;--blue:#075ba3;--sd-ui-scale:1;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:calc(16px * var(--sd-ui-scale));color:#15253e;background:#e7edf3;-webkit-text-size-adjust:100%;text-size-adjust:100%}
*{box-sizing:border-box}
html{min-height:100%;background:linear-gradient(110deg,#d9e3ec,#f8fafc 55%,#dbe4ed);overflow-x:clip}
body{position:relative;display:flex;flex-direction:column;width:100%;max-width:none;min-height:0;margin:0 auto;padding:0 0 calc(5rem + env(safe-area-inset-bottom));background:#f4f6fa;box-shadow:0 0 3rem #071e4720;overflow-x:clip}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer}
button:disabled{opacity:.55;cursor:not-allowed}
a{color:#194e84}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:.2rem solid #448ee5;outline-offset:.2rem}
main:focus{outline:none}
header{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:5rem;padding:.85rem 1rem;background:linear-gradient(120deg,#0a2448,#112d54);color:white}
.brand{display:flex;align-items:center;gap:.55rem;color:white;text-decoration:none;font-size:1.4rem;font-weight:800;letter-spacing:-.045rem;line-height:1.05;min-width:0}
.brand img{width:2.5rem;height:3rem;flex-shrink:0;filter:drop-shadow(0 .18rem .2rem #0003)}
.brand strong{color:#ff3052}
.brand small{display:block;margin-top:.3rem;color:#e6eefb;font-size:.72rem;letter-spacing:0;font-style:italic;font-weight:450}
.ui-icon{display:block;width:1.6rem;height:1.6rem;flex-shrink:0}
.sos-mini{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;flex-shrink:0;width:3.25rem;height:3.25rem;border:.12rem solid #ff9aab;border-radius:50%;background:linear-gradient(135deg,#ff143a,#c50020);color:white;font-size:.7rem;font-weight:800;box-shadow:0 .12rem .5rem #0003}
.sos-mini .ui-icon{width:1.25rem;height:1.25rem;fill:white;stroke-width:1.3}
.preview{position:relative;z-index:1;padding:.55rem .85rem;border-bottom:1px solid #d6dfeb;background:#e7edf4;color:#304862;font-size:.7rem;font-weight:600;line-height:1.45;text-align:center}
main{position:relative;z-index:1;width:100%;padding:1.1rem 1rem;min-width:0}
h1{font-size:1.55rem;line-height:1.25;letter-spacing:-.035rem;margin:0 0 .6rem}
h2{font-size:1.2rem;line-height:1.3;margin:0 0 .8rem}
h3{font-size:1.05rem;line-height:1.35;margin:0 0 .55rem}
p{line-height:1.55;margin:.7rem 0}
.lead{font-size:1rem;line-height:1.55;color:#52637b;margin:0 0 1.1rem}
.muted{color:#53657b;font-size:.92rem;line-height:1.55}
.back{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 0 .7rem;border:0;background:transparent;color:#2d5076;font-weight:650}
.card{margin:1rem 0;padding:1rem;border:1px solid #dce1e9;border-radius:1rem;background:white;box-shadow:0 .15rem .8rem #15253e05}
.warning,.info{padding:.85rem;border-radius:.85rem;font-size:.9rem;line-height:1.55}
.warning{border:1px solid #e9b4bf;background:#fff1f4;color:#602635}
.info{background:#eaf1f9;color:#203b5d}
.pill,.badge{display:inline-block;padding:.35rem .55rem;border-radius:.5rem;background:#edf2f8;color:#254263;font-size:.8rem;line-height:1.4}
.primary,.secondary,.danger,button.category{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.3rem;padding:.85rem 1rem;border:1px solid transparent;border-radius:.8rem;font-weight:700;text-align:center;text-decoration:none}
.primary,.danger{border-color:#ffffff70;background:linear-gradient(135deg,#ed002b,#bd0020);color:white;box-shadow:0 .15rem .5rem #b500181a}
.secondary{border-color:#cdd9e6;background:linear-gradient(#fff,#edf1f7);color:#173b66}
.block{width:100%;margin-top:.75rem}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.actions>*{flex:1;min-width:6.5rem}
label{display:block;font-size:1rem;font-weight:650;margin:1.15rem 0 .5rem}
input,select,textarea{display:block;width:100%;min-height:3.25rem;padding:.85rem;border:1px solid #abbdd1;border-radius:.65rem;background:#fff;color:#14253b}
textarea{resize:vertical}
input[type=checkbox]{width:1.5rem;min-height:1.5rem;margin:0;flex-shrink:0}
label.check{display:flex;align-items:flex-start;gap:.7rem;font-size:.92rem;font-weight:450;line-height:1.5}
fieldset{min-width:0}
.categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
button.category{flex-direction:column;gap:.45rem;min-height:5.25rem;padding:.65rem .25rem;border-color:#d6dce7;background:linear-gradient(#fff,#edf0f7);color:#172842;font-size:.82rem}
.category-icon{color:#cf0528}
.category-icon .ui-icon{width:1.85rem;height:1.85rem;stroke-width:2.1}
.category[data-category=eclairage] .category-icon{color:#a86d00}
.category[data-category=agression] .category-icon,.category[data-category=trottoir] .category-icon{color:#173456}
.category[aria-pressed=true]{border:2px solid #cf0528;background:white;color:#a7001b;box-shadow:0 0 0 .12rem #cf052812}
nav{position:fixed;z-index:900;bottom:0;left:50%;display:flex;justify-content:center;gap:0;width:100%;transform:translateX(-50%);padding:.5rem .5rem calc(.5rem + env(safe-area-inset-bottom));border-top:1px solid #d6dfeb;border-radius:1rem 1rem 0 0;background:#fff;box-shadow:0 -.2rem 1rem #06172c20}
nav button{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;min-height:3rem;padding:.2rem;border:0;border-radius:.6rem;background:transparent;color:#293c55}
nav .ui-icon{width:1.55rem;height:1.55rem}
nav span{font-size:.8rem;font-weight:650}
nav button[aria-current=page]{color:#c60023}
nav button[aria-current=page] .ui-icon{stroke-width:2.7}
footer{position:relative;z-index:1;display:flex;justify-content:center;flex-wrap:wrap;gap:.2rem;padding:.1rem .75rem .7rem}
.text{min-height:2.75rem;padding:.55rem .65rem;border:0;background:none;color:#294c75;font-size:.86rem;text-decoration:underline}
footer .text{font-size:.75rem}
#notice{position:fixed;z-index:2000;bottom:calc(5.8rem + env(safe-area-inset-bottom));left:50%;display:none;width:27rem;max-width:calc(100% - 2rem);transform:translateX(-50%);padding:1rem;border-radius:.85rem;background:#102842;color:white;box-shadow:0 .4rem 1.5rem #0003;line-height:1.5}
dialog{width:28rem;max-width:calc(100vw - 2rem);padding:1.5rem;border:0;border-radius:1.1rem;box-shadow:0 .6rem 4rem #0003}
dialog::backdrop{background:#06152bb0}
.map{height:21rem;margin-top:1rem;border:1px solid #c3d1e1;border-radius:1rem;isolation:isolate}
.leaflet-container{font-family:inherit;font-size:.95rem}
.leaflet-popup-content button{min-height:2.75rem}
.marker{width:2rem!important;height:2rem!important;border:.18rem solid white;border-radius:50%;background:#c92540;color:white;text-align:center;font-size:1.2rem;box-shadow:0 .12rem .6rem #0005}
.time{margin:1rem 0;color:#10223d;font-size:2.5rem;font-weight:850;font-variant-numeric:tabular-nums;letter-spacing:-.05rem}
.list{list-style:none;padding:0}
.list li{padding:1rem 0;border-bottom:1px solid #e5ebf2}
.list li:last-child{border:0}
.empty{padding:1.8rem 1rem;text-align:center;color:#53657b}
.error{color:#a61c34;font-weight:650;line-height:1.5}
.skip{position:absolute;top:-10rem;left:.75rem;z-index:3000;padding:.75rem;background:white}
.skip:focus{top:.75rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
body[data-view=home],body[data-view=splash]{background:linear-gradient(130deg,#071e40,#12325b 72%,#0a2448);color:white}
body[data-view=home] .preview,body[data-view=splash] .preview{border-bottom-color:#ffffff18;background:#09203e;color:#dbe5f5}
body[data-view=home] main{padding:1.15rem 1rem .4rem}
.welcome{padding:0 0 1rem}
.welcome h1{margin:0;color:white;font-size:1.4rem;font-weight:800;line-height:1.4;letter-spacing:-.03rem}
.welcome h1 span{font-size:1.22rem;font-weight:600}
.big-actions{display:flex;flex-direction:column;gap:.8rem}
.big{display:flex;align-items:center;justify-content:flex-start;gap:.8rem;width:100%;min-height:5.25rem;padding:1rem .9rem;border:1px solid #d0d9e6;border-radius:1rem;background:linear-gradient(#fff,#edf1f9);color:#12233e;box-shadow:0 .25rem .6rem #0003;text-align:left}
.big .symbol{display:grid;place-items:center;flex-shrink:0;width:2.4rem;height:2.6rem;color:#df0029}
.big .symbol .ui-icon{width:2.1rem;height:2.1rem;stroke-width:2.5}
.big strong{display:block;font-size:1.12rem;font-weight:800;line-height:1.25;letter-spacing:-.025rem}
.big small{display:block;margin-top:.35rem;color:#42536b;font-size:.82rem;font-weight:450;line-height:1.35}
.big.red{border-color:#ff8b9e;background:linear-gradient(135deg,#ff1238,#d80024 65%,#bd0020);color:white;box-shadow:0 .3rem 1rem #0004,inset 0 1px 2px #ffffff6b}
.big.red .symbol{color:white}
.big.red .symbol .ui-icon{fill:white;stroke-width:1.3}
.big.red strong{font-size:1.6rem}
.big.red small{color:white}
.big.white .symbol{color:#0566b8}
.big.white .symbol .ui-icon{fill:#0566b8;stroke:#0566b8}
.big.white .symbol .ui-icon circle{fill:white;stroke:white}
.action-chevron{margin-left:auto;flex-shrink:0}
.action-chevron .ui-icon{width:1rem;height:1.35rem;stroke-width:3}
.home-reassurance{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1.25rem 0 .8rem;padding:1rem;border:1px solid #ffffff21;border-radius:1rem;background:#ffffff07}
.reassurance-slogan{margin:0;color:white;font-size:1.05rem;font-weight:750;line-height:1.3}
.reassurance-note{margin:.45rem 0 0;color:#cbdcf1;font-size:.82rem;line-height:1.4}
.manual-note{margin:.6rem .1rem;color:#dbe5f3;font-size:.8rem;line-height:1.5;text-align:center}
body[data-view=home] footer .text,body[data-view=splash] footer .text{color:#c8d8ec}
.reference-portrait{position:relative;flex-shrink:0;width:5.5rem;aspect-ratio:376/316;overflow:hidden;border-radius:.7rem;background:#eaf0f5;box-shadow:0 .25rem 1rem #0003}
.reference-portrait img,.scene-people img{position:absolute;max-width:none;width:408.511%;height:364.557%;left:-308.511%;top:-253.165%}
.brand-swoosh{position:relative;width:5.4rem;height:.9rem;margin:.9rem auto 0;overflow:hidden}
.brand-swoosh::before,.brand-swoosh::after{position:absolute;left:0;content:"";width:5.3rem;height:1.25rem;border-top:.3rem solid #ec1237;border-radius:50%;transform:rotate(-9deg)}
.brand-swoosh::after{left:1.5rem;top:.25rem;width:4rem;border-width:.2rem;transform:rotate(8deg)}
.splash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-height:calc(100svh - 6rem);padding:1.4rem 1.2rem .75rem;text-align:center;overflow:hidden}
.splash-logo{width:5.8rem;height:6.75rem;filter:drop-shadow(0 .4rem .3rem #0004)}
.splash h1{margin:.6rem 0 .2rem;color:white;font-size:2.4rem;line-height:1.02;letter-spacing:-.08rem}
.splash h1 strong{color:#fc2447}
.signature{margin:.3rem 0;color:#e9f0fb;font-style:italic;font-size:1rem}
.splash-slogan{margin:1.35rem 0 1rem;color:white;font-size:1.35rem;font-weight:750;line-height:1.35}
.splash .reference-portrait{width:8rem;margin:0 auto .65rem}
.town{width:calc(100% + 3rem);height:3rem;margin-top:-.7rem;opacity:.5;background:url('/signal-danger/town.svg') center bottom/100% 100% no-repeat}
.start{justify-content:space-between;min-height:3.4rem;padding:.85rem 1.4rem;font-size:1.1rem;font-weight:750}
.splash-note{margin:.85rem 0 0;color:#c9d7ea;font-size:.78rem}
.splash-note a{color:white}
body[data-view=splash]{padding-bottom:0}
body[data-view=splash] header,body[data-view=splash] nav{display:none}
body[data-view=splash] main{padding:0 1rem}
body[data-view=splash] .preview{padding-top:max(.6rem,env(safe-area-inset-top))}
.sos-orb{display:flex;flex-direction:column;align-items:center;justify-content:center;width:10.5rem;height:10.5rem;margin:2rem auto;border:.35rem solid #ffb4c0;border-radius:50%;background:radial-gradient(circle at 35% 25%,#ff4260,#ed002b 55%,#bb001d);color:white;text-decoration:none;box-shadow:0 0 0 .6rem #fce0e6,0 0 0 1.1rem #fff0f3,0 .5rem 1.1rem #c0002730}
.sos-orb .ui-icon{width:2.4rem;height:2.4rem;fill:white;stroke-width:1.3}
.sos-orb strong{font-size:2.4rem;line-height:1.25}
.sos-orb span{font-size:.85rem}
.emergency-card h2{font-size:1rem}
.emergency-numbers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem}
.emergency-numbers a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:5.5rem;padding:.6rem .2rem;border-radius:.8rem;background:linear-gradient(#fb1d44,#c30023);color:white;text-decoration:none;text-align:center}
.emergency-numbers a:nth-child(2){background:linear-gradient(#2199f2,#005caf)}
.emergency-numbers strong{font-size:1.85rem;line-height:1.2}
.emergency-numbers span{margin-top:.2rem;font-size:.7rem;line-height:1.35}
.emergency-card .text{font-size:.78rem}
.contact-name{display:flex;align-items:center;gap:.6rem}
.contact-avatar{display:inline-grid;place-items:center;width:2.15rem;height:2.15rem;border-radius:50%;background:linear-gradient(#dbedff,#9fc8ff);color:#075493;font-size:.95rem}
#trip-arrived{border-color:#66c88d;background:linear-gradient(#087d39,#006b30)}
.reference-scene,.concept-reference{display:none}
@media(min-width:1200px){
 body{max-width:30rem;margin:1.5rem auto;min-height:0;border-radius:1.4rem;overflow:visible}
 nav{width:min(100%,30rem)}
 header{border-radius:1.4rem 1.4rem 0 0}
 .reference-scene{position:fixed;z-index:0;display:block;overflow:hidden;pointer-events:none;isolation:isolate}
 .reference-scene img{position:absolute;max-width:none;user-select:none}
 .scene-street{top:0;left:0;width:6.25rem;height:100dvh;opacity:.85;mask-image:linear-gradient(90deg,#000,#0000)}
 .scene-street img{width:auto;height:180%;left:0;top:-14%}
 .scene-people{right:0;bottom:0;width:21rem;aspect-ratio:376/316;border-radius:1.6rem 0 0 0;box-shadow:-1rem -1rem 4rem #e8edf6}
 .concept-reference{position:fixed;z-index:0;top:2rem;right:1.4rem;display:block;width:min(calc((100vw - 32.5rem)/2 - 2.5rem),21rem);color:#10223d}
 .concept-reference h2{padding:.8rem 1rem;border-radius:1rem;background:linear-gradient(#f8173c,#ce0022);color:white;font-size:1.3rem}
 .concept-item{display:flex;align-items:center;gap:.75rem;margin:.65rem 0;padding:.85rem .75rem;border-radius:1rem;background:#ffffffe5}
 .concept-item .ui-icon{width:2.2rem;height:2.2rem;color:#de0029}
 .concept-item h3{margin:0 0 .25rem;font-size:1rem}
 .concept-item p{margin:0;font-size:.78rem;line-height:1.4}
 .splash{min-height:43rem}
}
/* A real phone must not inherit the desktop frame, even in a wide virtual viewport. */
.phone-layout body{max-width:none;min-height:100svh;margin:0;border-radius:0;box-shadow:none;overflow-x:clip}
.phone-layout header{border-radius:0}
.phone-layout main{width:100%;min-height:0}
.phone-layout nav{left:0;width:100%;max-width:none;transform:none}
.phone-layout .reference-scene,.phone-layout .concept-reference{display:none}
.phone-layout .splash{min-height:calc(100svh - 6rem)}
@media(max-width:360px){.brand{font-size:1.25rem}.big{gap:.6rem;padding:.9rem .75rem}.big strong{font-size:1.05rem}.big small{font-size:.78rem}.home-reassurance{gap:.8rem;padding:.8rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}
.leaflet-control-zoom-in,.leaflet-control-zoom-out{width:2.75rem!important;height:2.75rem!important;line-height:2.75rem!important;font-size:1.6rem!important}
.leaflet-control-attribution{font-size:.65rem!important}
.leaflet-popup-content{font-size:.9rem;line-height:1.5;min-width:10rem;max-width:calc(100vw - 4rem)}

/* Keep native hidden controls hidden even when their button/label class uses flex. */
[hidden]{display:none!important}
.action-error{scroll-margin-block:6rem}


/* Isolated subscription choices, with existing navy/red identity. */
.sd-price-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1rem 0}.sd-price-options article{padding:1rem;border:1px solid #cdd9e6;border-radius:.8rem;background:#f4f7fb;min-width:0}.sd-price{font-size:1.9rem;font-weight:800;color:#0b2448}.sd-price small{font-size:1rem;font-weight:500}@media(max-width:600px){.sd-price-options{grid-template-columns:1fr}}

.sd-family-price{padding:1rem;border-left:4px solid #d60025;background:#edf2f8;border-radius:.6rem}.sd-family-price strong{color:#0b2448}

.report-description{overflow-wrap:anywhere;line-height:1.5}.report-description span{white-space:pre-line}
