/* Mise en page : carte plein écran, barre de navigation en haut, panneau de lore qui glisse depuis la droite (feuille du bas sur mobile). Thème sombre assumé, façon atlas de jeu. */
:root{
  --abyss:#010a13;        /* fond, océan profond */
  --navy:#0a1428;         /* panneaux */
  --navy-2:#0f1d33;       /* survols */
  --gold:#c8aa6e;         /* accent principal */
  --gold-hi:#f0e6d2;      /* titres, texte clair */
  --gold-dim:#785a28;     /* filets */
  --teal:#0ac8b9;         /* état actif / focus */
  --ink:#a09b8c;          /* texte courant */
  --alliance:#4a7fd8;
  --horde:#c8372d;
  --neutral:#c8aa6e;
  --hostile:#7cbf3a;
  --display:"Cinzel","Trajan Pro","Times New Roman",serif;
  --body:"Spectral",Georgia,"Times New Roman",serif;
  --ui:"Barlow Semi Condensed","Arial Narrow",system-ui,sans-serif;
  color-scheme:dark;
}
html,body{height:100%;}
body{background:var(--abyss);color:var(--ink);font-family:var(--body);overflow:hidden;-webkit-font-smoothing:antialiased;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
button:focus-visible,input:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
#app{position:fixed;inset:0;overflow:hidden;overflow:clip;}
#map{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none;background:rgb(2,12,20);}
#map:active{cursor:grabbing;}

/* ---------- Chargement ---------- */
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- Barre supérieure ---------- */
#topbar{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:16px;
  padding:calc(10px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px));
  background:linear-gradient(to bottom,rgba(1,10,19,.95),rgba(1,10,19,.75) 70%,rgba(1,10,19,0));pointer-events:none;}
