html,body{width:100%;height:100%}
body{background-color:#000;vertical-align:top;overflow:hidden}
body,h1,h2{margin:0;border:0;padding:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:12px;line-height:15px;color:rgba( 255,255,255,0.7 )}
a{color:rgba( 255,255,255,0.7 );text-decoration:none;border-bottom:1px dotted #FFF}
a:hover{color:#FFF;border-bottom:1px solid #FFF}
table,td,tr{margin:0;border:none;border-collapse:collapse;padding:0}
.pad{padding:8px}
.graydient{background:#000;background:-moz-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,#444),color-stop(90%,#000000));background:-webkit-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background:-o-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background:-ms-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background:radial-gradient(ellipse at center,#444 0%,#000000 90%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444',endColorstr='#000000',GradientType=1 )}
.heroicRed{background-color:#F00}
#container{width:100%;height:100%}
#fail{display:none;text-align:center;position:absolute;top:50%;left:50%;margin-top:-100px;margin-left:-250px;width:500px;height:200px;overflow:hidden}
#fail > h1{font-size:6em;line-height:2em}
#fail > h2{font-size:3em;line-height:1em}
@media not screen and (-webkit-transform-3d){#container{visibility:hidden}
#fail{display:block}
}
#pmLink{visibility:hidden;text-decoration:none;cursor:pointer;background:0 0;border:0}
#pmLink:hover{visibility:visible;color:gray}
.cube{width:100%;height:100%}
@font-face{font-family:"RubikExtended";src:url( "../media/RubikExtended.ttf" ) format( "truetype" ),url( "../media/RubikExtended.otf" ) format( "otf" );font-weight:normal;font-style:normal}
.faceLabel{display:none;position:absolute;font-size:60px;text-align:center;font-family:"RubikExtended";text-shadow:0 0 24px rgba( 0,0,0,0.3 );color:#FFF}
.cube .cubelet{width:1em;height:1em;position:absolute;box-sizing:border-box}
.cube .face{position:absolute;width:1em;height:1em;background-color:#000;text-align:center;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;padding:0.05em;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}
.cube .face.faceIntroverted{background-color:#000}
.cube .face.faceTransparent{background-color:transparent}
.purty .face{opacity:0.5}
.purty .face.faceFront{background-color:#FFF}
.purty .face.faceUp{background-color:#E87000}
.purty .face.faceRight{background-color:#3D81F6}
.purty .face.faceDown{background-color:#DC422F}
.purty .face.faceLeft{background-color:#009D54}
.purty .face.faceBack{background-color:#F5B400}
.cube .face > .wireframe{display:none;position:absolute;width:140px;height:140px;background-color:rgba( 255,255,255,0.05 )}
.cube .sticker{width:100%;height:100%;background-color:#F0F;border-radius:0.1em;text-align:center}
.cube .sticker.red{background:#DC422F}
.cube .sticker.white{background:#F3F3F3}
.cube .sticker.blue{background:#3D81F6}
.cube .sticker.green{background:#009D54}
.cube .sticker.orange{background:#E87000}
.cube .sticker.yellow{background:#F5B400}
.cube .sticker.stickerLogo{background:#F3F3F3 url( "ruwix.png" );background-size:100% 100%;background-repeat:none}
.cube .face > .id{display:none;position:absolute;z-index:1000;width:90%;height:90%;font-size:1em;line-height:0.9em;text-align:center;color:#000}
.cube .face > .id > .underline{border-bottom:1px solid #000}
.cube .face.faceIntroverted > .id{color:#FEFEFE}
.cube .face.faceIntroverted > .id > .underline{border-bottom:1px solid #FEFEFE}
.cube .face > .text{display:none;position:absolute;z-index:2000;width:100%;height:100%;text-align:center;color:#FFF;font-family:"RubikExtended",sans-serif;font-size:1em;line-height:1em}
.containerx{font-size:20px;line-height:28px}
a,a:hover,a:link,a:visited{border:none !important}
strong{font-weight:bold}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;line-height:1.6;background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);min-height:100vh;color:#fff;padding-top:30px;position:relative}
body.overflowauto{overflow:auto}
.containerx{max-width:830px;margin:15px auto;padding:20px;position:relative}
#language-selector-createx{padding-top:20px}
.sectionx{background:rgba(255,255,255,0.05);border-radius:15px;padding:30px;box-shadow:0 4px 15px rgba(0,0,0,0.2);margin-bottom:20px;border:1px solid rgba(255,255,255,0.1)}
.input-groupx{display:flex;gap:10px;margin-bottom:20px}
input[type="text"],input[type="number"]{flex:1;padding:12px 15px;background:rgba(255,255,255,0.9);border:2px solid rgba(255,255,255,0.2);border-radius:8px;font-size:22px;font-weight:bold;color:#1e1e1e;transition:all 0.3s ease;min-height:44px}
input[type="text"]:focus,input[type="number"]:focus{border-color:#4a90e2;outline:none;box-shadow:0 0 0 3px rgba(74,144,226,0.2)}
button{padding:12px 24px;background:linear-gradient(135deg,#4a90e2 0%,#357abd 100%);color:#ffffff;border:none;border-radius:8px;cursor:pointer;font-size:16px;transition:all 0.3s ease;text-transform:uppercase;letter-spacing:0.5px;font-weight:500;min-height:44px}
button:hover{background:linear-gradient(135deg,#357abd 0%,#2a5f9e 100%);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.2)}
button:active{transform:translateY(0);box-shadow:0 2px 6px rgba(0,0,0,0.2)}
.hiddenx{display:none}
#generated-linkx{background:rgba(255,255,255,0.05);padding:20px;border-radius:10px;margin-top:20px;border:1px solid rgba(255,255,255,0.1)}
#generated-linkx p{margin-bottom:10px;color:rgba(255,255,255,0.8)}
pre,code{word-break:break-all;color:#9ecbff;font-style:italic}
#generated-linkx a{color:#004ca5;text-decoration:none;word-break:break-all;display:block;padding:5px;font-weight:bold;background:#FFF;font-size:20px;line-height:28px}
.aligncenter{text-align:center}
#high0{height:0;overflow:visible;position:relative}
#solve-puzzlex{position:absolute;bottom:20px;padding:10px 20px;left:20px;text-align:center;right:20px;background:#121111}
#solve-puzzlex h2{margin:15px 0;color:#FFF;font-size:2em}
#generated-linkx a:hover{color:#0e974d}
.link-actionsx{display:flex;gap:10px;margin-top:15px}
.link-actionsx button{flex:1;padding:8px 15px;font-size:17px;background:rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;gap:8px}
button#copy-linkx{background:#3e83cd}
button#open-linkx{background:#16b180}
.link-actionsx button svg{width:22px;height:22px;fill:currentColor}
.link-actionsx button:hover{background:rgba(255,255,255,0.2)}
#secret-messagex{font-size:18px}
#secret-messagex .congratsx{color:#4bd997;font-size:1.2em;margin-bottom:15px;font-weight:500}
#secret-messagex .message-contentx{font-size:1.3em;margin:20px 0;padding:15px;background:#000;border-radius:8px}
.message-contentx a{color:#9898ff;text-decoration:underline}
.message-contentx a:hover{color:#fff}
.create-puzzle-linkx{display:inline-block;margin-top:15px;padding:10px 20px;background:linear-gradient(135deg,#4a90e2 0%,#357abd 100%);color:white;text-decoration:none;border-radius:8px;transition:all 0.3s ease}
a.create-puzzle-linkx{margin-bottom:50px}
.create-puzzle-linkx:hover{background:linear-gradient(135deg,#357abd 0%,#2a5f9e 100%);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,0.2)}
#footerx{background:rgba(255,255,255,0.05);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,0.1);padding:30px 20px;text-align:center;margin-top:50px;font-size:18px}
#footerx p{color:rgba(255,255,255,0.7);margin:10px 0;line-height:1.6}
#footerx a{color:#4a90e2;text-decoration:none;transition:color 0.3s ease}
#footerx a:hover{color:#357abd;text-decoration:underline}
@media (max-width:768px){#language-selector-solvex{display:none}#footerx{padding:20px 15px}
#footerx p{font-size:13px}
}
.content-sectionx{background:rgba(255,255,255,0.05);border-radius:15px;padding:30px;margin-top:30px;border:1px solid rgba(255,255,255,0.1)}
h1{font-size:2em;line-height:1;color:#FFF;max-width:600px;margin:auto;margin-bottom:20px;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,0.2)}
h2{line-height:1;text-align:center;font-weight:500;text-shadow:0 2px 4px rgba(0,0,0,0.2);color:#FFF;font-size:1.6em;margin:30px 0 15px}
h3{font-size:1.3em;margin:25px 0 10px;color:#FFF}
p{color:rgba(255,255,255,0.9);margin-bottom:15px}
.stats-boxx{background:rgba(74,144,226,0.1);border-radius:10px;padding:20px;margin:20px 0;border:1px solid rgba(74,144,226,0.2)}
.stats-boxx p{font-weight:bold;margin-bottom:10px;color:#4a90e2}
.stats-boxx ul{list-style:none;padding:0}
.stats-boxx li{color:rgba(255,255,255,0.9);margin-bottom:8px;padding-left:20px;position:relative}
.stats-boxx li:before{content:"•";color:#4a90e2;position:absolute;left:0}
.feature-tablex{width:100%;border-collapse:collapse;margin:20px 0;background:rgba(255,255,255,0.05);border-radius:10px;overflow:hidden}
.feature-tablex th,.feature-tablex td{padding:12px 15px;text-align:left;border-bottom:1px solid rgba(255,255,255,0.1)}
.feature-tablex th{background:rgba(74,144,226,0.1);color:#4a90e2;font-weight:500}
.feature-tablex td{color:rgba(255,255,255,0.9)}
.content-sectionx ul{list-style:none;padding:0;margin:20px 0}
.content-sectionx ul li{color:rgba(255,255,255,0.9);margin-bottom:10px;padding-left:25px;position:relative}
.content-sectionx ul li:before{content:"→";color:#4a90e2;position:absolute;left:0}
.faqx{background:rgba(255,255,255,0.05);border-radius:10px;padding:20px;margin:20px 0}
.faqx h3{color:#4a90e2;margin-top:20px}
.faqx h3:first-child{margin-top:0}
.content-sectionx a{color:#7bafeb;text-decoration:none;transition:color 0.3s ease}
.content-sectionx a:hover{color:#b4daff;text-decoration:underline}
@media (max-width:768px){.content-sectionx{padding:20px}
.content-sectionx h1{font-size:2em}
.content-sectionx h2{font-size:1.5em}
.feature-tablex{display:block;overflow-x:auto}
}
.main-headerx{background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,0.1);position:fixed;top:0;left:0;right:0;z-index:1000}
.header-containerx{max-width:1200px;margin:0 auto;padding:7px 20px;display:flex;align-items:center;justify-content:space-between}
a.logox{color:#FFF;text-decoration:none;display:block;font-size:30px}
.logox img{display:inline-block;height:auto;vertical-align:middle}
.main-navx ul{display:flex;list-style:none;margin:0;padding:0;gap:20px}
.main-navx a{color:#fff;text-decoration:none;font-size:18px;padding:8px 12px;border-radius:6px;transition:all 0.3s ease;display:flex;align-items:center;gap:4px}
img{max-width:100%}
.cube{opacity:0.1}
.header-containerx a{border:none}
.main-navx a:hover{color:#fff;background:rgba(255,255,255,0.1)}
.mobile-menu-togglex{display:none;background:none;border:none;padding:10px;cursor:pointer}
.mobile-menu-togglex span{display:block;width:25px;height:2px;background:#fff;margin:5px 0;transition:all 0.3s ease}
.containerx{margin-top:80px}
@media (max-width:768px){.mobile-menu-togglex{display:block}
.main-navx{position:fixed;top:70px;left:0;right:0;background:rgba(26,26,46,0.95);backdrop-filter:blur(10px);padding:20px;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all 0.3s ease}
.main-navx.activex{display:block}
.main-navx.active{transform:translateY(0);opacity:1;visibility:visible}
.main-navx ul{flex-direction:column;gap:10px}
.main-navx a{padding:12px;font-size:18px}
.mobile-menu-togglex.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-menu-togglex.active span:nth-child(2){opacity:0}
.mobile-menu-togglex.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}
}
@media (max-width:768px){.input-groupx{display:block;text-align:center}
.containerx{margin-top:70px}
input#message-inputx{display:block;width:90%;margin:0 auto 15px}
}
.nav-iconx{width:20px;height:20px;fill:currentColor;margin-right:2px}
#language-selectorx{margin:15px 0;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);border-radius:8px;padding:10px;display:flex;gap:8px;border:1px solid rgba(255,255,255,0.1)}
.language-btnx{margin-bottom:5px;padding:8px 10px;font-size:14px;background:rgba(255,255,255,0.1);color:#ffffff;border:none;border-radius:4px;cursor:pointer;transition:all 0.3s ease}
.language-btnx:hover{background:rgba(255,255,255,0.2);transform:translateY(-1px)}
.language-btnx.activex{background:#4a90e2;color:#ffffff}
#back-to-topx{position:fixed;z-index:99;bottom:45px;left:20px;width:44px;height:44px;background:rgba(74,144,226,0.9);border-radius:50%;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;border:none;box-shadow:0 2px 10px rgba(0,0,0,0.2);margin:20px 0}
#back-to-topx:hover{background:#357abd;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.3)}
#back-to-topx svg{width:24px;height:24px;display:inline-block;vertical-align:middle;fill:#ffffff;left:13px;position:absolute;top:9px}
@media (max-width:768px){#language-selectorx{flex-wrap:wrap}
.language-btnx{flex:1 1 calc(50% - 4px);min-width:80px}
}
@media screen and (max-height:800px){#solve-puzzlex{bottom:1px}
#solve-puzzlex h2{margin:5px 0}
}
@media screen and (max-height:640px){#language-selector-solvex{display:none}
a.logox img{width:40px;height:37px}
.header-containerx{padding:4px 10px}
}
