.lo{display:grid;gap:12px;justify-items:center;max-width:520px;margin:0 auto}.lo-msg{margin:0;min-height:2.6em;text-align:center;display:grid;place-items:center}.lo-board{--gap: clamp(4px, 1.6vw, 8px);display:grid;grid-template-columns:repeat(var(--n),1fr);gap:var(--gap);width:100%;max-width:460px;padding:var(--gap);border-radius:var(--radius);background:var(--table-2);box-shadow:var(--shadow);touch-action:manipulation}.lo-cell{appearance:none;position:relative;aspect-ratio:1;min-width:0;border-radius:18%;cursor:pointer;padding:0;border:2px solid color-mix(in srgb,var(--table) 60%,#000);background:color-mix(in srgb,var(--table) 75%,#000);box-shadow:inset 0 -3px #00000040;transition:background .15s,box-shadow .15s,transform .08s}.lo-cell:active{transform:scale(.94)}.lo-cell.on{background:radial-gradient(circle at 50% 42%,#fff8d6,#ffd84a 55%,#f0a800);border-color:#ffe38a;box-shadow:0 0 14px 2px #ffd64a99,inset 0 -3px #0000001f}.lo-cell:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.lo-dot{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.lo-cell.lo-press .lo-dot:after{content:"";width:30%;aspect-ratio:1;border-radius:50%;background:var(--accent);border:3px solid var(--accent-text);box-shadow:0 0 0 2px var(--accent)}.lo-cell.lo-hint{animation:lo-pulse .9s ease-in-out infinite alternate;outline:3px solid var(--good);outline-offset:2px}@keyframes lo-pulse{0%{transform:scale(1)}to{transform:scale(.9)}}.lo-won .lo-cell{animation:lo-glow .8s ease-out}@keyframes lo-glow{0%{box-shadow:0 0 18px 4px var(--good)}to{box-shadow:inset 0 -3px #00000040}}.lo-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}@media (prefers-reduced-motion: reduce){.lo-cell.lo-hint,.lo-won .lo-cell{animation:none}}