.cursor-wrapper,.main-cursor{position:fixed;pointer-events:none;z-index:9999}.main-cursor{top:0;left:0}:root{--bg:#595080;--box:#b46f7523;--light:#b46f7523;--light2:#8d555a;--dark:#351919;--body:#251418;--alt:#ff949d;--buttonhover:#f9fd00}*{box-sizing:border-box}::-moz-selection{background:var(--body);color:var(--bg)}::selection{background:var(--body);color:var(--bg)}html{overflow-x:hidden}body:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#000;z-index:999;opacity:0;pointer-events:none;transition:inherit}body{font-family:Trebuchet MS,sans-serif;margin:0;padding:0}body.toggled:before{opacity:.5;mix-blend-mode:color-burn}main{display:flex;flex-wrap:wrap;width:1050px}.box,main{margin:auto;max-width:100%}.box{display:grid;padding:20px;border-radius:10px;border:2px solid;background:var(--box);box-shadow:5px 5px 3px inset hsla(0,0%,100%,.65),5px 10px 10px 5px inset var(--light),-6px -6px 1px inset var(--dark),3px 3px 0 rgba(0,0,0,.1),5px 5px 0 rgba(0,0,0,.1),7px 7px 0 rgba(0,0,0,.1),9px 9px 0 rgba(0,0,0,.1)}.box,.box-wrap{position:relative}.main-box{width:300px;min-height:300px;max-width:92%;margin:20px auto}.box:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;z-index:1;border-radius:inherit;pointer-events:none}.box-inner{padding:20px;background:var(--alt);border-radius:3px;border:2px solid;box-shadow:inset 2px 2px 5px rgba(0,0,0,.5),-3px -3px 5px rgba(0,0,0,.25),4px 4px 5px hsla(0,0%,100%,.75);position:relative;z-index:3;max-width:100%}.box-inner:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,var(--alt) 25%,transparent 25%,transparent 75%,var(--alt) 75%,var(--alt) 0),linear-gradient(45deg,var(--alt) 25%,transparent 25%,transparent 75%,var(--alt) 75%,var(--alt) 0),transparent;background-size:10px 10px,10px 10px;background-position:0 0,5px 5px;filter:brightness(.8);opacity:.25;mix-blend-mode:multiply}.box.toggler{height:100%;width:150px;align-content:center}.box.frame:before{content:"";position:absolute;top:10px;left:10px;width:calc(100% - 22px);height:calc(100% - 22px);border:2px solid;border-radius:5px;pointer-events:none}.box-inner .box:not(.toggler){margin-bottom:20px;display:block}.box-inner .box:last-of-type{margin-bottom:0}.toggler-inner{width:55px;height:110px;border:2px solid;border-radius:3px;margin:auto;background-image:linear-gradient(to bottom,var(--box) 0,var(--box) 20%,var(--bg) 30%,var(--light) 60%,var(--dark) 95%);box-shadow:0 0 3px 3px inset var(--bg),3px 3px 0 rgba(0,0,0,.1),5px 5px 0 rgba(0,0,0,.1),7px 7px 0 rgba(0,0,0,.1);position:relative;cursor:pointer;transition:all .2s steps(2);transform:perspective(400px);transform-style:preserve-3d}.toggler-inner:before{background:inherit;transform-style:preserve-3d;transform:perspective(500px) rotateX(35deg);top:calc(-12% - 2px);left:-2px;width:100%;height:112%;border:2px solid;box-shadow:inherit}.toggler-inner:after,.toggler-inner:before{content:"";position:absolute;border-radius:inherit;transition:inherit}.toggler-inner:after{top:100%;left:-5%;height:70%;width:calc(110% + 5px);background:#000;opacity:.3;filter:blur(2px);transform:skewx(20deg) translatex(25%);pointer-events:none}.toggler-inner.active:before{transform:perspective(500px) rotateX(-35deg);top:-3%}.toggler-inner.active:after{height:20%;transform:skewx(20deg) translatex(10%);width:110%}nav{width:100%;border-top:2px solid;margin-bottom:20px;border-bottom:2px solid;text-align:center;background:var(--light);position:sticky;top:0;z-index:9}nav:before{content:"";box-shadow:5px 5px 3px inset hsla(0,0%,100%,.65),5px 10px 10px 5px inset var(--light),-6px -6px 1px inset var(--dark),3px 3px 0 rgba(0,0,0,.1),5px 5px 0 rgba(0,0,0,.1),7px 7px 0 rgba(0,0,0,.1),9px 9px 0 rgba(0,0,0,.1);position:absolute;top:0;left:-20px;width:calc(100% + 40px);height:100%;z-index:-1;pointer-events:none}.nav-wrap{display:flex;width:calc(100% - 20px);max-width:1000px;margin:0 auto}nav a{padding:10px;flex-grow:1;color:inherit;text-transform:uppercase;font-weight:700;text-decoration:none;border-right:2px solid;transition:all .15s steps(2)}nav a:first-of-type{border-left:2px solid}nav a:focus,nav a:hover{background:var(--light2);box-shadow:-2px -2px 2px 2px inset hsla(0,0%,100%,.5),2px 2px 1px 2px inset var(--dark)}nav a:focus{filter:brightness(.9)}nav a span{display:inline-block;transition:inherit}nav a:focus span,nav a:hover span{transform:translatey(3px)}h1{width:100%;text-align:center;text-transform:uppercase;margin:0;padding:20px}h2,h3,h4{margin:.5em 0}h3{border-bottom:2px solid;padding-bottom:.5em}.button{background:var(--body);max-width:-moz-max-content;max-width:max-content;display:inline-block;font-weight:700;border:1px solid transparent;color:var(--buttonhover);text-decoration:none;text-transform:uppercase;letter-spacing:.05em;padding:.5em 1em;border-radius:3px;box-shadow:.2em .2em .2em .1em inset var(--light2),.2em .2em .2em rgba(238,255,0,.39);transition:all .2s steps(2)}.button:hover{color:var(--light2);background:var(--buttonhover);box-shadow:-.2em -.2em .2em .1em inset var(--body),.2em .2em .2em rgba(0,0,0,.25)}.button:focus{background:var(--dark);box-shadow:.2em .2em .2em .1em inset var(--body)}.button.alt{background:var(--bg);color:var(--body);box-shadow:inset 0 0 0 .1em transparent,.2em .2em .2em rgba(0,0,0,.25);border-color:currentcolor}.button.alt:hover{background:var(--light2)}.button.alt:focus{box-shadow:inset .2em .2em .2em .1em rgba(0,0,0,.25)}.screw{position:absolute;height:100%;top:0;width:18px;left:calc(50% - 9px)}.screw:after,.screw:before{position:absolute;width:18px;height:18px;border:2px solid;border-radius:100%;background:linear-gradient(160deg,#d4d4d4,#825a48 35%,#825a48 40%,#251418 0,#251418 60%,#825a48 0,#825a48 65%,#d4d4d4);box-shadow:3px 3px 3px rgba(0,0,0,.3),inset 3px 3px 3px hsla(0,100%,89%,.25),inset -3px -3px 3px rgba(0,0,0,.25)}.screw:before{content:"";top:18px}.screw:after{content:"";bottom:18px;transform:rotate(85deg);box-shadow:3px -3px 3px rgba(0,0,0,.3),inset 3px -3px 3px hsla(0,100%,89%,.25),inset -3px 3px 3px rgba(0,0,0,.25)}.screw.right{left:unset;right:20px}.screw.left{left:20px}.screw.rotated{transform:rotate(90deg);transition:transform .3s ease-in-out}.open-left{position:relative;transform:perspective(1000px) rotateY(0deg);transform-origin:left center;transition:transform 1s steps(10)}.open-left.toggled{transform:perspective(1000px) rotateY(-92deg)}.open-left.toggled a:before{content:" ";position:absolute;top:0;left:0;width:100%;height:100%;max-width:unset;background:#000;opacity:.05}.open-left .screw{transform:scalex(100%) translatex(0);transition:transform .5s steps(5)}.open-left.toggled .screw{transform:scalex(500%) translatex(-70%);transition-delay:.5s}.column-wrap{margin:0 auto;max-width:-moz-max-content;max-width:max-content}.outlet{border:2px solid;width:60px;height:50px;margin:5px auto;background:var(--light2);border-radius:40% 40% 50% 50%;box-shadow:3px 3px 3px rgba(0,0,0,.25),inset 3px 3px 3px rgba(0,0,0,.15),inset -3px -3px 3px hsla(0,0%,100%,.5);position:relative}.outlet:before{top:10px;left:15px;width:6px;height:16px;border-radius:3px;box-shadow:19px 0}.outlet:after,.outlet:before{content:"";position:absolute;background:var(--body)}.outlet:after{left:22.5px;bottom:7px;width:10px;height:10px;border-radius:90% 90% 3px 3px}