/* 印刷用シート（実寸mm）。なぞり書きの文字は Klee One（SIL OFL 1.1）のサブセット */
@font-face {
  font-family: 'KleeSheet';
  src: url('../fonts/klee-one-semibold.woff2') format('woff2');
  font-weight: 600;
  font-display: block;
}
.sheet {
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
  background: #fff;
  color: #1d232b;
  font-family: 'KleeSheet', 'Hiragino Sans', 'Yu Gothic', Meiryo, system-ui, sans-serif;
  font-weight: 600;
  line-height: 1.2;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.sheet *, .sheet *::before, .sheet *::after { box-sizing: border-box; }
.sheet svg { display: block; }
.sheet svg text { font-family: 'KleeSheet', 'Hiragino Sans', 'Yu Gothic', sans-serif; font-weight: 600; }

/* 見出しと名前欄 */
.ws { display: flex; flex-direction: column; padding: 12mm 12mm 10mm; }
.ws-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 6mm; height: 14mm; margin-bottom: 6mm; padding-bottom: 2mm; border-bottom: 0.4mm solid #2a6f97; }
.ws-title { font-size: 6mm; line-height: 1.15; }
.ws-title em { margin-left: 3mm; padding: 0.4mm 2mm; border-radius: 1mm; background: #d0342b; color: #fff; font-size: 4mm; font-style: normal; vertical-align: middle; }
.ws-fields { display: flex; align-items: flex-end; gap: 1.5mm; flex: none; font-size: 3.6mm; }
.ws-blank { display: inline-block; width: 10mm; border-bottom: 0.25mm solid #555; height: 6mm; }
.ws-blank.wide { width: 40mm; margin-right: 3mm; }
.ws-foot { display: flex; justify-content: space-between; margin-top: auto; padding-top: 2mm; color: #8a929b; font-size: 2.8mm; font-family: system-ui, sans-serif; font-weight: 400; }

/* 算数 */
.ws-grid { display: grid; flex: 1; column-gap: 6mm; }
.hp { display: flex; align-items: center; gap: 0.35em; white-space: nowrap; font-variant-numeric: tabular-nums; border-bottom: 0.15mm dotted #c9cfd6; }
.hp .no { width: 2.2em; color: #8a929b; font-size: 0.62em; }
.hp .blank { display: inline-block; min-width: 2.6em; padding: 0 0.2em; border-bottom: 0.25mm solid #555; text-align: center; line-height: 1.3; }
.hp .blank.sm { min-width: 1.6em; }
.hp .rem { font-size: 0.7em; }
.hp .ans, .vp .ans { color: #d0342b; }
.vp { display: flex; align-items: flex-start; gap: 0.3em; padding-top: 1mm; font-variant-numeric: tabular-nums; }
.vp .no { color: #8a929b; font-size: 0.55em; }
.vgrid { display: grid; grid-auto-rows: 1.25em; }
.vgrid i { font-style: normal; text-align: center; }
.vgrid b { height: 0; margin: 0.15em 0; border-top: 0.35mm solid #333; align-self: center; }

/* なぞり書き */
.ws-rows { display: flex; flex-direction: column; }
.trace .pair { display: flex; flex-direction: column; gap: 1mm; }

/* 方眼紙など */
.paper svg { position: absolute; inset: 0; }

/* 単語カード */
.card-grid { position: absolute; display: grid; }
.card-cell { display: flex; align-items: center; justify-content: center; padding: 3mm; border: 0.2mm dashed #9aa3ad; margin: -0.1mm; text-align: center; overflow: hidden; word-break: break-word; line-height: 1.25; }
.card-note { position: absolute; left: 10mm; bottom: 4mm; color: #8a929b; font-size: 2.6mm; font-family: system-ui, sans-serif; font-weight: 400; }

@media print {
  html, body { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body > *:not(#print-root) { display: none !important; }
  #print-root { display: block !important; }
  #print-root .sheet { break-after: page; page-break-after: always; }
  #print-root .sheet:last-child { break-after: auto; page-break-after: auto; }
}
#print-root { display: none; }