.bh4-play{max-width:64rem;margin:auto;padding:1rem;color:#172b3f}.bh4-play h1{font-weight:800}.bh4-play nav{display:flex;gap:.65rem;flex-wrap:wrap;margin-bottom:1rem}.bh4-play button,.bh4-play input{min-height:44px;border:1px solid #4f6b80;border-radius:.3rem;padding:.5rem .65rem}.bh4-play button{background:#f5fafc;color:#172b3f;font-weight:600}.bh4-play button:disabled{opacity:.55}.bh4-play :focus-visible{outline:3px solid #d67936;outline-offset:3px}.bh4-play [hidden]{display:none!important}.bh4-play details{margin:.8rem 0}.bh4-play pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#edf5fa;padding:.8rem}#bh4-desk{position:sticky;top:0;z-index:5;background:#edf5fa;border-bottom:2px solid #4f6b80;padding:.6rem;display:grid;gap:.3rem}#bh4-form{display:grid;grid-template-columns:1fr auto;gap:.5rem}#bh4-form label{grid-column:1/-1}#bh4-guess{min-width:0}#bh4-work{display:grid;grid-template-columns:3fr 2fr;gap:1.3rem;margin-top:1rem;overflow-anchor:none}#bh4-bank{display:flex;flex-wrap:wrap;gap:.5rem}.bh4-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.bh4-audit{border-left:3px solid #4f6b80;padding:.5rem .7rem;margin:.7rem 0;overflow-wrap:anywhere}#bh4-result{overflow-anchor:none}#bh4-result a{display:inline-block;padding:.7rem}#bh4-result button{margin:.3rem}#bh4-views{display:none}@media(max-width:620px){.bh4-play{padding:.6rem}.bh4-play h1{font-size:2rem}.bh4-play h2{font-size:1.4rem}.bh4-play h3{font-size:1.2rem}#bh4-work{display:block}#bh4-form{grid-template-columns:1fr}.bh4-actions{display:grid}#bh4-bank{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#bh4-bank button{overflow-wrap:anywhere}#bh4-views{display:flex;gap:.5rem}#bh4-views button{flex:1}#bh4-views [aria-pressed=true]{background:#172b3f;color:white}.bh4-play[data-view=guess] #bh4-bank-panel,.bh4-play[data-view=bank] #bh4-guess-panel{display:none}.bh4-play pre{font-size:.83rem}}
.bh4-comparison{border-top:1px solid #4f6b80;padding-top:.8rem;overflow-anchor:none}.bh4-comparison summary,#bh4-history summary{min-height:44px;padding:.65rem 0;cursor:pointer}.bh4-comparison p,.bh4-comparison caption,.bh4-comparison label,#pg-share-feedback{max-width:65ch;font-size:1rem;line-height:1.6;overflow-wrap:anywhere}.bh4-compare-controls{display:grid;gap:.5rem;max-width:65ch}.bh4-comparison select{box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:.6rem;font:inherit;font-size:1rem;color:#172b3f;background:#fff;border:1px solid #4f6b80;border-radius:.3rem}.bh4-comparison table{width:100%;max-width:65ch;table-layout:fixed;border-collapse:collapse;font-size:1rem;line-height:1.6}.bh4-comparison th,.bh4-comparison td{padding:.5rem .35rem;text-align:left;border-bottom:1px solid #4f6b80;overflow-wrap:anywhere}.bh4-comparison thead th:nth-child(2){width:3.5rem}.bh4-comparison thead th:nth-child(3){width:4.5rem}.bh4-comparison thead th:nth-child(4){width:2.5rem}.bh4-comparison thead th:not(:first-child){white-space:nowrap}.bh4-comparison caption{caption-side:top;text-align:left;margin:1rem 0 .5rem}.bh4-comparison h4{margin:1.4rem 0 .5rem}.bh4-comparison section{border-top:1px solid #4f6b80;margin-top:1.5rem;padding-top:.5rem}.bh4-comparison select::selection{background:#172b3f;color:white}@media(max-width:620px){.bh4-comparison th,.bh4-comparison td{padding:.45rem .2rem}.bh4-comparison table{line-height:1.4}}
/* German comparison headings need wrapping inside the existing numeric columns. */
.bh4-play[data-language="de"] .bh4-comparison thead th:not(:first-child){white-space:normal}
