/* 画面の枠・A4 の紙は漢字プリントと同じ物を使う。ここには4本線だけの所を書く（ローマ字プリントも読む） */
@import url("../kanji/app.css");

.abcgrid { grid-template-columns: repeat(auto-fill, minmax(2.9rem, 1fr)); }
.abcgrid button { font-family: "Century Gothic", "Segoe UI", Arial, sans-serif; font-size: 1.05rem; aspect-ratio: auto; min-height: 2.4rem; }
.rows { list-style: none; margin: 4mm 0 0; padding: 0; flex: 1; display: flex; flex-direction: column; justify-content: space-around; }
.rows li { display: flex; align-items: center; gap: 2mm; }
.rows .no { font-size: 3.6mm; color: #555; width: 8mm; }
.four { display: block; overflow: visible; }
.four .fl { stroke: #888; stroke-width: .25; }
.four .fl.base { stroke: #d33; stroke-width: .3; }
.four text { font-family: "Century Gothic", "URW Gothic", "Avenir Next", "Futura", "Segoe UI", "Helvetica Neue", Arial, sans-serif; }
.four .model { fill: #111; }
.four .trace { fill: #c9c9c9; }
.four .ans { fill: var(--red); }
.four .blank { fill: none; }
.four .slot { fill: none; stroke: #999; stroke-width: .25; stroke-dasharray: 1 1; }

/* 英単語：左に日本語 */
.words .jp { width: 26mm; font-family: var(--kyokasho); font-size: 4.6mm; }
.words .w3 { display: flex; flex-direction: column; gap: 3.5mm; }