:root{--ink:#f9edcf;--muted:#c3c7b9;--panel:#192e32;--gold:#eecb76;--green:#94d0aa;--line:#456166}*{box-sizing:border-box}html{background:#101d25;color:var(--ink);min-height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}body{margin:0;background:radial-gradient(circle at 50% 0%,#294d55 0%,#101d25 58%)}button{cursor:pointer;border:0;color:inherit;font:inherit;touch-action:manipulation}#app{max-width:1120px;margin:auto;padding:12px 14px 24px}.masthead{display:flex;justify-content:space-between;align-items:end;gap:10px;margin:5px 4px 13px}.masthead small{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:850}.masthead h1{font-family:Georgia,serif;font-size:clamp(24px,4vw,42px);margin:0;font-weight:850;line-height:1.1}.masthead h1 span{font-weight:400}.version{text-align:right;color:#a5c2b4;font-size:10px;letter-spacing:1px;font-weight:800;line-height:1.7}.frame{position:relative;background:#1f413b;overflow:hidden;border:4px solid #c39e62;border-radius:10px;box-shadow:0 16px 45px #06111699;aspect-ratio:960/600}#game{display:block;width:100%;height:100%;image-rendering:pixelated}.gamehud{position:absolute;left:10px;right:10px;top:10px;display:flex;gap:7px;align-items:flex-start;pointer-events:none}.hudpiece,.hudbutton{background:#13252adf;border:1px solid #a78b59ad;border-radius:6px;padding:7px 11px;box-shadow:0 3px 0 #101d2299}.hudpiece{min-width:84px;display:flex;flex-direction:column;gap:1px;font-weight:bold;font-size:18px}.hudtitle{font-size:9px;color:#eccb8b;letter-spacing:1px}.questhud{flex:1;font-size:12px;min-width:0}.hudbutton{pointer-events:auto;color:#ffe9b3;font-size:20px;font-weight:bold;padding:6px 12px}.floating-info{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);background:#102629dd;border:1px solid #dab26b;border-radius:6px;padding:7px 12px;text-align:center;max-width:90%;font-size:12px;text-shadow:0 1px #0008;pointer-events:none}.notice{position:absolute;top:68px;left:50%;transform:translateX(-50%);padding:10px 20px;border:2px solid #efcf8e;background:#233c39f2;color:#fff3bf;border-radius:8px;font-size:13px;font-weight:bold;text-align:center;box-shadow:0 6px 24px #132127a1;z-index:3;pointer-events:none}.hidden{display:none!important}.dialog{position:absolute;z-index:8;bottom:16px;left:4%;width:92%;background:#122c36f5;border:3px solid #ebc886;border-radius:11px;padding:15px;display:flex;gap:15px;box-shadow:0 10px 36px #06131bd9;min-height:139px}.portrait{width:76px;height:76px;flex:none;border:2px solid #c2a56b;background:#254a50;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:37px}.dialogtext{flex:1;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.4}.speaker{color:#ffd888;font-weight:900;font-size:16px}.dialogBtns{display:flex;justify-content:flex-end;margin-top:auto}.dialogBtns button{background:#c99b57;color:#102029;padding:6px 14px;border-radius:5px;font-weight:850}.overlay{position:absolute;z-index:10;inset:0;background:#071417c9;display:flex;align-items:center;justify-content:center;padding:20px}.panel{text-align:center;background:linear-gradient(145deg,#233f45,#10242f);border:3px solid #d6b472;border-radius:14px;max-width:510px;width:100%;padding:24px;box-shadow:0 16px 40px #0009}.panel-emblem{font-size:37px}.panel .eyebrow{color:#deb679;letter-spacing:2px;font-size:11px;font-weight:800;margin:0}.panel h2{font-family:Georgia,serif;font-size:clamp(22px,3vw,32px);margin:8px 0}.panel p{line-height:1.5;font-size:14px;color:#d7dad2}.panel-actions{display:flex;justify-content:center;gap:11px;flex-wrap:wrap;margin-top:22px}.panel-actions button{padding:11px 16px;border-radius:7px;font-weight:850}.panel-actions .primary{background:#e8bc68;color:#1b2925}.panel-actions .secondary{background:#426063;color:#fff4d8;border:1px solid #a9c0ac}.panel .fine{font-size:11px;color:#aab8af;margin:18px 0 0}.lower{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:15px;margin-top:15px}.controls{min-height:164px;display:flex;justify-content:space-between;gap:16px;border:1px solid #39585a;background:#132a30;border-radius:9px;padding:15px}.dpad{width:155px;height:142px;position:relative;flex:none}.dpad button{position:absolute;border:1px solid #76928e;background:#38595c;width:48px;height:44px;border-radius:9px;font-size:20px;font-weight:900;user-select:none;-webkit-user-select:none;box-shadow:0 3px 0 #092027}.dpad button:active,.action:active{transform:translateY(2px);filter:brightness(1.2)}.dpad [data-dir=up]{left:53px;top:0}.dpad [data-dir=left]{left:0;top:49px}.dpad [data-dir=down]{left:53px;top:98px}.dpad [data-dir=right]{left:106px;top:49px}.actionkeys{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.action{height:62px;width:84px;border-radius:13px;border:1px solid #f3dca0;font-size:11px;font-weight:950;letter-spacing:.5px;box-shadow:0 4px 0 #041d26}.action small{display:block;font-size:9px;opacity:.7;margin-top:4px}.bite{background:#a85743}.magic{background:#5168a9}.interact{background:#48876b}.sidebar{background:#172f36;border:1px solid #436165;padding:17px;border-radius:9px;font-size:12px;line-height:1.45;min-width:0}.paneltitle{color:#f1cc7e;font-size:11px;letter-spacing:1.1px;font-weight:950}.sidebar p{margin:6px 0 8px;color:#dce4d4}.sepline{height:1px;background:#35565c;margin:11px 0}.sidebar #inventory{margin-top:7px;color:#cddbd2}footer{margin:15px 4px 0;color:#9eb7ae;font-size:11px;line-height:1.6;text-align:center}@media(max-width:720px){#app{padding:7px}.masthead{margin:6px 3px}.version{font-size:8px}.masthead small{font-size:8px}.frame{border-width:2px}.gamehud{left:4px;right:4px;top:4px;gap:3px}.hudpiece,.hudbutton{padding:3px 5px;font-size:13px;min-width:53px}.hudtitle{font-size:6px}.questhud{font-size:8px}.hudbutton{font-size:16px}.floating-info{font-size:9px;bottom:4px;padding:4px 6px}.dialog{bottom:3px;left:2%;width:96%;min-height:0;padding:6px;gap:7px}.portrait{width:39px;height:39px;font-size:22px}.dialogtext{font-size:11px;gap:2px}.speaker{font-size:12px}.dialogBtns button{font-size:11px;padding:3px 8px}.overlay{padding:5px}.panel{padding:8px;border-width:2px}.panel-emblem{font-size:22px}.panel h2{font-size:18px}.panel p{font-size:10px;margin:5px}.panel .eyebrow{font-size:8px}.panel-actions{margin-top:9px}.panel-actions button{font-size:11px;padding:6px 10px}.panel .fine{font-size:8px;margin:6px}.lower{grid-template-columns:1fr;gap:8px;margin-top:8px}.controls{min-height:116px;padding:7px}.dpad{transform:scale(.75);transform-origin:top left;margin-right:-38px;height:112px}.actionkeys{gap:5px}.action{width:69px;height:49px;font-size:9px}.sidebar{padding:11px}footer{font-size:9px;margin-top:9px}}@media(max-width:380px){.action{width:56px}.actionkeys{gap:4px}.dpad{transform:scale(.68);margin-right:-50px}}

/* Les menus de développement restent accessibles sur un petit écran. */
.panel{max-height:100%;overflow-y:auto}
.dpad button{touch-action:none}

/* Le journal sort du monde pour dégager la vue. */
.gamehud{justify-content:flex-start;align-items:center}.gamehud .hudbutton{margin-left:auto}.hudpiece{min-width:70px;font-size:15px;padding:4px 8px}.world-status{display:flex;justify-content:space-between;gap:12px;padding:8px 5px;font-size:12px;color:#ddcd9f}.world-status span:last-child{color:#a9cbb2}
@media(max-width:720px){.hudpiece{font-size:11px;min-width:48px;padding:3px 5px}.hudtitle{font-size:7px}.world-status{font-size:10px;gap:8px}.floating-info{font-size:8px;max-width:94%}}
@media(max-width:720px){.action.magic{font-size:8px;letter-spacing:0}}

.pause-inventory{text-align:left;border-top:1px solid #bcab7f55;margin-top:14px;padding-top:8px}.pause-inventory h3{font-size:14px;margin:8px 0}.pause-inventory p{font-size:12px;margin:6px 0}.souvenir-slots{display:flex;gap:6px;flex-wrap:wrap}.souvenir-slots span{border:1px solid #cdbb88;border-radius:6px;padding:7px;font-size:12px}.overlay .panel{max-height:95%;overflow:auto}

/* Un menu complet doit rester lisible même lorsque le canvas mobile est court. */
@media(max-width:720px),(max-height:500px){.overlay{position:fixed;inset:0;padding:16px;z-index:30}.overlay .panel{max-height:calc(100dvh - 32px);overscroll-behavior:contain}}
/* Acte I : pause et sac sont deux écrans distincts. */
.action:disabled{opacity:.4;cursor:default;box-shadow:none}.dev-link{display:block;background:none;color:#a9c1b4;font-size:10px;text-decoration:underline;margin-top:12px;padding:4px 0}.portrait img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.betty-portrait{background:#254a50 url('assets/betty_sprites.png') no-repeat;background-size:228px 304px;background-position:-76px 0}.pause-screen{display:grid;grid-template-columns:1fr 180px;column-gap:20px;max-width:650px;text-align:left}.pause-screen .panel-emblem{grid-column:1;align-self:end}.pause-screen h2{grid-column:1}.pause-screen p{grid-column:1}.pause-screen .panel-actions{grid-column:2;grid-row:1/5;display:flex;flex-direction:column;margin:0}.inventory-screen{max-width:680px}.inventory-sections{text-align:left}.inventory-sections h3{font-size:12px;color:#efcd8c;margin:12px 0 6px}.inventory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.inventory-slot{min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid #b39c6b;background:#0e242b;border-radius:6px;font-size:12px;padding:6px}.inventory-sections .inventory-grid:last-child{grid-template-columns:repeat(4,1fr)}
@media(max-width:720px){.pause-screen{grid-template-columns:1fr 140px;padding:15px}.inventory-slot{min-height:43px;font-size:10px}.betty-portrait{background-size:117px 156px;background-position:-39px 0}.inventory-screen{padding:15px}}

/* Sélection visible au clavier et choix accessibles à la souris / au tactile. */
button.selected,button:focus-visible{outline:3px solid #ffe28c;outline-offset:3px;filter:brightness(1.15)}
.dialog-choices{display:flex;gap:12px;justify-content:flex-end;margin-top:8px}.dialog-choices button{background:#426063;border:1px solid #e8bc68;border-radius:6px;padding:9px 18px;color:#fff4d8;font-weight:800}
@media(max-width:720px){.dialog:has(.dialog-choices:not(:empty)){position:fixed;left:4%;width:92%;bottom:20px;z-index:40}.dialog-choices button{min-height:44px}}
/* Référence menu-v2 : sac visible à gauche, gestion de partie à droite. */
.pause-screen:has(.inventory-sections){max-width:900px;width:96%;grid-template-columns:minmax(0,1.35fr) minmax(210px,1fr);gap:4px 28px;padding:24px;background:linear-gradient(120deg,#122b30f5,#10262bf2);border:3px double #e6c986;border-radius:16px}
.pause-screen:has(.inventory-sections)>.panel-emblem,.pause-screen:has(.inventory-sections)>h2,.pause-screen:has(.inventory-sections)>p{grid-column:2;text-align:center;margin:2px}
.pause-screen:has(.inventory-sections)>.panel-actions{grid-column:2;grid-row:4;gap:9px;justify-content:start;padding:12px 0}
.pause-screen:has(.inventory-sections)>.inventory-sections{grid-column:1;grid-row:1/5;border-right:1px solid #d7be7e66;padding-right:24px}
.pause-screen .inventory-sections:before{content:'🎒 INVENTAIRE';display:block;color:#f0d69e;letter-spacing:2px;font-weight:bold;padding:8px 0;border-bottom:1px solid #c3aa6c}
.pause-screen .inventory-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.pause-screen .inventory-slot{min-height:56px;font-size:11px;background:#10262b;border:2px solid #a99577;border-radius:9px}
.pause-screen .inventory-grid:last-child{grid-template-columns:repeat(4,minmax(0,1fr))}
.pause-screen .panel-actions button{min-height:44px;border:1px solid #b0bca5;border-radius:10px;background:#163239}.pause-screen .panel-actions button.primary{background:#efd48d;color:#182b2c;border:3px double #5f552f}
@media(max-width:720px){.pause-screen:has(.inventory-sections){grid-template-columns:minmax(0,1.2fr) minmax(125px,1fr);column-gap:12px;padding:12px;max-height:calc(100dvh - 24px)}.pause-screen:has(.inventory-sections)>.inventory-sections{padding-right:10px}.pause-screen .inventory-grid{gap:4px}.pause-screen .inventory-slot{min-height:40px;padding:3px;font-size:8px}.pause-screen .inventory-sections h3{font-size:10px}.pause-screen .inventory-sections:before{font-size:11px;letter-spacing:1px}.pause-screen .panel-actions button{font-size:11px;padding:7px}.pause-screen:has(.inventory-sections)>p{font-size:10px}}
/* Écran titre distinct de la pause : composition illustrée, mobile et clavier. */
.panel.main-screen{position:relative;max-width:760px;width:94%;min-height:410px;padding:44px 36px 35px;border:3px solid #bc9c60;border-radius:18px;background:linear-gradient(100deg,rgba(14,37,36,.97) 35%,rgba(16,44,36,.72)),url('assets/buildings/maison-mamoune-briques.png') right center/62% auto no-repeat,#284f3c;box-shadow:0 15px 65px #0009;text-align:left}
.main-screen h2{font-size:clamp(26px,4vw,42px);line-height:1.1;color:#ffe7ae;max-width:490px}.main-screen>p{max-width:460px}.main-screen .panel-emblem{font-size:40px;text-align:left}.main-screen .panel-actions{display:grid;grid-template-columns:1fr 1fr;max-width:420px;gap:12px}.main-screen button{min-height:48px}
@media(max-width:600px){.panel.main-screen{min-height:340px;padding:22px 18px}.main-screen .panel-actions{gap:8px}.main-screen h2{font-size:27px}.panel-actions button{white-space:normal}}

/* Carillon : cibles tactiles locales et texte d'indice sur plusieurs lignes. */
.church-panel .panel-actions button{min-height:44px}.church-panel p{white-space:pre-line;min-height:4.5em}.church-panel canvas{display:block;height:auto;image-rendering:pixelated;margin:10px auto 0}

/* Miroir local : contrôles confortables et aperçu du vrai atlas. */
.mirror-panel .panel-actions button{min-height:44px}.mirror-panel p{min-height:3em}.mirror-panel canvas{display:block;height:auto;image-rendering:pixelated;margin:8px auto 0}

/* M09: identical dialog metrics from the first line; disable iOS text autosizing. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
#dialogContent{font:inherit;line-height:inherit;letter-spacing:normal;overflow-wrap:break-word}
.pause-objective{display:none}
.install-link{grid-column:1/-1;background:transparent!important;border:0!important;box-shadow:none!important;color:#e6d3a6!important;text-decoration:underline;font-size:12px!important;min-height:32px!important;padding:4px!important}
.install-panel p{white-space:pre-line;text-align:left;line-height:1.55}
.opening{position:absolute;inset:0;z-index:18;overflow:hidden;pointer-events:none}
.eyelid{position:absolute;left:-5%;width:110%;height:52%;background:#000;animation:betty-wake 2.4s cubic-bezier(.4,0,.3,1) both}
.eyelid-top{top:0;transform-origin:top center;border-radius:0 0 50% 50%}
.eyelid-bottom{bottom:0;transform-origin:bottom center;border-radius:50% 50% 0 0}
.opening button{position:absolute;right:14px;top:14px;pointer-events:auto;background:#132d32df;border:1px solid #e1c48b;border-radius:9px;padding:10px 16px;min-height:44px;font-size:14px;color:#fff0ce}
.opening-active .controls{visibility:hidden}
@keyframes betty-wake{0%,10%{transform:scaleY(1)}100%{transform:scaleY(0)}}
@media(prefers-reduced-motion:reduce){.eyelid{animation:none}}
/* Fully black first instant, including the curved corners of the eyelids. */
.opening{background:#000;animation:betty-wake-backdrop 2.4s linear both}
@keyframes betty-wake-backdrop{0%,10%{background-color:#000}30%,100%{background-color:transparent}}
.mobile-portrait .opening{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.opening{animation:none}}

/* Save result belongs to the pause header, above its overlay and local scrollers. */
.pause-screen h2 .save-feedback{display:block;margin-top:5px;font:600 13px/1.3 system-ui,sans-serif;letter-spacing:normal;color:#bde3c6;white-space:normal}
.pause-screen h2 .save-feedback[data-kind="error"]{color:#ffd0b9}

/* R3: trois caractéristiques lisibles et exactement trois souvenirs. */
.panel .inventory-sections .inventory-grid.progression-grid{grid-template-columns:1fr}.inventory-sections .progression-grid .inventory-slot{justify-content:flex-start;text-align:left;min-height:34px;font-size:13px}.panel .inventory-sections .inventory-grid.souvenir-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.inventory-slot{overflow-wrap:anywhere}

/* R8 : deux lignes visuelles de progression ; aucun changement des bonus. */
.compact-stats{display:flex;flex-direction:column;gap:2px;padding:5px 0}.inventory-hearts{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:25px;line-height:1.05}.heart-full{color:#ef846e}.heart-empty{color:#c7b898}.heart-count{font-size:12px;margin-left:6px;color:#d4d7cc}.inventory-upgrades{display:flex;align-items:center;gap:28px}.upgrade-count{display:flex;align-items:center;gap:7px;font-weight:bold;font-size:16px}.upgrade-icon{width:32px;height:28px;image-rendering:pixelated}