#topbar>*{pointer-events:auto;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--gold-hi);flex:none;}
.brand-emblem{display:block;width:44px;height:44px;margin:-3px 0;}
.brand-word{display:block;width:auto;height:16px;}
.brand small{display:block;font-family:var(--ui);letter-spacing:.2em;font-size:10.5px;color:var(--gold);text-transform:uppercase;margin-top:4px;}
#nav{display:flex;flex:none;gap:2px;margin:0 auto;}
#nav button{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--gold-hi);padding:10px 14px;border-bottom:2px solid transparent;transition:color .2s,border-color .2s;white-space:nowrap;}
#nav button:hover{color:#fff;}
#nav button[aria-pressed="true"]{border-bottom-color:var(--gold);color:var(--gold);}
/* Sélecteur de monde (menu déroulant) et niveau de la carte (ciel / surface / souterrain), d'un seul tenant */
#worlds{position:relative;flex:none;display:flex;align-items:center;height:38px;box-sizing:border-box;border:1px solid var(--gold-dim);background:rgba(10,20,40,.85);transition:border-color .2s;}
#worlds:hover,#worlds.open{border-color:var(--gold);}
#worldBtn{display:flex;align-items:center;gap:9px;height:100%;padding:0 11px 0 9px;color:var(--gold-hi);}
#worldBtn:hover{color:#fff;}
#worldBtn:focus-visible,#underPill button:focus-visible{outline:2px solid var(--teal);outline-offset:-2px;}
#worldBtn .wico{width:20px;height:20px;flex:none;fill:var(--gold);color:var(--gold);}
#worldBtn .wlab{display:flex;flex-direction:column;align-items:flex-start;line-height:1;text-align:left;}
#worldBtn small{font-family:var(--ui);font-weight:600;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:3px;}
#worldBtn b{font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;}
#worldBtn .chev{width:9px;height:6px;flex:none;fill:none;stroke:var(--gold);stroke-width:1.6;transition:transform .2s;}
#worlds.open .chev{transform:rotate(180deg);}
#underPill{display:flex;align-items:center;gap:2px;height:100%;padding:0 3px;border-left:1px solid var(--gold-dim);}
#underPill button{display:flex;align-items:center;gap:6px;height:30px;padding:0 8px;color:var(--ink);font-family:var(--ui);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:color .2s,background .2s;}
#underPill button svg{width:15px;height:15px;flex:none;fill:currentColor;}
#underPill button:hover{color:#fff;}
#underPill button:not([aria-pressed="true"]) span{display:none;}
#underPill button[aria-pressed="true"]{background:#6b5428;color:#fff;}
#underPill #pUnder[aria-pressed="true"]{background:#0b5f5a;}
#underPill #pSky[aria-pressed="true"]{background:#2b5d8c;}
#worldList{position:absolute;top:calc(100% + 6px);left:-1px;z-index:30;min-width:290px;max-height:calc(100vh - 90px);overflow:auto;padding:6px 0;background:var(--navy);border:1px solid var(--gold-dim);box-shadow:0 16px 40px rgba(0,0,0,.6);}
#worldList[hidden]{display:none;}
#worldList button{display:flex;align-items:center;gap:12px;width:100%;padding:8px 16px 8px 14px;text-align:left;border-left:2px solid transparent;font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-hi);}
#worldList button small{display:block;margin-top:2px;font-family:var(--ui);font-weight:500;font-size:12.5px;letter-spacing:.03em;text-transform:none;color:var(--ink);}
#worldList button:hover,#worldList button:focus{background:var(--navy-2);outline:none;}
#worldList button[aria-pressed="true"]{border-left-color:var(--gold);color:var(--gold);}
#worldList .wg{flex:none;width:7px;height:7px;border:1px solid var(--gold);transform:rotate(45deg);}
#worldList button[aria-pressed="true"] .wg{background:var(--gold);}
#worldList .ver{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding:10px 16px 6px;border-top:1px solid rgba(120,90,40,.35);font-family:var(--ui);font-weight:600;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);}
#worldList select{font-family:var(--display);font-weight:600;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-hi);background:rgba(1,10,19,.9);border:1px solid var(--gold-dim);padding:5px 6px;cursor:pointer;}
#worldList select:focus-visible{outline:1px solid var(--gold-hi);}
.search{position:relative;flex:0 1 260px;min-width:170px;}
.search input{width:100%;box-sizing:border-box;background:rgba(10,20,40,.85);border:1px solid var(--gold-dim);color:var(--gold-hi);font-family:var(--ui);font-size:14px;padding:9px 12px 9px 34px;letter-spacing:.03em;}
.search input::placeholder{color:#6b6a63;}
.search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:16px;height:16px;fill:var(--gold);}
#results{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:var(--navy);border:1px solid var(--gold-dim);max-height:60vh;overflow:auto;list-style:none;padding:4px 0;margin-left:0;box-shadow:0 12px 40px rgba(0,0,0,.6);}
#results li button{display:flex;width:100%;justify-content:space-between;gap:10px;align-items:center;text-align:left;padding:8px 12px;font-family:var(--ui);font-size:14.5px;color:var(--gold-hi);}
#results li button:hover,#results li button.active{background:var(--navy-2);}
#results li span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);flex:none;}
#results .empty{padding:10px 12px;font-family:var(--ui);font-size:13.5px;color:var(--ink);}
#menuBtn{display:none;}
/* Barre trop étroite (main.js fitTopbar) : sections dans le menu ☰ ; puis, sur téléphone, le monde passe en seconde ligne. */
#topbar.fold #nav{display:none;}
#topbar.fold #nav.open{display:flex;position:absolute;top:100%;right:max(16px,env(safe-area-inset-right,0px));width:min(300px,calc(100vw - 32px));box-sizing:border-box;flex-direction:column;margin:0;background:var(--navy);border:1px solid var(--gold-dim);padding:6px;box-shadow:0 16px 40px rgba(0,0,0,.6);}
#topbar.fold #nav.open button{text-align:left;}
#topbar.fold #menuBtn{display:grid;place-items:center;width:40px;height:38px;box-sizing:border-box;border:1px solid var(--gold-dim);background:rgba(10,20,40,.85);flex:none;}
#topbar.fold #menuBtn:hover{border-color:var(--gold);}
#topbar.fold #menuBtn svg{width:18px;height:18px;fill:var(--gold-hi);}
#topbar.fold .search{flex:1 1 0;max-width:400px;}
#topbar.fold #lang{margin-left:auto;}
#topbar.tight .brand>span,#topbar.tight #lang .code,#topbar.tight #underPill button span{display:none;}
#topbar.stack{flex-wrap:wrap;row-gap:4px;}
#topbar.stack #underPill button[aria-pressed="true"] span{display:inline;}
#topbar.stack::after{content:"";order:9;flex-basis:100%;height:0;}
#topbar.stack #worlds{order:10;height:36px;}
#topbar.stack #worldBtn small{display:none;}
/* Sélecteur de langue : menu déroulant à drapeaux */
#lang{position:relative;flex:none;}
#lang .flag{display:inline-block;flex:none;width:20px;height:13px;overflow:hidden;box-shadow:0 0 0 1px rgba(200,170,110,.55);}
#lang .flag svg{display:block;width:100%;height:100%;}
#lang .lang-cur{display:flex;align-items:center;gap:7px;height:38px;box-sizing:border-box;padding:0 9px 0 10px;border:1px solid var(--gold-dim);background:rgba(10,20,40,.85);
  font-family:var(--display);font-weight:600;font-size:11.5px;letter-spacing:.12em;color:var(--gold-hi);transition:border-color .2s,color .2s;}
