/* Queue pause (feature 7, SPEC §7, frames f7-1..f7-8, parts f0-parts): the disc, the band under the drawer's head, the Pause button, the dialogs, the Generate strip and the notes.
   Measures are the frames' (frames/kit/feat.css); tokens only. The one literal is the ring rgba(242,181,74,.55) the SPEC names. Motion: --m-rise, --dur-2..3 only; the paused disc does not pulse. */
/* the top-bar disc, every role */
.qbtn.pz-paused,body:has(#qdrawer[open]) .qbtn.pz-paused{border-color:rgb(var(--p-amber-rgb) / .55);background:var(--amber-soft);color:var(--amber)}
.qbtn.pz-paused .i{color:var(--amber)}
.qbtn.pz-paused .num{background:var(--amber);color:var(--on-amber)}
.qbtn.pz-paused,.qbtn.pz-paused::before,.qbtn.pz-paused::after,.qbtn.pz-paused .num{animation:none}

/* the drawer: the band is one more grid row between the head and the tabs (the body keeps scrolling under it) */
#qdrawer.pz-on{grid-template-rows:auto auto auto minmax(0,1fr)}
#qdrawer.pz-on #q-tabs{grid-row:3}
#qdrawer.pz-on .d-body{grid-row:4}
#qdrawer #pz-btn{margin-left:auto;margin-right:var(--s-1);height:32px;flex:none}
#qdrawer #pz-btn .i{width:var(--icon-md);height:var(--icon-md)}
.pz-band{grid-row:2;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:0 var(--s-3);align-items:start;margin:var(--s-1) var(--s-6) var(--s-3);padding:var(--s-3);border-radius:var(--r-3);background:var(--amber-soft);box-shadow:inset 0 0 0 1px rgb(var(--p-amber-rgb) / .22)}
.pz-band[hidden]{display:none}
.pz-band:not([hidden]){animation:pz-in var(--dur-3) var(--ease) both}
@keyframes pz-in{from{opacity:0;transform:translateY(calc(-1 * var(--m-rise)))}}
.pz-bi{display:grid;place-items:center;width:32px;height:32px;border-radius:var(--r-2);background:var(--amber-soft);color:var(--amber)}
.pz-bi .i{width:var(--icon-lg);height:var(--icon-lg)}
.pz-bt{min-width:0}
.pz-bt b{display:block;font:600 var(--fs-3)/20px var(--font)}
.pz-bt p{margin:0;color:var(--text-2);font:400 var(--fs-2)/18px var(--font)}
.pz-bt q{display:block;margin:var(--s-1) 0 0;color:var(--text);font:400 var(--fs-2)/18px var(--font);quotes:none;overflow-wrap:anywhere}
.pz-band .btn{height:var(--ctl-s)}
.pz-bs{grid-column:2 / 4;display:flex;align-items:center;gap:var(--s-2);margin:var(--s-2) 0 0;padding:var(--s-2) 0 0;border-top:1px solid rgb(var(--p-amber-rgb) / .22);color:var(--text);font:400 var(--fs-2)/18px var(--font)}
.pz-bs .si{cursor:default}
.pz-bs .si .i{width:var(--icon-md);height:var(--icon-md)}
/* the reason line under Waiting, once per section */
.pz-why{display:flex;align-items:center;gap:var(--s-2);margin:var(--s-1) var(--s-2) var(--s-2);color:var(--text-2);font:400 var(--fs-2)/18px var(--font)}
.pz-why .i{flex:none;width:var(--icon-md);height:var(--icon-md);color:var(--text-3)}

/* Generate: the strip above the order bar (f7-8); the grid's last explicit row is the footer's, so the strip takes it and the footer follows in the implicit row */
.pz-gen{display:flex;align-items:center;gap:var(--s-2);margin:0;padding:var(--s-2) var(--s-4) var(--s-2) var(--s-6);border-top:1px solid var(--line);background:var(--amber-soft);color:var(--text);font:400 var(--fs-2)/18px var(--font)}
.pz-gen[hidden]{display:none}
.pz-gen .i,.pz-note .i,.pz-conn .i,.pz-ovall .i{flex:none;width:var(--icon-md);height:var(--icon-md);color:var(--amber)}
.pz-note{display:flex;align-items:flex-start;gap:var(--s-2);margin:var(--s-3) 0 0;padding:var(--s-2) var(--s-3);border-radius:var(--r-2);background:var(--amber-soft);color:var(--text);font:400 var(--fs-2)/18px var(--font)}
.pz-note .i{margin-top:1px}
.pz-conn{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-3);padding:var(--s-2) var(--s-3);border-radius:var(--r-2);background:var(--amber-soft);color:var(--text);font:400 var(--fs-2)/18px var(--font)}
.pz-ovall{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-3);color:var(--text-2);font:400 var(--fs-2)/18px var(--font)}
.ox-act .ic.warn{color:var(--amber)}

/* the dialogs (f7-2, f7-5): no art, at most 400 high */
dialog.pzd{width:min(480px,calc(100vw - 32px));max-height:min(400px,calc(100vh - 32px));padding:0;text-align:left}
dialog.pzd[open]{display:flex;flex-direction:column}
.pz-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);flex:none;height:64px;padding:0 14px 0 var(--s-6)}
.pz-head h2{margin:0;font:600 var(--fs-4)/24px var(--font);text-wrap:balance}
.pz-body{flex:0 1 auto;min-height:0;overflow-y:auto;padding:0 var(--s-6)}
.pz-sub{margin:var(--s-1) 0 0;color:var(--text-2);font:400 var(--fs-3)/20px var(--font)}
.pz-sub.b{margin-top:var(--s-3)}
.pz-rows{margin:var(--s-3) 0 0}
.pz-rows .seg{margin-top:var(--s-2)}
.pz-r{display:grid;grid-template-columns:minmax(0,1fr) 32px 104px;align-items:center;gap:var(--s-2);height:28px;border-bottom:1px solid var(--line);font:400 var(--fs-2)/18px var(--font)}
.pz-r > span:first-child{color:var(--text-2)}
.pz-r .c{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.pz-r .p{color:var(--text);white-space:nowrap}
.pz-field{margin:var(--s-4) 0 0}
.pz-lab2{margin:0 0 var(--s-2);font:600 var(--fs-2)/18px var(--font)}
.pz-lab2.n{margin:var(--s-3) 0 var(--s-2)}
.pz-lab2 small{color:var(--text-3);font-size:var(--fs-2);font-weight:400}
.pz-in{display:block;width:100%;box-sizing:border-box;height:40px;padding:0 var(--s-3);border-radius:var(--r-2);border:1px solid var(--line-strong);background:var(--bg);color:var(--text);font:400 var(--fs-3)/20px var(--font)}
.pz-in::placeholder{color:var(--text-3)}
.pz-in:focus{outline:0;border-color:var(--accent);box-shadow:var(--ring-field)}
.pz-err{display:flex;align-items:flex-start;gap:var(--s-2);margin:var(--s-3) 0 0;color:var(--red);font:400 var(--fs-2)/18px var(--font)}
.pz-err .i{flex:none;width:var(--icon-md);height:var(--icon-md);margin-top:1px}
.pz-foot{display:flex;align-items:center;justify-content:flex-end;gap:var(--s-2);height:72px;padding:0 var(--s-6);flex:none}
.pz-foot .btn{white-space:nowrap}
.pz-foot .btn .i{width:var(--icon-md);height:var(--icon-md)}
.pzd .btn:active:not(:disabled){transform:scale(.97)}
@media (prefers-reduced-motion:reduce){.pz-band:not([hidden]){animation:none}}
