/* Foglio del calendario: condiviso fra pagina pubblica e anteprima dell'admin.
   I colori arrivano dalle variabili --paper, --ink, --accent impostate per ogni mese. */

@font-face{font-family:"Archivo Black";src:url("fonts/archivo-black-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Bebas Neue";src:url("fonts/bebas-neue-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fonts/playfair-display-latin-900-normal.woff2") format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Space Mono";src:url("fonts/space-mono-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Caveat";src:url("fonts/caveat-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

.paper{
  --paper:#ffffff; --ink:#0b0b0b; --accent:#ed2534;
  --display:"Helvetica Neue","Arial Black",Arial,sans-serif;
  --faint:#a9a9a9; --rule:#ececec; --soft:#8a8a8a;
  --faint:color-mix(in srgb,var(--ink) 34%,var(--paper));
  --rule:color-mix(in srgb,var(--ink) 9%,var(--paper));
  --soft:color-mix(in srgb,var(--ink) 50%,var(--paper));
  background:var(--paper);color:var(--ink);text-align:center;padding:28px 24px 18px;
  box-shadow:5px 5px 0 color-mix(in srgb,var(--paper) 84%,#000),9px 9px 0 color-mix(in srgb,var(--paper) 76%,#000),12px 18px 30px rgba(0,0,0,.2);
  transform-origin:20% 0;font-family:"Helvetica Neue",Arial,sans-serif;transition:background-color .25s,color .25s
}
.paper .brand{font-family:var(--display);font-size:clamp(18px,4.8vw,28px);font-weight:900;letter-spacing:-1.2px}
.paper .brand span{color:var(--faint)}
.paper .dow{font-family:var(--display);font-size:clamp(22px,6vw,32px);font-weight:900;letter-spacing:5px;margin-top:34px}
.paper .day{font-family:var(--display);font-size:clamp(132px,40vw,220px);line-height:.95;font-weight:900;letter-spacing:-.06em;padding-right:.06em;font-variant-numeric:tabular-nums}
.paper .month{font-family:var(--display);font-weight:900;letter-spacing:5px;font-size:clamp(23px,6vw,34px);margin-top:16px}
.paper .label{min-height:20px;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;margin-top:10px}
.paper .quote{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(19px,5vw,27px);letter-spacing:1.5px;line-height:1.22;margin:24px 0;min-height:160px;display:grid;align-content:center;text-wrap:balance;overflow-wrap:anywhere}
.paper .quote.empty{color:var(--faint)}
.paper.special .day,.paper.special .dow,.paper.special .quote:not(.empty){color:var(--accent)}
.paper .birth{border-top:1px solid var(--rule);padding-top:12px;text-align:left;font-size:13px}
.paper .birth h2{margin:0;font-weight:800;letter-spacing:1px;font-size:12px}
.paper .birth p{margin:8px 0}
.paper .foot{color:var(--soft);font-size:12px;margin-top:14px;text-align:left;font-variant-numeric:tabular-nums}
.paper .deco{display:block;margin:0 auto;max-width:100%;max-height:96px;object-fit:contain}
.paper .deco.top{margin-bottom:18px}
.paper .deco.bottom{margin-top:16px}
.paper .deco[hidden]{display:none}

/* caratteri della frase */
.paper .quote.f-archivo{font-family:"Archivo Black",var(--display);font-weight:400;letter-spacing:.5px}
.paper .quote.f-bebas{font-family:"Bebas Neue",var(--display);font-weight:400;font-size:clamp(28px,7.4vw,40px);letter-spacing:1.5px;line-height:1.02}
.paper .quote.f-playfair{font-family:"Playfair Display",Georgia,serif;font-weight:900;text-transform:none;font-size:clamp(23px,6vw,32px);letter-spacing:0;line-height:1.15}
.paper .quote.f-mono{font-family:"Space Mono",ui-monospace,Menlo,monospace;font-weight:700;font-size:clamp(17px,4.4vw,23px);letter-spacing:0;line-height:1.3}
.paper .quote.f-caveat{font-family:"Caveat","Comic Sans MS",cursive;font-weight:700;text-transform:none;font-size:clamp(30px,8vw,42px);letter-spacing:0;line-height:1.08}

.paper.rip{animation:rip .35s forwards}
@keyframes rip{to{opacity:0;transform:rotate(-6deg) translateY(45px)}}
@media (prefers-reduced-motion:reduce){.paper.rip{animation:none}.paper{transition:none}}