/*
 * Motor Claude — Trança Dourada (Rapunzel, sem personagens).
 * A janela da torre (pedra, hera e florzinhas) no alto, à direita, e a trança
 * de cabelo em 3D, fio por fio, descendo pela lateral do convite inteiro: um
 * período exato da trança (braid.webp) repete sem emenda e o script mede onde
 * começa e onde termina, para a ponta com o laço de cetim cair no fim do
 * convite. Florzinhas presas na trança; pétalas e pólen dourado no ar.
 * Estrutura comum em princesas/princesas.css.
 * Letras: IM Fell English (Clássica), Fleur De Leah (Caligrafia), Junge (Moderna);
 * texto em Mukta.
 */
@font-face{font-family:"IM Fell English";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/im-fell-english-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IM Fell English";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/im-fell-english-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Fleur De Leah";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/fleur-de-leah-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Junge";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/junge-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Mukta";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/mukta-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Mukta";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/mukta-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Mukta";font-style:normal;font-weight:600 700;font-display:swap;src:url("../fonts/mukta-latin-600-normal.woff2") format("woff2")}

/* Paletas (as mesmas cores do theme.json, conferidas por tools/arte-princesas/build.py) */
body.sg-engine-claude_v1:has(.pz-root[data-pz-theme="tranca"]){
  --pz-name-font:"IM Fell English",Georgia,serif;--pz-title:"IM Fell English",Georgia,serif;--pz-sans:"Mukta",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --pz-base:#FAEDE6;--pz-ink:#38281E;--pz-muted:#6B5444;--pz-accent:#8C5230;--pz-name:#47291A;--pz-halo:rgba(255,248,242,.95);
  --pz-btn:#94592C;--pz-btn-hi:#B47740;--pz-btn-lo:#78441E;--pz-btn-ink:#FFFFFF;
  --pz-g1:rgba(255,251,248,.74);--pz-g2:rgba(255,246,240,.54);--pz-rim:rgba(255,255,255,.95);--pz-rim-lo:rgba(255,255,255,.42);
  --pz-hair:rgba(80,50,30,.14);--pz-field:rgba(255,255,255,.68);--pz-shadow:rgba(110,70,40,.28);--pz-glow:rgba(255,255,255,.6);
  --pz-solid:linear-gradient(160deg,rgba(255,252,249,.95),rgba(252,244,238,.9));
  --pz-veil:linear-gradient(180deg,rgba(255,248,242,.3),rgba(250,236,226,.5));--pz-flash:rgba(255,236,200,.85)}
body.sg-engine-claude_v1:has(.pz-root[data-pz-theme="tranca"][data-pz-set="campo"]){
  --pz-base:#E9F1F2;--pz-ink:#1D2A29;--pz-muted:#495A58;--pz-accent:#2C6553;--pz-name:#1F3830;--pz-halo:rgba(248,252,252,.95);
  --pz-btn:#2E6A56;--pz-btn-hi:#448A72;--pz-btn-lo:#225444;--pz-hair:rgba(30,60,50,.14);--pz-shadow:rgba(40,80,70,.26);
  --pz-veil:linear-gradient(180deg,rgba(246,252,252,.3),rgba(232,242,240,.5));--pz-flash:rgba(255,255,240,.9)}
body.sg-engine-claude_v1:has(.pz-root[data-pz-theme="tranca"][data-pz-set="canela"]){
  --pz-base:#F8E5D4;--pz-ink:#3A2117;--pz-muted:#6C4A3A;--pz-accent:#974028;--pz-name:#4A2215;--pz-halo:rgba(255,246,236,.95);
  --pz-btn:#9C4329;--pz-btn-hi:#BC6040;--pz-btn-lo:#7E331E;--pz-hair:rgba(90,40,20,.14);--pz-shadow:rgba(120,60,30,.28);
  --pz-veil:linear-gradient(180deg,rgba(255,244,232,.3),rgba(250,230,212,.5));--pz-flash:rgba(255,226,180,.85)}
