/* Litterelles — styles globaux de la maquette */
*{box-sizing:border-box}
html,body{margin:0}
body{background:#EDE5D8;font-family:'Nunito',system-ui,sans-serif;color:#2D2420;-webkit-font-smoothing:antialiased}
a{color:#C05C3D}a:hover{color:#9E472C}
button,input,textarea{font:inherit}
input[type=search]::-webkit-search-cancel-button{display:none}
::-webkit-scrollbar{width:0;height:0}
*{scrollbar-width:none}

@keyframes shimmer{0%{background-position:-380px 0}100%{background-position:380px 0}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes slideIn{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes dropIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.28)}100%{transform:scale(1)}}

.lr-story-input::placeholder{color:rgba(253,251,247,.7)}

noscript div{max-width:420px;margin:80px auto;padding:24px;background:#FDFBF7;border-radius:18px;text-align:center}

/* ---------- Back-office : repli des grilles sur écrans moyens ---------- */
@media (max-width: 960px){
  .lr-g3{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width: 720px){
  .lr-admin{padding:18px !important;border-radius:20px !important}
  .lr-g2,.lr-g3,.lr-ig{grid-template-columns:minmax(0,1fr) !important}
  .lr-hist-wrap{overflow-x:auto}
  .lr-hist{min-width:620px}
}

/* ---------- PC : barre d'onglets + téléphone tiennent dans 100vh (taille réelle 392×844 si possible) ---------- */
.lr-wrap{min-height:100vh;padding:2.5vh 20px;display:flex;flex-direction:column;align-items:center;gap:16px}
.lr-phone{height:min(844px, calc(110vh - 56px));min-height:560px;width:auto;aspect-ratio:392/844}
.lr-notif{max-height:calc(100% - 110px)}
.lr-mobile-only{display:none !important}

/* ---------- Vrai téléphone (portrait ou paysage) : uniquement l'application, plein écran ---------- */
@media (max-width: 500px), (pointer: coarse) and (max-height: 500px){
  body{background:#FDFBF7}
  .lr-bar{display:none !important}
  .lr-wrap{padding:0;gap:0;min-height:100vh;min-height:100dvh}
  .lr-phone{width:100%;height:100vh;height:100dvh;min-height:0;aspect-ratio:auto;border-radius:0 !important;padding:0 !important;box-shadow:none !important;background:#FDFBF7 !important}
  .lr-screen{border-radius:0 !important}
  .lr-status{display:none !important}
  .lr-top,.lr-top-light{padding-top:calc(14px + env(safe-area-inset-top)) !important}
  .lr-notif{top:calc(64px + env(safe-area-inset-top)) !important}
  .lr-story-bars{top:calc(14px + env(safe-area-inset-top)) !important}
  .lr-story-head{top:calc(26px + env(safe-area-inset-top)) !important}
  .lr-nav{height:calc(72px + env(safe-area-inset-bottom)) !important}
  input,textarea{font-size:16px !important}
  .lr-wrap > .lr-admin{max-width:none;border-radius:0 !important;box-shadow:none !important;min-height:100dvh;padding:calc(18px + env(safe-area-inset-top)) 16px 30px !important}
  .lr-mobile-only{display:flex !important}
}