#wh-trainer{margin:14px 0;color:#3b0764}
#wh-trainer details{border:2px solid #d8b4fe;border-radius:12px;background:#faf5ff}
#wh-trainer summary{min-height:44px;padding:12px;cursor:pointer;font-weight:800}
#wh-trainer .wh-trainer-body{padding:0 12px 12px}
#wh-trainer p{font-size:.85rem;line-height:1.5;overflow-wrap:anywhere}
#wh-trainer label{display:block;font-size:.85rem;font-weight:700;margin:12px 0 4px}
#wh-trainer select{width:100%;min-height:44px;border:2px solid #d8b4fe;border-radius:8px;background:white;color:#3b0764;padding:8px;font:inherit}
#wh-trainer .wh-trainer-grid{display:grid;grid-template-columns:repeat(4,minmax(44px,1fr));gap:5px;margin-top:12px}
#wh-trainer .wh-trainer-cell{min-width:44px;min-height:44px;aspect-ratio:1;border:2px solid #d8b4fe;border-radius:8px;background:white;color:#3b0764;font:inherit;font-weight:800;font-size:1.15rem;line-height:1;cursor:pointer}
#wh-trainer .wh-trainer-pending{border:3px dashed #7e22ce;background:#fef9c3}
#wh-trainer .wh-trainer-traced{border:3px solid #166534;background:#dcfce7;color:#14532d}
#wh-trainer .wh-trainer-status{min-height:4.5em;margin:10px 0}
#wh-trainer .wh-trainer-actions{display:flex;flex-wrap:wrap;gap:8px}
#wh-trainer .btn{min-width:44px;min-height:44px;flex:1;padding:10px 8px}
#wh-trainer :is(summary,button,select):focus-visible{outline:3px solid #2563eb;outline-offset:3px}