*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#02080d;color:#eef4f4;font-family:Arial,sans-serif}.cinematic{position:fixed;inset:0}.cinematic video{width:100%;height:100%;object-fit:cover}.cinematic>div{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,transparent 0 24%,rgba(0,7,11,.38) 64%,rgba(0,5,8,.9) 100%)}.login{position:fixed;z-index:3;left:50%;top:48%;transform:translate(-50%,-50%);width:min(470px,88vw);text-align:center}.login img{width:430px;max-width:90vw;height:190px;filter:drop-shadow(0 8px 20px #000)}.login form{display:grid;gap:10px}.login input{height:56px;padding:0 18px;border:0;border-bottom:1px solid #c7a45d;background:rgba(0,9,14,.56);color:#fff;outline:0;letter-spacing:.12em}.login button,.finish button{height:58px;border:1px solid #d0ac61;background:linear-gradient(90deg,#123e55dd,#745020dd);color:white;font:700 15px Georgia;letter-spacing:.2em;cursor:pointer}.login p{font-size:11px;color:#aab8bc;text-shadow:0 2px 5px #000}.err{display:block;color:#ff8176;margin-top:12px}footer{position:fixed;z-index:20;bottom:0;left:0;right:0;height:35px;padding:10px 20px;background:#02070de8;color:#81949a;font-size:10px;letter-spacing:.08em}footer a{color:#ff3b35;text-decoration:none;font-weight:bold}#creator{position:fixed;inset:0 0 35px;background:radial-gradient(circle at 30% 40%,#19303c,#03080d 70%)}#preview{position:absolute;inset:0;width:100%;height:100%}.createUI{position:absolute;right:3vw;top:3vh;bottom:4vh;width:min(570px,44vw);padding:20px 22px;overflow:auto;background:linear-gradient(135deg,rgba(2,10,15,.93),rgba(4,18,26,.8));border-left:1px solid #9e804b;border-right:1px solid #2b5868;box-shadow:0 20px 60px #0008}.createUI header{display:flex;align-items:center;border-bottom:1px solid #ffffff18;padding-bottom:12px}.createUI header img{width:155px;height:65px;object-fit:contain;margin-right:18px}.createUI header b{font:22px Georgia;letter-spacing:.12em}.createUI header small{display:block;color:#8fa4aa;margin-top:4px}.step h3{font:11px Arial;letter-spacing:.22em;color:#d3b36c;margin:18px 0 8px}.raceGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.raceGrid input,.classGrid input,.seg input{display:none}.raceGrid span,.classGrid span,.seg span{display:block;padding:10px;border:1px solid #38505a;background:#07131aab;cursor:pointer}.raceGrid small{display:block;color:#789099;font-size:9px;margin-top:3px}.raceGrid input:checked+span,.classGrid input:checked+span,.seg input:checked+span{border-color:#d4ad5e;background:#173445;color:#fff;box-shadow:inset 0 0 20px #1f6c8733}.cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.seg,.classGrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.seg span,.classGrid span{text-align:center;font-size:11px}.createUI select,.finish input{width:100%;height:42px;margin-top:7px;padding:0 10px;background:#061017;color:#dfe8ea;border:1px solid #344a53}.finish{display:grid;grid-template-columns:1fr 1.35fr;gap:8px;margin-top:18px}.finish input{height:58px;margin:0}.rotateHint{position:absolute;left:27%;bottom:25px;transform:translateX(-50%);font-size:10px;letter-spacing:.18em;color:#a5b5ba}@media(max-width:900px){.createUI{width:52vw}.raceGrid{grid-template-columns:1fr 1fr}.finish{grid-template-columns:1fr}.rotateHint{display:none}}
/* UVRIS V30 mobile character creator fix */
@media(max-width:900px){
  #creator{inset:0 0 35px 0}
  #preview{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
  .createUI{
    right:2vw;top:2vh;bottom:2vh;
    width:54vw;max-width:570px;
    padding:12px 12px;
  }
  .createUI header img{width:105px;height:48px;margin-right:8px}
  .createUI header b{font-size:15px}
  .createUI header small{font-size:9px}
}
@media(max-width:600px){
  .createUI{width:52vw;right:1.5vw;padding:9px}
  .raceGrid{grid-template-columns:1fr}
  .cols{grid-template-columns:1fr}
  .step h3{margin:10px 0 5px}
  .raceGrid span,.classGrid span,.seg span{padding:7px 5px}
  .finish{margin-top:10px}
}
