/* MemoMilo v268 — création du profil à la première ouverture (préfixe mmp-). */
.mmp-layer{position:fixed;inset:0;z-index:2147482000;display:flex;justify-content:center;overflow:hidden;
  font-family:"MemoMilo Nunito",Nunito,system-ui,sans-serif;color:var(--mmp-ink);
  --mmp-bg:linear-gradient(180deg,#74cdef 0%,#8fdcf3 30%,#b8e7ea 58%,#e3ead6 100%);
  --mmp-ink:#0c3550;--mmp-sub:#3c6683;--mmp-panel:rgba(255,255,255,.86);--mmp-panel-rim:rgba(255,255,255,.95);--mmp-shadow:rgba(8,70,110,.22);
  --mmp-field:#fff;--mmp-field-rim:#bfe3f3;--mmp-focus:#20b8ee;--mmp-btn1:#19bdf2;--mmp-btn2:#0a6fe0;--mmp-btn-ink:#fff;--mmp-glow:rgba(255,255,255,.9);
  --mmp-bubble:#fff;--mmp-bubble-ink:#0c3550;--mmp-error:#c62845;--mmp-dot:rgba(12,53,80,.18);--mmp-dot-on:#0aa7d8;
  background:var(--mmp-bg);opacity:0;transition:opacity .38s ease}
.mmp-layer[data-skin="ocean"]{--mmp-bg:linear-gradient(rgba(0,30,53,.1),rgba(0,15,34,.45)),url("../images/ocean-home-premium/home-ocean-bg.webp") center/cover no-repeat,#032b46;
  --mmp-ink:#eafaff;--mmp-sub:#a9d8ea;--mmp-panel:rgba(4,40,66,.72);--mmp-panel-rim:rgba(140,230,255,.22);--mmp-shadow:rgba(0,10,25,.5);--mmp-field:rgba(255,255,255,.95);--mmp-field-rim:rgba(140,230,255,.4);--mmp-glow:rgba(120,230,255,.28);--mmp-dot:rgba(255,255,255,.22);--mmp-dot-on:#5fe0ff;--mmp-error:#ff8fa3}
.mmp-layer[data-skin="ardoise"]{--mmp-bg:radial-gradient(circle at 50% -10%,rgba(154,229,236,.15),transparent 37%),linear-gradient(180deg,#314953 0%,#21343d 38%,#15242b 72%,#0d171c 100%);
  --mmp-ink:#ecf7f9;--mmp-sub:#a7c2ca;--mmp-panel:rgba(33,52,61,.82);--mmp-panel-rim:rgba(154,229,236,.18);--mmp-shadow:rgba(0,0,0,.45);--mmp-field:#f4fbfc;--mmp-field-rim:rgba(154,229,236,.35);--mmp-glow:rgba(154,229,236,.2);--mmp-dot:rgba(255,255,255,.2);--mmp-dot-on:#75dce8;--mmp-error:#ff9aa8}
.mmp-layer[data-skin="grenat"]{--mmp-bg:radial-gradient(circle at 50% -12%,rgba(255,225,202,.22),transparent 38%),linear-gradient(180deg,#7f2b42 0%,#5b1d30 42%,#3d111d 76%,#260a13 100%);
  --mmp-ink:#fff3ef;--mmp-sub:#e6bcc4;--mmp-panel:rgba(70,20,34,.8);--mmp-panel-rim:rgba(255,215,200,.2);--mmp-shadow:rgba(20,0,6,.5);--mmp-field:#fff8f6;--mmp-field-rim:rgba(233,166,186,.45);--mmp-focus:#e9a6ba;--mmp-btn1:#d9577a;--mmp-btn2:#8f2445;--mmp-glow:rgba(255,214,190,.22);--mmp-dot:rgba(255,255,255,.2);--mmp-dot-on:#e9a6ba;--mmp-error:#ffb3c0}
.mmp-layer[data-skin="ambre"]{--mmp-bg:radial-gradient(circle at 50% -8%,rgba(255,247,201,.85),transparent 32%),linear-gradient(180deg,#f7a33e 0%,#ffc76e 30%,#f5d89f 66%,#e3b977 100%);
  --mmp-ink:#4a2600;--mmp-sub:#7a4a14;--mmp-panel:rgba(255,250,238,.88);--mmp-shadow:rgba(120,60,10,.25);--mmp-field-rim:#f0d29c;--mmp-focus:#f2711c;--mmp-btn1:#ff9a2e;--mmp-btn2:#e0600c;--mmp-dot:rgba(74,38,0,.18);--mmp-dot-on:#e8650f}
.mmp-layer[data-skin="nuit"]{--mmp-bg:radial-gradient(1.4px 1.4px at 14% 12%,rgba(255,255,255,.75),transparent),radial-gradient(1.2px 1.2px at 82% 8%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 68% 22%,rgba(255,255,255,.55),transparent),radial-gradient(circle at 50% -10%,rgba(133,190,255,.18),transparent 34%),linear-gradient(180deg,#151f35 0%,#0e1728 36%,#09111f 70%,#050a13 100%);
  --mmp-ink:#eef4ff;--mmp-sub:#a9b9d8;--mmp-panel:rgba(20,31,53,.84);--mmp-panel-rim:rgba(157,232,255,.16);--mmp-shadow:rgba(0,0,15,.55);--mmp-field:#f3f6ff;--mmp-field-rim:rgba(143,184,255,.4);--mmp-focus:#8fb8ff;--mmp-btn1:#6f7bff;--mmp-btn2:#3c46c9;--mmp-glow:rgba(140,170,255,.2);--mmp-dot:rgba(255,255,255,.2);--mmp-dot-on:#9de8ff;--mmp-error:#ff9aa8}
.mmp-layer.is-in{opacity:1}
.mmp-layer.is-leaving{opacity:0;pointer-events:none}
.mmp-layer *{box-sizing:border-box}
html.mmp-open,html.mmp-open body{overflow:hidden}

/* décor : halo, deux cartes officielles flottantes, éclats */
.mmp-bg{position:absolute;inset:0;pointer-events:none}
.mmp-glow{position:absolute;left:50%;top:24%;width:min(130vw,680px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,var(--mmp-glow),transparent)}
.mmp-card{position:absolute;width:min(22vw,110px);aspect-ratio:150/198;border-radius:14%/10.5%;background:linear-gradient(160deg,#34c4fd,#1696fb 45%,#0266f3);border:min(1.6vw,8px) solid #fff;
  box-shadow:0 14px 30px rgba(6,64,160,.28);opacity:.55}
.mmp-card::after{content:"";position:absolute;inset:22% 18%;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95) 0 34%,transparent 36%);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.mmp-card-l{left:-4%;top:58%;transform:rotate(-16deg);animation:mmp-float 6s ease-in-out infinite}
.mmp-card-r{right:-5%;top:12%;transform:rotate(14deg);animation:mmp-float 7s ease-in-out -2s infinite}
.mmp-spark{position:absolute;width:10px;height:10px;background:#fff;clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);opacity:.0;animation:mmp-twinkle 3.2s ease-in-out infinite}
.mmp-spark.is-1{left:16%;top:18%}.mmp-spark.is-2{right:18%;top:42%;animation-delay:1.1s}.mmp-spark.is-3{left:10%;top:80%;animation-delay:2s}

.mmp-shell{position:relative;width:100%;max-width:460px;height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  display:flex;flex-direction:column;align-items:center;
  padding:calc(env(safe-area-inset-top,0px) + 14px) 18px calc(env(safe-area-inset-bottom,0px) + 18px)}
.mmp-head{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;flex:none}
.mmp-logo{width:min(56vw,210px);height:auto;filter:drop-shadow(0 4px 8px rgba(3,40,110,.3))}
.mmp-steps{display:flex;gap:6px}
.mmp-steps i{width:22px;height:6px;border-radius:99px;background:var(--mmp-dot);transition:background .3s,width .3s}
.mmp-steps i.is-on{background:var(--mmp-dot-on);width:30px}

.mmp-milo{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%;flex:1 1 auto;min-height:120px;max-height:230px;margin:4px 0 -6px}
.mmp-milo img{height:100%;max-height:220px;width:auto;object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,30,60,.3));animation:mmp-bob 3.6s ease-in-out infinite;transform-origin:50% 100%}
.mmp-bubble{position:absolute;top:6%;left:52%;max-width:min(46vw,210px);margin:0;padding:10px 13px;border-radius:16px 16px 16px 4px;background:var(--mmp-bubble);color:var(--mmp-bubble-ink);
  font-weight:800;font-size:14px;line-height:1.3;box-shadow:0 8px 20px rgba(0,30,60,.2);unicode-bidi:plaintext;opacity:0;transform:translateY(6px) scale(.96)}
[dir="rtl"] .mmp-bubble{border-radius:16px 16px 4px 16px}
.mmp-bubble.is-in{animation:mmp-bubble .42s cubic-bezier(.2,1.2,.3,1) both}

.mmp-panel{position:relative;width:100%;flex:none;padding:20px 18px 18px;border-radius:26px;background:var(--mmp-panel);
  box-shadow:0 18px 40px var(--mmp-shadow),inset 0 0 0 1px var(--mmp-panel-rim);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mmp-step{display:flex;flex-direction:column;gap:12px}
.mmp-step[hidden],.mmp-info[hidden]{display:none}
.mmp-step.is-on{animation:mmp-step .38s cubic-bezier(.2,.9,.3,1) both}
.mmp-step h2{margin:0;font-size:clamp(20px,5.6vw,24px);font-weight:900;line-height:1.15;color:var(--mmp-ink);text-align:center;overflow-wrap:anywhere;unicode-bidi:plaintext}
.mmp-sub{margin:0;font-size:14px;line-height:1.45;color:var(--mmp-sub);text-align:center;font-weight:700}
.mmp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mmp-field{position:relative;display:block}
.mmp-field input{width:100%;height:58px;padding:0 64px 0 18px;border-radius:18px;border:2px solid var(--mmp-field-rim);background:var(--mmp-field);color:#0c3550;
  font-family:inherit;font-weight:900;font-size:20px;line-height:1;outline:none;transition:border-color .2s,box-shadow .2s}
[dir="rtl"] .mmp-field input{padding:0 18px 0 64px}
.mmp-field input::placeholder{color:#8fb0c4;font-weight:800}
.mmp-field input:focus{border-color:var(--mmp-focus);box-shadow:0 0 0 4px color-mix(in srgb,var(--mmp-focus) 25%,transparent)}
.mmp-field input.is-refused{border-color:var(--mmp-error);animation:mmp-shake .4s}
.mmp-count{position:absolute;inset-inline-end:16px;top:50%;transform:translateY(-50%);font-size:12px;color:#7d9bb0;font-weight:800;direction:ltr}
.mmp-error{margin:-4px 2px 0;min-height:1.2em;font-size:13px;font-weight:800;color:var(--mmp-error);text-align:center;line-height:1.35}
.mmp-error:empty{min-height:0;margin:0}
.mmp-dob{display:grid;grid-template-columns:1fr 1.6fr 1.2fr;gap:8px}
.mmp-dob label{display:flex;flex-direction:column;gap:4px;min-width:0}
.mmp-dob span{font-size:11px;font-weight:900;letter-spacing:.04em;color:var(--mmp-sub);padding-inline-start:6px}
.mmp-dob select{width:100%;height:54px;padding:0 30px 0 12px;border-radius:16px;border:2px solid var(--mmp-field-rim);color:#6d8ca1;font-family:inherit;font-weight:800;font-size:16px;line-height:1;
  -webkit-appearance:none;appearance:none;background:var(--mmp-field) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230a8fc4' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") right 11px center/12px 8px no-repeat;outline:none;text-overflow:ellipsis}
.mmp-dob select.is-set{color:#0c3550;font-weight:900}
.mmp-dob select:focus{border-color:var(--mmp-focus);box-shadow:0 0 0 4px color-mix(in srgb,var(--mmp-focus) 25%,transparent)}
.mmp-btn{position:relative;overflow:hidden;height:56px;border:0;border-radius:999px;color:var(--mmp-btn-ink);font-family:inherit;font-weight:900;font-size:18px;line-height:1;letter-spacing:.02em;
  background:linear-gradient(180deg,var(--mmp-btn1),var(--mmp-btn2));box-shadow:0 10px 22px color-mix(in srgb,var(--mmp-btn2) 40%,transparent),inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .15s,opacity .2s,filter .2s;cursor:pointer}
.mmp-btn::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:35%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);animation:mmp-shine 2.8s ease-in-out 1s infinite}
.mmp-btn:active{transform:scale(.97)}
.mmp-btn:disabled{opacity:.45;filter:saturate(.6);cursor:default}
.mmp-btn:disabled::after{display:none}
.mmp-btn.is-loading{color:transparent}
.mmp-btn.is-loading::before{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-11px;border-radius:50%;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;animation:mmp-spin .8s linear infinite}
.mmp-links{display:flex;justify-content:space-between;gap:10px}
.mmp-link{border:0;background:none;padding:6px 4px;color:var(--mmp-sub);font-family:inherit;font-weight:800;font-size:13px;line-height:1.2;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mmp-info{margin:0;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--mmp-panel-rim) 30%,transparent);font-size:12.5px;line-height:1.5;font-weight:700;color:var(--mmp-sub)}
.mmp-layer :focus-visible{outline:3px solid var(--mmp-focus);outline-offset:2px}
.mmp-badge{width:76px;height:76px;margin:4px auto 0;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(180deg,#5ee06f,#14a83a);box-shadow:0 10px 24px rgba(20,140,60,.35),inset 0 2px 0 rgba(255,255,255,.4);animation:mmp-pop .55s cubic-bezier(.3,1.6,.5,1) both}
.mmp-badge svg{width:44px;height:44px}

/* petits écrans : Milo se fait plus discret */
@media (max-height:640px){.mmp-milo{max-height:130px;min-height:96px}.mmp-milo img{max-height:128px}.mmp-bubble{font-size:13px}}
@media (max-height:420px){.mmp-milo{display:none}}

@keyframes mmp-float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes mmp-twinkle{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.9;transform:scale(1)}}
@keyframes mmp-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-1deg)}}
@keyframes mmp-bubble{from{opacity:0;transform:translateY(6px) scale(.9)}to{opacity:1;transform:none}}
@keyframes mmp-step{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes mmp-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes mmp-shine{0%{left:-40%}40%,100%{left:120%}}
@keyframes mmp-spin{to{transform:rotate(360deg)}}
@keyframes mmp-pop{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.mmp-layer *,.mmp-layer *::before,.mmp-layer *::after{animation-duration:1ms!important;animation-iteration-count:1!important}.mmp-bubble.is-in{opacity:1;transform:none}}
.mmp-layer.is-calm *,.mmp-layer.is-calm *::after{animation:none!important}
.mmp-layer.is-calm .mmp-bubble.is-in{opacity:1;transform:none}

/* v269 · Saisie au clavier : disposition compacte, le champ reste toujours visible au-dessus du clavier. */
.mmp-layer{bottom:auto;height:100%}
.mmp-layer .mmp-head,.mmp-layer .mmp-milo,.mmp-layer .mmp-milo img,.mmp-layer .mmp-logo{transition:max-height .28s ease,height .28s ease,width .28s ease,margin .28s ease,opacity .2s ease}
.mmp-layer.is-typing .mmp-shell{justify-content:flex-start;padding-top:calc(env(safe-area-inset-top,0px) + 10px)}
.mmp-layer.is-typing .mmp-head{flex-direction:row;justify-content:space-between;gap:10px}
.mmp-layer.is-typing .mmp-logo{width:118px}
.mmp-layer.is-typing .mmp-milo{flex:none;height:76px;min-height:0;max-height:76px;margin:8px 0 8px;justify-content:flex-start;align-items:center;gap:10px}
.mmp-layer.is-typing .mmp-milo img{height:76px;max-height:76px;animation:none}
.mmp-layer.is-typing .mmp-bubble{position:static;max-width:none;flex:1 1 auto;font-size:13px;padding:9px 12px;border-radius:14px 14px 14px 4px}
[dir="rtl"] .mmp-layer.is-typing .mmp-bubble,.mmp-layer[dir="rtl"].is-typing .mmp-bubble{border-radius:14px 14px 4px 14px}
.mmp-layer.is-typing .mmp-panel{padding:14px 14px 14px}
.mmp-layer.is-typing .mmp-step{gap:10px}
.mmp-layer.is-typing .mmp-step h2{font-size:19px}
.mmp-layer.is-typing [data-step="name"] .mmp-sub{display:none}
.mmp-layer.is-typing .mmp-bg .mmp-card{opacity:.25}
/* Zone visible très réduite (petit téléphone + clavier) : Milo laisse toute la place au champ. */
.mmp-layer.is-typing.is-short .mmp-milo,.mmp-layer.is-keyboard.is-short .mmp-milo{display:none}
.mmp-layer.is-typing.is-short .mmp-steps{display:none}
.mmp-layer.is-typing.is-short .mmp-step h2{font-size:17px}

/* v272 · Date de naissance : trois cases numériques, rapides et fluides */
.mmp-dobx{position:relative;display:flex;align-items:flex-end;gap:6px;padding:10px 12px 12px;border-radius:20px;background:var(--mmp-field);
  box-shadow:inset 0 0 0 2px var(--mmp-field-rim);transition:box-shadow .2s ease,transform .2s ease;cursor:text}
.mmp-dobx:focus-within{box-shadow:inset 0 0 0 2px var(--mmp-focus),0 0 0 4px color-mix(in srgb,var(--mmp-focus) 22%,transparent)}
.mmp-dobx.is-valid{box-shadow:inset 0 0 0 2px #22b45a,0 0 0 4px rgba(34,180,90,.16)}
.mmp-dobx.is-invalid{box-shadow:inset 0 0 0 2px var(--mmp-error);animation:mmp-shake .4s}
.mmp-seg{display:flex;flex-direction:column;align-items:center;gap:3px;flex:0 0 auto;min-width:0}
.mmp-seg span{font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#7d9bb0}
.mmp-seg input{width:2.6ch;height:46px;padding:0;border:0;border-radius:12px;background:color-mix(in srgb,var(--mmp-focus) 7%,#fff);color:#0c3550;text-align:center;
  font-family:inherit;font-weight:900;font-size:26px;line-height:1;letter-spacing:.04em;font-variant-numeric:tabular-nums;outline:none;caret-color:var(--mmp-focus);
  transition:background .2s ease,transform .15s ease;box-sizing:content-box;padding:0 8px}
.mmp-seg.is-y input{width:4.4ch}
.mmp-seg input::placeholder{color:#b3c8d6;font-weight:800}
.mmp-seg.is-focus input{background:color-mix(in srgb,var(--mmp-focus) 16%,#fff);transform:translateY(-1px)}
.mmp-seg.is-set input{background:color-mix(in srgb,var(--mmp-focus) 10%,#fff)}
.mmp-slash{font-style:normal;font-weight:900;font-size:24px;color:#a5bccb;padding-bottom:9px}
.mmp-dobx{justify-content:center}
.mmp-dob-ok{position:absolute;right:10px;top:10px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;background:#22b45a;opacity:0;transform:scale(.4);transition:opacity .2s,transform .3s cubic-bezier(.3,1.6,.5,1)}
.mmp-dob-ok svg{width:15px;height:15px}
.mmp-dobx.is-valid .mmp-dob-ok{opacity:1;transform:scale(1)}
.mmp-dob-read{margin:-2px 0 0;min-height:1.3em;text-align:center;font-weight:900;font-size:15px;color:var(--mmp-ink);unicode-bidi:plaintext}
.mmp-dob-read:empty{min-height:0;margin:0}
.mmp-dob-read:not(:empty){animation:mmp-step .3s ease both}
.mmp-layer.is-typing [data-step="dob"] .mmp-sub{display:none}
@media (max-width:350px){.mmp-seg input{font-size:22px;padding:0 6px}.mmp-slash{font-size:20px}}