/* Quiet graphite controls, silver edges, accessible motion. */
#mainNav button{position:relative;isolation:isolate;overflow:hidden;outline:none;border:1px solid transparent;border-radius:10px;background:transparent;color:#99999e;padding:12px 13px;margin:5px 0;box-shadow:none;transform:none;transition:background .24s ease,border-color .24s ease,color .24s ease,box-shadow .24s ease}
#mainNav button .icon{color:#85858a;transition:color .24s ease,transform .24s ease}
#mainNav button::before{content:'';position:absolute;left:0;top:27%;bottom:27%;width:2px;border-radius:2px;background:linear-gradient(#f1f1f4,#85858d);opacity:0;transform:scaleY(.35);transition:opacity .25s,transform .3s}
#mainNav button::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 20%,#ffffff07 48%,transparent 75%);transform:translateX(-140%);transition:transform .75s ease}
#mainNav button:hover{background:#ffffff05;border-color:#ffffff0b;color:#e8e8ea;transform:none;box-shadow:none}
#mainNav button:hover::after{transform:translateX(140%)}
#mainNav button:hover .icon{color:#d5d5da;transform:translateX(1px)}
#mainNav button.active,#mainNav button.active:hover{background:linear-gradient(115deg,#242427,#141416 75%);color:#f0f0f2;border:1px solid #ffffff1c;outline:none;box-shadow:inset 0 1px #ffffff06,0 3px 12px #0002;transform:none}
#mainNav button.active::before{opacity:1;transform:scaleY(1)}
#mainNav button.active .icon{color:#d8d8de}
#mainNav button:focus-visible{outline:2px solid #a9a9b1;outline-offset:2px}
#mainNav button:active{background:#27272b;transition-duration:.08s}
#mainNav .nav-count{background:#ffffff09;color:#bbb;border:1px solid #ffffff0b}
.button:not(.danger):not(.ghost),.button.primary{background:linear-gradient(145deg,#333336,#202022 65%,#28282b);color:#ededf0;border:1px solid #77777f;border-bottom-color:#44444b;box-shadow:inset 0 1px #ffffff0a,0 3px 10px #0003;font-weight:600;transition:background .25s,border-color .25s,box-shadow .25s,transform .2s}
.button:not(.danger):not(.ghost):hover,.button.primary:hover{background:linear-gradient(145deg,#414145,#27272b 65%,#313135);border-color:#a2a2aa;color:#fff;filter:none;box-shadow:inset 0 1px #ffffff13,0 5px 18px #0005;transform:translateY(-1px)}
.button:not(.danger):not(.ghost)::after{background:linear-gradient(110deg,transparent 25%,#ffffff0e 48%,transparent 70%);transition:transform .8s ease}
.button.ghost{border-color:#ffffff18;background:transparent;color:#bdbdc4}.button.ghost:hover{background:#ffffff05;border-color:#ffffff30;color:#eee}
.button:active{transform:translateY(0)!important;box-shadow:inset 0 1px 5px #0004!important}.button:disabled{transform:none!important}.button:disabled::after{display:none}
@media(prefers-reduced-motion:reduce){#mainNav button,#mainNav button::before,#mainNav button::after,#mainNav button .icon,.button{transition:none!important}#mainNav button::after,.button::after{display:none}}
