/* Poster Studio — framed, curved, branded poster pages */
.poster-section{padding-top:1.5rem}
.poster-wrap{max-width:100%}
.poster-wrap.is-port{max-width:660px;margin:0 auto}
.poster-wrap.is-land{max-width:1100px;margin:0 auto}
.poster-frame{position:relative;padding:12px;border-radius:38px;background:linear-gradient(135deg,var(--gold),#ffe680 22%,var(--green) 55%,var(--blue) 100%);box-shadow:0 22px 50px rgba(11,42,111,.28),0 4px 12px rgba(11,42,111,.18)}
.poster-frame:before{content:"";position:absolute;inset:5px;border-radius:34px;border:2px solid rgba(255,255,255,.55);pointer-events:none}
.poster-frame svg{display:block;width:100%;height:auto;border-radius:27px;background:#071a4a}
.poster-dims{margin:.9rem 0 .5rem;text-align:center;color:var(--muted);font-size:.8rem;font-weight:600}
.poster-bar{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;margin-top:.4rem}
.pb{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:999px;border:2px solid var(--blue);background:var(--card);color:var(--blue)!important;font-weight:800;font-size:.86rem;cursor:pointer;transition:.18s;text-decoration:none;line-height:1.1}
.pb:hover{background:var(--blue);color:#fff!important;transform:translateY(-2px);box-shadow:0 8px 18px rgba(27,77,179,.28)}
.pb:disabled{opacity:.6;cursor:progress;transform:none}
.pb.is-busy i{animation:pbspin 1s linear infinite}
@keyframes pbspin{to{transform:rotate(360deg)}}
.pb-gold{background:linear-gradient(135deg,var(--gold),#ffdf4d);border-color:var(--gold);color:#1b1b1b!important;box-shadow:0 6px 16px rgba(242,194,0,.35)}
.pb-gold:hover{background:linear-gradient(135deg,#ffdf4d,var(--gold));color:#1b1b1b!important}
.pb-wa{border-color:#1fa855;color:#13813f!important}
.pb-wa:hover{background:#1fa855}
[data-theme="dark"] .pb{color:#cfe0ff!important;border-color:#3a5bb0} [data-theme="dark"] .pb-gold{color:#1b1b1b!important}
.poster-status{margin:.7rem auto 0;max-width:540px;text-align:center;font-weight:700;font-size:.88rem;color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);border-radius:12px;padding:.45rem .8rem}
.poster-status.bad{color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent)}
#poster-area.loading,.ps-preview.loading{opacity:.45;pointer-events:none;transition:.2s}

/* side panel */
.ps-side{padding:1.3rem}
.ps-sticky{position:sticky;top:96px}
.ps-size{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:1rem}
.ps-size a,.ps-size label{display:flex;flex-direction:column;gap:.15rem;align-items:flex-start;padding:.7rem .85rem;border:2px solid var(--line);border-radius:16px;font-weight:800;cursor:pointer;color:var(--ink)!important;background:var(--bg);margin:0;transition:.18s;font-size:.9rem}
.ps-size small{font-weight:600;color:var(--muted);font-size:.7rem} .ps-size i{color:var(--blue)}
.ps-size a:hover,.ps-size label:hover{border-color:var(--blue)}
.ps-size a.on,.ps-size label.on{border-color:var(--blue);background:var(--sky);box-shadow:0 0 0 3px rgba(27,77,179,.12)}
.ps-size input{position:absolute;opacity:0;pointer-events:none}
.ps-size label:focus-within{outline:3px solid var(--gold);outline-offset:2px}
.ps-form label,.ps-fields label{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:.7rem 0 .25rem}
.ps-form .form-select,.ps-fields .form-select{border-radius:12px;border:1.5px solid var(--line);background-color:var(--bg);color:var(--ink);font-size:.9rem}
.ps-h{font-size:.78rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:1.2rem 0 .5rem}
.ps-links{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.ps-links a{display:flex;align-items:center;gap:.6rem;padding:.5rem .7rem;border-radius:12px;font-weight:700;font-size:.88rem;background:var(--bg);border:1px solid var(--line)}
.ps-links a:hover{background:var(--sky);border-color:var(--blue)} .ps-links i{color:var(--blue);width:1.1rem;text-align:center}
.ps-tip{margin-top:1.1rem;font-size:.8rem;color:var(--muted);background:color-mix(in srgb,var(--gold) 14%,transparent);border-radius:14px;padding:.7rem .85rem}
.ps-tip i{color:var(--gold-d);margin-right:.3rem}

/* hub */
.ps-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.ps-kind{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.7rem .3rem;border-radius:16px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font-weight:800;font-size:.76rem;cursor:pointer;transition:.18s;text-align:center;line-height:1.15}
.ps-kind i{font-size:1.25rem;color:var(--blue)}
.ps-kind:hover{border-color:var(--blue);transform:translateY(-2px)}
.ps-kind.on{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 8px 18px rgba(27,77,179,.3)} .ps-kind.on i{color:var(--gold)}
.ps-fields [hidden]{display:none!important}
.ps-hint{min-height:1.3rem;font-size:.82rem;color:var(--muted);margin:.4rem 0}
.ps-open{width:100%;justify-content:center;margin-top:.2rem} .ps-open[aria-disabled=true]{opacity:.5;pointer-events:none}
.ps-empty{text-align:center;padding:4rem 1.5rem;color:var(--muted)} .ps-empty i{font-size:3rem;color:var(--blue);opacity:.4;display:block;margin-bottom:1rem}
@media(max-width:991px){.ps-sticky{position:static}}
@media(max-width:575px){.pb{padding:.55rem .8rem;font-size:.8rem}.poster-frame{padding:8px;border-radius:28px}.poster-frame svg{border-radius:21px}.poster-frame:before{inset:3px;border-radius:25px}}

/* printing: one sheet, the whole poster scaled to fit the page (A4, no margins) so nothing is cut off */
#poster-print-sheet{display:none}
@media print{
  html,body{margin:0!important;padding:0!important;background:#fff!important;height:auto!important}
  body.poster-printing > *:not(#poster-print-sheet){display:none!important}
  body.poster-printing #poster-print-sheet{display:flex;align-items:center;justify-content:center;width:100%;height:99vh;overflow:hidden;break-inside:avoid;page-break-after:avoid}
  body.poster-printing #poster-print-sheet svg{display:block;width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

