.layout-selector{--active:#111827;--inactive:#9ca3af;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;width:34px;height:34px;transform:scale(var(--scale,1)) translateZ(0);background:#fff;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;margin:0;padding:0;transition:background-color .25s,border-color .25s,box-shadow .25s,transform .16s;display:inline-flex;position:relative;box-shadow:0 1px 2px #0000000d,0 1px 3px #00000008}.layout-selector:hover{background-color:#fcfcfd;border-color:#e5e7eb}.layout-selector:active{--scale:.95}.layout-selector:focus-visible{outline:2px solid var(--inactive);outline-offset:2px}.layout-selector-icon{width:17px;height:17px;display:block;position:relative}.grid-icon{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);gap:3px;transition:opacity .3s,transform .4s cubic-bezier(.22,1,.36,1);display:grid;position:absolute;inset:0}.grid-square{background:var(--inactive);border-radius:2px;width:100%;height:100%;transition:background-color .25s,transform .4s cubic-bezier(.22,1,.36,1);display:block;transform:scale(1)}.layout-mode-1 .square-1,.layout-mode-2 .square-1,.layout-mode-2 .square-4,.layout-mode-3 .square-1,.layout-mode-3 .square-3,.layout-mode-3 .square-4{background:var(--active)}.layout-mode-2 .square-4,.layout-mode-3 .square-3{animation-delay:40ms}.layout-mode-3 .square-4{animation-delay:80ms}.layout-mode-1 .square-1,.layout-mode-2 .square-1,.layout-mode-2 .square-4,.layout-mode-3 .square-1,.layout-mode-3 .square-3,.layout-mode-3 .square-4{animation:.36s cubic-bezier(.22,1,.36,1) active-square}@keyframes active-square{0%{transform:scale(.7)}60%{transform:scale(1.08)}to{transform:scale(1)}}.layout-mode-4 .grid-icon{opacity:0;transform:scale(.7)rotate(-6deg)}.layout-mode-4 .list-icon{opacity:1;transform:scale(1)}.list-icon{opacity:0;flex-direction:column;justify-content:space-between;transition:opacity .25s,transform .4s cubic-bezier(.22,1,.36,1);display:flex;position:absolute;inset:1px;transform:scale(.7)rotate(6deg)}.list-icon span{background:var(--active);transform-origin:0;border-radius:2px;width:100%;height:2px;animation:.36s cubic-bezier(.22,1,.36,1) list-line-in;display:block}.list-icon span:nth-child(2){animation-delay:30ms}.list-icon span:nth-child(3){animation-delay:60ms}.list-icon span:nth-child(4){animation-delay:90ms}@keyframes list-line-in{0%{opacity:0;transform:translate(-6px)scaleX(.3)}60%{opacity:1;transform:translate(1px)scaleX(1.02)}to{opacity:1;transform:translate(0)scaleX(1)}}@media (prefers-reduced-motion:reduce){.layout-selector *,.layout-selector{transition:none!important;animation:none!important}}