html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: #000;
  overscroll-behavior: none;
}

body.minios-frontend-body {
  position: fixed;
  inset: 0;
  width: 100%;
  min-height: 100dvh;
  overflow: visible;
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  touch-action: manipulation;
}

body.minios-app-active {
  overflow: hidden;
}


.minios-device button {
  font: inherit;
  outline: none;
}

.minios-device button:focus,
.minios-device button:focus-visible {
  outline: none;
}

.minios-device {
  --lock-wallpaper: var(--minios-lock-wallpaper, none);
  --springboard-wallpaper: var(--minios-springboard-wallpaper, var(--lock-wallpaper));
  width: min(430px, 100vw);
  height: 100dvh;
  margin: 0 auto;
  position: fixed;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background: #050509;
  box-shadow: 0 0 80px rgba(0,0,0,.55);
}

.admin-bar .minios-device {
  height: 100dvh;
}

.minios-device::before,
.minios-lockscreen::before,
.minios-springboard::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.minios-device::before {
  z-index: 0;
  background: radial-gradient(circle at 50% 0, rgba(255,255,255,.12), transparent 32%);
}

.minios-lockscreen,
.minios-springboard {
  position: absolute;
  inset: 0;
  overflow: hidden;
  box-sizing: border-box;
  z-index: 2;
  overflow: hidden;
}

.minios-lockscreen {
  z-index: 20;
  background: var(--lock-wallpaper) center / cover no-repeat,
    radial-gradient(circle at 28% 10%, rgba(10,132,255,.42), transparent 35%),
    radial-gradient(circle at 84% 14%, rgba(255,55,95,.35), transparent 34%),
    linear-gradient(180deg, #24314a, #07070b 66%, #000);
  transition: transform .72s cubic-bezier(.22,1,.36,1), opacity .42s ease;
}

.minios-lockscreen::before {
  z-index: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.1) 44%, rgba(0,0,0,.34));
}

.minios-device:not(.is-locked) .minios-lockscreen {
  transform: translateY(-105%);
  opacity: 0;
  pointer-events: none;
}

.minios-springboard {
  z-index: 3;
  touch-action: pan-y;
  opacity: 0;
  transform: translateY(18px) scale(.985);
  background: var(--springboard-wallpaper) center / cover no-repeat,
    linear-gradient(180deg, #1a2135, #050509);
  transition: transform .62s cubic-bezier(.22,1,.36,1), opacity .42s ease;
  pointer-events: none;
  visibility: visible;
  content-visibility: visible;
  will-change: transform, opacity;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

.minios-springboard::before {
  z-index: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.15) 42%, rgba(0,0,0,.34));
}

.minios-device:not(.is-locked) .minios-springboard {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.minios-device.is-locked .minios-springboard {
  visibility: visible;
}

.minios-lock-center {
  position: relative;
  z-index: 4;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  margin-top: calc(env(safe-area-inset-top) + 56px);
  padding: 0 22px;
  color: rgba(255,255,255,.96);
  text-shadow: 0 3px 14px rgba(0,0,0,.72), 0 18px 46px rgba(0,0,0,.38);
}

.minios-lock-date {
  font-size: clamp(20px, 5.3vw, 25px);
  line-height: 1.1;
  font-weight: 520;
  letter-spacing: -.035em;
  text-transform: capitalize;
}

.minios-lock-time {
  margin-top: 6px;
  font-size: clamp(86px, 24vw, 116px);
  line-height: .86;
  font-weight: 180;
  letter-spacing: -.08em;
}

.minios-lock-widgets {
  position: absolute;
  z-index: 5;
  top: calc(env(safe-area-inset-top) + 210px);
  left: 22px;
  right: 22px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 98px;
  align-items: stretch;
  gap: 10px;
}

.minios-lock-widget {
  min-height: 98px;
  border-radius: 25px;
  padding: 14px;
  box-sizing: border-box;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(26px) saturate(180%);
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  box-shadow: inset 0 1px rgba(255,255,255,.25), 0 14px 36px rgba(0,0,0,.18);
}

.minios-lock-widget span,
.minios-lock-widget small {
  display: block;
  font-size: 12px;
  opacity: .88;
}

.minios-lock-widget strong {
  display: block;
  margin-top: 4px;
  font-size: 16px;
  line-height: 1.05;
  letter-spacing: -.04em;
}

.minios-lock-notifications {
  position: absolute;
  z-index: 6;
  left: 20px;
  right: 20px;
  bottom: calc(env(safe-area-inset-bottom) + 112px);
  max-height: min(34dvh, 292px);
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: auto;
  overflow: hidden;
}

.minios-lock-notifications,
.minios-lock-notifications *,
.minios-lock-notif,
.minios-lock-notif * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  touch-action: pan-y;
}

.minios-lock-notif-title {
  flex: 0 0 auto;
  align-self: flex-start;
  height: 30px;
  padding: 0 17px;
  border-radius: 999px;
  box-sizing: border-box;
  background: rgba(55,55,58,.52);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.9);
  font-size: 14px;
  font-weight: 540;
  line-height: 29px;
  letter-spacing: -.015em;
  backdrop-filter: blur(18px) saturate(170%);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 8px 22px rgba(0,0,0,.18);
  text-shadow: 0 1px 8px rgba(0,0,0,.35);
}

.minios-lock-notif-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 1px 8px 0;
  mask-image: linear-gradient(to bottom, #000 0%, #000 86%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 86%, transparent 100%);
}

.minios-lock-notif-scroll::-webkit-scrollbar {
  display: none;
}

.minios-lock-notif {
  flex: 0 0 auto;
  position: relative;
  width: 100%;
  min-height: 78px;
  margin: 0;
  padding: 13px 94px 13px 14px;
  border-radius: 26px;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
  color: var(--notification-text-color, #111827);
  background: color-mix(in srgb, var(--notification-color, #f4f4f7) 84%, transparent);
  border: 1px solid rgba(255,255,255,.50);
  backdrop-filter: blur(28px) saturate(180%);
  -webkit-backdrop-filter: blur(28px) saturate(180%);
  box-shadow: inset 0 1px rgba(255,255,255,.68), 0 13px 30px rgba(0,0,0,.2);
}

.minios-lock-notif-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(235,237,242,.56));
  color: rgba(20,24,32,.92);
  font-size: 25px;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(0,0,0,.16);
}

.minios-lock-notif-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.minios-lock-notif-body {
  min-width: 0;
  align-self: center;
}

.minios-lock-notif strong,
.minios-lock-notif p {
  overflow: hidden;
  text-overflow: ellipsis;
}

.minios-lock-notif strong {
  display: block;
  margin: 0 0 4px;
  font-size: 17px;
  line-height: 1.08;
  font-weight: 760;
  color: var(--notification-text-color, #111827);
  white-space: nowrap;
}

.minios-lock-notif p {
  margin: 0;
  font-size: 15px;
  line-height: 1.18;
  color: color-mix(in srgb, var(--notification-text-color, #111827) 82%, transparent);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.minios-lock-notif small {
  position: absolute;
  right: 16px;
  top: 17px;
  max-width: 82px;
  text-align: right;
  margin: 0;
  font-size: 12px;
  line-height: 1;
  color: color-mix(in srgb, var(--notification-text-color, #111827) 54%, transparent);
  font-weight: 620;
  white-space: nowrap;
}

.minios-lock-bottom {
  position: absolute;
  z-index: 8;
  left: 20px;
  right: 20px;
  bottom: calc(env(safe-area-inset-bottom) + 22px);
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) 62px;
  align-items: center;
  gap: 12px;
}

.minios-unlock-zone {
  display: grid;
  gap: 7px;
  justify-items: center;
}

.minios-unlock-zone span {
  font-size: 14px;
  font-weight: 520;
  color: rgba(255,255,255,.72);
  text-shadow: 0 2px 10px rgba(0,0,0,.55);
}

/* Lockscreen controls: isolated from WordPress styles, no theme accent leakage. */
.minios-lock-action,
.minios-unlock-pill {
  all: unset;
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
  color: rgba(255,255,255,.96) !important;
  border: 0 !important;
  outline: 0 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.06) 39%, rgba(0,0,0,.22) 100%),
    rgba(28,28,30,.34) !important;
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.46),
    inset 0 -1px 0 rgba(0,0,0,.32),
    inset 0 0 0 1px rgba(255,255,255,.14),
    0 18px 42px rgba(0,0,0,.38) !important;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  text-decoration: none !important;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}

.minios-lock-action::before,
.minios-unlock-pill::before {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.38), rgba(255,255,255,0) 45%),
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.03) 46%, rgba(0,0,0,.18));
  opacity: .82;
}

.minios-lock-action::after,
.minios-unlock-pill::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.22),
    inset 0 -18px 32px rgba(0,0,0,.20);
}

.minios-lock-action:focus,
.minios-lock-action:focus-visible,
.minios-unlock-pill:focus,
.minios-unlock-pill:focus-visible {
  outline: 0 !important;
}