body.sg-engine-claude_v1:has(.pz-root[data-pz-theme="tranca"][data-pz-set="noite"]){
  --pz-base:#0A1230;--pz-ink:#F2F0FF;--pz-muted:#C4C7E7;--pz-accent:#F4CF82;--pz-name:#FFF6E2;--pz-halo:rgba(8,12,36,.85);
  --pz-btn:#F4CF82;--pz-btn-hi:#FBE6B4;--pz-btn-lo:#D6AE5E;--pz-btn-ink:#1A1630;
  --pz-g1:rgba(40,52,100,.5);--pz-g2:rgba(14,20,48,.44);--pz-rim:rgba(255,230,180,.6);--pz-rim-lo:rgba(255,255,255,.1);
  --pz-hair:rgba(255,255,255,.14);--pz-field:rgba(255,255,255,.08);--pz-shadow:rgba(0,0,10,.6);--pz-glow:rgba(255,220,160,.15);
  --pz-solid:linear-gradient(160deg,rgba(30,40,84,.96),rgba(12,18,44,.95));
  --pz-veil:linear-gradient(180deg,rgba(8,12,36,.36),rgba(8,12,36,.58));--pz-flash:rgba(255,226,170,.6)}
.pz-root[data-pz-theme="tranca"][data-pz-font="caligrafia"]{--pz-name-font:"Fleur De Leah",cursive}
.pz-root[data-pz-theme="tranca"][data-pz-font="moderna"]{--pz-name-font:"Junge",Georgia,serif}
body.sg-engine-claude_v1.sg-engine-claude_v1 .pagina-convite .pz-root[data-pz-theme="tranca"][data-pz-font="caligrafia"] :is(.pz-cover-name,.pz-name){font-style:normal!important;letter-spacing:0!important;padding-left:.4em!important;padding-right:.4em!important}
body.sg-engine-claude_v1.sg-engine-claude_v1 .pagina-convite .pz-root[data-pz-theme="tranca"][data-pz-font="moderna"] :is(.pz-cover-name,.pz-name){font-style:normal!important;letter-spacing:0!important}

/* ================= A janela e a trança ================= */
/* --tr-ww: largura da janela; a trança tem 44% dela; o centro fica a --tr-cx da borda direita. */
.pz-root[data-pz-theme="tranca"]{--tr-ww:min(56vw,260px);--tr-cx:58px}
.pz-tr-hang{position:absolute;top:0;bottom:0;z-index:2;width:var(--tr-ww);left:calc(100% - var(--tr-cx) - var(--tr-ww) / 2);pointer-events:none;transform-origin:50% 0}
.pz-tr-window{position:absolute;left:0;top:calc(env(safe-area-inset-top,0px) - var(--tr-ww) * .04);z-index:2;width:100%;aspect-ratio:1200/1500}
.pz-tr-window-img{position:relative;z-index:1;display:block;width:100%;height:100%;filter:drop-shadow(0 18px 24px rgba(60,30,10,.25))}
/* luz da vela lá dentro: tremula de leve */
.pz-tr-glow{position:absolute;left:30%;top:34%;z-index:2;width:40%;height:30%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,200,120,.45),transparent);mix-blend-mode:screen;opacity:.6}
.pz-root.is-ready .pz-tr-glow{animation:pz-tr-flicker 3.4s ease-in-out infinite}
@keyframes pz-tr-flicker{0%,100%{opacity:.5}30%{opacity:.85}55%{opacity:.6}75%{opacity:.78}}
.pz-tr-braid{position:absolute;left:50%;top:var(--tr-ww);z-index:1;width:var(--pz-bw,calc(var(--tr-ww) * .44));height:200svh;margin-left:calc(var(--pz-bw,calc(var(--tr-ww) * .44)) / -2);
  background-image:var(--pz-braid);background-repeat:repeat-y;background-size:100% var(--pz-th,calc(var(--tr-ww) * .44 * var(--pz-tile-ratio)));
  filter:drop-shadow(0 10px 12px rgba(70,40,10,.28))}
