:root{--cpd-purple: #8208df;--cpd-pink: #f739b2;--cpd-orange: #fe9f2a;--cpd-blue: #20ebee;--cpd-green: #adff2f;--cpd-dark-text: #303030;--cpd-font: "Orbitron", sans-serif;--cpd-font-alt: "Chakra Petch", sans-serif}body{margin:0;background-color:#000;overflow:hidden;overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none}button{outline:none!important;cursor:pointer;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}select{outline:none!important;cursor:pointer}.hidden{display:none!important}#app-loading{position:relative;color:gray;background-color:#000;flex:1;gap:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;overflow:hidden;font-family:var(--cpd-font);font-size:20px;width:100dvw;height:100dvh}#copyright{position:fixed;bottom:0;font-family:sans-serif;font-size:16px;padding:20px}.hide-username-labels .username-label{opacity:0!important}.username-label{will-change:transform,opacity;top:0;left:0;position:absolute;pointer-events:none;color:#fff;font-family:var(--cpd-font-alt);font-size:12px;text-shadow:1px 1px 3px black;opacity:1;transition:opacity .5s ease;max-width:100px;z-index:1}.username-label .npc-tag{margin-right:4px;font-weight:700;color:var(--cpd-blue)}.line-clamp-1,.line-clamp-2,.line-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word;white-space:normal}.line-clamp-1{-webkit-line-clamp:1;line-clamp:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.line-clamp-2{-webkit-line-clamp:2;line-clamp:2}.line-clamp-3{-webkit-line-clamp:3;line-clamp:3}difficulty-selector-screen{justify-content:center;align-items:center}home-screen{justify-content:center;align-items:center}home-screen header{text-align:center}home-screen .title-wrap{position:relative;display:inline-block;padding:8px 14px}home-screen .title-line{margin:0;line-height:1.05;letter-spacing:.02em}home-screen .title-en{font-family:BEYONDERS,sans-serif;font-weight:700;font-size:clamp(28px,12dvw,72px);text-transform:uppercase;color:#efe9f6}home-screen .title-en.small{font-size:clamp(18px,5dvw,36px);margin-top:4px}home-screen .title-jp{font-family:Noto Sans JP,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;font-size:clamp(14px,1.5dvw,22px);opacity:.9;letter-spacing:.14em;margin-top:10px;color:#d2f6ff;text-shadow:0 0 8px rgba(0,240,255,.4)}home-screen .title-glitch{position:relative;display:inline-block;text-shadow:0 0 14px rgba(168,107,255,.35),0 0 26px rgba(255,46,152,.45)}home-screen .title-glitch:before,home-screen .title-glitch:after{content:attr(data-text);position:absolute;inset:0}home-screen .title-glitch:before{left:1px;text-shadow:-1px 0 #a86bff;clip-path:polygon(0 2%,100% 0,100% 40%,0 42%)}home-screen .title-glitch:after{left:-1px;text-shadow:1px 0 var(--cpd-pink);clip-path:polygon(0 60%,100% 58%,100% 100%,0 100%)}:root{--main-menu-content-max-width: 600px}main-menu{position:fixed;z-index:99999;top:0;left:0}main-menu #container{position:relative;color:#e9e6f6;background:radial-gradient(1200px 800px at 80% 15%,rgba(255,46,152,.1),transparent 60%),radial-gradient(1000px 700px at 10% 80%,rgba(168,107,255,.1),transparent 60%),linear-gradient(180deg,#120c1a,#0a0710 70%,#07040c);flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;overflow:hidden;font-family:var(--cpd-font-alt);width:100dvw;height:100dvh}main-menu .bg{position:absolute;inset:0;pointer-events:none}main-menu .bg-gradient{background:radial-gradient(900px 600px at 85% 20%,rgba(255,46,152,.15),transparent 60%),radial-gradient(700px 500px at 15% 75%,rgba(168,107,255,.2),transparent 60%),radial-gradient(500px 300px at 50% 85%,rgba(255,46,152,.1),transparent 70%),radial-gradient(320px 200px at 18% 24%,rgba(168,107,255,.1),transparent 70%),linear-gradient(210deg,#ff2e9833,#ff2e9800 35%),linear-gradient(210deg,#a86bff33 10%,#a86bff00 45%)}main-menu .bg-grid{transform:perspective(300px) rotateX(55deg) translate3d(0,110px,0);background-image:linear-gradient(to right,rgba(255,46,152,.25) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,46,152,.25) 1px,transparent 1px);background-size:60px 60px,60px 60px;background-position:0 0,0 0;animation:gridScroll 10s linear infinite;filter:none}@keyframes gridScroll{0%{background-position:0 0,0 0}to{background-position:0 0,0 -360px}}main-menu #screen-content .screen,main-menu #screen-content{position:relative;flex:1;display:flex;flex-direction:column;width:100%;max-width:var(--main-menu-content-max-width)}main-menu #screen-content .screen.slide-animation{position:absolute;inset:0}main-menu footer{width:100%;z-index:99;display:flex;justify-content:space-between;opacity:.6;max-width:var(--main-menu-content-max-width)}main-menu #enable-audio-button{background:none;border:none;padding:0 7px}main-menu #enable-audio-button i{font-size:35px;display:inline-flex;vertical-align:middle}main-menu #back-button{opacity:0;transition:opacity .5s ease;background:none;color:#fff;outline:none;border:none;font-size:16px;padding:0;font-family:var(--cpd-font-alt);display:flex;align-items:center;gap:7px;font-weight:700;text-transform:uppercase;white-space:nowrap;pointer-events:none}main-menu #back-button i{font-size:26px;padding-top:2px}main-menu #back-button.active{opacity:1;pointer-events:all}main-menu .actions{perspective:900px;margin-top:7dvh;margin-bottom:7dvh;display:flex;flex-direction:column;align-items:center;gap:20px;width:300px}main-menu .btn-cpd{font-family:var(--cpd-font-alt);position:relative;border-radius:7px;border:2px solid var(--cpd-pink);height:60px;width:180px;background:#9c558369;color:#fff;text-transform:uppercase;font-weight:700;font-size:18px;box-shadow:0 2px 15px 3px #f739b1c9,0 0 15px #831c5e inset;transform:translateZ(0);transition:transform .7s,opacity .7s;will-change:transform,opacity;transform:translateZ(0) rotate3d(-1,1,0,-25deg);padding:0}main-menu #screen-content .screen.pre-reveal .btn-cpd{opacity:0%;transform:translate3d(0,100px,0) rotateY(30deg);pointer-events:none}main-menu .btn-cpd:focus{outline:none}main-menu .btn-cpd>div{position:relative;overflow:hidden;width:100%;height:100%;display:flex;justify-content:center;align-items:center}main-menu .btn-cpd .btn-frame{position:absolute;left:-6px;top:-6px;width:calc(100% + 12px);height:calc(100% + 12px);pointer-events:none;border-radius:inherit;background-image:linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink));background-repeat:no-repeat;background-size:18px 2px,2px 18px,18px 2px,2px 18px;background-position:6px 6px,6px 6px,calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) calc(100% - 6px);opacity:.95}main-menu .btn-cpd:first-child{border-top-left-radius:0;border-top-right-radius:0}main-menu .btn-cpd:last-child{border-bottom-left-radius:0;border-bottom-right-radius:0}main-menu .btn-cpd:before,main-menu .btn-cpd:after{position:absolute;background-color:transparent;width:100%;right:-2px;height:8px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 9' preserveAspectRatio='none'><g fill='%23f739b2'><polygon points='24,9 30,9 38,0 32,0'/><polygon points='34,9 40,9 48,0 42,0'/><polygon points='52,0 100,0 100,9 44,9'/></g></svg>") no-repeat left top / 100% 100%;border-top-right-radius:15px}main-menu .btn-cpd:first-child:before{content:"";top:-15px}main-menu .btn-cpd:last-child:after{content:"";bottom:-15px;transform:scale3d(1,-1,1)}main-menu .vignette{position:absolute;inset:-2px;pointer-events:none;box-shadow:inset 0 0 10vw 2vw #00000080}:root{--profile-screen-active-color: rgb(0, 255, 200)}profile-screen #username-input{height:50px;margin-bottom:10px;width:100%;max-width:var(--main-menu-content-max-width)}profile-screen #username-input input{width:100%;border:none;border-bottom:1px solid rgba(255,255,255,.4);border-radius:5px;background-color:#ffffff0f;outline:none;padding:3px 10px;color:var(--profile-screen-active-color)}profile-screen #username-input[data-error]:after{content:attr(data-error);white-space:nowrap;display:block;color:var(--cpd-green);font-size:14px;font-style:italic}profile-screen h2{opacity:.6;font-size:14px;margin-left:10px;margin-bottom:10px;font-style:italic}profile-screen #character-picker{display:flex;flex:1;gap:10px}profile-screen #left-side{display:flex;flex-direction:column;justify-content:space-between;padding-top:10px;padding-bottom:15px}profile-screen #character-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:7px;width:220px}profile-screen #character-list li{padding:5px 30px;border-radius:5px;background-color:#ffffff0d;cursor:pointer;width:100%;max-width:150px;color:#ffffff8b}profile-screen #character-list li.selected{color:#fff;text-shadow:0px 0px 7px #ffffff}profile-screen #character-preview{position:absolute;left:-20px;width:100dvw;max-width:450px;height:calc(100dvh - 220px);max-height:500px;min-height:250px;pointer-events:none}profile-screen #btn-confirm{color:#ffffffe6;font-size:16px;height:50px;width:150px;margin-top:25px;font-family:var(--cpd-font-alt);position:relative;border-radius:0 0 7px 7px;border:2px solid var(--cpd-pink);background:#9c558369;text-transform:uppercase;font-weight:700;box-shadow:0 2px 15px 3px #f739b1c9,0 0 15px #831c5e inset;padding:0;z-index:99}profile-screen #btn-confirm:before{content:"";position:absolute;left:-6px;top:-6px;width:calc(100% + 12px);height:calc(100% + 12px);pointer-events:none;z-index:2;border-radius:inherit;background-image:linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink));background-repeat:no-repeat;background-size:18px 2px,2px 18px,18px 2px,2px 18px;background-position:6px 6px,6px 6px,calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) calc(100% - 6px);opacity:.95}profile-screen #btn-confirm:after{content:"";position:absolute;z-index:100;background-color:transparent;width:100%;right:-2px;height:8px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 9' preserveAspectRatio='none'><g fill='%23f739b2'><polygon points='24,9 30,9 38,0 32,0'/><polygon points='34,9 40,9 48,0 42,0'/><polygon points='52,0 100,0 100,9 44,9'/></g></svg>") no-repeat left top / 100% 100%;border-top-right-radius:15px;top:-14px}:root{--toggle-switch-color: #b11d7b}.settings-grid{display:grid;grid-template-columns:1fr;padding:15px;gap:30px;margin-top:30px}.settings-row{justify-content:space-between;align-items:center;display:flex}.settings-row select{width:fit-content;background-color:#372536;border-radius:5px;padding:3px 5px}.form-check{display:flex;align-items:center;gap:15px;padding:0}.settings-actions{margin-top:15px;display:flex;justify-content:flex-end}.form-switch .form-check-input{width:50px;height:25px;background-color:#acacac;border:none;background-image:url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="-4 -4 8 8"%3e%3ccircle r="3" fill="%23fff"/%3e%3c/svg%3e');background-position:left center;background-repeat:no-repeat;background-size:contain;transition:background-position .3s ease,background-color .3s ease;cursor:pointer}.form-switch .form-check-input:checked{background-color:var(--toggle-switch-color);background-position:right center;background-image:url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="-4 -4 8 8"%3e%3ccircle r="3" fill="%23fff"/%3e%3c/svg%3e')}.form-switch .form-check-input:focus{box-shadow:none}loading-screen{display:flex;align-items:center;justify-content:center}loading-screen .spinner-border{color:#fffb;width:40px;height:40px}:root{--card-color: #20ebee;--card-shadow: drop-shadow(0px 0px 20px #20ebee);--card-bg: #20ebee2d}cyberpunk-card{display:flex;justify-content:center;align-items:center}cyberpunk-card .inner-card{flex:1;min-width:300px;max-width:100%;position:relative;filter:var(--card-shadow);padding:30px 20px;background:linear-gradient(-135deg,transparent 4.8px,var(--card-color) 4.8px 9.6px,transparent 9.6px 14.4px,var(--card-color) 14.4px 19.2px,transparent 19.2px 24px,var(--card-color) 24px 28.8px,transparent 28.8px)}cyberpunk-card .dots:before,cyberpunk-card .dots:after{content:"";position:absolute;height:60%;aspect-ratio:1 / 1;border:2px solid var(--card-color);border-radius:50%}cyberpunk-card .dots:before{left:7px}cyberpunk-card .dots:after{right:7px;background:var(--card-color)}cyberpunk-card .dots{position:absolute;top:2px;right:48px;height:17px;width:48px}cyberpunk-card .inner-card>.augmented:before,cyberpunk-card .inner-card>.augmented:after{inset:0 -1px -1px}cyberpunk-card .inner-card>.augmented{border:1px dashed var(--card-color);border-top:none;border-bottom-right-radius:19.2px;position:absolute;inset:0;z-index:-1;--aug-border: initial;--aug-border-all: 4.8px;--aug-border-bg: linear-gradient(-135deg, var(--card-color) 30%, transparent 30%), linear-gradient(45deg, var(--card-color) 5% 29%, transparent 29%), radial-gradient(circle at top left, var(--card-color) 72px, transparent 72px), linear-gradient(to bottom, transparent 7.44px, var(--card-color) 7.44px 19.2px, transparent 19.2px);--aug-inlay: initial;--aug-inlay-all: 2.4px;--aug-inlay-bg: var(--card-bg);--aug-tr1: 19.2px;--aug-tr2: 14.4px;--aug-tr-extend1: 30%;--aug-b: 12px;--aug-b-extend1: 15%;--aug-b-center: 30%;--aug-clip-bl1: initial;--aug-bl1: 12px;--aug-round-br1: initial;--aug-br1: 19.2px;--aug-clip-tl1: initial;--aug-tl1: 24px;--aug-rect-t1: initial;--aug-t-center: 72px;--aug-t1: 7.2px}@media (max-width: 600px){debug-controls *:not(.stats){display:none!important}debug-controls .stats>canvas:last-child{display:none!important}debug-controls .stats{margin:0!important}debug-controls{width:80px;padding:0!important}}debug-controls{display:flex;flex-direction:column;gap:5px;position:fixed;top:10px;right:10px;z-index:1000;background:#1e1e1e66;border-radius:10px;padding:15px;color:#fff;max-width:220px;font-size:12px}debug-controls label{display:flex;align-items:center;cursor:pointer}debug-controls input[type=checkbox]{cursor:pointer;accent-color:#0DF4F7;margin-right:10px;border-radius:4px}debug-controls input[type=checkbox]:focus{outline:none}debug-controls #debug-renderer-stats>div{width:150px;justify-content:space-between;display:flex}debug-controls #debug-renderer-stats{color:silver}debug-controls .renderer-stat{color:var(--cpd-green)}debug-controls .stats{margin-top:7px;display:flex;gap:10px;position:relative!important;flex-wrap:wrap;cursor:default;-webkit-user-select:none;user-select:none;pointer-events:none}debug-controls .stats canvas{display:block!important}:root{--challenge-notification-transition-time: .7s}challenge-notification[data-direction=outgoing]{--card-color: #f739b2;--card-shadow: drop-shadow(0px 0px 20px #f739b2);--card-bg: #f739b22d}challenge-notification[data-direction=incoming]{--card-color: #20ebee;--card-shadow: drop-shadow(0px 0px 20px #20ebee);--card-bg: #20ebee2d}challenge-notification[data-direction=incoming] .incoming-text,challenge-notification[data-direction=outgoing] .outgoing-text{display:block}challenge-notification[data-direction=outgoing] .incoming-text,challenge-notification[data-direction=incoming] .outgoing-text{display:none}challenge-notification cyberpunk-card{visibility:hidden;opacity:0;position:fixed;z-index:999;top:70px;left:50dvw;perspective:150px;transform:translate3d(-50%,-100px,0);transition:opacity var(--challenge-notification-transition-time) ease,transform var(--challenge-notification-transition-time) ease,visibility 0s linear var(--challenge-notification-transition-time);color:#fff;width:calc(100% - 40px);max-width:400px;font-family:var(--cpd-font);text-align:center;pointer-events:none;will-change:transform,opacity}challenge-notification.active cyberpunk-card{visibility:visible;opacity:1;pointer-events:auto;transform:translate3d(-50%,0,0);transition-delay:0s}challenge-notification .inner-card{transition:transform var(--challenge-notification-transition-time) ease}challenge-notification.active .inner-card{transform:rotateX(-5deg)}challenge-notification h1{color:#fffc}challenge-notification .body-text{font-family:var(--cpd-font-alt);display:flex;gap:7px;justify-content:center;flex-wrap:nowrap}challenge-notification .username{max-width:150px}challenge-notification .buttons-container{display:flex;justify-content:space-evenly;flex-wrap:nowrap}challenge-notification button{margin:20px 10px 0;font-family:var(--cpd-font-alt);font-size:18px;color:var(--cpd-dark-text);padding:15px 5px;width:120px;min-width:fit-content;max-width:50%;border-radius:10px;border:none;box-shadow:0 5px 15px #0006,0 0 15px #0003 inset;color:#fff;display:flex;align-items:center;justify-content:center}challenge-notification button.affirmative{background:linear-gradient(135deg,#09edde,#00b3ff)}challenge-notification button.negative{background:linear-gradient(135deg,#e4287d,#f4739e)}challenge-notification .time-remaining{pointer-events:none;color:#ffffffc7;display:inline-block;width:30px;text-align:end}:root{--status-notification-transition-time: .4s}status-notification{visibility:hidden;opacity:0;position:fixed;z-index:999;bottom:30dvh;left:20px;color:#fff;width:calc(100dvw - 175px);max-width:fit-content;font-family:var(--cpd-font-alt);transform:translate3d(0,30px,0);transition:opacity var(--status-notification-transition-time) ease,transform var(--status-notification-transition-time) ease,visibility 0s linear var(--status-notification-transition-time);will-change:opacity,transform;pointer-events:none;font-size:14px;text-shadow:1px 1px 5px rgba(0,0,0,.75)}status-notification.active{visibility:visible;opacity:1;transform:translateZ(0);transition-delay:0s}:root{--dialog-box-transition-time: .7s}dialog-box cyberpunk-card{--card-color: #909090;--card-shadow: drop-shadow(0px 0px 20px #454545);--card-bg: rgba(45, 45, 45, .6);visibility:hidden;opacity:0;position:fixed;z-index:999;bottom:70px;left:50dvw;perspective:150px;transform:translate3d(-50%,100px,0);transition:opacity var(--dialog-box-transition-time) ease,transform var(--dialog-box-transition-time) ease,visibility 0s linear var(--dialog-box-transition-time);color:#fff;width:calc(100% - 40px);max-width:420px;font-family:var(--cpd-font-alt);text-align:left;pointer-events:none;will-change:transform,opacity}dialog-box.active cyberpunk-card{visibility:visible;opacity:1;pointer-events:auto;transform:translate3d(-50%,0,0);transition-delay:0s}dialog-box .inner-card{padding:18px 20px;transition:transform var(--dialog-box-transition-time) ease;will-change:transform}dialog-box.active .inner-card{transform:rotateX(2deg)}dialog-box h1{font-family:var(--cpd-font);margin:10px 0;font-size:20px;color:#ababab}dialog-box .body-text{margin-top:12px}dialog-box .buttons-container{display:flex;justify-content:end;gap:15px;margin:20px 10px}dialog-box .buttons-container button{font-family:var(--cpd-font-alt);font-size:16px;color:var(--cpd-dark-text);padding:10px 5px;width:100px;min-width:fit-content;max-width:50%;border-radius:10px;border:none;box-shadow:0 5px 10px #0006,0 0 10px #0003 inset;color:#fff;display:flex;align-items:center;justify-content:center}:root{--interaction-buttons-transition-time: .5s}interaction-buttons{position:fixed;z-index:999;width:80px;height:fit-content;right:45px;display:flex;flex-direction:column;gap:30px;perspective:700px;z-index:10}interaction-buttons:not(.enabled) .btn-interaction{opacity:0%;transform:translate3d(0,40px,0) rotateY(30deg);pointer-events:none}interaction-buttons.enabled .btn-interaction{opacity:1;transform:translateZ(0) rotateY(-30deg)}interaction-buttons .btn-interaction{position:relative;border-radius:7px;border:2px solid var(--cpd-pink);height:50px;width:110px;background:#9c558369;color:#fff;font-family:var(--cpd-font);font-size:14px;box-shadow:0 2px 15px 2px #f739b1c9,0 0 15px #f739b1 inset;opacity:100%;transform:translateZ(0);transition:opacity var(--interaction-buttons-transition-time),transform var(--interaction-buttons-transition-time);will-change:opacity,transform;padding:0 5px;letter-spacing:1.2px}interaction-buttons .btn-interaction .btn-frame{position:absolute;left:-6px;top:-6px;width:calc(100% + 12px);height:calc(100% + 12px);pointer-events:none;z-index:2;border-radius:inherit;background-image:linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink)),linear-gradient(var(--cpd-pink),var(--cpd-pink));background-repeat:no-repeat;background-size:18px 2px,2px 18px,18px 2px,2px 18px;background-position:6px 6px,6px 6px,calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) calc(100% - 6px);opacity:.95}interaction-buttons .btn-interaction:first-child{border-top-left-radius:0;border-top-right-radius:0}interaction-buttons .btn-interaction:last-child{border-bottom-left-radius:0;border-bottom-right-radius:0}interaction-buttons .btn-interaction:before,interaction-buttons .btn-interaction:after{position:absolute;z-index:100;background-color:transparent;width:100%;right:-2px;height:8px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 9' preserveAspectRatio='none'><g fill='%23f739b2'><polygon points='24,9 30,9 38,0 32,0'/><polygon points='34,9 40,9 48,0 42,0'/><polygon points='52,0 100,0 100,9 44,9'/></g></svg>") no-repeat left top / 100% 100%;border-top-right-radius:15px}interaction-buttons .btn-interaction:first-child:before{content:"";top:-15px}interaction-buttons .btn-interaction:last-child:after{content:"";bottom:-15px;transform:scaleY(-1)}:root{--player-stats-transition-time: .7s}player-stats-menu cyberpunk-card{--card-color: #08dfa2;--card-shadow: drop-shadow(0px 0px 20px #08dfa2);--card-bg: rgba(8, 223, 162, .25);visibility:hidden;opacity:0;position:fixed;z-index:999;top:70px;left:50dvw;perspective:150px;transform:translate3d(-50%,-100px,0);transition:opacity var(--player-stats-transition-time) ease,transform var(--player-stats-transition-time) ease,visibility 0s linear var(--player-stats-transition-time);color:#fff;width:calc(100% - 40px);max-width:420px;font-family:var(--cpd-font-alt);text-align:left;pointer-events:none;will-change:transform,opacity}player-stats-menu.active cyberpunk-card{visibility:visible;opacity:1;pointer-events:auto;transform:translate3d(-50%,0,0);transition-delay:0s}player-stats-menu .inner-card{padding:18px 20px;transition:transform var(--player-stats-transition-time) ease;height:430px;will-change:transform;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}player-stats-menu.active .inner-card{transform:rotateX(-2deg)}player-stats-menu h1{font-family:var(--cpd-font);margin:10px 0;font-size:20px;color:#fffc}player-stats-menu .body{margin-top:12px}player-stats-menu .stats-container{opacity:1;transition:opacity .3s ease}player-stats-menu .stats-container.loading{opacity:.5}player-stats-menu .stat-row{display:flex;align-items:center;padding:3px 0}player-stats-menu .grid-judgments{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}player-stats-menu .label{opacity:.8;font-size:14px;margin-right:10px}player-stats-menu .value{font-weight:700;font-size:16px}player-stats-menu .actions{margin-top:20px;width:100%;justify-content:flex-end}player-stats-menu button.close-action{border-radius:10px;border:none;background:linear-gradient(135deg,#17e4aa,0%,#08dfa2);color:var(--cpd-dark-text);cursor:pointer;padding:15px 5px;width:120px;min-width:fit-content;max-width:50%}:root{--low-energy-color: #ff3b3b;--low-energy-blink-color: #fe2d2daf;--energy-indicator-font-family: var(--cpd-font);--energy-indicator-font-size: 14px}energy-indicator{position:fixed;z-index:99;top:7px;left:7px;color:var(--cpd-green);text-shadow:0px 0px 10px var(--cpd-green);font-family:var(--energy-indicator-font-family);font-size:var(--energy-indicator-font-size);pointer-events:none;border-top:3px solid var(--cpd-green);border-left:1px dashed #ffffff;border-radius:10px 0;padding:0 5px;display:flex;align-items:center;will-change:transform;transform-origin:center center;transition:transform .5s ease}energy-indicator i{font-size:20px;margin-right:5px}energy-indicator .energy-value{display:inline-block;transition:width .3s ease}energy-indicator.focused{transform:translate3d(calc(50dvw - 50%),20dvh,0) scale3d(1.3,1.3,1)}energy-indicator.low-energy-warning{border-top:3px solid var(--low-energy-color);color:var(--low-energy-color);text-shadow:0px 0px 10px black;animation:pulse-low-energy 1s infinite}@keyframes pulse-low-energy{0%{color:var(--low-energy-color);border-top-color:var(--low-energy-color)}50%{color:var(--low-energy-blink-color);border-top-color:var(--low-energy-blink-color)}to{color:var(--low-energy-color);border-top-color:var(--low-energy-color)}}energy-indicator .offscreen-element{visibility:hidden;position:absolute;white-space:nowrap;font-family:var(--energy-indicator-font-family);font-size:var(--energy-indicator-font-size)}:root{--song-picker-basic-transition-time: .7s}song-picker-basic cyberpunk-card{--card-color: #ffffff;--card-shadow: drop-shadow(0px 0px 20px #ffffff);--card-bg: rgba(255, 255, 255, .2);visibility:hidden;opacity:0;position:fixed;z-index:999;bottom:70px;left:50dvw;perspective:150px;transform:translate3d(-50%,100px,0);transition:opacity var(--song-picker-basic-transition-time) ease,transform var(--song-picker-basic-transition-time) ease,visibility 0s linear var(--song-picker-basic-transition-time);color:#fff;width:calc(100% - 40px);max-width:400px;font-family:var(--cpd-font);text-align:center;pointer-events:none;will-change:transform,opacity}song-picker-basic.active cyberpunk-card{visibility:visible;opacity:1;pointer-events:auto;transform:translate3d(-50%,0,0);transition-delay:0s}song-picker-basic .inner-card{transition:transform var(--song-picker-basic-transition-time) ease;will-change:transform}song-picker-basic.active .inner-card{transform:rotateX(5deg)}song-picker-basic .song-banner-carousel{position:relative;height:75px;width:245px;margin:20px auto;transition:transform .3s ease;will-change:transform}song-picker-basic .song-banner-carousel.spinning{transform:scale3d(.8,.8,1)}song-picker-basic .song-banner-carousel img{height:75px;width:245px;box-shadow:0 7px 20px #000c;border-radius:10px;position:absolute;left:0;top:0;object-fit:cover}song-picker-basic .song-info{display:flex;flex-wrap:nowrap;align-items:flex-end;justify-content:center;gap:7px;font-family:var(--cpd-font-alt)}song-picker-basic .song-info span:first-child{opacity:.5;font-size:14px}mini-map{position:fixed;left:10px;bottom:10px;border-radius:50%;overflow:hidden;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:.5;z-index:2000;cursor:pointer}mini-map canvas{width:100%;height:100%;display:block;border-radius:50%;background-color:#000}hud-ui>*{transition:transform .5s ease,opacity .5s ease;will-change:transform,opacity}hud-ui #in-game-menu-button{position:fixed;top:10px;right:10px;background-color:#1e1e1e99;border-radius:50%;border:2px solid #909090cc;border:none;font-size:30px;width:45px;height:45px;overflow:hidden;display:flex;justify-content:center;align-items:center;padding:7px 5px 5px;color:silver}hud-ui #joystick-zone{position:fixed;z-index:9999;bottom:10px;right:10px;border-radius:50%;box-shadow:0 5px 15px #1e1e1e66;cursor:grab}:root{--in-game-menu-transition-time: .5s}in-game-menu{position:fixed;top:0;left:0;width:100dvw;height:100dvh;z-index:9999;background-color:#0008;color:#909090;opacity:0;pointer-events:none;transition:opacity var(--in-game-menu-transition-time) ease;will-change:opacity;font-family:var(--cpd-font-alt);padding:10px}in-game-menu.active{opacity:1;pointer-events:auto}in-game-menu cyberpunk-card{--card-color: #909090;--card-shadow: drop-shadow(0px 0px 20px #000000);--card-bg: rgba(30, 30, 30, .6);transform:translate3d(0,100px,0);transition:transform var(--in-game-menu-transition-time) ease;will-change:transform}in-game-menu.active cyberpunk-card{transform:none}in-game-menu cyberpunk-card .inner-card{max-width:750px;height:calc(100dvh - 20px);background:none;display:flex;flex-direction:column;padding-bottom:10px}in-game-menu cyberpunk-card .body{display:flex;flex-direction:column;flex:1;overflow:hidden}in-game-menu cyberpunk-card .dots{display:none}in-game-menu .header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}in-game-menu h1,in-game-menu h2{font-family:var(--cpd-font);font-size:24px}in-game-menu h2{font-size:18px;margin-bottom:20px;color:var(--cpd-green)}in-game-menu button[name=close]{border:none;background:none;font-size:28px;color:silver;text-shadow:0 0 10px silver}in-game-menu #action-confirmation{padding:0 5px;color:#dc143c;font-size:14px;font-weight:700}in-game-menu #menu-options{padding:5px;margin-bottom:20px;display:flex;gap:15px}in-game-menu button:not([name=close]){border:none;background-color:#303030cc;padding:15px 20px;border-radius:7px;width:fit-content;color:silver}in-game-menu #objectives-list{color:#fff;font-size:14px;list-style:none;padding:5px;display:flex;flex-direction:column-reverse;overflow-y:auto;gap:20px}in-game-menu #objectives-list li{position:relative;padding-left:30px}in-game-menu #objectives-list li:before{position:absolute;left:0;font-family:bootstrap-icons;font-size:20px;line-height:22px;content:"";color:#909090}in-game-menu #objectives-list li.complete{color:#909090}in-game-menu #objectives-list li.complete:before{content:"";color:var(--cpd-green)}:root{--hold-note-color-rgb: rgb(255, 255, 255);--hold-note-color: 255, 255, 255}hold-note{position:absolute;left:50%;will-change:transform;transform-origin:center;transform:translateZ(0)}hold-note .hold-head{width:60px;height:var(--note-head-height);background-color:rgba(var(--hold-note-color));border:2px solid #ffffff81;border-radius:4px;position:absolute;top:0;left:50%;margin-left:-30px;z-index:3}hold-note .hold-tail{width:30px;background:linear-gradient(180deg,rgba(var(--hold-note-color),.1),rgba(var(--hold-note-color),.4));border-radius:20px 20px 0 0;position:absolute;top:0;left:50%;margin:0 auto 0 -15px;transform-origin:bottom;z-index:1}hold-note .hold-tail.pressed{background:linear-gradient(180deg,rgba(var(--hold-note-color),.3),rgba(var(--hold-note-color),.7));box-shadow:0 0 15px rgba(var(--hold-note-color),.4)}score-card{position:absolute;top:calc(50% - var(--dance-battle-status-panel-height));left:50%;color:#fff;padding:30px;border-radius:12px;width:500px;max-width:calc(100% - 20px);pointer-events:auto;will-change:transform,opacity;opacity:0;transform:translate3d(-50%,-50%,0);box-sizing:border-box;font-family:var(--cpd-font)}score-card .sc-subtitle{margin:0 0 10px;font-size:20px;border-bottom:1px solid rgba(255,255,255,.5)}score-card .row{display:flex;justify-content:space-between;flex-wrap:nowrap;margin:6px 0;width:100%}score-card .result-row{height:80px;align-items:center;justify-content:center}score-card #sc-result{transform-origin:center;text-transform:uppercase;font-size:34px}score-card #sc-result.pending{opacity:.8;font-weight:400;font-style:italic;font-size:14px;font-family:var(--cpd-font-alt)}score-card #sc-result.win{color:var(--judgment-color-good);text-shadow:0px 0px 10px var(--judgment-color-good)}score-card #sc-result.lose{color:var(--judgment-color-miss);text-shadow:0px 0px 10px var(--judgment-color-miss)}score-card #sc-result.tie{color:var(--judgment-color-almost);text-shadow:0px 0px 10px var(--judgment-color-almost)}score-card .label,score-card .value{width:fit-content}score-card .judgments{margin-top:12px}score-card .judgments .row .label{text-shadow:var(--judgment-text-shadow)}score-card .row[name=perfect] .label{color:var(--judgment-color-perfect)}score-card .row[name=good] .label{color:var(--judgment-color-good)}score-card .row[name=almost] .label{color:var(--judgment-color-almost)}score-card .row[name=miss] .label{color:var(--judgment-color-miss)}score-card #sc-close-btn{font-family:var(--cpd-font-alt);font-size:18px;padding:10px 5px;margin-top:15px;width:120px;position:relative;color:#fff;background:none;background-color:none;border-radius:0 7px;border:2px solid var(--cpd-pink);box-shadow:0 0 15px var(--cpd-pink)}score-card #sc-close-btn:before,score-card #sc-close-btn:after{content:"";position:absolute;z-index:100;background-color:transparent;width:100%;height:8px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 9' preserveAspectRatio='none'><g fill='%23f739b2'><polygon points='24,9 30,9 38,0 32,0'/><polygon points='34,9 40,9 48,0 42,0'/><polygon points='52,0 100,0 100,9 44,9'/></g></svg>") no-repeat left top / 100% 100%;border-top-right-radius:15px}score-card #sc-close-btn:before{top:-10px;left:-2px;transform:scaleX(-1)}score-card #sc-close-btn:after{bottom:-15px;right:-2px;transform:scaleY(-1)}stage-lane{display:flex;justify-content:center;position:relative;border-left:2px solid #ffffff7c;overflow:hidden}stage-lane:first-of-type{border-left:none}stage-lane .lane-receptor{position:absolute;top:0;width:100%;height:100%;border:none;cursor:pointer;transition:all .1s ease;z-index:999;pointer-events:all!important}stage-lane .tap-marker{position:absolute;left:auto;right:auto;height:8px;width:60px;border-radius:10px;background:#0fffaf;box-shadow:0 0 10px #0fffaf;will-change:opacity;transform-origin:center;transform:translateZ(0);opacity:0;transition:opacity .8s ease;z-index:99}stage-lane .tap-marker.active{opacity:1;transition:none}stage-lane .timing-overlay{position:absolute;left:0;right:0}stage-lane .timing-overlay.almost{background:#ffc8001a}stage-lane .timing-overlay.good{background:#00c8001a}stage-lane .timing-overlay.perfect{background:#00c8ff1a}game-stage{overflow:hidden;flex:1;width:100%;max-width:500px;border:2px solid #ffffff7c;margin:0 auto;border-top:none;border-bottom:none;box-shadow:0 0 25px 15px #0000004d}@media (max-width: 500px){game-stage{border:none;box-shadow:none}}game-stage[data-note-travel-direction=up]{transform:rotateX(180deg)}game-stage .stage-container{height:100%;display:grid;grid-template-columns:repeat(4,1fr);position:relative;transform-style:preserve-3d;will-change:transform,opacity}game-stage .particles-canvas{position:absolute;z-index:2;top:0;left:0;width:100%;height:100%;pointer-events:none}game-stage .judgment-line{position:absolute;left:0;right:0;height:2px;bottom:var(--judgment-line-y);background-color:#ff01f2;box-shadow:0 0 7px #ff7cf8;transform-origin:center center;will-change:transform;z-index:2;border-radius:10px}:root{--dance-battle-status-panel-height: 50px }status-panel{width:100%;max-width:1000px;padding:0;height:var(--dance-battle-status-panel-height);border-top:2px solid #ffffff7c;pointer-events:all!important;display:flex;flex-wrap:wrap;flex-direction:column;font-family:var(--cpd-font-alt)}status-panel .control{display:flex;gap:5px;height:fit-content;white-space:nowrap;border:1px solid rgb(60,60,60);border-radius:7px;padding:5px}status-panel .score-bar{width:100%;height:20px}electric-score-bar{position:relative;display:block}electric-score-bar canvas{display:block;width:100%;height:100%}electric-score-bar .score-marker{position:absolute;top:50%;left:-1px;width:2px;height:13px;background:#fff;border-radius:10px;box-shadow:0 0 10px #ffffffb3;transform:translate3d(0,-50%,0);transform-origin:center;will-change:transform;pointer-events:none}tap-note{position:absolute;left:50%;width:60px;height:var(--note-head-height);margin-left:-30px;background-color:#fff;border:2px solid #ffffff;border-radius:4px;will-change:transform;transform-origin:center;transform:translateZ(0);z-index:3}:root{--judgment-color-perfect: #ffe066;--judgment-color-good: #6ee7b7;--judgment-color-almost: #93c5fd;--judgment-color-miss: #f87171;--judgment-text-shadow: -2px -2px 0 black, 2px -2px 0 black, -2px 2px 0 black, 2px 2px 0 black}@property --pop-scale{syntax: "<number>"; initial-value: 1; inherits: false;}ui-overlay{position:absolute;left:50%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none;transform:translate3d(-50%,0,0)}ui-overlay .judgment-text,ui-overlay .combo-text{transform:translate3d(-50%,0,0) scale3d(.8,.8,1) scale3d(var(--pop-scale),var(--pop-scale),1);transition:transform .2s ease,opacity .2s ease;will-change:transform,opacity;opacity:0;left:50%;position:absolute;color:#fff;white-space:nowrap;text-align:center;text-shadow:var(--judgment-text-shadow)}ui-overlay .judgment-text.show,ui-overlay .combo-text.show{opacity:1;transform:translate3d(-50%,-20px,0) scaleZ(1) scale3d(var(--pop-scale),var(--pop-scale),1)}@keyframes judgment-pop{0%{--pop-scale: 1}35%{--pop-scale: 1.3}to{--pop-scale: 1}}ui-overlay .judgment-text.pop{animation:judgment-pop .2s ease}ui-overlay .judgment-text{font-family:Luckiest Guy,sans-serif;font-weight:bolder;font-size:30px;top:75%}ui-overlay .judgment-text[data-judgment=perfect]{color:var(--judgment-color-perfect)}ui-overlay .judgment-text[data-judgment=good]{color:var(--judgment-color-good)}ui-overlay .judgment-text[data-judgment=almost]{color:var(--judgment-color-almost)}ui-overlay .judgment-text[data-judgment=miss]{color:var(--judgment-color-miss)}ui-overlay .combo-text{font-family:var(--cpd-font-alt);font-weight:700;font-size:18px;top:calc(75% + 50px)}html,body{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:0;overflow:hidden}dance-battle{position:absolute;top:0;margin:0;padding:0;background-color:#00000080;color:#fff;overflow:hidden;display:flex;align-items:center;flex-direction:column-reverse;pointer-events:none;outline:none!important;height:100dvh;width:100dvw;z-index:10;opacity:0;transition:opacity 1s ease,background-color .5s ease;will-change:opacity}dance-battle:has(score-card){background-color:#000c}dance-battle.active{opacity:1}dance-battle #get-ready-banner{position:absolute;z-index:9999;margin:auto;transform:scale3d(4,4,1);color:#fff;font-family:var(--cpd-font);text-shadow:var(--judgment-text-shadow);transform-origin:center;top:50%;width:100%;text-align:center;opacity:0;transition:opacity .3s ease,transform .5s ease}dance-battle #get-ready-banner.visible{transform:none;opacity:1}