@font-face { font-family: 'Frank Ruhl'; src: url(/fonts/FrankRuhl-500-hebrew.woff2) format('woff2'); font-weight: 500; font-display: block; unicode-range: U+0590-05FF; }
/* Hebrew School at Home */
.trace { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.trace__said { font: 400 1.375rem/1.35 var(--display); color: var(--ink); min-height: 2.8em; margin-top: 1.2em; }
.trace__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.trace__pad { position: relative; width: 100%; max-width: 460px; aspect-ratio: 1; justify-self: center; background: var(--glass-2); border-radius: 999px 999px var(--r-m) var(--r-m);
  box-shadow: 0 30px 60px -40px rgba(22, 36, 31, .45); overflow: hidden; }
.trace__c { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.trace__letter { position: absolute; inset: 0; display: grid; place-items: center; font: 500 15rem/1 'Frank Ruhl', 'Times New Roman', serif; color: rgba(52, 84, 76, .18); }
.trace__pad.is-live .trace__letter { display: none; }
@media (max-width: 860px) { .trace { grid-template-columns: 1fr; } .trace__pad { max-width: 380px; } }
.trace { grid-template-areas: 'copy pad' 'copy hint'; }
.trace__copy { grid-area: copy; } .trace__pad { grid-area: pad; } .trace__hint { grid-area: hint; justify-self: center; margin-top: 14px; }
@media (max-width: 860px) { .trace { grid-template-areas: 'copy' 'pad' 'hint'; } }