.app--wordle{grid-template-rows:auto 1fr auto auto}.board{place-items:center;min-height:0;padding:4px 10px 6px;display:grid}.wd-grid{isolation:isolate;flex-direction:column;gap:5px;display:flex}.wd-grid[data-empty]{visibility:hidden}.wd-row{grid-template-columns:repeat(var(--cols), var(--cell));gap:5px;display:grid}.wd-cell{width:var(--cell);height:var(--cell);border:2px solid var(--glass);font-size:calc(var(--cell) * .5);color:var(--text);transform-style:preserve-3d;border-radius:5px;place-items:center;font-weight:800;line-height:1;transition:border-color .1s;display:grid}.wd-cell.is-typed{border-color:var(--glass-edge)}.wd-cell.is-correct,.wd-key.is-correct{color:#fff;background:#3aa757;border-color:#3aa757}.wd-cell.is-present,.wd-key.is-present{color:#fff;background:#d4a72c;border-color:#d4a72c}.wd-cell.is-absent,.wd-key.is-absent{background:color-mix(in srgb, var(--text-dim) 38%, transparent);color:var(--text);border-color:#0000}:root[data-shapes=on] .wd-cell.is-correct:after,:root[data-shapes=on] .wd-key.is-correct:after,:root[data-shapes=on] .wd-cell.is-present:after,:root[data-shapes=on] .wd-key.is-present:after{content:"";border:2px solid #ffffffe6;border-radius:50%;width:7px;height:7px;position:absolute;top:3px;right:3px}:root[data-shapes=on] .wd-cell.is-correct:after,:root[data-shapes=on] .wd-key.is-correct:after{background:#fffffff2}:root[data-shapes=on] .wd-cell,:root[data-shapes=on] .wd-key{position:relative}.pad{padding:2px 5px 0}.wd-pad{flex-direction:column;gap:6px;width:min(500px,100%);margin:0 auto;display:flex}.wd-keyrow{justify-content:center;gap:5px;display:flex}.wd-key{background:var(--surface-raised);min-width:0;height:48px;color:var(--text);text-transform:uppercase;border-radius:6px;flex:1 1 0;font-size:.9rem;font-weight:700;transition:background .15s,transform .1s}.wd-key:active:not(:disabled){transform:translateY(2px)}.wd-key--wide{flex:1.5 1 0;font-size:.7rem}.wd-key svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:21px;height:21px}.wd-pad.is-over .wd-key{opacity:.4;pointer-events:none}@media (max-height:700px){.wd-key{height:42px}}.board{position:relative}.toast{background:var(--text);color:var(--bg);white-space:nowrap;pointer-events:none;z-index:5;border-radius:10px;padding:9px 15px;font-size:.8rem;font-weight:700;animation:.14s both fade-in;position:absolute;top:10px;left:50%;transform:translate(-50%)}.wd-answer{text-align:center;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:2px 0 14px;font-size:1.7rem;font-weight:800}
