:root{color:#f2f3f5;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#15171c;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}main{width:min(100%,32rem);height:100dvh;padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr) 1.5rem auto;gap:8px;margin:0 auto;display:grid}header{grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;min-height:44px;display:grid;position:relative}h1{text-align:center;grid-column:2;margin:0;font-size:clamp(1.1rem,5vw,1.6rem)}button{font:inherit;color:#fff;cursor:pointer;touch-action:manipulation;border:0;border-radius:.4rem}.restart{background:#363b48;border-radius:50%;grid-column:3;width:44px;height:44px;padding:0;font-size:2rem;line-height:1}.board-area{place-items:center;min-height:0;display:grid;container-type:size}.board{aspect-ratio:5/6;grid-template-rows:repeat(6,minmax(0,1fr));grid-template-columns:minmax(0,1fr);gap:5px;width:min(100cqw,83.3333cqh,360px);display:grid}.board-row{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;min-height:0;display:grid}.tile{border:2px solid #555;border-radius:.5rem;place-items:center;min-height:0;font-size:clamp(1rem,5cqh,2.5rem);font-weight:700;display:grid}.correct{background-color:#538d4e;border-color:#538d4e}.present{background-color:#b59f3b;border-color:#b59f3b}.absent{background-color:#3a3a3c;border-color:#3a3a3c}.status{text-align:center;align-self:center;margin:0;font-size:.9rem;line-height:1.5rem}.keyboard{gap:6px;display:grid}.keyboard-row{justify-content:center;gap:4px;display:flex}.key{background-color:#626775;flex:none;width:calc(10% - 3.6px);min-width:0;max-width:46px;height:clamp(36px,7dvh,54px);padding:0;font-size:clamp(.75rem,3.3vw,1rem);font-weight:700}.key.action-key{flex:1;width:auto;max-width:none}.key.correct{background-color:#538d4e}.key.present{background-color:#b59f3b}.key.absent{background-color:#3a3a3c}.key:disabled{cursor:default}:focus-visible{outline-offset:2px;outline:2px solid #90c8ff}.board:focus{outline:none}@media (height<=450px){main{gap:4px}.keyboard{gap:3px}.key{height:28px}}