/* ==========================================================================
   Globi+ : compte à rebours, passeport, visa, devises, météo, micro, comparateur
   ========================================================================== */

/* ---------- En-tête de Globi ---------- */
.globi-head-txt{min-width:0;flex:1}
.globi-head-txt small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.globi-close{margin-left:0!important}
.globi-count{border:0;border-radius:999px;background:var(--orange,#d4552b);color:#fff;font:400 .95rem/1 var(--f-poster,Impact);letter-spacing:.04em;padding:7px 10px;cursor:pointer;
  animation:gp-pulse 2.4s ease-in-out infinite;flex:none}
@keyframes gp-pulse{50%{box-shadow:0 0 0 5px #d4552b44}}
.globi-pass-btn,.t2w-pass-nav{position:relative;width:36px;height:36px;border-radius:50%;border:1px solid #f3ede244;background:none;color:inherit;cursor:pointer;display:grid;place-items:center;flex:none;transition:transform .3s}
.globi-pass-btn:hover,.t2w-pass-nav:hover{transform:rotate(-10deg) scale(1.08)}
.globi-pass-btn svg,.t2w-pass-nav svg{width:20px;height:20px}
.globi-pass-btn em,.t2w-pass-nav em{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;border-radius:9px;background:var(--sun,#f2b33d);color:#1b2433;font:700 .65rem/18px var(--f-body,system-ui);font-style:normal;padding:0 4px}
.t2w-pass-nav{border-color:var(--line);color:var(--ink);width:39px;height:39px}

/* ---------- Micro ---------- */
.globi-mic{width:44px;height:44px;flex:none;border-radius:50%;border:1.5px solid var(--line,#ddd)!important;background:transparent!important;cursor:pointer;display:grid;place-items:center;color:var(--ink,#1b2433)}
.globi-mic svg{width:20px;height:20px;fill:currentColor}
.globi-mic[hidden]{display:none}
.globi.listening .globi-mic{background:var(--orange,#d4552b)!important;color:#fff;border-color:var(--orange,#d4552b)!important;animation:gp-listen 1s ease-in-out infinite}
@keyframes gp-listen{50%{box-shadow:0 0 0 8px #d4552b33}}
.globi[data-mood=listening] .globi-land{animation-duration:4s}

/* ---------- Messages enrichis ---------- */
.globi-msg.wide{max-width:96%}
.gp-step{display:inline-block;font:700 .7rem var(--f-body,system-ui);letter-spacing:.1em;color:var(--orange,#d4552b);margin-right:6px;background:#d4552b1a;border-radius:6px;padding:2px 6px}
.globi-chips .gp-ghost{border-style:dashed!important;opacity:.75}
.gp-sub{margin:10px 0 4px;font-weight:600;font-size:.85rem}
.gp-results{display:grid;gap:8px;margin:10px 0}
.globi-msg a.gp-result,.gp-result{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-decoration:none!important;margin:0!important;
  background:var(--surface,#fff);border:1.5px solid var(--ink,#1b2433);border-radius:12px;padding:9px 12px;color:var(--ink,#1b2433)!important;
  box-shadow:3px 3px 0 var(--ink,#1b2433);animation:gp-card .6s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 140ms);transition:transform .25s}
.gp-result:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--orange,#d4552b)}
.gp-result span{grid-row:span 2;font-size:1.35rem}
.gp-result b{font-family:var(--f-display,serif);font-size:1.1rem;font-weight:500}
.gp-result small{font-size:.75rem;opacity:.8;line-height:1.35}
@keyframes gp-card{from{opacity:0;transform:translateY(14px) scale(.9)}}
.gp-count{display:flex;flex-direction:column;align-items:flex-start;margin:4px 0}
.gp-count small{font-size:.78rem;opacity:.75}
.gp-count b{font:400 2.6rem/1 var(--f-poster,Impact);color:var(--orange,#d4552b);letter-spacing:.02em}
.gp-list{list-style:none;padding:0;margin:0;display:grid;gap:5px}
.gp-list li{font-size:.85rem;padding-left:18px;position:relative}
.gp-list li:before{content:"";position:absolute;left:2px;top:.45em;width:9px;height:9px;border:1.5px solid var(--ink,#1b2433);border-radius:3px}
.gp-list li.late:before{background:var(--sun,#f2b33d)}
.gp-list em{font-style:normal;font-weight:700;color:var(--orange,#d4552b);margin-right:4px}
.gp-list a{margin:0!important;display:inline!important;font-weight:500!important}
.gp-date{display:flex;gap:6px;margin:8px 0 4px}
.gp-date input{flex:1;min-width:0;border:1.5px solid var(--line,#ddd);border-radius:10px;padding:8px;font:inherit;background:var(--surface,#fff);color:var(--ink,#1b2433)}
.gp-date button{border:0;border-radius:10px;background:var(--ink,#1b2433);color:var(--bg,#fff);font-weight:700;padding:0 14px;cursor:pointer}
.gp-fx{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin:2px 0 6px}
.gp-fx span{font-size:.95rem;opacity:.8}
.gp-fx i{font-style:normal;color:var(--orange,#d4552b)}
.gp-fx b{font:400 1.7rem/1.1 var(--f-poster,Impact);letter-spacing:.02em;color:var(--ink,#1b2433);animation:gp-card .5s cubic-bezier(.3,1.5,.5,1) both .1s}
.gp-weather{display:flex;align-items:center;gap:10px}
.gp-wico{font-size:2.3rem;animation:gp-float 3s ease-in-out infinite}
@keyframes gp-float{50%{transform:translateY(-4px) rotate(-5deg)}}
.gp-weather b{display:block;font-family:var(--f-display,serif);font-size:1.15rem;font-weight:500}
.gp-weather small{font-size:.76rem;opacity:.8}
.gp-climate{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;align-items:end;height:92px;margin:6px 0 8px}
.gp-bar-m{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px;position:relative}
.gp-bar-m i{display:block;width:100%;height:var(--h);border-radius:4px 4px 2px 2px;background:linear-gradient(#6ec3e0,#1f5f7a);transform-origin:bottom;animation:gp-grow .8s cubic-bezier(.3,1.3,.5,1) both;animation-delay:calc(var(--i) * 45ms)}
.gp-bar-m.best i{background:linear-gradient(var(--sun,#f2b33d),var(--orange,#d4552b))}
.gp-bar-m small{font-size:.6rem;opacity:.7}
.gp-bar-m em{position:absolute;top:-2px;font-size:.55rem;font-style:normal;opacity:0;transition:opacity .2s}
.gp-bar-m:hover em{opacity:1}
@keyframes gp-grow{from{transform:scaleY(0)}}

/* ---------- Tampon qui frappe l'écran ---------- */
.gp-stamp-fly{position:fixed;z-index:9500;left:50%;top:45%;width:min(220px,50vw);aspect-ratio:1;margin:calc(min(220px,50vw) / -2) 0 0 calc(min(220px,50vw) / -2);pointer-events:none;
  animation:gp-slam .55s cubic-bezier(.2,1.6,.4,1) both;filter:drop-shadow(0 6px 10px #0003)}
.gp-stamp-fly.go{transition:all .8s cubic-bezier(.6,0,.3,1);left:calc(100% - 60px);top:calc(100% - 60px);width:40px;margin:-20px 0 0 -20px;opacity:.2}
@keyframes gp-slam{0%{transform:scale(3.2) rotate(-30deg);opacity:0}60%{opacity:1}100%{transform:scale(1) rotate(-8deg)}}
.gp-stamp-svg{width:100%;height:100%;transform:rotate(var(--rot,0deg));background:#fffdf8e6;border-radius:50%;mix-blend-mode:multiply}
html[data-theme=dark] .gp-stamp-svg{mix-blend-mode:normal}

/* ---------- Passeport ---------- */
dialog.t2w-modal{border:0;padding:0;background:transparent;max-width:min(760px,calc(100vw - 24px));width:100%;max-height:calc(100dvh - 30px);overflow:visible;color:var(--ink)}
dialog.t2w-modal::backdrop{background:#0b1f33b3;backdrop-filter:blur(4px)}
dialog.gp-passport[open]{animation:gp-book .6s cubic-bezier(.2,1.2,.4,1)}
@keyframes gp-book{from{transform:perspective(1200px) rotateY(-35deg) scale(.85);opacity:0}}
.gp-cover{position:relative;background:#1b2a4a;color:#e9c46a;border-radius:18px 18px 0 0;padding:26px 24px 20px;text-align:center;
  background-image:radial-gradient(circle at 50% 120%,#2b3f6b,transparent 60%);border-bottom:3px dashed #e9c46a55}
.gp-cover small{letter-spacing:.3em;font-size:.65rem;opacity:.8}
.gp-cover b{display:block;font:400 2.4rem/1 var(--f-poster,Impact);letter-spacing:.2em;margin:6px 0 4px}
.gp-cover span{font-family:var(--f-display,serif);font-style:italic;font-size:1.1rem}
.gp-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:1px solid #e9c46a66;background:none;color:#e9c46a;font-size:1.3rem;cursor:pointer}
.gp-inner{background:var(--surface);border-radius:0 0 18px 18px;padding:18px 20px 22px;max-height:calc(100dvh - 190px);overflow-y:auto;
  background-image:repeating-linear-gradient(0deg,transparent 0 27px,color-mix(in srgb,var(--blue) 8%,transparent) 27px 28px)}
.gp-intro{font-size:.9rem;margin:0 0 12px}
.gp-page{border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin:12px 0;background:var(--surface)}
.gp-page.done{border-color:var(--orange);box-shadow:4px 4px 0 var(--orange)}
.gp-page header{display:flex;align-items:center;gap:8px}
.gp-page header span{font-size:1.4rem}
.gp-page header b{font-family:var(--f-display);font-size:1.2rem;font-weight:500}
.gp-page header small{font-weight:700;color:var(--orange)}
.gp-page header a{margin-left:auto;font-size:.8rem}
.gp-bar{height:6px;border-radius:3px;background:var(--soft);margin:8px 0 10px;overflow:hidden}
.gp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--sun));border-radius:3px;animation:gp-grow-x 1s cubic-bezier(.3,1,.4,1) both}
@keyframes gp-grow-x{from{width:0}}
.gp-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:8px}
.gp-slot{aspect-ratio:1;border-radius:50%;border:1.5px dashed var(--line);display:block}
.gp-slot.on{border:0;animation:gp-slam .5s cubic-bezier(.2,1.6,.4,1) both;transition:transform .25s}
.gp-slot.on:hover{transform:scale(1.12)}
.gp-reset{margin-top:10px;border:0;background:none;color:var(--muted);text-decoration:underline;cursor:pointer;font-size:.8rem}
.gp-sentinel{height:1px}

/* ---------- Comparateur ---------- */
.cmp-page{padding-top:clamp(30px,5vw,60px);padding-bottom:80px}
.cmp-pick{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:24px 0 30px}
.cmp-pick select{appearance:none;border:1.5px solid var(--ink);border-radius:999px;padding:12px 40px 12px 18px;font:500 1rem var(--f-body);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23d4552b' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center;color:var(--ink);cursor:pointer}
.cmp-vs{font:400 2rem/1 var(--f-poster);color:var(--orange);animation:gp-float 2.5s ease-in-out infinite}
.cmp-swap{border:1.5px solid var(--ink);background:none;border-radius:50%;width:42px;height:42px;cursor:pointer;color:var(--ink);font-size:1.1rem;transition:transform .5s}
.cmp-swap:hover{transform:rotate(180deg)}
.cmp-grid{display:grid;grid-template-columns:170px 1fr 1fr;border:1.5px solid var(--ink);border-radius:20px;overflow:hidden;background:var(--surface);box-shadow:8px 8px 0 var(--ink)}
.cmp-grid>div{padding:14px 16px;border-top:1px solid var(--line);min-width:0}
.cmp-grid>.cmp-h{border-top:0;background:var(--ink);color:var(--bg);display:flex;align-items:center;gap:10px}
.cmp-h span{font-size:2rem}
.cmp-h b{font-family:var(--f-display);font-size:1.5rem;font-weight:500}
.cmp-h a{margin-left:auto;color:var(--sun);font-size:.85rem;white-space:nowrap}
.cmp-label{font-weight:600;font-size:.85rem;color:var(--muted);background:color-mix(in srgb,var(--soft) 60%,transparent)}
.cmp-cell{animation:cmp-in .6s cubic-bezier(.2,1,.3,1) both;animation-delay:calc(var(--r) * 45ms)}
.cmp-cell.b{animation-delay:calc(var(--r) * 45ms + 90ms)}
@keyframes cmp-in{from{opacity:0;transform:translateY(12px)}}
.cmp-big{font:400 1.6rem/1.1 var(--f-poster);letter-spacing:.02em}
.cmp-cell .gp-climate{height:80px;margin:0}
.cmp-clock{font:400 1.5rem/1 var(--f-poster);letter-spacing:.04em}
.cmp-cell small{display:block;color:var(--muted);font-size:.75rem}
.cmp-note{font-size:.8rem;color:var(--muted);margin-top:18px}
@media (max-width:700px){
  .cmp-grid{grid-template-columns:1fr 1fr;box-shadow:5px 5px 0 var(--ink)}
  .cmp-grid>.cmp-label{grid-column:span 2;padding:8px 12px 4px}
  .cmp-grid>.cmp-corner{display:none}
  .cmp-h b{font-size:1.1rem}.cmp-h a{display:none}
  .cmp-cell{border-top:0!important;padding-top:4px!important}
}
@media (max-width:650px){ .globi-head-txt small{display:none} }
@media (prefers-reduced-motion:reduce){ .gp-stamp-fly,.gp-result,.gp-bar-m i,.cmp-cell,dialog.gp-passport[open]{animation:none!important} }

.gp-visa{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:2px 0 8px;font-weight:600}
.gp-visa span{background:var(--surface,#fff);border:1.5px solid var(--ink,#1b2433);border-radius:999px;padding:3px 10px;font-size:.85rem}
.gp-visa i{font-style:normal;color:var(--orange,#d4552b)}
.cmp-page h1{font-size:clamp(2.6rem,6vw,5rem)!important;line-height:1!important;margin:14px 0!important}
.cmp-page>p{color:var(--muted);max-width:640px}

.gp-stamp-svg text{font-family:'Twemoji Country Flags','Anton',Impact,sans-serif}
.globi-chips .gp-buy{background:var(--orange,#d4552b)!important;color:#fff!important;border-color:var(--orange,#d4552b)!important;font-weight:700!important}