#lang .lang-cur:hover,#lang.open .lang-cur{border-color:var(--gold);color:#fff;}
#lang .chev{width:9px;height:6px;fill:none;stroke:var(--gold);stroke-width:1.6;transition:transform .2s;}
#lang.open .chev{transform:rotate(180deg);}
#lang .lang-list{position:absolute;top:100%;right:0;z-index:30;min-width:100%;margin:4px 0 0;padding:4px 0;list-style:none;background:var(--navy);border:1px solid var(--gold-dim);box-shadow:0 12px 40px rgba(0,0,0,.6);}
#lang .lang-list[hidden]{display:none;}
#lang li{display:flex;align-items:center;gap:10px;padding:8px 14px 8px 12px;white-space:nowrap;cursor:pointer;font-family:var(--ui);font-size:14.5px;color:var(--gold-hi);border-left:2px solid transparent;}
#lang li:hover,#lang li:focus{background:var(--navy-2);outline:none;}
#lang li[aria-selected="true"]{border-left-color:var(--gold);color:var(--gold);}

/* Menu déroulant Régions */
#regionMenu{position:absolute;z-index:25;background:var(--navy);border:1px solid var(--gold-dim);padding:6px 0;min-width:260px;box-shadow:0 16px 40px rgba(0,0,0,.6);}
#regionMenu button{display:flex;align-items:center;gap:12px;width:100%;padding:9px 16px;text-align:left;font-family:var(--display);font-weight:600;letter-spacing:.08em;font-size:13px;color:var(--gold-hi);}
#regionMenu button:hover{background:var(--navy-2);}
#regionMenu button small{font-family:var(--ui);font-weight:500;letter-spacing:.03em;font-size:12.5px;color:var(--ink);display:block;text-transform:none;margin-top:2px;}

/* ---------- Infobulle ---------- */
#tip{position:absolute;z-index:15;pointer-events:none;background:rgba(10,20,40,.95);border:1px solid var(--gold-dim);padding:6px 10px;font-family:var(--ui);font-size:13.5px;color:var(--gold-hi);white-space:nowrap;transform:translate(14px,14px);}
#tip small{display:block;font-size:10.5px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;}

