/* Modale recette (lecture + pas à pas) : le design de Refontes/design_handoff_recette/recette.css,
   CONFINÉ sous .rz par scripts/recette-ui-css.py (cf. l'en-tête de popotam-recette-ui.js).
   Ne pas éditer à la main : on modifie le script. Les @keyframes sont préfixées rz-. */
.rz *, .rz,.rz *::before,.rz *::after{box-sizing:border-box}
.rz{--card:#fff;--cream:#FFF8EA;--cream2:#FCEFD9;--ink:#2A211B;--ink2:#6A5C4C;--muted:#9C8B79;--line:#F0E5CF;--line2:#EEDFC2;
  --orange:#F0682F;--orange-d:#DA541E;--orange-bg:#FCE3D8;--green:#33A15B;--green-d:#2C8B4E;--green-bg:#E6F3E9;
  --sun:#FFC53D;--sun-d:#F6A609;--sun-bg:#FFF1D2;--pill:999px;
  --fd:"Bricolage Grotesque",system-ui,sans-serif;--fb:"Hanken Grotesk",system-ui,sans-serif;--fh:"Caveat",cursive;
  --spring:cubic-bezier(.3,1.5,.4,1)}
.rz a{color:var(--orange-d)}
.rz a:hover{color:var(--orange)}
.rz button{font:inherit;color:inherit}
.rz .ic svg,.rz button svg{display:block;flex:none}
.rz .ib{flex:none;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line2);background:var(--card);cursor:pointer;display:grid;place-items:center;color:var(--ink2);transition:border-color .2s,color .2s,transform .25s var(--spring)}
.rz .ib:hover{border-color:var(--ink2);color:var(--ink)}
.rz .ib:active{transform:scale(.9)}
.rz .fav.on{background:var(--sun-bg);border-color:var(--sun);color:var(--sun-d)}
.rz .fav.on svg{fill:var(--sun)}
.rz .hx{display:flex;gap:6px}
.rz .kick{display:inline-flex;align-items:center;gap:6px;font:800 11.5px var(--fd);letter-spacing:.13em;text-transform:uppercase;color:var(--orange-d)}
.rz .srv{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--pill);background:var(--cream2);white-space:nowrap}
.rz .srv button{width:30px;height:30px;border-radius:50%;border:0;background:#fff;cursor:pointer;font:800 16px var(--fd);line-height:1;display:grid;place-items:center}
.rz .srv button:active{transform:scale(.88)}
.rz .srv span{padding:0 8px;font-size:13px;color:var(--ink2);font-weight:700}
.rz .srv b{color:var(--ink);font-family:var(--fd)}
.rz .tile{flex:none;width:64px;height:64px;border-radius:18px;background:var(--db);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);transform:rotate(-5deg);display:grid;place-items:center}
.rz .tile svg{width:46px;height:46px;overflow:visible}
.rz .nd{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 4px 0 8px;vertical-align:1px}
.rz .nd.p{background:var(--orange)}
.rz .nd.g{background:var(--sun-d)}
.rz .nd.l{background:var(--green)}
.rz .kc{font:800 18px var(--fd)}
.rz .pop{display:none;margin-top:10px;padding:12px 14px;border-radius:16px;background:var(--sun-bg);font-size:13px;color:var(--ink2);animation:rz-popIn .3s var(--spring)}
.rz .pop.on{display:block}
.rz .pop p{margin:6px 0 0;line-height:1.45;text-wrap:pretty}
.rz .pop .nl{font-size:13px;color:var(--ink)}
@keyframes rz-popIn{from{opacity:0;transform:translateY(-6px)}}
.rz .cb{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid var(--line2);background:#fff;display:grid;place-items:center;color:#fff;transition:.3s var(--spring)}
.rz .cb svg{opacity:0;transform:scale(.3);transition:.3s var(--spring)}
.rz li.ok > .cb{background:var(--green);border-color:var(--green)}
.rz li.ok > .cb svg{opacity:1;transform:none}
.rz .ra{height:100%;display:flex;flex-direction:column}
.rz .ra-h{position:relative;display:flex;gap:16px;padding:22px 22px 16px;border-bottom:1.5px dashed var(--line2)}
.rz .ra-h .w{flex:1;min-width:0}
.rz .ra-h h2{margin:4px 0 8px;font:800 24px var(--fd);letter-spacing:-.02em;line-height:1.12;text-wrap:balance}
.rz .ra-h .meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--ink2);font-weight:700}
.rz .ra-h .meta > span:first-child{display:inline-flex;align-items:center;gap:5px}
.rz .nut{display:inline-flex;align-items:center;gap:5px;min-height:34px;padding:0 6px 0 10px;border-radius:var(--pill);border:0;background:var(--sun-bg);cursor:pointer;font:700 13px var(--fb);color:#8A5A00}
.rz .nut i{width:20px;height:20px;border-radius:50%;background:#fff;display:grid;place-items:center;font:800 11px var(--fd);font-style:normal}
.rz .ra-b{flex:1;min-height:0;display:grid;grid-template-columns:300px minmax(0,1fr)}
.rz .ra-l{overflow:auto;padding:18px 18px 18px 22px;background:var(--cream);display:flex;flex-direction:column;gap:14px;scrollbar-width:thin}
.rz .ra-r{overflow:auto;padding:18px 22px 22px;scrollbar-width:thin}
.rz .lh{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.rz .lh b{font:800 17px var(--fd)}
.rz .lh span{font-size:12.5px;color:var(--muted);font-weight:700}
.rz .ings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.rz .ings li{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px 0 10px;border-radius:14px;background:#fff;cursor:pointer;font-size:14.5px;transition:background .2s}
.rz .ings li .nm{flex:1;min-width:0}
.rz .ings li b{font-family:var(--fd);font-weight:800;white-space:nowrap}
.rz .ings li.ok{background:transparent}
.rz .ings li.ok .nm,.rz .ings li.ok b{color:var(--muted);text-decoration:line-through}
.rz .tools{font-size:13px;color:var(--ink2);line-height:1.5}
.rz .tools .tl{display:block;font:800 11px var(--fd);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.rz .cart{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:var(--pill);border:1.5px solid var(--line2);background:#fff;cursor:pointer;font:800 13.5px var(--fd);margin-top:auto}
.rz .cart:hover{border-color:var(--orange);color:var(--orange-d)}
.rz .steps{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;counter-reset:s}
.rz .steps li{position:relative;display:flex;gap:14px;padding:10px 0 12px}
.rz .steps li:not(:last-child)::before{content:"";position:absolute;left:17px;top:48px;bottom:-6px;width:2px;background:var(--line2)}
.rz .steps .n{flex:none;position:relative;z-index:1;width:36px;height:36px;border-radius:50%;border:2px solid var(--orange);background:#fff;color:var(--orange-d);font:800 15px var(--fd);cursor:pointer;display:grid;place-items:center;transition:.3s var(--spring)}
.rz .steps .n:hover{background:var(--orange-bg)}
.rz .steps li.ok .n{background:var(--green);border-color:var(--green);color:#fff}
.rz .steps li > div{flex:1;min-width:0;padding-top:5px}
.rz .steps .st{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.rz .steps .st b{font:800 16px var(--fd)}
.rz .steps .st span{font-size:12.5px;color:var(--muted);font-weight:700;white-space:nowrap}
.rz .steps p{margin:5px 0 0;font-size:15px;line-height:1.55;color:var(--ink2);text-wrap:pretty}
.rz .steps p b{color:var(--ink);font-weight:800}
.rz .steps li.ok p,.rz .steps li.ok .st b{color:var(--muted)}
.rz .steps li.ok .tip{display:none}
.rz .tip{display:flex;gap:9px;align-items:flex-start;margin-top:10px!important;padding:10px 12px;border-radius:14px;background:var(--sun-bg);color:#6B4400!important;font-size:14px!important}
.rz .tip .pp{flex:none;width:26px;height:26px;border-radius:9px;background:var(--sun);color:#5A3A05;display:grid;place-items:center;transform:rotate(-5deg)}
.rz .ra-f{display:flex;align-items:center;gap:8px;padding:12px 18px;border-top:1.5px solid var(--line)}
.rz .ra-f .sp{flex:1}
.rz .go{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:var(--pill);border:0;background:var(--orange);color:#fff;font:800 15px var(--fd);cursor:pointer;box-shadow:0 3px 0 var(--orange-d);white-space:nowrap;transition:transform .25s var(--spring)}
.rz .go svg{stroke:#fff}
.rz .go:active{transform:translateY(2px)}
.rz .alt{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 15px;border-radius:var(--pill);border:1.5px solid var(--line2);background:#fff;cursor:pointer;font:700 13.5px var(--fb);white-space:nowrap}
.rz .alt:hover{border-color:var(--ink2)}
.rz .glass{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.35);color:#fff;backdrop-filter:blur(8px)}
.rz .glass:hover{background:rgba(255,255,255,.32);color:#fff;border-color:#fff}
.rz .glass.fav.on{background:var(--sun);border-color:var(--sun);color:#6B4400}
.rz .glass.fav.on svg{fill:#fff}
.rz .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0 20px 18px;color:#fff}
.rz .cap h2{margin:0 0 10px;font:800 27px var(--fd);letter-spacing:-.025em;line-height:1.08;text-wrap:balance;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.rz .chips{display:flex;gap:6px;flex-wrap:wrap}
.rz .chips span{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 11px;border-radius:var(--pill);background:rgba(255,255,255,.18);backdrop-filter:blur(8px);font-size:13px;font-weight:700;white-space:nowrap}
.rz .chips .veg{background:var(--green)}
.rz .tabs{display:flex;gap:4px;padding:3px;border-radius:var(--pill);background:var(--cream2)}
.rz .tabs button{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border-radius:var(--pill);border:0;background:none;cursor:pointer;font:800 14px var(--fd);color:var(--ink2);white-space:nowrap}
.rz .tabs button small{font:800 11px var(--fd);padding:1px 7px;border-radius:var(--pill);background:rgba(0,0,0,.06)}
.rz .tabs button.on{background:var(--ink);color:#F6EEE3}
.rz .tabs button.on small{background:rgba(255,255,255,.2)}
.rz .kpi{display:grid;grid-template-columns:auto auto 1fr;gap:8px}
.rz .kpi > *{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border-radius:14px;background:#fff;border:1.5px solid var(--line2);font-size:13px;color:var(--ink2);white-space:nowrap}
.rz .kpi b{font:800 17px var(--fd);color:var(--ink)}
.rz .kpi .srv{background:none;padding:0}
.rz .kpi > span:nth-child(2){padding:0 4px}
.rz .kpi button{cursor:pointer;justify-content:center;font:inherit}
.rz .kpi button i{width:20px;height:20px;border-radius:50%;background:var(--sun-bg);display:grid;place-items:center;font:800 11px var(--fd);font-style:normal;color:#8A5A00}
.rz .prog{height:8px;border-radius:4px;background:var(--cream2);margin-top:14px;overflow:hidden}
.rz .prog i{display:block;height:100%;border-radius:4px;background:var(--green);transition:width .6s var(--spring)}
.rz .pl{display:block;margin-top:6px;font-size:12.5px;font-weight:700;color:var(--green-d)}
@media (prefers-reduced-motion:reduce){.rz *, .rz{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.rz .back{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px 0 9px;border-radius:var(--pill);border:0;background:var(--cream2);cursor:pointer;font:700 12.5px var(--fb);color:var(--ink2)}
.rz .back svg{transform:rotate(180deg)}
.rz .back:hover{color:var(--ink)}
.rz .ck .ra-h h2{margin-top:8px}
.rz .ck-prog{display:flex;flex-direction:column;gap:5px}
.rz .ck-prog .bar{display:block;height:8px;border-radius:4px;background:var(--cream2);overflow:hidden}
.rz .ck-prog .bar i{display:block;height:100%;border-radius:4px;background:var(--green);transition:width .6s var(--spring)}
.rz .ck-prog .pl{font-size:13px;font-weight:700;color:var(--green-d)}
.rz .ck-prog .pl b{font-family:var(--fd)}
.rz .seg2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:3px;border-radius:var(--pill);background:#fff;border:1.5px solid var(--line2)}
.rz .seg2 button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;border-radius:var(--pill);border:0;background:none;cursor:pointer;font:800 13.5px var(--fd);color:var(--ink2);white-space:nowrap}
.rz .seg2 button small{font:800 11px var(--fd);padding:0 6px;border-radius:var(--pill);background:var(--orange);color:#fff}
.rz .seg2 button.on{background:var(--ink);color:#F6EEE3}
.rz .tms{display:flex;flex-direction:column;gap:6px}
.rz .tms .empty{margin:0;padding:12px;border-radius:14px;border:1.5px dashed var(--line2);font-size:13px;color:var(--muted);text-wrap:pretty}
.rz .tmc{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:8px;padding:8px 8px 8px 10px;border-radius:16px;background:var(--orange-bg);animation:rz-popIn .35s var(--spring)}
.rz .tmc .ti{width:32px;height:32px;border-radius:10px;background:#fff;color:var(--orange-d);display:grid;place-items:center}
.rz .tmc .tw{min-width:0;display:flex;flex-direction:column}
.rz .tmc .tw b{font:800 13.5px var(--fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rz .tmc .tw span{font-size:11.5px;color:var(--ink2);font-weight:700}
.rz .tmc .tt{font:800 20px var(--fd);font-variant-numeric:tabular-nums;min-width:3.1em;text-align:right}
.rz .tmc .tb{width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.8);cursor:pointer;display:grid;place-items:center}
.rz .tmc .tb:active{transform:scale(.88)}
.rz .tmc.paused{background:var(--cream2)}
.rz .tmc.paused .tt{color:var(--muted)}
.rz .tmc.over{background:var(--green);color:#fff;grid-template-columns:auto minmax(0,1fr) auto;animation:rz-ring .5s ease-in-out infinite alternate}
.rz .tmc.over .ti{color:var(--green-d)}
.rz .tmc.over .tw span{color:rgba(255,255,255,.85)}
@keyframes rz-ring{from{transform:rotate(-1deg)}to{transform:rotate(1deg)}}
.rz .sg{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.rz .sg .tl{font:800 11px var(--fd);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.rz .sgb{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 8px 0 8px;border-radius:14px;border:1.5px solid var(--line2);background:#fff;cursor:pointer;text-align:left;font:600 13.5px var(--fb)}
.rz .sgb:hover{border-color:var(--orange)}
.rz .sgb .n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--cream2);display:grid;place-items:center;font:800 11.5px var(--fd)}
.rz .sgb .w{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rz .sgb b{flex:none;display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:var(--pill);background:var(--orange-bg);color:var(--orange-d);font:800 12px var(--fd);white-space:nowrap}
.rz .ck-steps li .n{cursor:default}
.rz .ck-steps li.up{opacity:.55}
.rz .ck-steps li.up p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rz .ck-steps li.ok{padding:4px 0 6px;cursor:pointer}
.rz .ck-steps li.ok .st b{text-decoration:line-through;font-weight:700}
.rz .ck-steps li.ok:hover .st b{color:var(--ink2)}
.rz .ck-steps li.cur{padding:14px 16px 16px;margin:4px -8px;border-radius:20px;border:2px solid var(--orange);background:#FFFCF6;box-shadow:0 4px 0 var(--orange-bg)}
.rz .ck-steps li.cur .n{background:var(--orange);color:#fff}
.rz .ck-steps li.cur::before{display:none}
.rz .ck-steps li.cur .st b{font-size:18px}
.rz .ck-steps li.cur p{font-size:16.5px;color:var(--ink2)}
.rz .tstart{display:inline-flex;align-items:center;gap:7px;min-height:44px;margin-top:12px;padding:0 15px;border-radius:var(--pill);border:1.5px solid var(--orange);background:#fff;color:var(--orange-d);cursor:pointer;font:800 13.5px var(--fd)}
.rz .tstart:hover{background:var(--orange-bg)}
.rz .on-t{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13px;font-weight:700;color:var(--orange-d)}
.rz .go.ok{background:var(--green);box-shadow:0 3px 0 var(--green-d)}
.rz .alt[disabled]{opacity:.4;pointer-events:none}
.rz .alt[data-prev] svg{transform:rotate(180deg)}
.rz .back{white-space:nowrap}
.rz .ck-steps .st{flex-wrap:nowrap;align-items:baseline}
.rz .ck-steps .st b{flex:1 1 auto;min-width:0;line-height:1.2}
.rz .ck-steps .st span{flex:none}
.rz .tmc{grid-template-columns:auto minmax(0,1fr) auto auto;grid-template-rows:auto auto;row-gap:6px;align-items:center}
.rz .tmc .ti{grid-row:1/3;align-self:start}
.rz .tmc .tw{grid-column:2/-1;grid-row:1}
.rz .tmc .tw b{white-space:normal;line-height:1.25}
.rz .tmc .tt{grid-column:2;grid-row:2;text-align:left}
.rz .tmc .tb:nth-of-type(1){grid-column:3;grid-row:2}
.rz .tmc .tb:nth-of-type(2){grid-column:4;grid-row:2}
.rz .tmc.over{grid-template-columns:auto minmax(0,1fr) auto}
.rz .tmc.over .tb{grid-column:3}
.rz .seg2{position:relative;isolation:isolate}
.rz .seg2::before{content:"";position:absolute;left:3px;top:3px;bottom:3px;width:calc(50% - 5px);border-radius:var(--pill);background:var(--ink);z-index:-1;transition:transform .42s cubic-bezier(.3,1.35,.45,1)}
.rz .seg2.r::before{transform:translateX(calc(100% + 4px))}
.rz .seg2.noanim::before{transition:none}
.rz .seg2 button{transition:color .25s}
.rz .seg2 button.on{background:none;color:#F6EEE3}
.rz .ra-l{overflow-x:hidden}
@media (prefers-reduced-motion:reduce){.rz .seg2::before{transition:none}}
.rz .am{position:relative;height:100%;display:flex;flex-direction:column;background:#fff}
.rz .am-b{flex:1;min-height:0;overflow:auto;scrollbar-width:none}
.rz .am-b::-webkit-scrollbar{display:none}
.rz .am-h{padding:54px 18px 14px;background:linear-gradient(180deg,var(--cream),#fff)}
.rz .am-h .top{display:flex;align-items:center;justify-content:space-between}
.rz .am-h .ti{display:flex;align-items:center;gap:12px;margin:10px 0 10px}
.rz .tile.sm{width:52px;height:52px;border-radius:15px}
.rz .tile.sm svg{width:36px;height:36px}
.rz .am-h h2{margin:0;font:800 22px var(--fd);letter-spacing:-.02em;line-height:1.12;text-wrap:balance}
.rz .am-h .meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--ink2);font-weight:700}
.rz .am-h .meta > span:first-child{display:inline-flex;align-items:center;gap:5px}
.rz .am-tabs{position:sticky;top:0;z-index:3;padding:10px 18px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1.5px solid var(--line)}
.rz .seg2 small.q{background:rgba(0,0,0,.08);color:inherit}
.rz .seg2 button.on small.q{background:rgba(255,255,255,.22)}
.rz .am-c{padding:14px 18px 22px}
.rz .am-c .ings li{background:var(--cream)}
.rz .am-c .ings li.ok{background:transparent}
.rz .am-c .tools{margin-top:14px}
.rz .am-c .cart{width:100%;margin-top:14px}
.rz .am-c .steps{margin-top:0}
.rz .am-c .steps p{font-size:15px}
.rz .am-n{margin:6px 0 0;font-size:12.5px;color:var(--muted);text-align:center}
.rz .am-f{position:relative;display:flex;align-items:center;gap:8px;padding:10px 14px 26px;border-top:1.5px solid var(--line);background:#fff}
.rz .am-f .go{flex:1;justify-content:center;min-height:52px;font-size:16px}
.rz .am-more{position:absolute;right:14px;bottom:calc(100% + 8px);display:none;flex-direction:column;padding:6px;border-radius:18px;background:#fff;border:2px solid var(--ink);box-shadow:0 5px 0 var(--ink);min-width:210px;animation:rz-popIn .3s var(--spring)}
.rz .am-more.on{display:flex}
.rz .am-more button{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 12px;border:0;border-radius:12px;background:none;cursor:pointer;font:700 14.5px var(--fb);text-align:left}
.rz .am-more button:hover{background:var(--cream)}
.rz .amc-h{padding:54px 16px 12px;background:linear-gradient(180deg,var(--cream),#fff);border-bottom:1.5px solid var(--line)}
.rz .amc-h .top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.rz .amc-h .back{min-height:40px}
.rz .ingb{margin-left:auto;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 13px;border-radius:var(--pill);border:1.5px solid var(--line2);background:#fff;cursor:pointer;font:800 13px var(--fd);white-space:nowrap}
.rz .ingb:hover{border-color:var(--green)}
.rz .am.ck .am-b{padding:14px 16px 16px}
.rz .am.ck .ck-steps{margin:0}
.rz .am.ck .ck-steps li.cur{margin:4px -4px}
.rz .am.ck .ck-steps li.cur p{font-size:17px;line-height:1.55}
.rz .am.ck .tstart{width:100%;justify-content:center}
.rz .dock{display:flex;flex-direction:column;gap:6px;padding:0 12px}
.rz .dock:not(:empty){padding:8px 12px;border-top:1.5px solid var(--line);background:var(--cream)}
.rz .dock .tmc{grid-template-columns:auto minmax(0,1fr) auto auto auto;grid-template-rows:auto;row-gap:0}
.rz .dock .tmc .ti{grid-row:auto;align-self:center}
.rz .dock .tmc .tw{grid-column:auto;grid-row:auto}
.rz .dock .tmc .tw b{white-space:nowrap}
.rz .dock .tmc .tt{grid-column:auto;grid-row:auto;text-align:right}
.rz .dock .tmc .tb:nth-of-type(1),.rz .dock .tmc .tb:nth-of-type(2){grid-column:auto;grid-row:auto}
.rz .dock .tmc.over{grid-template-columns:auto minmax(0,1fr) auto}
.rz .am.ck .am-f .ib[data-prev] svg{transform:rotate(180deg)}
.rz .am.ck .am-f .ib[disabled]{opacity:.35;pointer-events:none}
.rz .isheet{position:absolute;inset:0;z-index:10;pointer-events:none}
.rz .isheet .isb{position:absolute;inset:0;background:rgba(42,33,27,.4);opacity:0;transition:opacity .3s}
.rz .isheet .in{position:absolute;left:0;right:0;bottom:0;max-height:78%;overflow:auto;padding:10px 16px 30px;border-radius:28px 28px 0 0;background:#fff;transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.9,.3,1.04)}
.rz .isheet.on{pointer-events:auto}
.rz .isheet.on .isb{opacity:1}
.rz .isheet.on .in{transform:none}
.rz .isheet .grab{width:44px;height:5px;border-radius:3px;background:var(--line2);margin:0 auto 12px}
.rz .isheet .sh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.rz .isheet .sh b{font:800 18px var(--fd)}
.rz .isheet .ings li{background:var(--cream)}
.rz .isheet .ings li.ok{background:transparent}
.rz .ck-prog{position:relative}
.rz .ck-prog .bar{position:relative;overflow:hidden}
.rz .ck-prog .bar i{position:relative}
.rz .ck-prog .bar.boom{animation:rz-barGlow .9s ease}
@keyframes rz-barGlow{25%{box-shadow:0 0 0 4px rgba(51,161,91,.22),0 0 18px rgba(51,161,91,.55)}}
.rz .ck-prog .bar.boom i::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);animation:rz-barShine .8s .25s ease-out both}
@keyframes rz-barShine{from{left:-40%}to{left:110%}}
.rz .spk{position:absolute;width:8px;height:8px;border-radius:50%;pointer-events:none;z-index:4}
.rz .spk.sq{width:9px;height:5px;border-radius:2px}
.rz .ck-steps .n{position:relative}
.rz .ring-out{position:absolute;inset:-2px;border-radius:50%;border:3px solid var(--green);pointer-events:none}
.rz .ck-steps li.just .st b{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 58%/0 2px no-repeat;animation:rz-strike .45s .15s cubic-bezier(.6,0,.3,1) forwards}
@keyframes rz-strike{to{background-size:100% 2px}}
.rz .ck-steps li.ok .st{justify-content:flex-start}
.rz .ck-steps li.ok .st b{flex:0 1 auto}
.rz .ck-steps li.ok .st span{margin-left:auto}
.rz .ck-steps li.just .st b{display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.rz .ck-steps li.ok .st b{text-decoration:none;display:inline;font-weight:700;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  background:linear-gradient(currentColor,currentColor) 0 58%/100% 1.5px no-repeat}
.rz .ck-steps li.just .st b{background-size:0 1.5px;animation:rz-strike2 .45s .15s cubic-bezier(.6,0,.3,1) forwards}
@keyframes rz-strike2{to{background-size:100% 1.5px}}

/* ===== Intégration dans l'application (ajouts, hors handoff) ===== */
/* La carte : sur grand écran, la planche du handoff (980 px) tenue dans la fenêtre ; au
   téléphone, tout l'écran. Elle remplace .fb-card dans le voile habituel (.fb-overlay). */
.fb-overlay .rz-carte{position:relative;width:min(980px,calc(100vw - 32px));height:min(920px,calc(100vh - 32px));height:min(920px,calc(100dvh - 32px));
  background:var(--card);border-radius:26px;box-shadow:0 30px 60px -24px rgba(42,33,27,.55);overflow:hidden;
  transform:translateY(10px) scale(.98);transition:transform .2s cubic-bezier(.34,1.4,.6,1);font-family:var(--fb);color:var(--ink);line-height:1.4}
.fb-overlay.show .rz-carte{transform:none}
@media (max-width:600px){
.fb-overlay:has(.rz-carte){padding:0}
.fb-overlay .rz-carte{width:100vw;height:100vh;height:100dvh;border-radius:0}
.rz .am-h,.rz .amc-h{padding-top:calc(14px + env(safe-area-inset-top,0px))}
.rz .am-f{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
}
.rz h2{color:var(--ink)}
.rz ol,.rz ul{padding:0}
/* L'étoile est celle de l'appli (la même partout, avec son éclat) : le .fav du handoff ne s'y applique pas. */
.rz .hx .fav{width:44px;height:44px}
/* Le nombre de personnes, FIGÉ pour l'instant (décision de Jérémy, 30/09/2026 : le − / + sera tranché après). */
.rz .srv.fixe span{padding:4px 10px}
/* La photo du plat prend la place de la tuile, à la même taille. */
.rz .tile{padding:0;cursor:default}
.rz button.tile{cursor:zoom-in}
.rz .tile.photo{position:relative;background:var(--cream2);transform:rotate(-3deg)}
.rz .tile.photo img{width:100%;height:100%;object-fit:cover;border-radius:15px;display:block}
.rz .tile .ia{position:absolute;right:-8px;bottom:-8px;padding:1px 5px;border-radius:var(--pill);background:var(--ink);color:#fff;font:800 9px var(--fd);letter-spacing:.04em;transform:rotate(5deg)}
/* Une recette écrite à la main dans l'éditeur : affichée telle quelle, sans pas à pas. */
.rz .recette-riche{margin-top:12px;font-size:15px;line-height:1.55;color:var(--ink2)}
/* Les états d'attente et d'erreur, dans la même carte. */
.rz .rz-etat{height:100%;display:flex;flex-direction:column;justify-content:center;padding:24px;overflow:auto}
.rz .rz-etat .rz-x{position:absolute;top:16px;right:16px}
.rz .rz-etat .btn-row{justify-content:center}
.rz .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Le pied au téléphone : « ··· » s'ouvre au-dessus. */
.rz .am-more button{color:var(--ink)}
/* Un minuteur mesure au moins une minute ; une étape sans durée n'en propose pas. */
.rz .steps .st span:empty{display:none}
/* 44 px pour tout ce qui se touche : la case d'un ingrédient est la LIGNE entière (44 px). */
.rz .ings li{user-select:none;-webkit-tap-highlight-color:transparent}
/* La note d une recette publique ouverte pour un autre foyer (découvertes). */
.rz .rz-note{margin:12px 0 0;padding:10px 12px;border-radius:14px;background:var(--cream2);font-size:13.5px;line-height:1.45;color:var(--ink2)}
/* « Dans mes courses » : le second appui les retire (comme dans le livre). */
.rz .cart.on{border-color:var(--green);background:var(--green-bg);color:var(--green-d)}
@media (prefers-reduced-motion:reduce){.fb-overlay .rz-carte{transition:none}}