.ef-ap{max-width:960px;margin:20px auto}.ef-ap-links,.ef-ap-actions,.ef-ap-launch{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.ef-ap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(62px,1fr));gap:8px;margin:20px 0}.ef-ap-tile{padding:12px 4px;border:1px solid #aeb9cb;border-radius:10px;background:transparent;color:inherit;cursor:pointer}.ef-ap-tile.selected{outline:3px solid #6488e8}.ef-ap-focus,.ef-ap-contrast{padding:22px;border:1px solid #d5dce8;border-radius:14px;margin:16px 0}.ef-ap-letter{font-size:clamp(40px,9vw,82px);font-weight:800}.ef-ap button{margin:5px}.ef-ap select{display:block;width:100%;max-width:480px;margin:8px 0 16px}.ef-ap #efFeedback{margin-top:12px;min-height:24px}@media(max-width:500px){.ef-ap-focus,.ef-ap-contrast{padding:12px}}
/* Alphabet self-assessment: colours supplement, never replace, visible text labels. */
.ef-ap .ef-ap-grid{grid-template-columns:repeat(13,minmax(0,1fr));gap:8px}
.ef-ap .ef-ap-tile{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:64px;padding:8px 2px;line-height:1.2}
.ef-ap .ef-ap-symbol{font-size:13px;white-space:nowrap;font-weight:600}
.ef-ap .ef-ap-type{font-size:9px;line-height:1.1;font-weight:500;white-space:nowrap}
.ef-ap .ef-ap-tile.ef-ap-easy{background:#d5f2df;color:#174e2a;border-color:#31935c}
.ef-ap .ef-ap-tile.ef-ap-difficult{background:#ffdfd3;color:#782918;border-color:#d66b4c}
.ef-ap .ef-ap-tile.selected{outline:3px solid #6488e8;outline-offset:1px}
.ef-ap .ef-ap-mark-easy,.ef-ap .ef-ap-mark-difficult{color:#fff;border:2px solid transparent;font-weight:700}
.ef-ap .ef-ap-mark-easy{background:#16713b;border-color:#16713b}
.ef-ap .ef-ap-mark-difficult{background:#a93627;border-color:#a93627}
.ef-ap .ef-ap-mark-easy[aria-pressed="true"],.ef-ap .ef-ap-mark-difficult[aria-pressed="true"]{outline:3px solid #6488e8;outline-offset:2px}
.ef-ap .ef-ap-mark-easy:hover{background:#11592f}
.ef-ap .ef-ap-mark-difficult:hover{background:#832619}
.ef-ap .ef-ap-legend{font-size:13px;margin:12px 0 6px;color:var(--muted,#626e82)}
.ef-ap .ef-ap-kind{font-weight:700;margin:0 0 10px}
.ef-ap .ef-ap-status{font-size:13px;color:var(--muted,#626e82);margin:4px 5px 0}
@media(max-width:860px){.ef-ap .ef-ap-grid{grid-template-columns:repeat(auto-fit,minmax(66px,1fr))}}
@media(max-width:540px){.ef-ap .ef-ap-grid{grid-template-columns:repeat(auto-fit,minmax(64px,1fr))}.ef-ap .ef-ap-type{font-size:9px}}
