.konomana-drill {
  --ink: #173e37;
  --muted: #60736f;
  --paper: #f7f3e8;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  padding-inline: clamp(16px, 4vw, 72px);
  box-sizing: border-box;
  color: var(--ink);
}

.konomana-drill__intro,
.konomana-drill__controls,
.konomana-drill__message { width: min(100%, 1600px); margin-inline: auto; }
.konomana-drill__intro { margin-bottom: 28px; }
.konomana-drill__eyebrow { color: #9a6b1f; font-size: 12px; font-weight: 700; letter-spacing: .18em; }
.konomana-drill__intro h2 { margin: 8px 0 12px; font-family: "Yu Mincho", serif; font-size: clamp(30px, 5vw, 54px); font-weight: 500; line-height: 1.35; }
.konomana-drill__intro p:last-child { color: var(--muted); }

.konomana-drill__controls {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  padding: 24px;
  border: 1px solid #d9dfda;
  border-radius: 22px;
  background: var(--paper);
}

.konomana-drill__controls label { display: grid; gap: 7px; font-size: 14px; font-weight: 700; }
.konomana-drill__controls select { width: 100%; min-height: 46px; padding: 8px 12px; border: 1px solid #aebbb7; border-radius: 10px; background: #fff; color: var(--ink); font: inherit; }
.konomana-drill__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; }
.konomana-drill__actions button { min-height: 48px; padding: 10px 20px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.konomana-drill__actions button.is-secondary { background: transparent; color: var(--ink); }
.konomana-drill__message { min-height: 1.6em; margin-block: 14px; color: var(--muted); }
.konomana-drill__pages { display: grid; grid-template-columns: max-content; gap: 24px; justify-content: center; overflow: hidden; padding: 8px 0 32px; }
.konomana-drill__pages .konomana-sheet { zoom: var(--preview-scale, 1); box-shadow: 0 12px 36px rgba(20, 48, 42, .12); }

@media (min-width: 1740px) {
  .konomana-drill__pages { grid-template-columns: repeat(2, max-content); align-items: start; }
}

@media (max-width: 760px) {
  .konomana-drill__controls { grid-template-columns: 1fr 1fr; padding: 18px; }
}

@media (max-width: 480px) {
  .konomana-drill__controls { grid-template-columns: 1fr; }
  .konomana-drill__actions button { width: 100%; }
}

@media print {
  body * { visibility: hidden !important; }
  header.wp-block-template-part,
  footer.wp-block-template-part,
  .wp-block-post-title { display: none !important; }
  .wp-site-blocks,
  #wp--skip-link--target,
  #wp--skip-link--target > .wp-block-group,
  .wp-block-post-content { margin: 0 !important; padding: 0 !important; position: static !important; }
  .konomana-drill__pages,
  .konomana-drill__pages * { visibility: visible !important; }
  .konomana-drill__intro,
  .konomana-drill__controls,
  .konomana-drill__message { display: none !important; }
  html,
  body { width: 100% !important; height: auto !important; overflow: visible !important; }
  body.page-id-1205 .konomana-drill { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; position: static !important; left: auto !important; }
  body.page-id-1205 .konomana-drill__pages { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; position: absolute !important; inset: 0 auto auto -10mm !important; }
  body.page-id-1205 .konomana-drill__pages .konomana-sheet { zoom: 1; box-shadow: none; }
}