html{background-color:#000}body,#root{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;background-image:url(/dsl_bg.webp);background-position:center;background-size:cover}.r3f{touch-action:none}.banner-top{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:left;position:fixed;top:0;left:0;width:100%;zoom:1}.image-wrap{margin:60px;width:120px;height:120px;cursor:pointer}.interface{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center;position:fixed;bottom:0;left:0;width:100%;zoom:1}.interface-hand{position:absolute;bottom:0;left:0;width:100%;zoom:1;margin-bottom:20vh}@media screen and (max-width: 1439px){.interface{zoom:.5}.interface-hand{zoom:.5;margin-bottom:25vh}.banner-top{zoom:.5}}@media screen and (max-width: 480px){.interface{zoom:.5}.interface-hand{zoom:1;margin-bottom:16vh}.banner-top{justify-content:center;zoom:.5}}.action-card{display:flex;flex-direction:column;justify-content:center;text-align:center;font-family:Montserrat,serif;font-style:normal;pointer-events:all;margin-bottom:80px;margin-left:30px;margin-right:30px;width:120px;cursor:pointer}.action-card-row{display:flex;flex-direction:row;justify-content:center;text-align:center;font-family:Montserrat,serif;font-style:normal;pointer-events:all;top:0;right:0;margin-top:80px;margin-left:auto;padding-right:80px;height:50px;cursor:pointer}.dot{margin:auto;border-radius:50%;width:50px;height:50px;line-height:50px;pointer-events:inherit;cursor:pointer;border:3px solid #FAFAFA;text-align:center;vertical-align:middle;font-size:18pt;color:#fafafa}.line-left-grey{position:absolute;margin:28px 50% auto auto;top:0;left:0;bottom:0;right:0;width:64px;height:3px;background:#fafafa}.line-right-grey{position:absolute;top:0;left:0;bottom:0;right:0;width:64px;height:3px;background:#fafafa;margin:28px auto auto 50%}.line-left-red{position:absolute;margin:28px 50% auto auto;top:0;left:0;bottom:0;right:0;width:64px;height:3px;background:#f2330d}.line-right-red{position:absolute;top:0;left:0;bottom:0;right:0;width:64px;height:3px;background:#f2330d;margin:28px auto auto 50%}.text-button{margin-top:10px;font-size:18pt;color:#fafafa;pointer-events:inherit;cursor:pointer}.text-button-row{margin-top:12px;margin-right:10px;font-size:18pt;color:#fafafa;pointer-events:inherit;cursor:pointer}.action-card:hover>.dot{border:3px solid #F2330D;color:#f2330d}.action-card:hover>.text-button{color:#f2330d}.action-card:hover~.line-left-grey{background:#f2330d}.action-card:hover~.line-right-grey{background:#f2330d}.action-card:active>.dot{border:3px solid #F2330D;color:#f2330d}.action-card:active>.text-button{color:#f2330d}.action-card-row:hover>.dot{border:3px solid #F2330D;color:#f2330d}.action-card-row:hover>.text-button-row{color:#f2330d}.action-card-row:active>.dot{border:3px solid #F2330D;color:#f2330d}.action-card-row:active>.text-button-row{color:#f2330d}.action-card-disabled{display:flex;flex-direction:column;justify-content:center;text-align:center;font-family:Montserrat,serif;font-style:normal;pointer-events:none;margin-bottom:80px;margin-left:30px;margin-right:30px;width:120px}.action-card-disabled>.dot{border:3px solid #F2330D;color:#f2330d}.action-card-disabled>.text-button{color:#f2330d}.text{color:#fff;font-family:Montserrat,serif;font-style:normal;text-align:left}.hand{width:30px;height:30px;background-image:url(/hand.svg);background-size:contain;position:relative;margin-left:auto;margin-right:auto;left:0;bottom:0;animation:mymove 2s infinite}@keyframes mymove{0%{opacity:.25;left:-10px}25%{opacity:.5}50%{opacity:.25;left:10px}75%{opacity:.5}to{opacity:.25;left:-10px}}.point{position:absolute;top:50%;left:50%;width:40px;height:40px;pointer-events:none}.point .pulse{position:absolute;top:-20px;left:-20px;width:28px;height:28px;border-radius:50%;border:2px solid #FAFAFA;touch-action:none;pointer-events:none;scale:0;opacity:100%;animation-name:pulse;animation-duration:2s;animation-iteration-count:infinite}@keyframes pulse{0%{scale:0;opacity:0%}33%{opacity:0%}50%{opacity:25%}to{scale:2;opacity:0%}}.point .label{position:absolute;top:-20px;left:-20px;width:28px;height:28px;border-radius:50%;opacity:100%;border:2px solid #fafafa00;background:#f2330dc0;color:#fafafab2;font-family:Helvetica,Arial,sans-serif;text-align:center;line-height:28px;font-weight:500;font-size:24px;animation-name:label;animation-duration:2s;animation-iteration-count:1;cursor:help;touch-action:none;pointer-events:auto}@keyframes label{0%{scale:0;opacity:0%}to{scale:1;opacity:100%}}.label:hover{background:#fafafa;opacity:100%}.label-hidden{transform:scale(0)}.reset{font-family:Montserrat,serif;width:120px;height:auto;margin-left:auto;border-radius:6px;background:#f2330d;pointer-events:auto;cursor:pointer;text-align:center;font-size:18pt;color:#fff;padding-top:10px;padding-bottom:10px;touch-action:none;display:block;border:2px solid #F2330D}.reset:hover{background:#000;border:2px solid #FAFAFA}.reset:active{background:#fafafa;color:#000;border:2px solid #FAFAFA}.p{top:33dvh;left:0dvw;position:fixed;max-width:420px;background:#000;padding:25px;margin-right:0;transform:translate(-100%);text-align:left;color:#fff;vertical-align:middle;touch-action:none;display:flex;flex-direction:column}.p .heading{font-family:Montserrat,serif;font-optical-sizing:auto;font-weight:700;font-size:32px;margin-bottom:18px}.p .body{font-family:Montserrat,serif;font-optical-sizing:auto;font-weight:500;font-size:18px;margin-bottom:36px}.p.show{transform:translate(0);animation-name:in;animation-duration:1s}.p.hide{transform:translate(-100%);animation-name:out;animation-duration:1s}@keyframes in{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes out{0%{transform:translate(0)}to{transform:translate(-100%)}}@media screen and (max-width: 600px) and (min-width: 0px){.banner-top{zoom:.5}.p{padding:0%;position:fixed;top:auto;bottom:0;transform:translateY(100%)}.p .heading{padding:30px 30px 0;zoom:.6}.p .body{padding:0 30px;zoom:.6}.reset{margin-bottom:30px;margin-right:30px;font-size:12pt;padding-top:6px;padding-bottom:6px;width:90px}.point .label{font-size:22px;line-height:26px}@keyframes in{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes out{0%{transform:translateY(0)}to{transform:translateY(100%)}}}@media screen and (min-width: 600px) and (max-width: 1024px){.text-button,.text-button-row{font-size:10pt}.banner-top{zoom:.5}.p{position:fixed;top:auto;bottom:0;max-width:320px}.p .heading{font-size:26px}.p .body{font-size:16px}.reset{font-size:12pt}}@media screen and (min-width: 1024px) and (max-width: 1600px){.text-button,.text-button-row{font-size:10pt}.banner-top{zoom:.5}.p{position:fixed;top:auto;bottom:20%;max-width:320px}.p .heading{font-size:26px}.p .body{font-size:16px}.point .label{font-size:16px;line-height:26px}.dot,.reset{font-size:12pt}}
