/* =========================================================
   print-frame.css — הגרסה להדפסה ומסגור (print.html)

   העיקרון: כל המידות בתוך הדף הן ב-em ביחס ל-font-size של
   .sheet בלבד. משנים את ה-font-size הזה — כל הדף מתכווץ/גדל
   בפרופורציה מדויקת. לכן אותו עיצוב עובד גם על מסך, גם ב-A4
   וגם ב-A3, בלי לגעת בשום מספר אחר.
   ========================================================= */

:root{
  --ivory:     #FCFAF6;
  --ink:       #17161A;
  --ink-soft:  #4A4550;
  --muted:     #857D74;
  --gold:      #B08D3F;
  --gold-deep: #8C6E2A;
  --serif:     'Frank Ruhl Libre', 'Times New Roman', Georgia, serif;
  --sans:      'Heebo', 'Segoe UI', Arial, sans-serif;
  --hand:      'Amatic SC', 'Frank Ruhl Libre', cursive;
  --tap:       46px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:#E8E2D8;
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}

:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:3px; }

/* ---------- סרגל ---------- */
.bar{
  position:sticky; top:0; z-index:10;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.6rem;
  padding:.8rem 1rem;
  background:rgba(252,250,246,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(23,22,26,.1);
}

.bar__back,.bar__print,.bar__size{
  appearance:none;
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--tap);
  font-family:var(--sans); font-size:.88rem; font-weight:400;
  border-radius:999px;
  padding:.6rem 1.2rem;
  cursor:pointer;
  text-decoration:none;
  border:1px solid rgba(176,141,63,.5);
  background:transparent;
  color:var(--gold-deep);
  transition:background .25s ease, color .25s ease, transform .25s ease;
}
.bar__back{ border-color:transparent; color:var(--muted); }
.bar__back:hover{ background:rgba(23,22,26,.05); }

.bar__group{ display:flex; gap:.35rem; }
.bar__size{ min-width:64px; letter-spacing:.06em; }
.bar__size.is-on{ background:var(--gold); border-color:var(--gold); color:#fff; }

.bar__print{ background:var(--gold); border-color:var(--gold); color:#fff; }
.bar__print:hover{ transform:translateY(-2px); }

.hint{
  max-width:560px;
  margin:1rem auto .4rem;
  padding-inline:1.2rem;
  text-align:center;
  font-size:.82rem;
  line-height:1.7;
  color:#5E574E;
}
.hint b{ font-weight:500; color:var(--gold-deep); }

/* ---------- במה ---------- */
.stage{
  display:flex; justify-content:center;
  padding:1.2rem 1rem 3rem;
}

/* =========================================================
   הדף
   ========================================================= */
.sheet{
  position:relative;
  background:var(--ivory);
  box-shadow:0 22px 60px rgba(40,32,20,.28);
  overflow:hidden;

  /* מסך: הרוחב והפונט נעים יחד, כך שהפרופורציה נשמרת */
  width:min(94vw, 620px);
  aspect-ratio:210 / 297;
  font-size:min(3.7vw, 23px);
}
html.a3 .sheet{ aspect-ratio:297 / 420; }

/* מסגרת כפולה + מעוינים בפינות.
   ה-inset מכוון כך שהמסגרת נופלת ~9 מ"מ מקצה הדף — בתוך השטח
   שכל מדפסת ביתית יודעת להדפיס, כדי שהיא לא תיחתך. */
.orn{
  position:absolute;
  inset:1.15em;
  border:1px solid rgba(176,141,63,.75);
  pointer-events:none;
}
.orn::before{
  content:'';
  position:absolute; inset:0.28em;
  border:1px solid rgba(176,141,63,.34);
}
.orn__d{
  position:absolute;
  width:.34em; height:.34em;
  background:var(--gold);
  transform:rotate(45deg);
}
.orn__d--tr{ top:-.17em; right:-.17em; }
.orn__d--tl{ top:-.17em; left:-.17em; }
.orn__d--br{ bottom:-.17em; right:-.17em; }
.orn__d--bl{ bottom:-.17em; left:-.17em; }

.sheet__in{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  text-align:center;
  padding:2em 1.6em;
}

.kicker{
  font-size:.38em;
  letter-spacing:.5em;
  padding-inline-start:.5em;
  color:var(--gold-deep);
  margin:0 0 1.1em;
}

.crest{ width:3.2em; margin:0 0 .85em; }
.crest svg{ width:100%; height:auto; display:block; }

.portrait{ margin:0 0 .8em; }
.portrait[hidden]{ display:none !important; }
.portrait img{
  width:3.5em; height:3.5em;
  object-fit:cover;
  border-radius:50%;
  border:1px solid rgba(176,141,63,.6);
  padding:.09em;
  background:#fff;
}

.title{
  font-family:var(--serif);
  font-weight:500;
  font-size:1.45em;
  line-height:1.25;
  margin:0;
  color:var(--ink);
}

.rule{
  width:5.8em; height:1px;
  margin:1em auto 1.2em;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.rule--wide{ width:7.4em; margin:1.4em auto 1.25em; }

.lines p{
  font-family:var(--serif);
  font-weight:300;
  font-size:.74em;
  line-height:2.1;
  color:var(--ink);
  margin:0;
}

.extra{
  margin-top:.9em;
  padding-top:.85em;
  border-top:1px solid rgba(176,141,63,.28);
}
.extra p{
  font-family:var(--serif);
  font-weight:300;
  font-size:.62em;
  line-height:2;
  color:var(--gold-deep);
  margin:0;
}
.extra:empty{ display:none; }

/* בלי letter-spacing — הוא מנתק את הניקוד מהאותיות */
.amen{
  font-family:var(--serif);
  font-size:.58em;
  color:var(--gold-deep);
  margin:1.4em 0 0;
}

.forline{
  font-family:var(--serif);
  font-size:.72em;
  font-weight:400;
  color:var(--ink);
  margin:0;
}
.kidsline{
  font-size:.42em;
  letter-spacing:.2em;
  color:var(--muted);
  margin:.7em 0 0;
}
.ded{
  font-size:.4em;
  line-height:1.9;
  color:var(--ink-soft);
  margin:1.2em auto 0;
  max-width:26em;
}

.sig{
  font-family:var(--hand);
  font-weight:700;
  font-size:1.1em;
  line-height:1.2;
  color:var(--gold-deep);
  margin:.85em 0 0;
}
.footnote{
  font-size:.3em;
  color:var(--muted);
  margin:.9em 0 0;
}
.footnote:empty{ display:none; }

/* ---------- קרדיט מתחת לדף ---------- */
.credit{
  text-align:center;
  font-size:.7rem;
  color:#6B655C;
  opacity:.75;
  margin:0 0 2rem;
  padding-inline:1rem;
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
}

/* =========================================================
   הדפסה
   ========================================================= */
@media print{
  html,body{ background:#fff !important; }
  .no-print{ display:none !important; }
  .stage{ padding:0; display:block; }

  .sheet{
    width:210mm; height:297mm;
    aspect-ratio:auto;
    font-size:7.6mm;
    box-shadow:none;
    background:var(--ivory) !important;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
    break-inside:avoid;
  }
  html.a3 .sheet{
    width:297mm; height:420mm;
    font-size:10.7mm;
  }
}