.minios-lock-action {
  width: 62px;
  height: 62px;
  border-radius: 50% !important;
  padding: 0 !important;
  font-size: 24px;
  line-height: 1;
}

.minios-lock-action span,
.minios-unlock-pill span {
  position: relative;
}

.minios-lock-action span {
  z-index: 2;
}

.minios-lock-action img {
  position: relative;
  z-index: 2;
  width: 31px;
  height: 31px;
  border-radius: 50%;
  object-fit: cover;
}

.minios-unlock-pill {
  width: 100%;
  max-width: 294px;
  min-height: 60px;
  padding: 0 26px !important;
  border-radius: 999px !important;
  font-size: 16px;
  font-weight: 650;
  letter-spacing: -.025em;
  text-align: center;
  white-space: nowrap;
  text-shadow: 0 1px 14px rgba(0,0,0,.44);
}

.minios-unlock-pill .minios-unlock-label {
  z-index: 3;
}

.minios-unlock-pill .minios-unlock-shine {
  position: absolute;
  z-index: 1;
  inset: 4px;
  border-radius: inherit;
  pointer-events: none;
  overflow: hidden;
}

.minios-unlock-pill .minios-unlock-shine::before {
  content: "";
  position: absolute;
  top: -35%;
  bottom: -35%;
  left: -60%;
  width: 46%;
  border-radius: 999px;
  background: linear-gradient(100deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 34%,
    rgba(255,255,255,.26) 50%,
    rgba(255,255,255,.08) 66%,
    rgba(255,255,255,0) 100%
  );
  filter: blur(6px);
  opacity: 0;
  transform: translateX(0) skewX(-18deg);
  animation: minios-unlock-shine 3.2s cubic-bezier(.22, .61, .36, 1) infinite;
}

@keyframes minios-unlock-shine {
  0%, 46% { transform: translateX(0) skewX(-18deg); opacity: 0; }
  54% { opacity: .72; }
  78% { transform: translateX(360%) skewX(-18deg); opacity: 0; }
  100% { transform: translateX(360%) skewX(-18deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .minios-unlock-pill .minios-unlock-shine::before {
    animation: none;
  }
}

.minios-lock-action:active,
.minios-unlock-pill:active {
  transform: scale(.96);
  filter: brightness(1.08);
}

.minios-pages {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: visible;
  transform: translate3d(-100%, 0, 0);
  transition: transform .3s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
  scrollbar-width: none;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}


.minios-pages.is-instant {
  transition: none;
}

/* Fluidité du swipe (style iOS) : pendant le glissement et la transition de page,
   on désactive les flous (backdrop-filter) qui empêchent le navigateur de mettre
   le calque en cache et se recomposent à chaque frame (= saccades). Réactivés
   dès l'arrêt du mouvement, imperceptible à l'œil. */
/* Dock + widgets GARDENT leur verre dépoli pendant le swipe. On avait essayé de
   couper le flou pour la perf, mais ça rendait le dock translucide (transparent)
   puis, avec un fond opaque de repli, ça provoquait un FLASH BLANC à chaque
   changement de page. Le rendu naturel (flou conservé) est le plus immersif. */

.minios-pages::-webkit-scrollbar {
  display: none;
}

.minios-widget-page,
.minios-home-page {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: calc(env(safe-area-inset-top) + 44px) 20px calc(env(safe-area-inset-bottom) + 116px);
  overflow-y: auto;
  scrollbar-width: none;
}

.minios-widget-page::-webkit-scrollbar,
.minios-home-page::-webkit-scrollbar,
.minios-grid::-webkit-scrollbar {
  display: none;
}

.minios-widget-board:empty {
  display: none;
}

.minios-widget-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.minios-home-widget {
  min-height: 104px;
  border-radius: 28px;
  padding: 16px;
  box-sizing: border-box;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  box-shadow: inset 0 1px rgba(255,255,255,.24), 0 18px 46px rgba(0,0,0,.22);
}

.minios-home-widget.size-large {
  grid-column: span 2;
  min-height: 150px;
}

.minios-home-widget strong,
.minios-home-widget span {
  display: block;
}

.minios-home-widget strong {
  font-size: 22px;
  letter-spacing: -.05em;
}

.minios-home-widget span {
  margin-top: 6px;
  opacity: .78;
}

.minios-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px 14px;
  align-content: start;
}

.minios-app {
  appearance: none;
  border: 0;
  background: transparent;
  color: #fff;
  text-align: center;
  padding: 0;
  position: relative;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  overflow: visible;
}

.minios-icon {
  position: relative;
  width: 62px;
  height: 62px;
  margin: 0 auto 7px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,255,255,.34));
  box-shadow: inset 0 1px rgba(255,255,255,.72), 0 13px 26px rgba(0,0,0,.26);
  display: grid;
  place-items: center;
  overflow: hidden;
  font-size: 28px;
  font-weight: 800;
  transition: transform .18s cubic-bezier(.2,.9,.2,1);
  transform-style: preserve-3d;
}

.minios-app-visual {
  position: relative;
  display: inline-block;
  width: max-content;
  margin: 0 auto 7px;
  transform-style: preserve-3d;
  vertical-align: top;
  overflow: visible;
}

.minios-app-visual > .minios-icon {
  margin: 0;
}

.minios-icon-face {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: inherit;
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.minios-icon > img,
.minios-icon > picture {
  border-radius: inherit;
  overflow: hidden;
}

.minios-icon-front {
  transform: rotateY(0deg);
}

.minios-icon-back {
  transform: rotateY(180deg);
  background: #111;
}

.minios-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ~= (et non =) : data-app-effect peut désormais contenir plusieurs jetons
   séparés par un espace (ex. "breathe sparkle"), tous combinés en même temps
   sur la même icône sans se gêner (chacun cible un élément différent). */
.minios-app[data-app-effect~="breathe"] .minios-app-visual {
  animation: minios-app-breathe 3.2s ease-in-out infinite;
  transform-origin: center;
}

/* Le scintillement est désormais posé sur .minios-icon (pas .minios-app-visual)
   qui a déjà overflow:hidden + border-radius : le balayage lumineux reste
   ainsi contenu dans les limites de l'icône au lieu de déborder sur les
   icônes voisines, tout en restant bien visible (gradient plus lumineux,
   cadence plus rapide, mix-blend-mode pour un vrai effet de brillance). */
.minios-app[data-app-effect~="sparkle"] .minios-icon {
  position: relative;
  overflow: hidden;
}

.minios-app[data-app-effect~="sparkle"] .minios-icon::after {
  content: "";
  position: absolute;
  inset: -20%;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 32%, rgba(255,255,255,.9) 50%, transparent 66%);
  transform: translateX(-130%) rotate(8deg);
  animation: minios-app-sparkle 2.6s ease-in-out infinite;
  pointer-events: none;
  mix-blend-mode: screen;
}

/* Flip : la perspective doit être sur le PARENT de l'élément qui tourne, et
   l'élément qui tourne (.minios-icon) ne doit PAS avoir overflow:hidden (sinon
   le contexte preserve-3d est aplati et la face arrière apparaît en miroir au
   lieu de pivoter). Le clipping est assuré par chaque face (.minios-icon-face). */
.minios-app[data-app-effect~="flip"] .minios-app-visual {
  perspective: 540px;
}
.minios-app[data-app-effect~="flip"] .minios-icon {
  overflow: visible;
  animation: minios-app-flip 7.2s ease-in-out infinite;
}

@keyframes minios-app-breathe {
  0%, 100% { transform: scale(1); filter: brightness(1) drop-shadow(0 0 0 rgba(255,255,255,0)); }
  50% { transform: scale(1.1); filter: brightness(1.14) drop-shadow(0 4px 16px rgba(255,255,255,.4)); }
}

@keyframes minios-app-sparkle {
  0%, 55%, 100% { transform: translateX(-130%) rotate(8deg); opacity: 0; }
  68% { opacity: .95; }
  82% { transform: translateX(130%) rotate(8deg); opacity: 0; }
}

@keyframes minios-app-flip {
  0%, 35%, 100% { transform: rotateY(0deg); }
  48%, 68% { transform: rotateY(180deg); }
}

/* --- Effets d'icône supplémentaires (combinables, cf. data-app-effect~=) --- */
/* Transform-based -> posés sur .minios-app-visual (comme « breathe ») */
.minios-app[data-app-effect~="bounce"] .minios-app-visual {
  animation: minios-app-bounce 2.4s cubic-bezier(.28,.84,.42,1) infinite;
}
.minios-app[data-app-effect~="swing"] .minios-app-visual {
  animation: minios-app-swing 2.6s ease-in-out infinite;
  transform-origin: top center;
}
.minios-app[data-app-effect~="pulse"] .minios-app-visual {
  animation: minios-app-pulse 2.8s ease-in-out infinite;
}
.minios-app[data-app-effect~="shake"] .minios-app-visual {
  animation: minios-app-shake 3s ease-in-out infinite;
}
.minios-app[data-app-effect~="float"] .minios-app-visual {
  animation: minios-app-float 3.6s ease-in-out infinite;
}
/* Halo lumineux -> posé sur .minios-icon (box-shadow déborde malgré overflow) */
.minios-app[data-app-effect~="glow"] .minios-icon {
  animation: minios-app-glow 2.6s ease-in-out infinite;
}

