/* Question pages: "Print every card" (.qpf), the big-type read-aloud view (.qpr) and the printed card set (.qps sheets of
   .qpc cards). Every deck has its own colour; the sheets use named pages so US Letter and A4 print at their real size. */
:where(.qps,.qpr){--c:#7d2a52;--t:#f6ebf1}
:is(.qps,.qpr)[data-deck=couples]{--c:#9c2f5c;--t:#fbe8ef}:is(.qps,.qpr)[data-deck=first-date]{--c:#b0442a;--t:#fcece5}:is(.qps,.qpr)[data-deck=family]{--c:#2d7546;--t:#e4f2e9}
:is(.qps,.qpr)[data-deck=funny]{--c:#9a5a00;--t:#fff0d2}:is(.qps,.qpr)[data-deck=hard]{--c:#3b3a8f;--t:#ebebf8}:is(.qps,.qpr)[data-deck=kids]{--c:#1a69a8;--t:#e2eff9}
:is(.qps,.qpr)[data-deck=teens]{--c:#6a3db5;--t:#efe8fc}:is(.qps,.qpr)[data-deck=office]{--c:#0f6b6b;--t:#dff2f1}:is(.qps,.qpr)[data-deck=halloween]{--c:#b0480b;--t:#fdebdc}
:is(.qps,.qpr)[data-deck=harvest]{--c:#8c4815;--t:#f8ead9}:is(.qps,.qpr)[data-deck=christmas]{--c:#a3232e;--t:#fae6e7}:is(.qps,.qpr)[data-deck=baby-shower]{--c:#286c7d;--t:#e1f1f5}
:is(.qps,.qpr)[data-deck=bridal-shower]{--c:#8c3a68;--t:#f8e6ef}:is(.qps,.qpr)[data-deck=this-or-that]{--c:#7d2a52;--t:#f6ebf1}:is(.qps,.qpr)[data-deck=this-or-that-couples]{--c:#bb3b59;--t:#fdebee}
:is(.qps,.qpr)[data-deck=this-or-that-work]{--c:#2d5a92;--t:#e5edf8}:is(.qps,.qpr)[data-deck=this-or-that-food]{--c:#ad3a20;--t:#fde9e3}

/* Print every card: a second panel inside the print section, under the free sample */
.qpf{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:32px 56px;align-items:center;margin-top:16px;padding-top:44px;border-top:1px solid #cfe2d7}
.qpf-art{margin:0;border-radius:20px;overflow:hidden;aspect-ratio:3/2;background:#fff;box-shadow:0 26px 50px -30px rgba(32,27,56,.55)}
.qpf-art img{width:100%;height:100%;object-fit:cover}
.qpf h3{font-size:clamp(24px,2.3vw,32px);line-height:1.1;letter-spacing:-.025em;margin:0 0 12px}
.qpf-copy>p{font-size:16px!important;line-height:1.6;color:#3b3650;margin:0 0 18px}
.qpf .um{margin:0;max-width:none}
.qpf-form{display:grid;gap:16px}
.qpf-form[hidden],.qpf-gate[hidden]{display:none}
.qpf-field{display:grid;gap:6px;font-weight:700;font-size:14.5px}
.qpf-field select{min-height:48px;border-radius:12px;border:1px solid #b9b3c7;background:#fff;color:var(--ink);font:inherit;font-weight:600;padding:8px 12px;max-width:100%}
.qpf-opts{display:flex;flex-wrap:wrap;gap:10px 22px;border:0;margin:0;padding:0;min-width:0}
.qpf-opts legend{font-weight:700;font-size:14.5px;padding:0;margin-bottom:6px;width:100%}
.qpf-opts label{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px;cursor:pointer}
.qpf-opts input{width:20px;height:20px;accent-color:#2d7546;margin:0}
.qpf-acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.qpf-acts .button{min-height:52px}
.qpf .qpf-read{background:#fff;color:var(--ink);border-color:var(--ink)}
.qpf-status{min-height:1.5em;margin:0!important;font-size:14.5px!important;color:#2f4a3c!important}
.qpf-field select:focus-visible,.qpf-opts input:focus-visible{outline:3px solid #2d7546;outline-offset:2px}
@media (max-width:900px){.qpf{grid-template-columns:minmax(0,1fr);padding-top:32px;gap:22px}}
@media (max-width:600px){.qpf-acts .button{width:100%}}

/* Read aloud: one card at a time in big type for a TV or a tablet, or the whole deck as a list */
.qpr{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--c);color:#fff;font-family:var(--body,DM,Arial,sans-serif)}
.qpr[open]{display:flex;flex-direction:column}
.qpr::backdrop{background:rgba(20,12,24,.6)}
.qpr-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px clamp(16px,3vw,32px)}
.qpr-title{margin:0;font-size:16px;font-weight:600}.qpr-title b{font-family:var(--display,Manrope,Arial,sans-serif);font-size:19px;margin-right:8px}
.qpr-tools{display:flex;flex-wrap:wrap;gap:8px}
.qpr button{min-height:44px;min-width:44px;border-radius:99px;border:1.5px solid rgba(255,255,255,.7);background:transparent;color:#fff;font:inherit;font-weight:700;font-size:15px;padding:8px 16px;cursor:pointer}
.qpr button[aria-pressed=true]{background:#fff;color:var(--c);border-color:#fff}
.qpr button:hover{background:rgba(255,255,255,.14)}.qpr button[aria-pressed=true]:hover{background:#fff}
.qpr button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.qpr-stage{flex:1;display:grid;place-items:center;padding:8px clamp(16px,4vw,48px);min-height:0;overflow:auto}
.qpr-card{width:min(100%,1100px);background:#fff;color:#201b38;border-radius:clamp(20px,3vw,36px);padding:clamp(22px,4vw,56px);box-shadow:0 30px 70px -30px rgba(0,0,0,.55)}
.qpr-ask{margin:0 0 clamp(14px,2.4vw,30px);font-family:var(--display,Manrope,Arial,sans-serif);font-weight:800;color:var(--c);font-size:clamp(22px,3vw,40px);letter-spacing:-.02em}
.qpr-opts{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(10px,2vw,28px);align-items:stretch}
.qpr-opt{margin:0;display:flex;flex-direction:column;gap:12px;padding:clamp(16px,2.4vw,32px);border-radius:clamp(14px,2vw,24px);background:var(--t);font-family:var(--display,Manrope,Arial,sans-serif);font-weight:800;font-size:clamp(22px,3.6vw,52px);line-height:1.15;letter-spacing:-.02em;overflow-wrap:anywhere}
.qpr-opt--b{background:#f2f0f6}
.qpr-opt i{font-style:normal;display:inline-grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;border:2px solid var(--c);color:var(--c);font-size:.42em}
.qpr-or{align-self:center;margin:0;font-weight:800;font-size:clamp(16px,1.8vw,24px);color:#6c6178}
.qpr-after{margin:clamp(14px,2.4vw,30px) 0 0;font-size:clamp(16px,1.9vw,26px);color:#4a3f55}.qpr-after b{color:#201b38}
.qpr-nav{display:flex;justify-content:center;gap:14px;padding:14px 16px 22px}
.qpr-nav button{min-width:150px;font-size:17px;padding:12px 24px}
.qpr-nav button:last-child{background:#fff;color:var(--c);border-color:#fff}
.qpr-list{flex:1;overflow:auto;margin:0;padding:8px clamp(16px,4vw,56px) 40px clamp(48px,7vw,96px);font-size:clamp(20px,2.4vw,32px);line-height:1.35}
.qpr-list[hidden],.qpr-stage[hidden],.qpr-nav[hidden]{display:none}
.qpr-list h3{font-family:var(--display,Manrope,Arial,sans-serif);font-size:.8em;margin:1.2em 0 .4em -1.4em;color:#fff}
.qpr-list ol{margin:0;padding:0}.qpr-list li{padding:.35em 0 .35em .35em;border-bottom:1px solid rgba(255,255,255,.25)}
.qpr-list li::marker{font-size:.7em;font-weight:800}
.qpr-list b{font-weight:800}
@media (max-width:700px){.qpr-opts{grid-template-columns:minmax(0,1fr)}.qpr-or{justify-self:center}.qpr-nav button{min-width:0;flex:1}.qpr-title{width:100%}}

/* The printed set. Fronts and backs share one geometry, so backs line up when printed double-sided. */
@page qpf-letter{size:8.5in 11in;margin:0}
@page qpf-a4{size:210mm 297mm;margin:0}
@media screen{.qpf-out{display:none}}
@media print{
 body.qpf-printing{margin:0!important;padding:0!important;background:#fff!important}
 body.qpf-printing>*:not(.qpf-out){display:none!important}
 body:not(.qpf-printing) .qpf-out{display:none}
}
.qps{page:qpf-letter;box-sizing:border-box;width:215.9mm;height:279mm;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;break-after:page;page-break-after:always;font-family:var(--body,DM),Arial,sans-serif;color:#201b38;background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.qps[data-paper=a4]{page:qpf-a4;width:210mm;height:296.5mm}
.qps:last-child{break-after:auto;page-break-after:auto}
.qps *{box-sizing:border-box}
.qps-head,.qps-foot{width:178mm;display:flex;justify-content:space-between;align-items:baseline;gap:6mm;white-space:nowrap}
.qps-head{height:9mm;margin-bottom:4mm;padding-bottom:2mm;border-bottom:.4mm solid var(--c);font-size:8.5pt;color:#5c5770}
.qps-head b{font-family:var(--display,Manrope),Arial,sans-serif;font-weight:800;font-size:11pt;color:var(--c)}
.qps-foot{height:5mm;margin-top:4mm;font-size:7.5pt;color:#6c6178}
.qps-grid{display:grid;grid-template-columns:repeat(2,89mm);grid-template-rows:repeat(4,58mm);width:178mm;height:232mm}
.qpc{position:relative;display:flex;flex-direction:column;margin:-.15mm;border:.3mm dashed #a49cb2;background:#fff;overflow:hidden}
.qpc-blank{border-color:transparent}
.qpc-top{display:flex;align-items:center;justify-content:space-between;gap:3mm;height:9mm;padding:0 4.5mm;background:var(--t);flex:0 0 auto}
.qpc-top b{font-family:var(--display,Manrope),Arial,sans-serif;font-weight:800;font-size:10pt;letter-spacing:-.01em;color:var(--c)}
.qpc-top span{font-size:7pt;font-weight:700;color:#4a4560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qpc-opts{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1mm;padding:2mm 4.5mm 1mm;min-height:0}
.qpc-opt{display:flex;align-items:flex-start;gap:2.4mm;margin:0;padding:1.6mm 2.4mm;border-radius:2mm;background:var(--t)}
.qpc-opt--b{background:#f3f1f6}
.qpc-opt i{flex:0 0 auto;display:grid;place-items:center;width:5mm;height:5mm;margin-top:.2mm;border-radius:50%;border:.3mm solid var(--c);color:var(--c);font-style:normal;font-size:7pt;font-weight:800}
.qpc-opt span{font-family:var(--display,Manrope),Arial,sans-serif;font-weight:700;font-size:11pt;line-height:1.2;letter-spacing:-.005em;text-wrap:balance}
.qpc--long .qpc-opt span{font-size:9.8pt}
.qpc--tot .qpc-opt{align-items:center;padding:2.2mm 2.6mm}.qpc--tot .qpc-opt span{font-size:14pt;line-height:1.15}
.qpc--tot.qpc--long .qpc-opt span{font-size:12pt}
.qpc-or{margin:0;text-align:center;font-size:7pt;font-weight:800;color:#8a7f95;line-height:1}
.qpc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:3mm;padding:0 4.5mm 2.6mm;flex:0 0 auto}
.qpc-after{font-size:7pt;line-height:1.3;color:#4a4560}.qpc-after b{color:#201b38}
.qpc-n{font-size:6.5pt;font-weight:800;color:var(--c);white-space:nowrap}
.qpc-panel{position:absolute;inset:2.6mm;border-radius:3mm;background-color:var(--c);color:#fff;display:flex;flex-direction:column;padding:5mm 6mm 4mm}
.qpc-cover h2{margin:0;font-family:var(--display,Manrope),Arial,sans-serif;font-weight:800;font-size:19pt;line-height:1.05;letter-spacing:-.02em;color:#fff}
.qpc-kind{margin:1.4mm 0 0;font-size:8.5pt;font-weight:700;color:#fff}
.qpc-how{margin:auto 0 0;padding-left:4.4mm;display:grid;gap:.6mm;font-size:8pt;line-height:1.3}
.qpc-brand{margin:2.4mm 0 0;font-size:6.5pt;font-weight:700;opacity:.9}
.qpc-back .qpc-panel{align-items:center;justify-content:center;text-align:center;gap:1.4mm;background-image:radial-gradient(circle at 1.2mm 1.2mm,rgba(255,255,255,.14) .55mm,transparent .65mm);background-size:4.2mm 4.2mm}
.qpc-back b,.qpc-back span{background:var(--c);padding:0 2.4mm;border-radius:1.5mm}
.qpc-back b{font-family:var(--display,Manrope),Arial,sans-serif;font-weight:800;font-size:17pt;letter-spacing:-.02em;line-height:1.05}
.qpc-back span{font-size:9pt;font-weight:700}
.qpc-back small{position:absolute;bottom:3.6mm;left:0;right:0;font-size:6.5pt;font-weight:700;opacity:.9}