.pz-root[data-pz-tone="dark"] .pz-tr-braid{filter:drop-shadow(0 10px 14px rgba(0,0,0,.5))}
.pz-tr-end{position:absolute;left:50%;z-index:1;height:auto;transform:translateX(-50%);filter:drop-shadow(0 10px 12px rgba(70,40,10,.28))}
.pz-tr-flower{position:absolute;left:50%;z-index:3;width:calc(var(--pz-bw,120px) * var(--pz-fs,.42) * 1.25);height:auto;transform:translate(calc(-50% + var(--pz-fx,0px)),-50%) rotate(var(--pz-fr,0deg));filter:drop-shadow(0 4px 5px rgba(60,30,20,.25))}
/* balanço: a trança pende da janela e balança de leve; um toque dá um puxãozinho */
.pz-root.is-ready .pz-tr-hang--cover .pz-tr-braid{animation:pz-tr-sway 6.5s ease-in-out infinite;transform-origin:50% 0}
@keyframes pz-tr-sway{0%,100%{transform:rotate(0)}50%{transform:rotate(.35deg)}}
.pz-tr-hang.is-tug :is(.pz-tr-braid,.pz-tr-flower,.pz-tr-end){animation:pz-tr-tug .9s cubic-bezier(.3,1.6,.4,1)}
@keyframes pz-tr-tug{0%{translate:0 0}30%{translate:0 10px}60%{translate:0 -4px}100%{translate:0 0}}

/* Capa: a janela no alto à direita, a trança descendo pela lateral; o nome fica à esquerda dela */
.pz-root[data-pz-theme="tranca"]{--pz-title-top:max(36svh,calc(var(--tr-ww) * 1.2));--pz-title-pad-r:calc(var(--tr-cx) + var(--tr-ww) * .22 + 8px);--pz-title-pad-l:18px}
.pz-root.is-closed .pz-tr-hang--cover{animation:pz-tr-in 2.4s cubic-bezier(.16,1,.3,1) .1s both}
@keyframes pz-tr-in{from{opacity:0;transform:translateY(-14svh)}to{opacity:1;transform:none}}
/* Abertura: a janela sobe e a convidada desce pela trança */
.pz-root.is-opening .pz-tr-hang--cover{animation:pz-tr-out 1.7s cubic-bezier(.6,0,.25,1) forwards}
@keyframes pz-tr-out{to{opacity:0;transform:translateY(-60svh)}}

/* Folha: a mesma janela no alto e a trança descendo até o fim do convite, atrás dos cartões de vidro */
.pz-root[data-pz-theme="tranca"] .pz-front{padding-top:calc(var(--tr-ww) * 1.06)}
.pz-root[data-pz-theme="tranca"] .pz-front-text{padding-right:calc(var(--tr-cx) + var(--tr-ww) * .22 - 18px)}
body.sg-engine-claude_v1.sg-engine-claude_v1 .pagina-convite .pz-root[data-pz-theme="tranca"] .pz-date{white-space:normal;text-wrap:balance}
.pz-tr-hang--sheet{left:calc(100% - var(--tr-cx) - var(--tr-ww) / 2 + 18px)}
.pz-root.is-opening .pz-tr-hang--sheet{animation:pz-tr-sheet-in 1.8s cubic-bezier(.16,1,.3,1) .3s both}
@keyframes pz-tr-sheet-in{from{opacity:0;transform:translateY(12svh)}to{opacity:1;transform:none}}
.pz-root[data-pz-theme="tranca"] .pz-close{padding-bottom:calc(var(--tr-ww) * .9)}
.pz-tr-front-space,.pz-tr-close-space{display:none}
@media (min-width:660px){
  .pz-root[data-pz-theme="tranca"]{--tr-ww:280px}
  .pz-tr-hang--sheet{left:calc(100% - var(--tr-ww) / 2 + min(76px,(100vw - 100%) / 2 - 58px))}
  .pz-root[data-pz-theme="tranca"] .pz-front-text{padding-right:0}
}
@media (orientation:landscape) and (min-width:760px){
  .pz-root[data-pz-theme="tranca"]{--tr-ww:min(300px,46svh);--tr-cx:14vw;--pz-title-top:34svh;--pz-title-pad-r:22px}
}
.pz-root--cover-only :is(.pz-tr-hang,.pz-tr-braid){animation:none!important;opacity:1}
@media print{.pz-tr-hang{display:none!important}}