
.he-tableau{margin:2rem 0;padding:clamp(1rem,3vw,1.8rem);border:2px solid #b9caba;border-radius:22px;background:#f5f4e9;color:#163b35}
.he-tableau [hidden]{display:none!important}.he-tableau h3{margin:.2rem 0 1rem;font-size:clamp(1.3rem,4vw,1.8rem);line-height:1.2}
.he-kicker{font-size:.75rem;letter-spacing:.06em;font-weight:750;text-transform:uppercase;color:#2d6a4f}
.he-controls{display:flex;flex-wrap:wrap;gap:.7rem;margin:1rem 0}.he-controls label{display:grid;gap:.35rem;flex:1 1 145px;min-width:0}
.he-tableau select,.he-tableau button,.he-controls a{font:inherit;min-height:44px;border:1px solid #799584;border-radius:10px;background:white;color:#163b35;padding:.65rem .8rem;max-width:100%}
.he-tableau button{cursor:pointer;white-space:normal}.he-tableau button:hover{background:#f9edbd}.he-controls a{display:inline-flex;align-items:center;text-decoration:underline}
.he-tableau :focus-visible{outline:3px solid #7355a4;outline-offset:3px}.he-grid-wrap{max-width:100%;margin:1rem 0}.he-grid{width:100%;table-layout:fixed;border-collapse:collapse;font-size:.9rem}
.he-grid caption{font-weight:650;padding:.5rem 0;text-align:left}.he-grid th,.he-grid td{border:1px solid #789382;padding:.3rem;text-align:center;overflow-wrap:anywhere}
.he-grid th{background:#e9efdf;font-size:.8rem;font-weight:650}.he-grid th>span{display:block}.he-symbol svg{width:30px;height:30px;display:block;margin:auto}
.he-grid td button{padding:.25rem;min-height:55px;width:100%;display:flex;align-items:center;justify-content:center;border-radius:6px;font-size:.78rem}
.he-grid td svg{width:40px;height:40px;max-width:100%}.he-target{display:flex;align-items:center;gap:1rem;justify-content:space-between;font-weight:700;background:#f4c95d44;padding:.7rem;border-radius:12px}
.he-target-icon{flex:none}.he-target svg{display:block}.he-tableau .he-correct{background:#dcebdc;border-color:#2d6a4f;border-width:3px}.he-tableau .he-wrong{background:#f4dfd0;border-style:dashed;border-width:2px}
.he-tableau [role=status]{min-height:1.6em;font-weight:600}.he-tableau fieldset{border:1px solid #9db5a1;border-radius:12px;margin:1.2rem 0;padding:1rem;min-width:0}.he-tableau legend{font-weight:650;padding:0 .3rem}
.he-tableau details{margin:1rem 0}.he-tableau summary{cursor:pointer;min-height:44px;padding:.6rem 0;font-weight:650}.he-tableau ul{padding-left:1.2rem}.he-tableau li{margin:.7rem 0;overflow-wrap:anywhere}
.he-paper table{width:100%;border-collapse:collapse;font-size:.83rem}.he-paper td,.he-paper th{border:1px solid #799584;padding:.4rem;overflow-wrap:anywhere}
.he-tableau [data-de-preview]{display:block;width:min(100%,370px);height:auto;margin:1rem auto;border:1px solid #b9caba;background:#fff}
@media(max-width:420px){.he-tableau{padding:.8rem;border-radius:16px}.he-grid th,.he-grid td{padding:.2rem}.he-grid th{font-size:.72rem}.he-grid td button{min-height:48px;font-size:.7rem}.he-grid td svg{width:32px;height:32px}.he-controls>*{max-width:100%}}
@media(prefers-reduced-motion:reduce){.he-tableau *{animation:none!important;transition:none!important}}
@media print{.he-tableau{break-inside:avoid;background:white;border-color:#444}.he-controls, .he-tableau button{display:none!important}.he-paper{display:block!important}.he-tableau details>summary{display:none}.he-tableau details>*{display:block}.he-tableau [data-de-preview]{max-width:100%}}

/* Scoped mobile correction from actual visual QA, 23 October UTC. */
.he-tableau .he-controls select{width:100%;min-width:0;max-width:100%;box-sizing:border-box}
.he-tableau .he-grid{min-width:0!important;max-width:100%;width:100%;table-layout:fixed}
.he-tableau .he-grid th,.he-tableau .he-grid td{min-width:0!important;overflow-wrap:anywhere}
.he-tableau .he-grid-wrap{max-width:100%;overflow-x:auto}
@media(max-width:420px){.he-tableau .he-controls label{flex:1 1 100%;width:100%}}