@keyframes minios-app-bounce {
  0%, 20%, 53%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(-13px); }
  43% { transform: translateY(-13px); }
  70% { transform: translateY(-6px); }
}

@keyframes minios-app-swing {
  0%, 100% { transform: rotate(0deg); }
  20% { transform: rotate(9deg); }
  40% { transform: rotate(-7deg); }
  60% { transform: rotate(4deg); }
  80% { transform: rotate(-2deg); }
}

@keyframes minios-app-pulse {
  0%, 30%, 60%, 100% { transform: scale(1); }
  15% { transform: scale(1.16); }
  45% { transform: scale(1.1); }
}

@keyframes minios-app-shake {
  0%, 62%, 100% { transform: translateX(0) rotate(0deg); }
  68%, 80%, 92% { transform: translateX(-3px) rotate(-3deg); }
  74%, 86%, 98% { transform: translateX(3px) rotate(3deg); }
}

@keyframes minios-app-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}

@keyframes minios-app-glow {
  0%, 100% { box-shadow: inset 0 1px rgba(255,255,255,.72), 0 13px 26px rgba(0,0,0,.26); }
  50% { box-shadow: inset 0 1px rgba(255,255,255,.72), 0 0 20px 5px rgba(122,196,255,.9), 0 13px 26px rgba(0,0,0,.26); }
}

.minios-icon-code-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  pointer-events: none;
}

.minios-icon picture,
.minios-widget-icon picture,
.minios-lock-notif-icon picture,
.minios-lock-action picture {
  display: block;
  width: 100%;
  height: 100%;
}

.minios-icon picture img,
.minios-widget-icon picture img,
.minios-lock-notif-icon picture img,
.minios-lock-action picture img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.minios-app:active .minios-app-visual {
  transform: scale(.88);
}

.minios-springboard .minios-app,
.minios-springboard .minios-app *,
.minios-dock .minios-app,
.minios-dock .minios-app * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

.minios-springboard.is-delete-sim .minios-app {
  animation: minios-app-wiggle .16s ease-in-out infinite alternate;
}

.minios-springboard.is-delete-sim .minios-app::before {
  content: "−";
  position: absolute;
  z-index: 3;
  top: -8px;
  left: calc(50% - 38px);
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(80,80,84,.94);
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 4px 12px rgba(0,0,0,.34);
}

@keyframes minios-app-wiggle {
  from { transform: rotate(-1.2deg); }
  to { transform: rotate(1.2deg); }
}