/* ---------- Contrôles ---------- */
#zoomCtl{position:absolute;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:6px;z-index:12;transition:right .5s cubic-bezier(.2,.8,.2,1);}
#zoomCtl button{width:42px;height:42px;display:grid;place-items:center;background:rgba(10,20,40,.88);border:1px solid var(--gold-dim);color:var(--gold-hi);font-size:20px;font-family:var(--display);}
#zoomCtl button:hover{border-color:var(--gold);color:#fff;}
#zoomCtl svg{width:18px;height:18px;fill:currentColor;}
body.panel-open #zoomCtl{right:calc(min(460px,100vw) + 16px);}
#hint{position:absolute;left:50%;bottom:calc(26px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:11;font-family:var(--ui);letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--gold-hi);background:rgba(1,10,19,.7);padding:9px 18px;border:1px solid rgba(120,90,40,.6);transition:opacity .8s;white-space:nowrap;}
body.panel-open #hint{opacity:0;}

/* ---------- Panneau ---------- */
#panel{position:absolute;top:0;right:0;bottom:0;width:min(460px,100vw);z-index:30;background:linear-gradient(180deg,#0b172c 0%,var(--navy) 40%,#060f1d 100%);border-left:1px solid var(--gold-dim);box-shadow:-30px 0 60px rgba(0,0,0,.55);transform:translateX(105%);transition:transform .55s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;}
body.panel-open #panel{transform:none;}
/* Panneau ouvert (bureau) : recherche et langue restent accessibles à gauche du panneau. */
@media (min-width:861px){
  body.panel-open #topbar{padding-right:calc(min(460px,100vw) + 16px);gap:14px;}
  body.panel-open #topbar.fold #nav.open{right:calc(min(460px,100vw) + 16px);}
}
@media (min-width:861px) and (max-width:1500px){
  body.panel-open #nav button{padding:10px 8px;letter-spacing:.08em;}
  body.panel-open .brand small{display:none;}
}
#panel::before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:1px;background:linear-gradient(to bottom,transparent,var(--gold) 20%,var(--gold) 80%,transparent);}
.ptools{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:14px;right:14px;display:flex;justify-content:space-between;z-index:3;}
.ptools button{width:38px;height:38px;display:grid;place-items:center;background:rgba(1,10,19,.75);border:1px solid var(--gold-dim);color:var(--gold-hi);}
.ptools button:hover{border-color:var(--gold);}
.ptools button[hidden]{display:none!important;}
.ptools svg{width:16px;height:16px;fill:currentColor;}
#pbody{overflow-y:auto;flex:1;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--gold-dim) transparent;padding-bottom:calc(30px + env(safe-area-inset-bottom,0px));}
.splash{position:relative;height:230px;overflow:hidden;}
.splash canvas{width:100%;height:100%;display:block;}
.splash::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,20,40,0) 30%,var(--navy) 98%);}
.phead{position:relative;margin-top:-86px;padding:0 28px;z-index:2;}
.spacer{height:72px;}
.spacer + .phead{margin-top:0;}
.eyebrow{font-family:var(--ui);font-weight:600;font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.eyebrow a{color:var(--gold);text-decoration:none;}
.eyebrow a:hover{color:var(--gold-hi);}
.ptitle{font-family:var(--display);font-weight:700;color:var(--gold-hi);font-size:clamp(28px,6vw,40px);line-height:1.04;letter-spacing:.04em;text-transform:uppercase;margin:8px 0 6px;text-wrap:balance;}
.psub{font-family:var(--body);font-style:italic;color:var(--gold);font-size:17px;margin:0;}
.divider{display:flex;align-items:center;gap:10px;margin:18px 28px;}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:linear-gradient(to right,transparent,var(--gold-dim));}
.divider::after{background:linear-gradient(to left,transparent,var(--gold-dim));}
.divider i{width:8px;height:8px;border:1px solid var(--gold);transform:rotate(45deg);}
.prose{padding:0 28px;font-size:16.5px;line-height:1.62;color:#cfc7b3;}
.prose p{margin:0 0 14px;}
.prose:not(.more) p:first-child::first-letter{font-family:var(--display);font-size:2.6em;float:left;line-height:.9;margin:4px 8px 0 0;color:var(--gold);}
.sec{padding:6px 28px 4px;}
.sec h3{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:18px 0 12px;display:flex;align-items:center;gap:10px;}
.sec h3::after{content:"";flex:1;height:1px;background:rgba(120,90,40,.6);}
.facts{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;margin:0;font-size:15px;}
.facts dt{font-family:var(--ui);font-weight:600;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);padding-top:3px;}
.facts dd{margin:0;color:#d9d1bd;min-width:0;}
.chars{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:14px 8px;}
.char{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;font-family:var(--ui);font-size:13px;line-height:1.2;color:var(--gold-hi);}
.char:hover .medal{border-color:var(--gold-hi);transform:translateY(-2px);}
.medal{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:20px;color:var(--gold-hi);border:2px solid var(--gold);transition:transform .2s,border-color .2s;position:relative;}
.medal.big{width:96px;height:96px;font-size:32px;}
.medal::after{content:"";position:absolute;inset:3px;border-radius:50%;border:1px solid rgba(240,230,210,.18);}
.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;}
.list button{display:flex;width:100%;align-items:center;gap:12px;padding:10px 4px;text-align:left;border-bottom:1px solid rgba(120,90,40,.28);font-family:var(--ui);font-size:15px;color:var(--gold-hi);}
.list button:hover{background:rgba(200,170,110,.06);}
.list button em{font-style:normal;margin-left:auto;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);flex:none;}
/* Régions du monde : vignette de la carte peinte, nom, épithète, détail des zones ; cartes rattachées en retrait. */
.list.regions button{gap:14px;padding:10px 6px 10px 2px;border-bottom-color:rgba(120,90,40,.2);transition:background .15s;}
.list.regions button:hover .rg-th{border-color:var(--gold);}
.rg-th{width:54px;height:54px;flex:none;border:1px solid rgba(200,170,110,.4);border-radius:4px;background:radial-gradient(circle at 50% 45%,#1b2e48,#07101d 78%);box-shadow:0 1px 6px rgba(0,0,0,.45);transition:border-color .15s;}
.rg-txt{display:flex;flex-direction:column;gap:1px;min-width:0;}
.rg-txt b{font-weight:600;font-size:16px;line-height:1.2;color:var(--gold-hi);}
.rg-txt i{font-family:var(--body);font-size:13.5px;line-height:1.3;color:var(--ink);}
.rg-txt small{font-size:11.5px;letter-spacing:.04em;color:var(--gold);opacity:.85;margin-top:2px;}
.list.regions li.sub button{padding-left:30px;position:relative;}
.list.regions li.sub button::before{content:"";position:absolute;left:12px;top:-1px;height:50%;width:10px;border-left:1px solid var(--gold-dim);border-bottom:1px solid var(--gold-dim);}
.list.regions li.sub .rg-th{width:42px;height:42px;}
.list.regions li.sub .rg-txt b{font-size:15px;}
.gly{width:10px;height:10px;flex:none;transform:rotate(45deg);border:1px solid var(--gold);}
.gly.capitale{background:var(--gold);}
.gly.raid,.gly.donjon{border-radius:50%;transform:none;border-color:#d0573d;background:rgba(208,87,61,.4);}
.gly.site{border-color:var(--teal);}
.story{margin:0 0 14px;padding:14px 16px;background:rgba(1,10,19,.45);border:1px solid rgba(120,90,40,.4);}
.story b{display:flex;justify-content:space-between;gap:12px;font-family:var(--display);font-weight:600;color:var(--gold-hi);font-size:14.5px;letter-spacing:.06em;margin-bottom:6px;}
.story b span{font-family:var(--ui);font-size:12px;letter-spacing:.12em;color:var(--gold);flex:none;font-weight:600;}
.story p{margin:0;font-size:15px;line-height:1.55;color:#cbc2ad;}
.tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--ui);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:3px 9px;border:1px solid currentColor;}
.tag.A{color:#7ea6ec;} .tag.H{color:#e2675c;} .tag.N{color:var(--gold);} .tag.X{color:#9ad35b;}
.chips{display:flex;flex-wrap:wrap;gap:8px;}
.chip{font-family:var(--ui);font-size:13.5px;color:var(--gold-hi);border:1px solid var(--gold-dim);padding:6px 11px;}
.chip:hover{border-color:var(--gold);background:rgba(200,170,110,.08);}
.chip.plain{color:#cbc2ad;border-color:rgba(120,90,40,.4);}
.chip.plain:hover{background:none;border-color:rgba(120,90,40,.4);}
.lsrc{font-family:var(--ui);font-size:12.5px;line-height:1.6;color:#8f866f;margin:6px 0 0;overflow-wrap:anywhere;}
.lsrc a{color:var(--gold);}
.lsrc cite{font-style:italic;}
.filters{display:flex;flex-wrap:wrap;gap:6px;padding:0 28px;}
.filters button{font-family:var(--ui);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:6px 11px;border:1px solid var(--gold-dim);color:var(--ink);}
.filters button[aria-pressed="true"]{color:var(--abyss);background:var(--gold);border-color:var(--gold);}
.tl{list-style:none;margin:0;padding:0 28px 0 46px;position:relative;}
.tl::before{content:"";position:absolute;left:33px;top:6px;bottom:6px;width:1px;background:linear-gradient(to bottom,var(--gold),var(--gold-dim) 90%,transparent);}
.tl li{position:relative;margin-bottom:18px;}
.tl li::before{content:"";position:absolute;left:-17px;top:7px;width:8px;height:8px;border:1px solid var(--gold);background:var(--navy);transform:rotate(45deg);}
.tl .yr{font-family:var(--ui);font-weight:600;font-size:12px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;}
.tl b{display:block;font-family:var(--display);color:var(--gold-hi);font-size:15.5px;letter-spacing:.04em;margin:2px 0 4px;}
.tl p{margin:0 0 6px;font-size:15px;line-height:1.5;color:#cbc2ad;}
.tl button{font-family:var(--ui);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);padding:0;}
.fac{padding:14px 16px;margin:0 28px 14px;border:1px solid rgba(120,90,40,.45);background:rgba(1,10,19,.4);}
.fac h4{margin:0 0 4px;font-family:var(--display);font-size:18px;letter-spacing:.06em;color:var(--gold-hi);display:flex;justify-content:space-between;align-items:center;gap:10px;}
.fac q{display:block;font-style:italic;color:var(--gold);margin-bottom:8px;font-size:15px;}
.fac p{margin:0 0 10px;font-size:15px;line-height:1.55;color:#cbc2ad;}
.fac small{display:block;font-family:var(--ui);font-size:13px;color:var(--ink);margin-bottom:10px;}
.cta{display:inline-flex;align-items:center;gap:8px;margin:4px 28px 0;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi);border:1px solid var(--gold);padding:11px 18px;background:linear-gradient(to bottom,rgba(200,170,110,.12),rgba(200,170,110,0));}
.cta:hover{background:rgba(200,170,110,.2);}
.status{font-family:var(--ui);font-size:13px;color:var(--ink);}

/* ---------- Mobile ---------- */
@media (max-width:860px){
  #topbar{gap:10px;}
  #topbar.fold #nav.open{left:max(16px,env(safe-area-inset-left,0px));width:auto;}
  .search{min-width:120px;}
  #lang .lang-cur{padding:0 8px;gap:6px;}
  #lang .code{display:none;}
  .brand small{display:none;}
  .brand-word{height:14px;}
  #hint{display:none;}
  #panel{top:auto;height:62%;width:100%;border-left:0;border-top:1px solid var(--gold-dim);transform:translateY(105%);}
  body.panel-open #zoomCtl{right:max(16px,env(safe-area-inset-right,0px));bottom:calc(62% + 12px);}
  .splash{height:170px;}
  .phead{margin-top:-70px;}
}
@media (max-width:520px){
  .brand-word{display:none;}
}

/* Pas de sélection de texte ni de surlignage (la carte se glisse, se double-clique) ; le champ de recherche reste éditable. */
html, body, * { user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
::selection { background: transparent; }
input, textarea, [contenteditable], [contenteditable] * { user-select: text; -webkit-user-select: text; }
input::selection, textarea::selection, [contenteditable] ::selection { background: rgba(200, 170, 110, .35); }