/* カテゴリをえらぶ画面。**学年を全部並べると見にくい。**（2026-09-22） */
:root { color-scheme: light dark; }
.pk {
  margin: 0; min-height: 100dvh; display: grid; place-items: center;
  padding: 1.5rem 1rem;
  font-family: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  background: Canvas; color: CanvasText;
}
.pk-box { width: min(46rem, 100%); }
.pk h1 { font-size: 1.6rem; margin: 0 0 .4rem; }
.pk-sub { margin: 0 0 1.6rem; opacity: .8; }
.pk-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}
.pk-card {
  display: grid; gap: .35rem; text-align: left;
  padding: 1.1rem 1.2rem; border-radius: 1rem; cursor: pointer;
  border: 1px solid color-mix(in srgb, CanvasText 18%, transparent);
  background: color-mix(in srgb, CanvasText 4%, Canvas);
  color: inherit; font: inherit;
  min-height: 6rem;                      /* 指で押せる大きさ */
}
.pk-card:hover { background: color-mix(in srgb, CanvasText 9%, Canvas); }
.pk-card:focus-visible { outline: 3px solid Highlight; outline-offset: 2px; }
.pk-n { font-size: 1.3rem; font-weight: 700; }
.pk-g { font-size: .9rem; opacity: .75; }
.pk-c { font-size: .85rem; opacity: .6; }
.pk-note { margin: 1.6rem 0 0; font-size: .9rem; opacity: .7; }