.g-lights-out{--c:64px;--gap:6px;margin:0 auto;padding:8px;max-width:100%;box-sizing:content-box;background:#1b2236;border-radius:14px;box-shadow:inset 0 0 0 2px #0f1422,var(--shadow);user-select:none;-webkit-user-select:none}.g-lights-out .lo-grid{display:grid;grid-template-columns:repeat(var(--n,5),var(--c));grid-auto-rows:var(--c);gap:var(--gap)}.g-lights-out .lo-cell{position:relative;width:var(--c);height:var(--c);padding:0;margin:0;border:0;border-radius:calc(var(--c) * .2);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:linear-gradient(160deg,#3b4766,#29324b);box-shadow:inset 0 2px rgba(255,255,255,.14),inset 0 -3px rgba(0,0,0,.35),0 1px 2px rgba(0,0,0,.4);transition:background .18s ease,box-shadow .18s ease;outline:none}.g-lights-out .lo-cell:hover{filter:brightness(1.15)}.g-lights-out .lo-cell.is-on{background:radial-gradient(circle at 50% 38%,#fff2b0 0%,#ffd34d 55%,#f2a900 100%);box-shadow:inset 0 2px rgba(255,255,255,.65),inset 0 -3px rgba(150,90,0,.35),0 0 calc(var(--c) * .3)rgba(255,205,60,.55)}.g-lights-out .lo-cell:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--focus);z-index:2}.g-lights-out .lo-cell.is-pop{animation:lo-pop .22s ease-out}.g-lights-out .lo-cell.is-mark::after{content:'';position:absolute;left:50%;top:50%;width:30%;height:30%;transform:translate(-50%,-50%);border-radius:50%;background:#1f9be0;box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(0,0,0,.45)}.g-lights-out .lo-cell.is-hint{box-shadow:0 0 0 3px #1f9be0,0 0 0 6px rgba(255,255,255,.9),0 0 14px 4px rgba(31,155,224,.8);animation:lo-hint .9s ease-in-out 3;z-index:2}@keyframes lo-pop{0%{transform:scale(.82)}60%{transform:scale(1.06)}100%{transform:scale(1)}}@keyframes lo-hint{50%{transform:scale(1.08)}}@media(prefers-reduced-motion:reduce){.g-lights-out .lo-cell{transition:none}.g-lights-out .lo-cell.is-pop,.g-lights-out .lo-cell.is-hint{animation:none}}