/* Homepage matched to the 311 × 643 reference frame. */
#app:has(.home-screen){width:min(100%,311px)}
.home-screen{height:643px;min-height:643px;padding:0 12px;background:#fff;overflow:hidden}
.home-screen .site-header{height:55px;margin:0 -12px;padding:0 13px;grid-template-columns:36px 1fr 68px;background:#fff}
.home-screen .brand{display:flex;align-items:center;justify-content:center}.home-screen .menu-icon{font-size:22px;text-align:left}.home-screen .bag-icon{font-size:18px;text-align:right}
.home-screen .site-header .ghost{width:30px;height:30px;padding:0;display:grid;place-items:center}
.home-screen .site-header .ghost svg{width:17px;height:17px;stroke-width:1.55}
.home-screen .header-actions{display:flex;align-items:center;justify-content:flex-end;gap:3px}
.home-screen .top-nav{height:49px;margin:0 -12px;padding:3px 8px 6px;display:grid;grid-template-columns:repeat(5,1fr) 1.55fr;align-items:center;gap:2px;border:0;background:#fff;font-size:5.5px}
.home-screen .top-nav span{min-width:0;height:39px;display:flex;flex-direction:column;justify-content:center;gap:1px;color:#111;font-weight:500}.home-screen .nav-pictogram{font-style:normal;font-size:13px;line-height:14px}.home-screen .home-picto{width:21px;height:21px;display:grid;place-items:center;background:#f2f2f2;border-radius:50%;margin-top:-2px}.home-screen .agent-tab{height:38px;background:#f2f2f2;border-radius:6px;padding:2px 3px;display:grid!important;grid-template-columns:18px 1fr;align-items:center;text-align:left}.home-screen .agent-tab .nav-pictogram{font-size:15px}.home-screen .agent-tab b{line-height:1.1}
.home-screen .hero{height:258px;min-height:258px;margin:0 -12px;padding:20px 12px 10px;grid-template-columns:62% 38%;background:#f7f3f0;overflow:hidden}.home-screen .hero-copy{z-index:2;text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-bottom:10px}.home-screen .new-badge{font-size:12px;padding:4px 11px}.home-screen .hero h1{font-size:16px!important;line-height:1.07!important;letter-spacing:-.04em;margin:12px 0 16px;width:205px!important;max-width:205px!important;text-align:left!important;text-wrap:balance}.home-screen .hero p,.home-screen .trust{display:none!important}.home-screen .hero .primary{min-height:42px;border-radius:8px;padding:9px 10px;font-size:11px;width:176px}.home-screen .hero .hero-cta{display:inline-flex;align-items:center;justify-content:center;gap:7px}.home-screen .hero .button-icon{display:inline-grid;place-items:center;flex:0 0 auto}.home-screen .hero .button-icon svg{width:14px;height:14px;stroke-width:1.9}.home-screen .hero .button-label{display:inline-block;white-space:nowrap}.home-screen .hero-visual{height:258px;margin:-20px -12px -10px -32px;background:#f7f3f0}.home-screen .hero-model-crop img{width:311px;left:-147px;top:-104px}
.home-screen .avatar-stack img:nth-child(1){content:url("assets/trust-avatar-1.png")}
.home-screen .avatar-stack img:nth-child(2){content:url("assets/trust-avatar-2.png")}
.home-screen .avatar-stack img:nth-child(3){content:url("assets/trust-avatar-3.png")}
.home-screen .avatar-stack img:nth-child(4){content:url("assets/trust-avatar-4.png")}
.home-screen .hero-model-crop img{
  content:url("assets/homepage-model-hd.png");
  width:175px;
  height:auto;
  max-width:none;
  left:auto;
  right:-12px;
  top:-40px;
  object-fit:contain;
  filter:contrast(1.015) saturate(.98);
}
.home-screen .section-title{height:34px;margin:0;display:flex;align-items:center;font-size:10px}.home-screen .section-title span,.home-screen .section-title button{font-size:8px;color:#111}.home-screen .mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.home-screen .featured-grid{height:358px}.home-screen .mini-card{position:relative;min-height:0;height:114px;border:1px solid #ececec;border-radius:12px;padding:10px 9px 6px;background:#fafafa;overflow:hidden}.home-screen .mini-card small{display:none}.home-screen .mini-card b{display:block;font-size:11px;line-height:1.02;max-width:88px;letter-spacing:-.025em}.home-screen .mini-card .card-arrow{position:absolute;right:9px;left:auto;top:9px;width:17px;height:17px;border-radius:50%;background:#111;color:#fff;display:grid;place-items:center;font-size:9px;z-index:1}.home-screen .mini-card img{position:absolute;left:7px;right:7px;bottom:3px;width:calc(100% - 14px);height:72px;object-fit:contain}
.home-screen .discover-heading,.home-screen .discover-grid{display:none!important}
.home-screen .bottom-nav{height:53px;margin:0 -12px -22px;padding:7px 19px 5px;position:absolute;left:12px;right:12px;bottom:22px;background:#fff;border-top:1px solid #ededed;display:flex;align-items:flex-start;font-size:6px}.home-screen .bottom-nav>.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;font-weight:500}.home-screen .bottom-nav .nav-label{display:block;font-size:inherit;font-weight:500;line-height:1.1}.home-screen .bottom-nav .is-active .nav-label{font-weight:800}.home-screen .bottom-nav .nav-icon{width:17px;height:17px;display:grid;place-items:center;font-style:normal;line-height:1}.home-screen .bottom-nav .nav-icon svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.8}
@media(min-width:700px){#app:has(.home-screen){width:311px}.home-screen{min-height:643px;border-radius:0}}

/* Native mobile navigation: categories live behind the hamburger. */
.home-screen .mobile-menu-layer{position:absolute;inset:0;z-index:40;display:grid;grid-template-columns:1fr 38px}
.home-screen .mobile-menu-backdrop{position:absolute;inset:0;border:0;background:rgba(25,22,20,.34);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.home-screen .mobile-menu-drawer{position:relative;width:273px;height:100%;padding:20px 14px 16px;display:flex;flex-direction:column;background:#fff;border-radius:0 18px 18px 0;box-shadow:18px 0 50px rgba(0,0,0,.18);animation:mobileMenuIn .24s cubic-bezier(.2,.8,.2,1)}
@keyframes mobileMenuIn{from{transform:translateX(-100%);opacity:.7}to{transform:translateX(0);opacity:1}}
.home-screen .mobile-menu-drawer>header{height:55px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #ececec}
.home-screen .mobile-menu-drawer>header span{display:flex;flex-direction:column;gap:2px}.home-screen .mobile-menu-drawer>header small{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#8a8a8a}.home-screen .mobile-menu-drawer>header b{font-size:16px}
.home-screen .mobile-menu-drawer>header button{width:31px;height:31px;border:0;border-radius:50%;display:grid;place-items:center;background:#f2f2f2}.home-screen .mobile-menu-drawer>header svg{width:15px;height:15px}
.home-screen .mobile-menu-drawer nav{display:grid;gap:7px;padding:14px 0}
.home-screen .mobile-menu-item{min-height:60px;padding:9px 10px;border:1px solid #e8e8e8;border-radius:13px;display:grid;grid-template-columns:34px 1fr 15px;align-items:center;gap:9px;background:#fff;text-align:left;color:#141414}
.home-screen .mobile-menu-item>svg:first-child{width:22px;height:22px;stroke-width:1.55;color:#1a1a1a}.home-screen .mobile-menu-item>svg:last-child{width:13px;height:13px;color:#9a9a9a}
.home-screen .mobile-menu-item span{display:flex;flex-direction:column;gap:3px}.home-screen .mobile-menu-item b{font-size:12px}.home-screen .mobile-menu-item small{font-size:11px;color:#777777}
.home-screen .mobile-menu-footer{margin-top:auto;padding-top:12px;border-top:1px solid #ececec}.home-screen .mobile-menu-footer>button{width:100%;min-height:53px;padding:8px 10px;border:0;border-radius:13px;display:grid;grid-template-columns:32px 1fr 15px;align-items:center;gap:8px;background:#171a1b;color:#fff;text-align:left}.home-screen .mobile-menu-footer svg{width:17px;height:17px}.home-screen .mobile-menu-footer span{display:flex;flex-direction:column;gap:2px}.home-screen .mobile-menu-footer b{font-size:11px}.home-screen .mobile-menu-footer small{font-size:11px;color:#c9c9c9}

/* Screen 2 — usage selection modal */






/* Badge des cartes Collections : petite fleche (remplace l'ancien "?"). */
.home-screen .mini-card .card-arrow svg { width: 11px; height: 11px; stroke: currentColor; stroke-width: 2; fill: none; }
