/* caixinha-natal.css — /caixinha-de-natal/ on top of /assets/polyatic.css: the warm stage (the
   cutting-mat green of the site with a lamp glow, as on the gift box pages), the frases, the key
   type buttons and the Pix status line. Tokens only; light and dark come from polyatic.css. */
.cxn-head .sub{margin-bottom:.875rem}
.duo.cxn-duo>.pane-result{position:static}
@media(min-width:900px){.duo.cxn-duo>.pane-result{position:sticky;top:1rem}}
.cxn-stage{background:radial-gradient(120% 80% at 50% 0%,rgba(255,196,120,.16),transparent 60%),linear-gradient(180deg,var(--mat),var(--mat-2));
  color:var(--mat-ink);border-radius:var(--r);padding:.75rem .875rem 1rem;box-shadow:var(--shadow);min-width:0}
.cxn-stage h2{font-family:var(--mono);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.07em;color:var(--mat-muted);margin:0 0 .5rem;text-align:center}
.cxn-stage .modes{max-width:24rem;margin:0 auto .625rem;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.cxn-stage .modes button{color:var(--mat-muted)}
.cxn-stage .modes button.active{background:var(--mat-ink);color:var(--mat)}
.cxn-paper{line-height:0;display:flex;justify-content:center}
.cxn-paper canvas{display:block;width:100%;max-width:19rem;height:auto;aspect-ratio:210/297;background:#fff;border-radius:2px;
  box-shadow:0 1px 0 rgba(0,0,0,.1),0 18px 40px -16px rgba(0,0,0,.6)}
.cxn-summary{margin:.5rem 0;text-align:center;font-size:.8125rem;color:var(--mat-ink)}
.cxn-dl{display:flex;flex-wrap:wrap;gap:.5rem;max-width:24rem;margin:0 auto}
.cxn-dl .btn{flex:1 1 8rem}
.cxn-dl .btn:disabled{opacity:.55;cursor:wait}
.cxn-stage .btn.ghost{color:var(--mat-ink);border-color:rgba(255,255,255,.4);background:transparent}
.cxn-msg{margin:.5rem 0 0;text-align:center;font-size:.8125rem;color:var(--mat-muted)}
.cxn-msg:empty{display:none}
.cxn-form textarea{min-height:6.5rem;resize:vertical;line-height:1.45}
.cxn-in{display:grid;gap:.3125rem;font-size:.875rem;color:var(--muted)}
.cxn-in input,.cxn-in textarea{color:var(--ink)}
.cxn-count{font-family:var(--mono);font-size:.6875rem;color:var(--muted)}
.cxn-hint{margin:.375rem 0 0;font-size:.8125rem;line-height:1.45;color:var(--muted)}
.cxn-frases-wrap{margin-top:.5rem}
.cxn-frases-wrap>summary{cursor:pointer;font-weight:600;font-size:.875rem;color:var(--accent)}
.cxn-fgroup{margin:.75rem 0 .3125rem;font-family:var(--mono);font-size:.6875rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.cxn-frases{display:grid;gap:.375rem}
.cxn-frases button{text-align:left;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:.625rem;padding:.5rem .625rem;font:inherit;font-size:.8125rem;line-height:1.4;cursor:pointer}
.cxn-frases button:hover{border-color:var(--muted)}
.cxn-frases button[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.cxn-chips{display:flex;flex-wrap:wrap;gap:.375rem}
.cxn-chips button{border:1px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:999px;padding:.375rem .75rem;font:inherit;font-size:.875rem;line-height:1.2;cursor:pointer}
.cxn-chips button:hover{border-color:var(--muted)}
.cxn-chips button.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);font-weight:600}
.cxn-chips button:focus-visible,.cxn-frases button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cxn-pix{border:1px solid var(--line);border-radius:.75rem;padding:.75rem .875rem;background:var(--surface-2)}
.cxn-pix h3{margin:0 0 .25rem;font-size:1rem}
.cxn-pix .grid2{margin-top:.625rem}
.cxn-pixmsg{margin:.625rem 0 0;padding:.5rem .625rem;border-radius:.5rem;font-size:.8125rem;line-height:1.45;border:1px solid var(--line);background:var(--surface)}
.cxn-pixmsg.bad{border-color:var(--bad);color:var(--ink)}
.cxn-pixmsg.bad::before{content:"Sem QR code: ";font-weight:700;color:var(--bad)}
.cxn-pixmsg.ok{border-color:var(--ok)}
.cxn-pixmsg.ok::before{content:"✓ ";font-weight:700;color:var(--ok)}
input[aria-invalid="true"]{border-color:var(--bad)}
.cxn-check{display:flex;gap:.5rem;align-items:center;margin-top:.625rem;font-size:.875rem}
.cxn-spec{font-size:.8125rem;color:var(--muted)}
.cxn-stage [hidden],.cxn-form [hidden]{display:none!important}
@media(max-width:600px){.cxn-paper canvas{max-width:17.5rem}.cxn-paper canvas.land{max-width:100%}}
.cxn-keyhead{margin-top:.625rem}
.cxn-paper canvas.land{max-width:26rem}