/* Liste de naissance */
/* ====== Liste de naissance ====== */
.garl{display:block; width:100%; height:64px; color:var(--ink); overflow:visible}
.garl .flag{transform-box:fill-box; transform-origin:50% 0; animation:flag 3.6s ease-in-out infinite}
@keyframes flag{50%{transform:rotate(5deg)}}
.addlist{grid-column:1/-1; justify-self:center; font-weight:700; font-size:14.5px; color:var(--rose-ink); padding:8px 12px; border-radius:999px; transition:background .2s}
.addlist:hover{background:var(--rosesoft)}

/* Page d'accueil de la liste */
.lhero{background:var(--tint); border-radius:40px; overflow:hidden; margin-bottom:40px}
.lhero-in{display:grid; grid-template-columns:1.3fr 1fr; gap:30px; align-items:center; padding:10px 56px 56px}
.lhero h1{font-size:clamp(38px,5vw,66px); max-width:15ch}
.lhero p{color:var(--muted); font-size:18px; max-width:48ch; margin:18px 0 26px}
.lhero-art{position:relative; height:320px}
.lhero-art span{position:absolute; width:150px; height:150px; background:var(--surface); border-radius:32px; display:grid; place-items:center; box-shadow:var(--shadow); animation:hover 6s ease-in-out infinite}
.lhero-art svg{width:84%}
.lhero-art span.full{overflow:hidden}
.lhero-art span.full svg{width:100%; height:100%}
.lg0{left:8%; top:4%; transform:rotate(-6deg)} .lg1{left:52%; top:0; animation-delay:-1.5s !important} .lg2{left:0; top:52%; animation-delay:-3s !important} .lg3{left:44%; top:48%; width:170px !important; height:170px !important; animation-delay:-4.5s !important}
.lsteps{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:24px}
.lsteps div{background:var(--surface); border-radius:28px; padding:28px}
.lsteps i{width:40px; height:40px; border-radius:50%; background:var(--rose); color:#fff; font-style:normal; font-weight:800; display:grid; place-items:center; margin-bottom:14px}
.lsteps h3{font-size:24px; margin-bottom:8px}
.lsteps p{margin:0; color:var(--muted)}
.lperks{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:70px}
.lperks div{border:1.5px solid var(--line); border-radius:24px; padding:22px}
.lperks i{font-style:normal; font-size:26px}
.lperks b{display:block; margin:8px 0 4px}
.lperks p{margin:0; color:var(--muted); font-size:14.5px}
.lmine{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px}
.ltile{position:relative; display:grid; grid-template-columns:84px 1fr; gap:16px; align-items:center; background:var(--tint); border-radius:26px; padding:16px 20px 16px 16px; text-decoration:none; transition:transform .3s var(--spring)}
.ltile:hover{transform:translateY(-3px)}
.ltile .ring{width:84px; height:84px; color:var(--ink)}
.ltile .rp{position:absolute; left:16px; width:84px; text-align:center; font-weight:800; font-size:15px}
.ltile b{font-family:var(--serif); font-weight:500; font-size:22px; display:block}
.ltile small{color:var(--muted)}
.ring-v{transition:stroke-dashoffset 1.4s var(--ease)}
.lfind{display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center; background:var(--surface); border-radius:32px; padding:36px 40px; margin-bottom:90px}
.lfind h2{font-size:32px}
.lfind p{color:var(--muted); margin:8px 0 0}
.lfind form{display:flex; gap:10px; flex-wrap:wrap}
.lfind input{flex:1; min-width:180px; border:1.5px solid var(--line); background:var(--bg); border-radius:999px; padding:13px 18px; outline:none; text-transform:uppercase}
.lfind input:focus{border-color:var(--rose)}

/* Création */
.lcreate{display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:44px; align-items:start; padding-bottom:90px}
.cof textarea{border:1.5px solid var(--line); background:var(--bg); border-radius:14px; padding:12px 14px; outline:none; font:inherit; color:inherit; width:100%; resize:vertical}
.cof textarea:focus{border-color:var(--rose)}
.themes{display:flex; gap:8px; flex-wrap:wrap}
.th-sw{position:relative; display:flex; align-items:center; gap:8px; border:1.5px solid var(--line); border-radius:999px; padding:7px 14px 7px 7px; cursor:pointer; font-weight:600; font-size:14px; background:var(--bg)}
.th-sw input{position:absolute; opacity:0; pointer-events:none; left:8px; top:8px}
.th-sw span{width:24px; height:24px; border-radius:50%; background:var(--tint); box-shadow:inset 0 0 0 5px var(--c)}
.th-sw:has(input:checked){border-color:var(--c); background:var(--tint)}
.th-sw:has(input:focus-visible){outline:2.5px solid var(--rose); outline-offset:2px}
.lprev{position:sticky; top:96px}
.lprev-lab{display:block; font-weight:700; font-size:14px; color:var(--muted); margin-bottom:10px}
.lprev-card{background:var(--tint); border-radius:32px; padding:0 26px 30px; text-align:center; overflow:hidden; transition:background .4s}
.lprev-card .garl{margin:0 -26px 10px; width:calc(100% + 52px); height:54px}
.lprev-card small{color:var(--muted); font-weight:600}
.lprev-card b{display:block; font-family:var(--serif); font-weight:500; font-size:44px; line-height:1.1; margin:4px 0}
.lprev-card > span{color:var(--muted)}
.lprev-card em{display:inline-block; font-style:normal; color:#fff; font-weight:800; font-size:13.5px; border-radius:999px; padding:5px 14px; margin-top:14px}
.lprev-card q{display:block; margin-top:16px; font-family:var(--serif); font-size:17px; color:var(--ink)}

/* Gestion */
.lman{display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:44px; align-items:start; padding-bottom:90px}
.lman-h h1{font-size:clamp(34px,4.2vw,52px)}
.lman-h p{color:var(--muted); margin:8px 0 24px}
.lside{position:sticky; top:96px; display:grid; gap:14px}
.lside-card{background:var(--tint); border-radius:30px; padding:0 24px 24px; overflow:hidden; display:grid; gap:10px}
.lside-card .garl{margin:0 -24px; width:calc(100% + 48px); height:50px}
.lside-ring{position:relative; width:150px; height:150px; margin:0 auto 6px}
.lside-ring .ring{width:150px; height:150px; color:var(--ink)}
.lside-ring span{position:absolute; inset:0; display:grid; place-content:center; text-align:center; color:var(--muted); font-size:13px; font-weight:600}
.lside-ring b{font-family:var(--serif); font-size:34px; font-weight:500; color:var(--ink); line-height:1}
.lside-card .row b{font-weight:800}
.jm{justify-self:center; color:#fff; font-weight:800; font-size:13.5px; border-radius:999px; padding:6px 14px; margin-top:4px}
.lshare{background:var(--surface); border-radius:26px; padding:22px; display:grid; gap:12px}
.lshare p{margin:0; color:var(--muted); font-size:14px}
.wa-share{background:#25D366; color:#073B1C; width:100%}
.wa-share svg{width:22px; height:22px}
.wa-share svg path{fill:#073B1C}
.wa-share:hover{transform:translateY(-2px)}
.litems{display:grid; gap:12px}
.lit{display:grid; grid-template-columns:96px 1fr; gap:18px; align-items:center; background:var(--surface); border-radius:24px; padding:12px 20px 14px 12px}
.lit .thumb{width:96px; height:96px; border-radius:18px}
.lit h3{font-family:var(--sans); letter-spacing:0; font-weight:800; font-size:16.5px}
.lit .cp-meta{margin:4px 0 8px}
.lit-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.lit-row .qty{margin:0}
.favb{font-weight:700; font-size:14px; padding:6px 10px; border-radius:999px; color:var(--muted); transition:background .2s, color .2s}
.favb[aria-pressed="true"]{color:#B7791F; background:color-mix(in srgb,#E8A33D 16%,transparent)}
.lbar{height:6px; border-radius:6px; background:var(--bg2); overflow:hidden; margin-top:12px}
.lbar i{display:block; height:100%; border-radius:6px; transition:width .9s var(--ease)}
.lgot{display:block; margin-top:6px; color:var(--muted); font-size:13px; font-weight:600}
.ess{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; background:var(--rosesoft); border-radius:24px; padding:22px 24px; margin-bottom:22px}
.ess p{margin:4px 0 0; color:var(--muted); font-size:14.5px; max-width:52ch}
.lpick{display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px}
.lp{display:grid; gap:6px; font-size:14px; line-height:1.3}
.lp .th{aspect-ratio:1; border-radius:22px; background:var(--tint); display:grid; place-items:center}
.lp .th svg{width:74%; height:74%; transition:transform .5s var(--spring)}
.lp:hover .th svg{transform:scale(1.08) rotate(-4deg)}
.lp small{color:var(--muted); font-weight:600}
.lp button{border-radius:999px; padding:9px 12px; font-weight:700; font-size:13.5px; box-shadow:inset 0 0 0 1.5px var(--ink); transition:background .2s, color .2s}
.lp button:hover{background:var(--ink); color:var(--bg)}
.lp button.in{background:color-mix(in srgb,#3E9B72 14%,transparent); color:#2F7F5C; box-shadow:none}
.lgifts-h{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; background:var(--surface); border-radius:24px; padding:22px 24px; margin-bottom:18px}
.lgifts-h b{display:block; font-family:var(--serif); font-weight:500; font-size:34px}
.lgifts-h span{color:var(--muted)}
.lgifts-h .btn[disabled]{opacity:.4; pointer-events:none}
.lwall{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px}
.lmsg{background:var(--surface); border-radius:22px; padding:18px 20px}
.lmsg header{display:flex; gap:12px; align-items:center}
.lmsg header .av{width:40px; height:40px; flex-shrink:0}
.lmsg header small{display:block; color:var(--muted); font-size:13px}
.lmsg header em{margin-left:auto; font-style:normal; font-weight:800; white-space:nowrap}
.lmsg p{margin:12px 0 0; font-family:var(--serif); font-size:16.5px}

/* Page des invités */
.lguest{padding-bottom:90px}
.lg-hero{background:var(--tint); text-align:center; padding:0 0 44px; margin-bottom:34px; overflow:hidden}
.lg-hero .garl{height:80px; margin-bottom:10px}
.lg-hero small{font-weight:700; color:var(--muted)}
.lg-hero h1{font-size:clamp(56px,9vw,120px); line-height:1; margin:6px 0 10px; animation:rise .9s var(--ease) both}
.lg-hero > .wrap > p{color:var(--muted); font-size:18px; margin:0 0 16px}
.lg-hero .jm{display:inline-block; background:var(--accent)}
.lg-hero blockquote{font-family:var(--serif); font-size:clamp(18px,2vw,22px); max-width:40ch; margin:22px auto 0}
.lg-prog{max-width:560px; margin:30px auto 0; text-align:left; background:var(--surface); border-radius:22px; padding:16px 20px}
.lg-prog-t{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:14.5px}
.lg-prog-t span{color:var(--muted)}
.lg-prog .meter i{transition:width 1.4s var(--ease)}
.lg-bar{display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px}
.cur{display:inline-flex; background:var(--bg2); border-radius:999px; padding:4px}
.cur button{padding:8px 16px; border-radius:999px; font-weight:700; font-size:14px; color:var(--muted); transition:background .25s, color .25s}
.cur button[aria-pressed="true"]{background:var(--ink); color:var(--bg)}
.eurnote{color:var(--muted); font-size:13.5px; margin:0 0 14px}
.lg-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:22px; margin:10px 0 60px}
.lg-card{position:relative; display:flex; flex-direction:column; background:var(--surface); border-radius:28px; overflow:hidden; animation:pageIn .5s var(--ease) backwards}
.lg-card:nth-child(2){animation-delay:.05s} .lg-card:nth-child(3){animation-delay:.1s} .lg-card:nth-child(4){animation-delay:.15s} .lg-card:nth-child(n+5){animation-delay:.2s}
.lg-card .th{aspect-ratio:1.25; background:var(--tint); display:grid; place-items:center}
.lg-card .th svg{width:62%; height:auto; transition:transform .6s var(--spring)}
.lg-card:hover .th svg{transform:scale(1.08) rotate(-4deg)}
.lg-card.full .th{filter:grayscale(.6); opacity:.7}
.lg-card .tag{top:12px; left:12px}
.lg-meta{padding:18px 20px 20px; display:flex; flex-direction:column; flex:1}
.lg-meta > b{font-size:16.5px; line-height:1.3}
.lg-meta > small{color:var(--muted); font-size:13.5px; margin-top:3px}
.lg-price{font-weight:800; font-size:18px; margin-top:8px}
.lg-act{display:flex; gap:8px; margin-top:auto; padding-top:16px}
.lg-act .btn{flex:1; padding:12px 14px}
.lg-act .btn[disabled]{opacity:.5}
.lg-pot .th{position:relative; background:var(--tint)}
.lg-pot .th .garl{position:absolute; top:0; left:0; height:50px}
.lg-pot .th span{font-size:64px; animation:hover 5s ease-in-out infinite}
.lg-wall{margin-bottom:50px}
.lg-wall h2{font-size:clamp(28px,3.4vw,42px); margin-bottom:20px}
.lg-how{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:40px}
.lg-how div{border:1.5px solid var(--line); border-radius:24px; padding:22px}
.lg-how i{font-style:normal; font-size:24px}
.lg-how b{display:block; margin:6px 0 4px}
.lg-how p{margin:0; color:var(--muted); font-size:14.5px}
.lg-own{text-align:center; color:var(--muted)}
.lg-own p{margin:0 0 12px}

/* Fenêtre de cadeau */
.gift{padding:40px 36px 30px; display:grid; gap:18px}
.gift-h{display:grid; grid-template-columns:84px 1fr; gap:16px; align-items:center; padding-right:40px}
.gift-h .thumb{width:84px; height:84px; border-radius:20px; background:var(--tint); display:grid; place-items:center}
.gift-h .thumb svg{width:82%; height:82%}
.gift-h small{color:var(--muted); font-weight:700}
.gift-h h2{font-size:28px; margin:2px 0}
.gift-h span{color:var(--muted); font-size:14px}
.gift .ff .lab{margin:0}
.gift .qty{margin:0}
.gift .qty button{width:42px; height:42px}
.amts{display:flex; gap:8px; flex-wrap:wrap}
.gift input,.gift textarea{border:1.5px solid var(--line); background:var(--surface); border-radius:14px; padding:12px 14px; outline:none; font:inherit; color:inherit; width:100%}
.gift textarea{resize:vertical}
.gift input:focus,.gift textarea:focus{border-color:var(--accent)}
.gift .btn-dark{background:var(--ink)}
.gnote{margin:0; text-align:center; color:var(--muted); font-size:13.5px}
.gift-ok{text-align:center; padding:0 36px 44px; background:linear-gradient(var(--tint), var(--bg) 60%)}
.gift-ok .garl{margin:0 -36px 10px; width:calc(100% + 72px); height:60px}
.gift-ok .okc{width:110px; height:110px}
.gift-ok h2{font-size:36px; margin:12px 0 10px}
.gift-ok p{color:var(--muted); max-width:40ch; margin:0 auto 24px}

@media (max-width:1080px){
  .lcreate,.lman{grid-template-columns:1fr}
  .lprev,.lside{position:static}
  .lperks{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .lband-in,.lhero-in{grid-template-columns:1fr; padding:14px 26px 36px}
  .lband{border-radius:32px}
  .wa-mock{margin:0 auto; transform:none}
  .lhero-art{height:240px}
  .lhero-art span{width:110px; height:110px}
  .lg3{width:130px !important; height:130px !important}
  .lsteps,.lg-how{grid-template-columns:1fr}
  .lfind{grid-template-columns:1fr; padding:28px 24px}
}
@media (max-width:640px){
  .lperks{grid-template-columns:1fr}
  .lit{grid-template-columns:72px 1fr; padding:10px 14px 12px 10px}
  .lit .thumb{width:72px; height:72px}
  .gift{padding:34px 20px 24px}
  .lg-grid{grid-template-columns:1fr 1fr; gap:12px}
  .lg-meta{padding:14px}
  .lg-act{flex-direction:column}
  .lg-meta > b{font-size:15px}
}
@media (prefers-reduced-motion:reduce){ .wa-msg{opacity:1; transform:none} }
.lshare input{text-transform:none; font-size:13px}
@media (max-width:640px){ .lg-price{font-size:15.5px} .lg-meta > small,.lgot{font-size:12.5px} }

/* Icônes au trait (remplacent les émojis) */
.lperks i,.lg-how i{display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:var(--rosesoft); color:var(--rose-ink)}
.lperks i .ico,.lg-how i .ico{width:24px; height:24px}
.addlist{display:inline-flex; align-items:center; gap:7px}
.favb{display:inline-flex; align-items:center; gap:6px}
.favb .ico{width:15px; height:15px}
.lg-card .th .th-ic{color:var(--accent,var(--rose)); position:relative}
.lg-card .th .th-ic .ico{width:64px; height:64px}
.gift-h .thumb-ic{color:var(--accent,var(--rose))}
.gift-h .thumb-ic .ico{width:40px; height:40px}
.lgot .ico,.lin .ico{width:15px; height:15px}

/* Tontine bébé */
.ton-art{position:relative; height:280px}
.ton-art span{position:absolute; width:120px; height:120px; border-radius:32px; background:var(--surface); display:grid; place-items:center; box-shadow:var(--shadow); color:#B7791F; animation:hover 6s ease-in-out infinite}
.ton-art span .ico{width:52px; height:52px}
.ton-art .tg0{left:10%; top:6%} .ton-art .tg1{left:52%; top:22%; animation-delay:-2s} .ton-art .tg2{left:24%; top:56%; width:140px; height:140px; animation-delay:-4s}
.tonv{max-width:860px}
.tonv h1{margin:14px 0 6px}
.tprog{background:var(--surface); border-radius:20px; padding:18px 20px; margin:20px 0; display:grid; gap:10px}
.tprog-t{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap}
.tprog-t b{font-size:20px}
.tprog-t span,.tprog small{color:var(--muted)}
.tdots{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.tdots span{position:relative; width:46px; height:46px; border-radius:14px; background:var(--bg2); display:grid; place-items:center; color:#fff}
.tdots span.ok{background:#3E9B72}
.tdots span.wait{background:#E8A33D}
.tdots span .ico{width:18px; height:18px}
.tdots small{position:absolute; bottom:-17px; left:50%; transform:translateX(-50%); font-size:10.5px; color:var(--muted); white-space:nowrap}
.tdots{padding-bottom:16px}
.tpay{display:grid; gap:12px; margin-top:22px; max-width:520px}
.tmembers{display:grid; gap:12px}
.tmembers > div{background:var(--surface); border-radius:18px; padding:14px 16px}
.tm-h{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.tm-h .av{width:34px; height:34px; border-radius:50%; background:var(--sand); display:grid; place-items:center; font-weight:800}
.tm-h small{color:var(--muted)}
.tonv .stepbox h2 i .ico{width:15px; height:15px}
.tonban{display:flex; align-items:center; gap:16px; padding:18px 22px; border-radius:24px; background:var(--sand); text-decoration:none; margin-bottom:40px}
.tonban > span{width:52px; height:52px; border-radius:16px; background:var(--surface); display:grid; place-items:center; color:#B7791F; flex:none}
.tonban > span .ico{width:26px; height:26px}
.tonban div{flex:1}
.tonban b{display:block; font-size:17px}
.tonban small{color:var(--muted); font-size:14.5px}
.tonban em{font-style:normal; font-weight:800}
@media (max-width:640px){.tonban{flex-wrap:wrap} .ton-art{height:200px}}

/* Tontine bébé : illustration, accueil, page */
.tmock{background:var(--surface); border-radius:26px; padding:20px; box-shadow:var(--shadow); display:grid; gap:12px; max-width:400px; width:100%; margin-inline:auto}
.tmock .av{width:36px; height:36px; flex:none; border-radius:50%; background:var(--sand); display:grid; place-items:center; font-weight:800; font-size:14px}
.tmock-h{display:flex; align-items:center; gap:10px}
.tmock-h > div{flex:1; min-width:0}
.tmock-h b{display:block; font-size:15px}
.tmock-h small,.tmock-amt small,.tmock li small{color:var(--muted); font-size:12.5px}
.tmock-live{font-size:12px; font-weight:800; color:#2F7F5C; background:color-mix(in srgb,#3E9B72 14%,transparent); padding:4px 10px; border-radius:99px}
.tmock-amt b{display:block; font-family:var(--serif); font-size:30px; font-weight:500; line-height:1.1}
.tmock-bar{height:10px; border-radius:99px; background:var(--bg2); overflow:hidden}
.tmock-bar i{display:block; width:76%; height:100%; border-radius:99px; background:#E8A33D}
.tmock ul{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.tmock li{display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:14px; background:var(--bg)}
.tmock li > span:nth-child(2){flex:1; min-width:0}
.tmock li b{display:block; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tmock li em{font-style:normal; font-weight:800; font-size:13px; white-space:nowrap}
.tmock-m{display:flex; gap:3px}
.tmock-m i{width:9px; height:9px; border-radius:3px; background:var(--line)}
.tmock-m i.ok{background:#3E9B72}
.tmock-f{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:#8A5A00; background:#FBEBC8; border-radius:12px; padding:10px 12px}
.tmock-f .ico{width:18px; height:18px; flex:none}
.ton-visual{display:grid; place-items:center; padding:10px 0 20px}
.ton-visual .tmock{transform:rotate(2deg)}
.tperks i{display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:var(--sand); color:#B7791F}
.tcreate{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:24px; align-items:start; margin-bottom:60px}
.tcreate .stepbox{margin:0}
.tcalc{position:sticky; top:110px; background:var(--sand); border-radius:28px; padding:26px; display:grid; gap:12px}
.tcalc h3{font-size:24px}
.tcalc p{margin:0}
.tcalc input[type=range]{width:100%; accent-color:#E8A33D}
.tcalc-r{display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid color-mix(in srgb,var(--ink) 10%,transparent)}
.tcalc-t{background:var(--surface); border-radius:18px; padding:16px 18px; margin-top:6px}
.tcalc-t small{display:block; color:var(--muted); font-weight:600}
.tcalc-t b{display:block; font-family:var(--serif); font-weight:500; font-size:36px; line-height:1.15}
.tcalc-eq{font-size:13px; color:var(--muted)}
@media (max-width:1000px){.tcreate{grid-template-columns:1fr} .tcalc{position:static}}
@media (max-width:900px){.tband-in{grid-template-columns:1fr; padding:30px 24px} .tband-art{order:2}}

/* Page publique de la liste : parents, date et compte à rebours bien séparés */
.lg-meta{display:grid; justify-items:center; gap:8px; margin:4px 0 6px}
.lg-meta p{margin:0}
.lg-by{font-size:19px; color:var(--ink)}
.lg-by b{font-weight:800}
.lg-date{display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:16px}
.lg-date .ico{width:17px; height:17px}
.lg-hero .lg-meta .jm{margin-top:10px}
@media (max-width:640px){ .lg-by{font-size:17px} .lg-date{font-size:15px} }

/* Création de liste : « Aperçu en direct » façon mini page */
.lprev-lab{display:flex; align-items:center; gap:12px; margin-bottom:14px; font-weight:400; color:inherit}
.lprev-lab > span{flex:none; width:40px; height:40px; border-radius:14px; background:var(--rosesoft); color:var(--rose-ink); display:grid; place-items:center}
.lprev-lab > span .ico{width:19px; height:19px}
.lprev-lab b{display:block; font-size:15.5px}
.lprev-lab small{display:block; color:var(--muted); font-size:13px}
.lprev-win{background:var(--surface); border-radius:26px; box-shadow:var(--shadow); overflow:hidden}
.lprev-bar{display:flex; align-items:center; gap:6px; padding:10px 14px; border-bottom:1px solid var(--line)}
.lprev-bar i{width:9px; height:9px; border-radius:50%; background:var(--line2,#ddd)}
.lprev-bar i:nth-child(1){background:#EE8A7A} .lprev-bar i:nth-child(2){background:#F2C07E} .lprev-bar i:nth-child(3){background:#8FC7A6}
.lprev-bar span{flex:1; min-width:0; margin-left:8px; background:var(--bg2); border-radius:99px; padding:4px 12px; font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lprev-card{border-radius:0; padding:0 22px 22px}
.lprev-card .garl{margin:0 -22px 8px; width:calc(100% + 44px); height:46px}
.lprev-card b{font-size:40px; margin:2px 0 8px; overflow-wrap:anywhere}
.lprev-meta{display:grid; justify-items:center; gap:4px}
.lprev-meta p{margin:0; font-size:14px; color:var(--ink)}
.lprev-meta p.d{display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:13px}
.lprev-meta p.d .ico{width:14px; height:14px}
.lprev-meta p.ph{color:var(--muted); opacity:.75; font-style:italic}
.lprev-meta em{display:inline-block; font-style:normal; color:#fff; background:var(--accent); font-weight:800; font-size:12.5px; border-radius:999px; padding:4px 12px; margin-top:8px}
.lprev-card q{font-size:15px; margin-top:12px}
.lprev-prog{background:var(--surface); border-radius:14px; padding:10px 12px; margin-top:16px; text-align:left; display:grid; gap:6px}
.lprev-prog span{font-size:12px; font-weight:700}
.lprev-prog i{height:6px; border-radius:9px; background:var(--bg2)}
.lprev-items{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:14px}
.lprev-items span{display:grid; gap:5px}
.lprev-items i{aspect-ratio:1; border-radius:12px; background:var(--bg2)}
.lprev-items b{height:6px; border-radius:6px; background:var(--bg2)}
.lprev-items b:last-child{width:60%}
.lprev-note{margin:10px 2px 0; font-size:13px; color:var(--muted); text-align:center}
@media (max-width:1080px){ .lprev{margin:6px 0 4px; max-width:440px; width:100%} }
.lprev-card .garl,.lside-card .garl,.gift-ok .garl{max-width:none}