.minios-app[data-kind="music"] .minios-icon { background: linear-gradient(145deg, #ff375f, #af52de); }
.minios-app[data-kind="phone"] .minios-icon { background: linear-gradient(145deg, #30d158, #0a9f45); }
.minios-app[data-kind="messages"] .minios-icon { background: linear-gradient(145deg, #34c759, #0a84ff); }
.minios-app[data-kind="notifications"] .minios-icon { background: linear-gradient(145deg, #ff9f0a, #ff453a); }

.minios-app-name {
  display: block;
  font-size: 11px;
  line-height: 1.15;
  color: rgba(255,255,255,.92);
  text-shadow: 0 2px 10px rgba(0,0,0,.75);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.minios-badge {
  position: absolute;
  z-index: 6;
  top: -8px;
  right: -9px;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  box-sizing: border-box;
  border-radius: 999px;
  background: var(--minios-badge-color, #ff3b30);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 10px rgba(0,0,0,.32);
  transform: translateZ(20px);
  pointer-events: none;
  isolation: isolate;
}

.minios-dock {
  position: absolute;
  z-index: 4;
  left: 18px;
  right: 18px;
  bottom: calc(env(safe-area-inset-bottom) + 14px);
  min-height: 82px;
  border-radius: 31px;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.08));
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(38px) saturate(190%);
  -webkit-backdrop-filter: blur(38px) saturate(190%);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
  padding: 10px 13px;
  box-shadow: inset 0 1px rgba(255,255,255,.26), 0 22px 70px rgba(0,0,0,.34);
}

.minios-dock.is-empty {
  display: none;
}

/* Le dock n'appartient qu'aux pages d'applications : il SUIT le déplacement
   horizontal des pages (translateX piloté en JS = max(0, currentX + pageWidth)),
   donc il reste fixe sur les pages d'apps et glisse hors champ par le côté quand
   on rejoint la page widgets — comme s'il partait avec la page 1. Pendant le
   drag (pages .is-dragging) on coupe la transition pour qu'il colle au doigt. */
.minios-dock {
  /* --dock-base : centrage de base (0 en mobile/éditeur, -50% en bureau).
     --dock-shift : décalage de suivi des pages, piloté en JS. */
  transform: translateX(calc(var(--dock-base, 0px) + var(--dock-shift, 0px)));
  transition: transform .3s cubic-bezier(.22, .61, .36, 1);
}
.minios-springboard:has(.minios-pages.is-dragging) .minios-dock {
  transition: none;
}
/* En mode bureau/paysage, le dock VISITEUR est centré (left:50% + translateX
   -50%). On le restitue via --dock-base pour que le suivi (--dock-shift) s'y
   ajoute. Exclut l'éditeur (.minios-sbed-springboard), dont le dock n'est jamais
   centré (device en largeur mobile). */
@media (min-width: 768px) and (min-height: 640px) {
  .minios-springboard:not(.minios-sbed-springboard) .minios-dock { --dock-base: -50%; }
}
@media (orientation: landscape) and (max-height: 620px) {
  .minios-springboard:not(.minios-sbed-springboard) .minios-dock { --dock-base: -50%; }
}
.minios-springboard.is-widgets-page .minios-dock {
  pointer-events: none;
}

/* Page widgets : défilement vertical réellement opérationnel. Deux verrous à
   lever : (1) le touch-action (le springboard est sinon en pan-y/none pour le
   swipe horizontal géré en JS) ; (2) l'overflow — le CSS critique met les pages
   en overflow:hidden, donc on force overflow-y:auto ici avec une spécificité
   supérieure. Couvre la classe visiteur (.minios-widget-page) et éditeur
   (.minios-sbed-widget-page). Limité à .is-widgets-page → les pages d'apps
   gardent leur comportement (swipe horizontal, pas de scroll). */
.minios-springboard.is-widgets-page,
.minios-springboard.is-widgets-page .minios-widget-page,
.minios-springboard.is-widgets-page .minios-sbed-widget-page,
.minios-springboard.is-widgets-page .minios-widget-grid,
.minios-springboard.is-widgets-page .minios-sbed-widget-grid {
  touch-action: pan-y;
}
.minios-springboard.is-widgets-page .minios-widget-page,
.minios-springboard.is-widgets-page .minios-sbed-widget-page {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.minios-dock .minios-icon {
  width: 55px;
  height: 55px;
  border-radius: 17px;
  margin-bottom: 0;
}

.minios-dock .minios-app-visual {
  margin-bottom: 0;
}

.minios-dock .minios-app-name {
  display: none;
}

.minios-page-dots {
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom) + 122px);
  /* Indicateur de page masqué à la demande (plus de points sous le springboard). */
  display: none;
  justify-content: center;
  gap: 7px;
  pointer-events: none;
}

.minios-dock.is-empty + .minios-page-dots,
.minios-page-dots:has(+ .minios-dock.is-empty) {
  bottom: calc(env(safe-area-inset-bottom) + 30px);
}

.minios-page-dots span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.42);
  box-shadow: 0 1px 5px rgba(0,0,0,.25);
}

.minios-page-dots .is-active {
  background: rgba(255,255,255,.94);
}

.minios-modal {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  align-items: flex-end;
  background: rgba(0,0,0,.06);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .28s ease, visibility .28s ease;
}

.minios-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.minios-app-window {
  width: 100%;
  height: 94%;
  border-radius: 34px 34px 0 0;
  background: #0d0d12;
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 -30px 80px rgba(0,0,0,.5);
  overflow: hidden;
  transform: translateY(106%);
  transition: transform .56s cubic-bezier(.22,1,.36,1);
  will-change: transform;
}

.minios-modal.is-open .minios-app-window {
  transform: translateY(0);
}

.minios-modal[data-active-kind="messages"] .minios-app-window { background: #f6f7fb; color: #111; }
.minios-modal[data-active-kind="music"] .minios-app-window { background: linear-gradient(180deg, #220619, #09070d); color: #fff; }
.minios-modal[data-active-kind="phone"] .minios-app-window {
  height: 100%;
  max-height: 100%;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #000;
  box-shadow: none;
}
.minios-modal[data-active-kind="notifications"] .minios-app-window { background: linear-gradient(180deg, #19191f, #050509); color: #fff; }

.minios-app-content {
  height: calc(100% - 70px);
  overflow: auto;
  padding: 18px;
  box-sizing: border-box;
}

.minios-modal[data-active-kind="phone"] .minios-app-header {
  position: absolute;
  top: max(10px, env(safe-area-inset-top));
  left: 0;
  right: 0;
  z-index: 40;
  min-height: 0;
  padding: 10px 12px;
  background: transparent;
  border-bottom: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  pointer-events: none;
}

.minios-modal[data-active-kind="phone"] .minios-app-header h2 {
  opacity: 0;
}

.minios-modal[data-active-kind="phone"] .minios-close {
  pointer-events: auto;
  margin-left: 8px !important;
  width: 36px !important;
  height: 36px !important;
  background: rgba(52,199,89,.14) !important;
  border-color: rgba(52,199,89,.28) !important;
  color: #34c759 !important;
  box-shadow: none !important;
}

.minios-modal[data-active-kind="phone"] .minios-app-content {
  height: 100%;
  padding: 0;
  overflow: hidden;
  background: #fff;
}

.minios-modal[data-active-kind="safari"] .minios-app-window {
  background: #f2f2f7;
  color: #1c1c1e;
}

.minios-modal[data-active-kind="safari"] .minios-app-content {
  height: 100%;
  padding: 0;
  overflow: hidden;
  background: #f2f2f7;
}

.minios-modal[data-active-kind="safari"] .minios-app-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  background: transparent;
  border-bottom: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  pointer-events: none;
}

.minios-modal[data-active-kind="safari"] .minios-app-header h2 {
  opacity: 0;
}

.minios-modal[data-active-kind="safari"] .minios-close {
  pointer-events: auto;
}

.minios-modal[data-active-kind="custom"] .minios-app-content,
.minios-app-content:has(.minios-custom-app-frame) {
  padding: 0 !important;
  overflow: hidden;
  background: transparent;
}

.minios-list {
  display: grid;
  gap: 10px;
}

.minios-list-item,
.minios-empty {
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
}

.minios-list-item {
  padding: 14px;
}

.minios-list-item strong,
.minios-list-item span {
  display: block;
}

.minios-list-item strong {
  font-size: 15px;
}

.minios-list-item span {
  margin-top: 3px;
  font-size: 13px;
  color: rgba(255,255,255,.62);
}

.minios-empty {
  padding: 24px;
  color: rgba(255,255,255,.68);
  line-height: 1.45;
}

.minios-home-indicator {
  position: absolute;
  z-index: 35;
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%);
  width: 138px;
  height: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.82);
  display: none;
}


@media (max-height: 760px) {
  .minios-lock-center {
    margin-top: calc(env(safe-area-inset-top) + 36px);
  }
  .minios-lock-date {
    font-size: 20px;
  }
  .minios-lock-time {
    font-size: clamp(78px, 23vw, 102px);
  }
  .minios-lock-widgets {
    top: calc(env(safe-area-inset-top) + 190px);
  }
  .minios-lock-notifications {
    max-height: min(30dvh, 250px);
    bottom: calc(env(safe-area-inset-bottom) + 98px);
  }
  .minios-lock-notif {
    min-height: 70px;
    padding: 11px 76px 11px 13px;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 10px;
  }
  .minios-lock-notif-icon {
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }
  .minios-lock-notif p {
    -webkit-line-clamp: 1;
    font-size: 14px;
  }
  .minios-lock-bottom {
    bottom: calc(env(safe-area-inset-bottom) + 14px);
  }
}

@media (max-width: 380px) {
  .minios-lock-center {
    padding: 0 18px;
  }
  .minios-lock-bottom,
  .minios-lock-notifications {
    left: 16px;
    right: 16px;
  }
  .minios-lock-bottom {
    grid-template-columns: 58px 1fr 58px;
    gap: 10px;
  }
  .minios-lock-action {
    width: 58px;
    height: 58px;
  }
  .minios-unlock-pill {
    min-height: 54px;
    font-size: 15px;
  }
  .minios-lock-notif {
    padding-right: 72px;
  }
}

/* MiniOS reusable widgets */
.minios-lock-widgets {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.minios-lock-widget {
  color: var(--widget-text-color, #fff);
  background: color-mix(in srgb, var(--widget-color, #2f3138) 76%, transparent);
  border: 1px solid color-mix(in srgb, var(--widget-text-color, #fff) 18%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--widget-text-color, #fff) 22%, transparent), 0 18px 42px rgba(0,0,0,.22);
}
.minios-lock-widget.size-wide { grid-column: span 2; }
.minios-lock-widget.size-large { grid-column: span 3; grid-row: span 2; }
.minios-widget-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
  background: rgba(255,255,255,.14);
  margin-bottom: 8px;
}
.minios-widget-icon img { width: 100%; height: 100%; object-fit: cover; }
.minios-widget-content { min-width: 0; }
.minios-widget-progress i {
  display: block;
  height: 7px;
  margin-top: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--widget-text-color, #fff) 20%, transparent);
  overflow: hidden;
}
.minios-widget-progress i b {
  display: block;
  width: var(--progress-level, 0%);
  height: 100%;
  border-radius: inherit;
  background: currentColor;
  opacity: .85;
}
.minios-home-widget {
  color: var(--widget-text-color, #fff);
}

/* ── Effet liquid glass (verre dépoli) — activable par widget/app via le
   panneau « Design » de l'éditeur springboard. Le fond du widget devient plus
   translucide (≈60 % de l'opacité réglée) et on ajoute un flou + saturation +
   un liseré lumineux, dans l'esprit iOS. ── */
.minios-device.minios-glass-widgets .minios-lock-widget {
  background: color-mix(in srgb, var(--widget-color, #2f3138) calc(var(--minios-widget-opacity-percent, 76%) * 0.6), transparent);
  backdrop-filter: blur(26px) saturate(185%);
  -webkit-backdrop-filter: blur(26px) saturate(185%);
  border: 1px solid color-mix(in srgb, var(--widget-text-color, #fff) 28%, transparent);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--widget-text-color, #fff) 36%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--widget-text-color, #fff) 9%, transparent),
    0 18px 42px rgba(0, 0, 0, 0.26);
}
.minios-device.minios-glass-apps .minios-icon {
  backdrop-filter: blur(16px) saturate(165%);
  -webkit-backdrop-filter: blur(16px) saturate(165%);
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.40), rgba(255, 255, 255, 0.12));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 10px 24px rgba(0, 0, 0, 0.22);
}
/* Effet désactivé : on retire le flou et on opacifie le fond (le verre dépoli
   par défaut vient de minios-critical.css ; ces règles le neutralisent quand
   l'utilisateur coupe le liquid glass dans le panneau Design). */
.minios-device:not(.minios-glass-widgets) .minios-lock-widget {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: color-mix(in srgb, var(--widget-color, #2f3138) var(--minios-widget-opacity-percent, 76%), #15161b) !important;
}

/* ─── Redesign unifié des widgets (lockscreen + springboard), tailles 2×2 / 4×2,
   typo iOS. Appliqué globalement pour un rendu identique sur les deux surfaces. ─── */
.minios-lock-widget {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 16px 17px;
  border-radius: 24px;
  overflow: hidden;
}
.minios-lock-widget .minios-widget-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.minios-lock-widget .minios-widget-content span {
  font-size: 12px; font-weight: 600; opacity: 0.72; letter-spacing: -0.01em;
}
.minios-lock-widget .minios-widget-content strong {
  font-size: 22px; font-weight: 750; line-height: 1.06; letter-spacing: -0.03em;
}
.minios-lock-widget .minios-widget-content small {
  font-size: 13px; opacity: 0.82;
}
/* Grand (4×2, pleine largeur) : icône à gauche, contenu à droite, valeur XL. */
.minios-lock-widget.size-large {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 16px;
}
.minios-lock-widget.size-large .minios-widget-content strong {
  font-size: 30px;
}
.minios-lock-widget.size-large .minios-widget-icon,
.minios-lock-widget.size-large .minios-weather-icon {
  margin-bottom: 0; align-self: start; width: 44px; height: 44px; font-size: 1.4rem;
}
/* Météo propre : température en grand (c'est le span), condition + lieu en dessous. */
.minios-widget-weather { display: flex; flex-direction: column; }
.minios-widget-weather .minios-widget-content [data-weather-temp] {
  font-size: 30px; font-weight: 750; opacity: 1; letter-spacing: -0.04em; line-height: 1;
}
.minios-widget-weather .minios-widget-content [data-weather-condition] {
  font-size: 14px; font-weight: 650; opacity: 0.92;
}
.minios-widget-weather.size-large {
  display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 16px;
}

/* ─────────── Widgets façon Apple (batterie / musique / calendrier / carte) ───────────
   Rendus globaux : identiques sur le lockscreen et le springboard. */

/* Progression (métrique) : barre fine, rouge en dessous de 20 %. */
.minios-widget-progress.is-low .minios-widget-content i b { background: #ff453a; opacity: 1; }

/* Batterie : anneau circulaire façon iPhone (jauge conique, donut masqué). */
.minios-widget-battery {
  display: flex; flex-direction: row; align-items: center; gap: 14px;
}
.minios-wbat-ring {
  --bat-color: #34c759;
  position: relative; width: 56px; height: 56px; flex-shrink: 0;
  display: grid; place-items: center;
}
.minios-wbat-ring::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(var(--bat-color) var(--progress-level, 100%), rgba(120,120,128,.32) 0);
  -webkit-mask: radial-gradient(circle, transparent 53%, #000 54%);
          mask: radial-gradient(circle, transparent 53%, #000 54%);
}
.minios-widget-battery.is-low .minios-wbat-ring { --bat-color: #ff453a; }
/* Spécificité renforcée : bat la règle de minios-critical.css
   « .minios-lock-widget span { display:block } » (0,1,1) qui empêchait sinon
   le centrage vertical (le % se collait en haut de l'anneau). */
.minios-lock-widget .minios-wbat-pct {
  position: absolute; inset: 0; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  /* Plus petit + serre : « 100% » (3 chiffres) tient DANS le trou de l'anneau. */
  font-size: 12.5px; font-weight: 750; letter-spacing: -.06em; opacity: 1;
  color: var(--widget-text-color, #fff); line-height: 1; white-space: nowrap;
}
.minios-wbat-pct i { font-size: 8px; font-weight: 600; font-style: normal; opacity: .7; margin-left: 0; }
.minios-wbat-meta { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.minios-wbat-meta strong { font-size: 17px; font-weight: 700; letter-spacing: -.02em; line-height: 1.12; }
.minios-wbat-meta small { font-size: 13px; opacity: .72; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Grande batterie (4×2) : anneau plus gros. */
.minios-widget-battery.size-large .minios-wbat-ring { width: 72px; height: 72px; }
.minios-widget-battery.size-large .minios-wbat-pct { font-size: 17px; }

/* Widget Musique : vrai lecteur (pochette + infos + contrôles + progression).
   Au repos : pochette « logo Musique » (dégradé + note) ; en lecture : pochette
   du morceau + couleur dominante (appliquées au runtime). */
.minios-lock-widget.minios-widget-music {
  display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 9px;
  cursor: pointer; grid-template-columns: none; position: relative;
}
/* Fond du widget = pochette du morceau en cours, floutée (rempli au runtime). */
.minios-wmusic-bg {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  filter: blur(20px) saturate(1.5) brightness(.78);
  transform: scale(1.25);
  opacity: 0; transition: opacity .45s ease;
}
.minios-wmusic-bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.5));
}
.minios-widget-music.is-playing-widget .minios-wmusic-bg { opacity: 1; }
.minios-lock-widget.minios-widget-music > .minios-wmusic-top,
.minios-lock-widget.minios-widget-music > .minios-wmusic-seek,
.minios-lock-widget.minios-widget-music > .minios-wmusic-controls { position: relative; z-index: 1; }
.minios-wmusic-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.minios-lock-widget .minios-wmusic-cover {
  width: 50px; height: 50px; border-radius: 13px; flex-shrink: 0;
  background-image: linear-gradient(150deg, #fc5c7d, #fa2d48);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  display: grid; place-items: center; box-shadow: 0 6px 16px rgba(0,0,0,.28); color: #fff;
}
.minios-wmusic-note { font-size: 24px; opacity: .95; }
.minios-wmusic-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.minios-wmusic-body strong { font-size: 15px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.minios-wmusic-body span { font-size: 12.5px; opacity: .72; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Barre de progression : scrubber custom (pointer events) = tap + glissement
   fiables sur iPhone, n'importe où sur la barre. Zone tactile haute (16px),
   barre visuelle fine (4px). */
.minios-wmusic-seek {
  position: relative; width: 100%; height: 16px; display: flex; align-items: center;
  cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent;
}
.minios-wmusic-seek::before {
  content: ""; position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%);
  height: 4px; border-radius: 2px;
  background: color-mix(in srgb, var(--widget-text-color, #fff) 22%, transparent);
}
.minios-wmusic-seek-fill {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  height: 4px; width: 0%; border-radius: 2px; background: var(--widget-text-color, #fff);
  pointer-events: none;
}
.minios-wmusic-seek-fill::after {
  content: ""; position: absolute; right: -5px; top: 50%; transform: translateY(-50%);
  width: 11px; height: 11px; border-radius: 50%; background: var(--widget-text-color, #fff);
  box-shadow: 0 1px 4px rgba(0,0,0,.4);
}
/* Boutons lecture : mêmes icônes SVG que l'app Musique. */
.minios-wmusic-controls { display: flex; align-items: center; justify-content: center; gap: 24px; }
.minios-wmusic-ctrl {
  border: 0; background: transparent; color: var(--widget-text-color, #fff);
  width: 30px; height: 30px; padding: 0; line-height: 0;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.minios-wmusic-ctrl svg { width: 20px; height: 20px; display: block; }
.minios-wmusic-ctrl:active { opacity: .5; transform: scale(.92); }
.minios-wmusic-ctrl[disabled] { opacity: .32; }
.minios-wmusic-toggle svg { width: 24px; height: 24px; }
.minios-widget-music.size-large { gap: 12px; }
.minios-widget-music.size-large .minios-wmusic-cover { width: 66px; height: 66px; border-radius: 16px; }
.minios-widget-music.size-large .minios-wmusic-body strong { font-size: 18px; }
.minios-widget-music.size-large .minios-wmusic-body span { font-size: 14px; }
.minios-widget-music.size-large .minios-wmusic-controls { gap: 32px; }
.minios-widget-music.size-large .minios-wmusic-ctrl svg { width: 22px; height: 22px; }
.minios-widget-music.size-large .minios-wmusic-toggle svg { width: 28px; height: 28px; }

/* Widget Image : l'image remplit tout le conteneur, coins arrondis, sans texte. */
.minios-lock-widget.minios-widget-image { padding: 0 !important; overflow: hidden; display: block; grid-template-columns: none; }
.minios-widget-image-fill {
  width: 100%; height: 100%; border-radius: inherit;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  background-color: rgba(255,255,255,.06);
}

/* Widget Calendrier : carte blanche, jour de semaine rouge, gros numéro. */
.minios-widget-cal {
  background: #ffffff !important; color: #1c1c1e; display: flex; flex-direction: column;
  gap: 4px; cursor: pointer; border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
.minios-wcal-head { display: flex; flex-direction: column; }
.minios-wcal-weekday { font-size: 13px; font-weight: 800; letter-spacing: .02em; color: var(--wcal-accent, #ff3b30); text-transform: uppercase; }
.minios-wcal-day { font-size: 38px; font-weight: 700; line-height: 1; letter-spacing: -.03em; color: #1c1c1e; }
.minios-wcal-event { margin-top: auto; font-size: 13px; font-weight: 600; color: #6b6b70; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.minios-widget-cal.has-event .minios-wcal-event { color: var(--wcal-accent, #ff3b30); }
/* Grand calendrier (4×2) : date à gauche, évènement détaillé à droite. */
.minios-widget-cal.size-large {
  display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 18px;
}
.minios-widget-cal.size-large .minios-wcal-day { font-size: 54px; }
.minios-widget-cal.size-large .minios-wcal-weekday { font-size: 15px; }
.minios-widget-cal.size-large .minios-wcal-event { margin-top: 0; -webkit-line-clamp: 3; font-size: 15px; line-height: 1.3; }

/* Widget Carte : aperçu plein cadre + épingle + pastille label. */
.minios-widget-map {
  position: relative; padding: 0 !important; overflow: hidden; cursor: pointer;
  background: #dfe6ee !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
.minios-wmap-canvas { position: absolute; inset: 0; background: #dfe6ee; }
.minios-wmap-pin {
  position: absolute; left: 50%; top: 46%; width: 16px; height: 16px; transform: translate(-50%, -50%);
  border-radius: 50%; background: #0a84ff; border: 3px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.minios-wmap-label {
  position: absolute; left: 10px; bottom: 10px; z-index: 2;
  font-size: 12px; font-weight: 700; color: #1c1c1e;
  background: rgba(255,255,255,.92); padding: 4px 10px; border-radius: 999px;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
/* Bouton emoji du widget Carte : pastille tappable qui ouvre Plans en
   surlignant les lieux portant cet emoji (ex : 🍕). */
.minios-wmap-emoji {
  position: absolute; right: 8px; top: 8px; z-index: 3;
  width: 34px; height: 34px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.95); box-shadow: 0 2px 8px rgba(0,0,0,.22);
  font-size: 18px; line-height: 1; display: grid; place-items: center; cursor: pointer;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.minios-wmap-emoji:active { transform: scale(.9); }

/* Widget Minuteur : anneau central qui se vide pendant un minuteur en cours. */
.minios-widget-timer {
  position: relative; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 6px; cursor: pointer;
}
.minios-wtimer-ring { width: 64px; height: 64px; transform: rotate(-90deg); }
.minios-widget-timer.size-large .minios-wtimer-ring { width: 86px; height: 86px; }
.minios-wtimer-bg { fill: none; stroke: rgba(255,255,255,.2); stroke-width: 8; }
.minios-wtimer-fg {
  fill: none; stroke: var(--widget-timer-ring, #FF9500); stroke-width: 8; stroke-linecap: round;
  stroke-dasharray: 326.7; stroke-dashoffset: 326.7; transition: stroke-dashoffset .9s linear;
}
.minios-wtimer-label {
  font-size: 14px; font-weight: 700; color: var(--widget-text-color, #fff);
  font-variant-numeric: tabular-nums;
}
.minios-widget-timer.size-large .minios-wtimer-label { font-size: 17px; }

/* ── Versions compactes en carré (1 cellule) : la rangée lockscreen est courte,
   on évite que le texte des widgets riches soit rogné. Sur le springboard la
   case carrée est un 2×2 (plus grande) : ces règles l'aèrent sans la casser. ── */
.minios-lock-widget.size-square { padding: 13px 14px; }
.minios-widget-battery.size-square {
  flex-direction: column; justify-content: center; align-items: center; gap: 6px; text-align: center;
}
.minios-widget-battery.size-square .minios-wbat-ring { width: 50px; height: 50px; }
.minios-widget-battery.size-square .minios-wbat-pct { font-size: 13px; }
.minios-widget-battery.size-square .minios-wbat-meta { align-items: center; }
.minios-widget-battery.size-square .minios-wbat-meta small { display: none; }
.minios-widget-battery.size-square .minios-wbat-meta strong { font-size: 13px; }
/* Springboard 2×2 (size-small) : batterie centrée, anneau plus gros, texte dessous. */
.minios-widget-battery.size-small {
  flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-align: center;
}
.minios-widget-battery.size-small .minios-wbat-ring { width: 64px; height: 64px; }
.minios-widget-battery.size-small .minios-wbat-pct { font-size: 13px; }
.minios-widget-battery.size-small .minios-wbat-meta { align-items: center; }
.minios-widget-battery.size-small .minios-wbat-meta small { display: none; }
.minios-widget-battery.size-small .minios-wbat-meta strong { font-size: 14px; }
/* Musique sur le lockscreen (1 cellule) : version compacte sans contrôles. */
.minios-widget-music.size-square { gap: 6px; }
.minios-widget-music.size-square .minios-wmusic-cover { width: 42px; height: 42px; }
.minios-widget-music.size-square .minios-wmusic-controls,
.minios-widget-music.size-square .minios-wmusic-seek { display: none; }
/* Date plus grande sur le petit format 2×2 (point 20). */
.minios-widget-cal.size-square .minios-wcal-day,
.minios-widget-cal.size-small .minios-wcal-day { font-size: 46px; }
.minios-widget-cal.size-square .minios-wcal-weekday,
.minios-widget-cal.size-small .minios-wcal-weekday { font-size: 14px; }
/* Récapitulatif multi-évènements : « N évènements » + lignes (heure + titre). */
.minios-wcal-count { display: block; font-size: 12px; font-weight: 800; color: var(--wcal-accent, #ff3b30); margin-bottom: 3px; }
.minios-wcal-line { display: block; font-size: 12.5px; color: #3a3a3c; line-height: 1.32; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.minios-wcal-line b { color: #1c1c1e; font-weight: 700; }
/* Quand le contenu est un récap (spans), on n'applique pas le clamp en boîte. */
.minios-wcal-event:has(.minios-wcal-line) { display: block; -webkit-line-clamp: none; overflow: hidden; }

/* Météo refonte : fond teinté selon la température (rempli au runtime). */
.minios-widget-weather.minios-weather-tinted { border: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 10px 26px rgba(0,0,0,.28); }
.minios-widget-weather.minios-weather-tinted .minios-weather-icon { background: rgba(255,255,255,.22); }
.minios-widget-weather.minios-weather-tinted [data-weather-place],
.minios-widget-weather.minios-weather-tinted [data-weather-range] { opacity: .92; }

/* MiniOS weather widget */
.minios-widget-weather {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.minios-weather-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
  font-size: 1.12rem;
  margin-bottom: 8px;
  flex-shrink: 0;
}
.minios-widget-weather .minios-widget-content span,
.minios-widget-weather .minios-widget-content strong,
.minios-widget-weather .minios-widget-content small {
  overflow-wrap: break-word;
  white-space: normal;
  word-break: normal;
  line-height: 1.18;
}
.minios-widget-weather.size-square {
  font-size: .88em;
}
.minios-widget-weather.size-square .minios-weather-icon {
  width: 28px;
  height: 28px;
  font-size: 1em;
}
/* Sur les tailles plus larges, assez de place pour mettre l'icône et le texte côte à côte */
.minios-widget-weather.size-wide,
.minios-widget-weather.size-large {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 10px;
}
.minios-widget-weather.size-wide .minios-weather-icon,
.minios-widget-weather.size-large .minios-weather-icon {
  margin-bottom: 0;
}
.minios-widget-weather [data-weather-place] {
  display: block;
  margin-top: 1px;
  font-weight: 650;
  opacity: .9;
}
.minios-widget-weather [data-weather-range] {
  display: block;
  margin-top: 1px;
  opacity: .78;
}
.minios-widget-custom {
  padding: 0;
  overflow: hidden;
}
.minios-widget-custom-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  background: transparent;
}

/* Système glass piloté depuis gestion-mobile */
.minios-lock-widget {
  background: color-mix(in srgb, var(--widget-color, #2f3138) var(--minios-widget-opacity-percent, 76%), transparent);
  border-color: color-mix(in srgb, var(--widget-text-color, #ffffff) 18%, transparent);
}

.minios-lock-notif {
  background: color-mix(in srgb, var(--notification-color, #f4f4f7) var(--minios-notification-opacity-percent, 84%), transparent);
}

.minios-icon {
  opacity: var(--minios-app-opacity, .92);
}

.minios-lock-bottom {
  grid-template-columns: 56px minmax(0, 1fr) 56px;
  left: 22px;
  right: 22px;
  gap: 14px;
}

.minios-lock-action,
.minios-unlock-pill {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.34), rgba(255,255,255,0) 52%),
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.035) 46%, rgba(0,0,0,.24) 100%),
    rgba(22, 24, 29, var(--minios-control-opacity, .42)) !important;
  border: 0 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(0,0,0,.36),
    inset 0 0 0 1px rgba(255,255,255,.16),
    0 14px 30px rgba(0,0,0,.26) !important;
}

.minios-unlock-pill {
  max-width: 282px;
  min-height: 54px;
  padding: 0 23px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.36), rgba(255,255,255,0) 52%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04) 48%, rgba(0,0,0,.26) 100%),
    rgba(22, 24, 29, var(--minios-unlock-opacity, .42)) !important;
}

.minios-lock-action {
  width: 56px;
  height: 56px;
  font-size: 22px;
}

.minios-lock-action::before,
.minios-unlock-pill::before {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.42), rgba(255,255,255,0) 48%),
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.02) 52%, rgba(0,0,0,.16));
  opacity: .78;
}

.minios-unlock-pill .minios-unlock-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  width: 100%;
}

@media (max-width: 390px) {
  .minios-lock-bottom {
    grid-template-columns: 52px minmax(0, 1fr) 52px;
    left: 18px;
    right: 18px;
    gap: 12px;
  }
  .minios-lock-action {
    width: 52px;
    height: 52px;
  }
  .minios-unlock-pill {
    max-width: 260px;
    min-height: 52px;
    font-size: 15px;
  }
  .minios-unlock-pill .minios-unlock-label {
    min-height: 52px;
  }
}

/* Reset propre contre les styles du thème WordPress dans le mini OS */
.minios-device button,
.minios-device button:focus,
.minios-device button:focus-visible,
.minios-device [type="button"],
.minios-device [type="button"]:focus,
.minios-device [type="button"]:focus-visible {
  outline: 0 !important;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}

.minios-app,
.minios-app:focus,
.minios-app:focus-visible,
.minios-app:hover {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.minios-icon {
  border: 0 !important;
  outline: 0 !important;
}


/* Springboard viewport, paging and PWA-safe spacing */
html,
body,
body.minios-frontend-body {
  height: 100%;
  min-height: 100dvh;
  overflow: hidden;
  background: #000 !important;
}

body.minios-frontend-body #page,
body.minios-frontend-body .site,
body.minios-frontend-body .site-main,
body.minios-frontend-body main {
  min-height: 100dvh;
  height: 100dvh;
  overflow: hidden;
  background: #000 !important;
}

body.minios-frontend-body footer,
body.minios-frontend-body .site-footer {
  display: none !important;
}

.minios-device {
  height: 100dvh !important;
  min-height: 100dvh;
  max-height: 100dvh;
  inset: 0 !important;
  bottom: 0 !important;
  overflow: hidden;
}

.minios-springboard {
  height: 100%;
  overflow: hidden;
  touch-action: none;
}

.minios-pages {
  height: 100%;
  display: flex;
  overflow: visible;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translate3d(-100%, 0, 0);
  transition: transform .34s cubic-bezier(.22, .72, .24, 1);
}

.minios-pages.is-dragging {
  transition: none !important;
}

.minios-pages.is-instant {
  transition: none !important;
}

.minios-widget-page,
.minios-home-page {
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 100%;
  overflow: hidden;
  transform: translateZ(0);
  padding: calc(env(safe-area-inset-top) + 48px) 20px calc(env(safe-area-inset-bottom) + 122px);
}

.minios-grid {
  min-height: auto;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(6, minmax(72px, 80px));
  grid-auto-rows: 80px;
  gap: 14px 12px;
  align-content: start;
}

.minios-grid .minios-app {
  grid-row: var(--app-row, auto);
  grid-column: var(--app-col, auto);
  align-self: start;
  min-width: 0;
}

.minios-grid-widget {
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  justify-self: stretch;
}
.minios-grid-widget .minios-lock-widget {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.minios-dock {
  bottom: calc(env(safe-area-inset-bottom) + 24px);
}

.minios-page-dots {
  bottom: calc(env(safe-area-inset-bottom) + 130px);
}

.minios-dock.is-empty + .minios-page-dots,
.minios-page-dots:has(+ .minios-dock.is-empty) {
  bottom: calc(env(safe-area-inset-bottom) + 38px);
}

.minios-page-dots span:only-child {
  display: none;
}

.minios-modal {
  inset: 0;
  overflow: hidden;
}

.minios-app-window,
.minios-modal[data-active-kind="messages"] .minios-app-window {
  height: calc(100dvh - env(safe-area-inset-top));
  max-height: calc(100dvh - env(safe-area-inset-top));
  border-radius: 34px 34px 0 0;
}

.minios-app-content {
  min-height: 0;
  padding-bottom: 0;
}

@supports (-webkit-touch-callout: none) {
  .minios-device,
  body.minios-frontend-body #page,
  body.minios-frontend-body .site,
  body.minios-frontend-body .site-main,
  body.minios-frontend-body main {
    height: -webkit-fill-available;
    min-height: -webkit-fill-available;
  }
}

@media (display-mode: standalone) {
  .minios-widget-page,
  .minios-home-page {
    padding-bottom: calc(env(safe-area-inset-bottom) + 118px);
  }

  .minios-app-window,
  .minios-modal[data-active-kind="messages"] .minios-app-window {
    height: calc(100dvh - env(safe-area-inset-top));
    max-height: calc(100dvh - env(safe-area-inset-top));
  }

  .minios-grid {
    grid-template-rows: repeat(6, 88px);
    grid-auto-rows: 88px;
    gap: 18px 12px;
  }
}

/* Responsive shells: tablet, desktop, and iPhone landscape */
@media (min-width: 768px) and (min-height: 640px) {
  body.minios-frontend-body {
    background:
      radial-gradient(circle at 20% 8%, rgba(10,132,255,.18), transparent 30%),
      radial-gradient(circle at 82% 12%, rgba(255,55,95,.14), transparent 34%),
      linear-gradient(145deg, #050509, #10121a 54%, #050509) !important;
  }

  .minios-device {
    width: 100vw;
    height: 100dvh !important;
    min-height: 0;
    max-height: 100dvh;
    inset: 0 !important;
    transform: none;
    border-radius: 0;
    border: 0;
    box-shadow: none;
  }

  .minios-lock-center {
    width: min(48vw, 640px);
    margin-top: clamp(44px, 8vh, 92px);
    padding: 0 clamp(36px, 6vw, 96px);
    text-align: left;
  }

  .minios-lock-date {
    font-size: clamp(1.3rem, 1.6vw, 2rem);
  }

  .minios-lock-time {
    font-size: clamp(5.6rem, 10vw, 11rem);
  }

  .minios-lock-widgets {
    top: clamp(54px, 8vh, 100px);
    left: auto;
    right: clamp(36px, 6vw, 96px);
    width: min(42vw, 620px);
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: clamp(12px, 1.2vw, 18px);
  }

  .minios-lock-widget.size-large {
    grid-column: span 2;
  }

  .minios-lock-notifications {
    left: clamp(36px, 6vw, 96px);
    right: auto;
    width: min(42vw, 560px);
    bottom: clamp(104px, 14vh, 152px);
    max-height: min(36dvh, 330px);
  }

  .minios-lock-bottom {
    left: clamp(36px, 6vw, 96px);
    right: clamp(36px, 6vw, 96px);
    bottom: clamp(26px, 4vh, 48px);
    grid-template-columns: 64px minmax(240px, 360px) 64px;
    justify-content: center;
  }

  .minios-widget-page,
  .minios-home-page {
    padding: clamp(44px, 7vh, 86px) clamp(44px, 6vw, 110px) clamp(120px, 14vh, 164px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .minios-widget-board {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: clamp(16px, 1.6vw, 24px);
  }

  .minios-home-widget.size-wide {
    grid-column: span 2;
  }

  .minios-home-widget.size-large {
    grid-column: span 4;
  }

  .minios-grid {
    grid-template-columns: repeat(auto-fill, minmax(clamp(82px, 7.4vw, 124px), 1fr));
    grid-template-rows: none;
    grid-auto-rows: clamp(104px, 11vh, 142px);
    gap: clamp(18px, 2.2vw, 34px) clamp(14px, 2vw, 28px);
    max-width: min(1440px, 100%);
    margin: 0 auto;
  }

  .minios-grid .minios-app,
  .minios-grid-widget {
    grid-row: auto;
    grid-column: auto;
  }

  .minios-icon {
    width: clamp(68px, 5.7vw, 94px);
    height: clamp(68px, 5.7vw, 94px);
    border-radius: clamp(18px, 1.55vw, 25px);
  }

  .minios-app-name {
    font-size: clamp(.78rem, .9vw, 1rem);
    max-width: clamp(86px, 8vw, 132px);
    margin: 0 auto;
  }

  .minios-dock {
    left: 50%;
    right: auto;
    bottom: clamp(22px, 3.5vh, 42px);
    width: min(760px, calc(100vw - 12vw));
    min-height: clamp(84px, 9vh, 112px);
    padding: clamp(10px, 1.2vw, 15px) clamp(16px, 1.8vw, 28px);
    transform: translateX(-50%);
  }

  .minios-dock .minios-icon {
    width: clamp(60px, 5vw, 82px);
    height: clamp(60px, 5vw, 82px);
  }

  .minios-page-dots {
    bottom: clamp(114px, 13vh, 154px);
  }

  .minios-modal {
    align-items: center;
    justify-content: center;
    padding: clamp(26px, 4vw, 54px);
    box-sizing: border-box;
    background: rgba(0,0,0,.22);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .minios-app-window,
  .minios-modal[data-active-kind="messages"] .minios-app-window {
    width: min(1120px, 100%);
    height: min(820px, 100%) !important;
    max-height: 100%;
    border-radius: 30px;
    transform: translateY(26px) scale(.97);
    box-shadow: 0 34px 110px rgba(0,0,0,.55);
  }

  .minios-modal.is-open .minios-app-window {
    transform: translateY(0) scale(1);
  }

  .minios-modal[data-active-kind="phone"] .minios-app-window,
  .minios-modal[data-active-kind="safari"] .minios-app-window,
  .minios-modal[data-active-kind="custom"] .minios-app-window {
    width: min(1180px, 100%);
    height: min(860px, 100%) !important;
    max-height: 100%;
    border-radius: 30px;
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 34px 110px rgba(0,0,0,.55);
  }
}

@media (min-width: 1100px) and (min-height: 720px) {
  .minios-device {
    width: 100vw;
    height: 100dvh !important;
    max-height: 100dvh;
  }

  .minios-grid {
    grid-template-columns: repeat(auto-fill, minmax(clamp(92px, 6.8vw, 132px), 1fr));
    max-width: min(1500px, 100%);
  }
}

@media (orientation: landscape) and (max-height: 620px) {
  body.minios-frontend-body {
    background: #050509 !important;
  }

  .minios-device {
    width: 100vw;
    height: 100dvh !important;
    min-height: 100dvh;
    max-height: 100dvh;
    inset: 0 !important;
    border-radius: 0;
    border: 0;
    transform: none;
  }

  .minios-lock-center {
    width: 44%;
    margin-top: calc(env(safe-area-inset-top) + 24px);
    text-align: left;
    padding-left: max(24px, env(safe-area-inset-left));
    padding-right: 12px;
  }

  .minios-lock-date {
    font-size: 18px;
  }

  .minios-lock-time {
    font-size: clamp(58px, 13vw, 92px);
  }

  .minios-lock-widgets {
    top: calc(env(safe-area-inset-top) + 24px);
    left: 48%;
    right: max(18px, env(safe-area-inset-right));
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .minios-lock-widget {
    min-height: 74px;
    border-radius: 20px;
    padding: 12px;
  }

  .minios-lock-widget.size-large {
    grid-column: span 3;
  }

  .minios-lock-notifications {
    left: max(22px, env(safe-area-inset-left));
    right: 52%;
    bottom: calc(env(safe-area-inset-bottom) + 76px);
    max-height: 34dvh;
  }

  .minios-lock-notif {
    min-height: 60px;
    padding: 10px 70px 10px 11px;
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .minios-lock-notif-icon {
    width: 40px;
    height: 40px;
  }

  .minios-lock-bottom {
    left: max(22px, env(safe-area-inset-left));
    right: max(22px, env(safe-area-inset-right));
    bottom: calc(env(safe-area-inset-bottom) + 12px);
    grid-template-columns: 50px minmax(180px, 300px) 50px;
    justify-content: center;
  }

  .minios-lock-action {
    width: 50px;
    height: 50px;
  }

  .minios-unlock-pill,
  .minios-unlock-pill .minios-unlock-label {
    min-height: 48px;
  }

  .minios-widget-page,
  .minios-home-page {
    padding: calc(env(safe-area-inset-top) + 26px) max(28px, env(safe-area-inset-right)) calc(env(safe-area-inset-bottom) + 96px) max(28px, env(safe-area-inset-left));
  }

  .minios-home-page,
  .minios-widget-page {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .minios-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(6, 76px);
    grid-auto-rows: 76px;
    gap: 13px 12px;
    max-width: 760px;
    margin: 0 auto;
  }

  .minios-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    margin-bottom: 5px;
  }

  .minios-app-name {
    font-size: 10px;
  }

  .minios-widget-board {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .minios-home-widget {
    min-height: 86px;
    border-radius: 22px;
    padding: 12px;
  }

  .minios-dock {
    left: 50%;
    right: auto;
    bottom: calc(env(safe-area-inset-bottom) + 12px);
    width: min(430px, calc(100% - 80px));
    min-height: 68px;
    padding: 8px 12px;
    transform: translateX(-50%);
  }

  .minios-dock .minios-icon {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }

  .minios-page-dots {
    bottom: calc(env(safe-area-inset-bottom) + 86px);
  }

  .minios-app-window,
  .minios-modal[data-active-kind="messages"] .minios-app-window,
  .minios-modal[data-active-kind="phone"] .minios-app-window,
  .minios-modal[data-active-kind="safari"] .minios-app-window,
  .minios-modal[data-active-kind="custom"] .minios-app-window {
    width: 100%;
    height: 100dvh !important;
    max-height: 100dvh;
    border-radius: 0;
    border: 0;
  }

  .minios-app-content {
    height: calc(100% - 58px);
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .minios-modal[data-active-kind="safari"] .minios-app-content,
  .minios-modal[data-active-kind="phone"] .minios-app-content,
  .minios-modal[data-active-kind="messages"] .minios-app-content,
  .minios-modal[data-active-kind="photos"] .minios-app-content,
  .minios-modal[data-active-kind="custom"] .minios-app-content {
    overflow: hidden;
  }

  .minios-modal:not([data-active-kind="safari"]):not([data-active-kind="phone"]):not([data-active-kind="messages"]):not([data-active-kind="photos"]):not([data-active-kind="custom"]) .minios-app-content > * {
    min-height: 100%;
    height: auto;
  }
}

/* ─────────── Simulation d'appareil (navigateur) + PWA plein écran ───────────
   - Ordinateur (navigateur, grand écran) : MiniOS dans un cadre façon Mac, centré.
   - Tablette (navigateur) : cadre façon iPad, centré.
   - PWA installée (standalone/fullscreen) : plein écran réel, sans cadre.
   « display-mode: browser » exclut le mode PWA pour que la fullscreen prime.
   .minios-modal étant position:absolute dans .minios-device, les apps ouvertes
   restent contenues dans le cadre. */
@media (display-mode: browser) and (min-width: 1100px) and (min-height: 700px) {
  body.minios-frontend-body {
    display: flex; align-items: center; justify-content: center;
    padding: clamp(20px, 3.4vh, 54px); box-sizing: border-box;
  }
  .minios-device {
    position: relative !important; inset: auto !important;
    width: min(1320px, 95vw) !important;
    height: min(840px, 88vh) !important;
    max-height: 88vh !important; min-height: 0 !important;
    border-radius: 20px !important; overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 44px 130px rgba(0,0,0,.62), 0 0 0 11px #0a0b10, 0 0 0 12px rgba(255,255,255,.06) !important;
    transform: none !important;
  }
}

@media (display-mode: browser) and (min-width: 768px) and (max-width: 1099px) and (min-height: 700px) {
  body.minios-frontend-body {
    display: flex; align-items: center; justify-content: center;
    padding: clamp(16px, 3vh, 40px); box-sizing: border-box;
  }
  .minios-device {
    position: relative !important; inset: auto !important;
    width: min(860px, 94vw) !important;
    height: min(1180px, 94vh) !important;
    max-height: 94vh !important; min-height: 0 !important;
    border-radius: 34px !important; overflow: hidden !important;
    border: 12px solid #0a0b10 !important;
    box-shadow: 0 36px 100px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.06) !important;
    transform: none !important;
  }
}

@media (display-mode: standalone), (display-mode: fullscreen) {
  body.minios-frontend-body {
    display: block !important; padding: 0 !important; background: #000 !important;
  }
  .minios-device {
    position: fixed !important; inset: 0 !important;
    width: 100vw !important; height: 100dvh !important;
    max-width: 100vw !important; max-height: 100dvh !important; min-height: 100dvh !important;
    margin: 0 !important; border: 0 !important; border-radius: 0 !important;
    box-shadow: none !important; transform: none !important;
  }
}

/* ─────────── Contributions payantes : feuille visiteur + toast + CTA ─────────── */
.minios-contrib-sheet { position: fixed; inset: 0; z-index: 9500; display: flex; align-items: flex-end; justify-content: center; }
.mc-cs-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.mc-cs-card {
  position: relative; z-index: 1; width: min(440px, 100%); max-height: 90vh; overflow: auto;
  background: #fff; color: #1c1c1e; border-radius: 22px 22px 0 0; padding: 8px 18px calc(20px + env(safe-area-inset-bottom));
  box-shadow: 0 -16px 50px rgba(0,0,0,.35); animation: mc-cs-up .26s cubic-bezier(.2,.8,.2,1);
}
@keyframes mc-cs-up { from { transform: translateY(40px); opacity: .4; } to { transform: translateY(0); opacity: 1; } }
.mc-cs-grab { width: 38px; height: 5px; border-radius: 3px; background: #d1d1d6; margin: 6px auto 10px; }
.mc-cs-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.mc-cs-head strong { font-size: 18px; font-weight: 700; letter-spacing: -.02em; }
.mc-cs-x { background: #efeff0; border: 0; width: 30px; height: 30px; border-radius: 50%; font-size: 18px; color: #555; cursor: pointer; }
.mc-cs-note { font-size: 12.5px; color: #6b6b70; line-height: 1.4; background: #f5f5f7; border-radius: 12px; padding: 10px 12px; margin: 6px 0 14px; }
.mc-cs-field { display: block; margin-bottom: 12px; }
.mc-cs-field > span { display: block; font-size: 13px; font-weight: 600; color: #3a3a3c; margin-bottom: 5px; }
.mc-cs-field input[type="text"], .mc-cs-field input[type="email"], .mc-cs-field input[type="tel"], .mc-cs-field input[type="url"], .mc-cs-field textarea {
  width: 100%; box-sizing: border-box; border: 1px solid #e2e2e6; border-radius: 12px; padding: 11px 13px;
  font-size: 15px; font-family: inherit; background: #fafafa; color: #1c1c1e;
}
.mc-cs-field textarea { resize: vertical; min-height: 92px; }
.mc-cs-upload { width: 100%; border: 1px dashed #c5c5cc; background: #fafafa; color: #0a84ff; border-radius: 12px; padding: 12px; font-size: 14px; font-weight: 600; cursor: pointer; }
.mc-cs-thumb img { max-width: 100%; max-height: 160px; border-radius: 12px; margin-top: 10px; display: block; }
.mc-cs-submit { width: 100%; border: 0; border-radius: 14px; padding: 14px; margin-top: 6px; background: #0a84ff; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
.mc-cs-submit:disabled { opacity: .6; }
.minios-contrib-toast {
  position: fixed; left: 50%; bottom: calc(28px + env(safe-area-inset-bottom)); transform: translate(-50%, 16px);
  z-index: 9600; background: rgba(28,28,30,.96); color: #fff; padding: 12px 18px; border-radius: 14px;
  font-size: 14px; font-weight: 600; max-width: 86vw; text-align: center; opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; box-shadow: 0 12px 36px rgba(0,0,0,.4);
}
.minios-contrib-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
/* Bouton/CTA de contribution dans les apps */
.minios-contrib-cta { color: #0a84ff; }