*{box-sizing:border-box;margin:0;padding:0;font-family:Courier New,Courier,monospace}body,html{color:#fff;background-color:#000;width:100%;height:100%;overflow:hidden}#top-left-icons{z-index:2000;pointer-events:auto;gap:15px;display:flex;position:absolute;top:20px;left:20px}#top-left-icons button{color:#0ff;cursor:pointer;background:#00000080;border:2px solid #0ff;border-radius:4px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}#top-left-icons button:hover{color:#000;background:#0ff;box-shadow:0 0 15px #0ff}#top-left-icons button svg{width:20px;height:20px}#game-container{width:100%;height:100%;position:relative}canvas{width:100%;height:100%;display:block}#ui-layer{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.screen{pointer-events:auto;background:#000c;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:100%;height:100%;display:none}.screen.active{display:flex}#hud.active{pointer-events:none;background:0 0;display:block}h1{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff;letter-spacing:5px;text-align:center;margin-bottom:2rem;font-size:4rem;font-style:italic}h2{color:#f0f;text-shadow:0 0 10px #f0f;letter-spacing:3px;margin-bottom:1.5rem;font-size:2.5rem}.subtitle{color:#f0f;letter-spacing:3px;margin-bottom:2rem;font-size:1.2rem}#car-selection-flow,#map-selection-flow{flex-grow:1;justify-content:space-between;align-items:stretch;gap:20px;width:95%;max-width:1400px;margin-bottom:20px;display:flex}.selection-left,.selection-right{z-index:10;flex-direction:column;justify-content:center;align-items:stretch;width:350px;display:flex}#car-info{flex-direction:column;flex-grow:1;justify-content:center;display:flex;max-height:none!important}.selection-middle{pointer-events:none;flex-grow:1;justify-content:center;align-items:center;display:flex}#car-preview-placeholder,#map-preview-placeholder{width:100%;height:100%}.char-selection-layout{justify-content:center;align-items:center;gap:20px;width:98%;max-width:1200px;display:flex}#char-carousel-container{justify-content:center;align-items:center;gap:15px;width:95%;max-width:1100px;margin-bottom:20px;display:flex}.carousel-nav-btn{color:#0ff;cursor:pointer;z-index:10;background:#00ffff1a;border:2px solid #0ff;padding:10px 20px;font-size:2rem;transition:all .3s}.carousel-nav-btn:hover{color:#000;background:#0ff;box-shadow:0 0 20px #0ff}#char-list{background:#00ffff0d;border-top:1px solid #0ff3;border-bottom:1px solid #0ff3;justify-content:center;gap:15px;width:100%;padding:10px;display:flex;overflow:hidden}#char-details-area{flex-direction:row;flex-grow:1;justify-content:center;align-items:stretch;gap:30px;width:98%;max-width:1400px;margin-bottom:10px;display:flex;overflow:hidden}#char-info{flex-direction:column;flex-grow:1;gap:10px;height:100%;display:flex}.story-viewport{flex-direction:column;flex-grow:1;display:flex;text-align:left!important;max-width:none!important}.char-preview-panel{flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:300px;display:flex}#char-outro-pic{z-index:5;background:#111;border:3px solid #0ff;width:120px;height:120px;margin-top:-30px;overflow:hidden;box-shadow:0 0 15px #00ffff80}#char-outro-pic img{object-fit:cover;width:100%;height:100%}.mini-portrait{z-index:5;background:#111;border:2px solid #0ff;width:80px;height:80px;position:absolute;bottom:10px;right:10px;overflow:hidden;box-shadow:0 0 10px #0ff6}.mini-portrait img{object-fit:cover;width:100%;height:100%}.story-img-container{aspect-ratio:1;cursor:pointer;background:#111;border:2px solid #0ff;width:100%;margin-bottom:15px;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 0 10px #0ff}.story-img-container:hover{border-color:#fff;transform:scale(1.02);box-shadow:0 0 20px #fff}.story-img-container img{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .5s;display:block}#image-modal{z-index:9999;pointer-events:auto;background:#000000f2;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}#image-modal.active{display:flex}#image-modal .modal-content{flex-direction:column;justify-content:center;align-items:center;gap:30px;width:90%;height:90%;display:flex}#modal-img{object-fit:contain;background:#000;border:4px solid #0ff;max-width:95%;max-height:80vh;box-shadow:0 0 30px #0ff}.modal-close-hint{color:#ff0;letter-spacing:2px;text-shadow:0 0 10px #ff0;font-size:1.2rem;animation:1.5s infinite pulse}@keyframes pulse{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.story-img-container.loaded img{opacity:1}.story-img-container.loading:before{content:"";opacity:.8;background-image:repeating-radial-gradient(circle,#444 0,#000 1px,#0000 2px),repeating-linear-gradient(45deg,#333 0,#000 2px,#0000 4px),linear-gradient(#12101000 50%,#00000040 50%),linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f);background-size:100px 100px,10px 10px,100% 4px,100% 100%;width:200%;height:200%;animation:.1s infinite static-noise;position:absolute;top:-50%;left:-50%}.story-img-container.loading:after{content:"INITIALIZING...";color:#0ff;letter-spacing:2px;text-shadow:0 0 10px #0ff;z-index:2;font-family:Courier New,Courier,monospace;font-weight:700;animation:1.5s infinite pulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes static-noise{0%{transform:translate(0)}25%{transform:translate(-10px,10px)}50%{transform:translate(10px,-10px)}75%{transform:translate(-10px,-10px)}to{transform:translate(0)}}#char-pic-container canvas,#char-pic-container img{object-fit:cover;background:#111;border:4px solid #0ff;width:250px;height:250px;box-shadow:0 0 20px #0ff}.menu-section{text-align:center;flex:1;max-width:800px;margin-bottom:1.5rem}.menu-section h3{color:#ff0;text-transform:uppercase;margin-bottom:.5rem;font-size:1.2rem}.button-group{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.button-group-vertical{flex-direction:column;gap:15px;width:300px;display:flex}.button-group-vertical button{width:100%;padding:15px;font-size:1.2rem}.list-container{background:#00ffff0d;flex-direction:column;align-items:center;gap:5px;width:95%;max-width:none;max-height:60vh;padding:10px;display:flex;overflow-y:auto}#char-list{grid-template-columns:repeat(5,1fr);width:100%;max-height:none;display:grid;overflow:visible}.char-list-btn{border-color:#333;flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex;padding:8px!important}.char-list-img{aspect-ratio:1;object-fit:cover;border:1px solid #444;width:100%;max-width:120px}.char-list-btn:hover .char-list-img,.char-list-btn.selected .char-list-img,.char-list-btn.focused .char-list-img{border-color:#0ff;box-shadow:0 0 10px #0ff}.char-list-btn span{letter-spacing:1px;white-space:nowrap;text-overflow:ellipsis;text-align:center;width:100%;font-size:.6rem;overflow:hidden}button{color:#fff;cursor:pointer;text-transform:uppercase;clip-path:polygon(10% 0,100% 0,100% 70%,90% 100%,0 100%,0 30%);letter-spacing:1px;background:#00ffff0d;border:1px solid #00ffff4d;padding:12px 24px;font-size:1rem;font-weight:700;transition:all .3s cubic-bezier(.23,1,.32,1);position:relative;overflow:hidden}button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:all .5s;position:absolute;top:0;left:-100%}button:hover{color:#0ff;background:#00ffff26;border-color:#0ff;transform:translateY(-2px);box-shadow:0 0 20px #0ff6}button:hover:before{left:100%}button.focused{color:#fff;background:#fff3;border-color:#fff;outline:none;transform:scale(1.05);box-shadow:0 0 25px #ffffff80}button.selected{color:#000;background:#0ff;border-color:#0ff;box-shadow:0 0 30px #0ff}#main-menu{flex-direction:column}.main-menu-content{z-index:10;justify-content:space-between;align-items:center;width:100%;max-width:none;margin-top:20px;padding:0 50px;display:flex}.menu-left-panel{flex-direction:column;align-items:flex-start;display:flex}.menu-right-panel{flex:1;justify-content:flex-end;padding-left:50px;display:flex}.menu-story-box{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);clip-path:polygon(0 0,100% 0,100% 90%,90% 100%,0 100%);background:#000a0fcc;border:1px solid #0ff6;max-width:600px;padding:45px;box-shadow:0 0 50px #000c,inset 0 0 30px #00ffff1a}.lore-text{color:#fff;text-align:left;font-family:Courier New,Courier,monospace;font-size:1.3rem;line-height:1.7}.menu-stripe{z-index:1;pointer-events:none;background:linear-gradient(125deg,#0000 0% 20%,#ffffff1f 20.2% 47%,#0000 47.2%);border-right:1px solid #ffffff1a;width:100%;height:100%;position:absolute;top:0;left:0}#main-menu h1{width:100%;margin-bottom:2rem}#main-menu .main-btn{text-align:left;background:#ff00ff0d;border-left:.3vw solid #f0f;justify-content:flex-start;align-items:center;width:22vw;min-width:280px;margin-top:1.2vh;padding:1.5vh 2vw;font-size:1.2rem;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex}#main-menu .main-btn:first-child{margin-left:16vw}#main-menu .main-btn:nth-child(2){margin-left:13.7vw}#main-menu .main-btn:nth-child(3){margin-left:11.4vw}#main-menu .main-btn:nth-child(4){margin-left:9.1vw}#main-menu .main-btn:nth-child(5){margin-left:6.8vw}#main-menu .main-btn:nth-child(6){margin-left:4.5vw}#main-menu .main-btn:nth-child(7){margin-left:2.2vw}#main-menu .main-btn:nth-child(8){margin-left:0}#main-menu .main-btn:hover{color:#fff;background:#f0f3;padding-left:3vw;transform:translate(1vw)}.main-btn{color:#f0f;clip-path:polygon(5% 0,100% 0,100% 75%,95% 100%,0 100%,0 25%);border-color:#ff00ff80;margin-top:1rem;padding:15px 35px;font-size:1.5rem}.main-btn:hover{color:#fff;background:#f0f3;border-color:#f0f;box-shadow:0 0 30px #f0f9}.info-box{text-align:center;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);clip-path:polygon(0 0,95% 0,100% 5%,100% 100%,5% 100%,0 95%);background:linear-gradient(135deg,#001414d9 0%,#000505f2 100%);border:1px solid #00ffff4d;width:100%;max-width:600px;min-height:40px;margin:12px 0;padding:20px;font-size:1rem;line-height:1.6;position:relative;box-shadow:inset 0 0 20px #00ffff0d,0 10px 30px #00000080}.info-box:after{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00ffff08 3px);width:100%;height:100%;position:absolute;top:0;left:0}.sub-info-box{clip-path:polygon(0 0,98% 0,100% 10%,100% 100%,2% 100%,0 90%);background:#00ffff0d;border:1px solid #00ffff26;border-radius:4px;padding:15px}#char-info{flex-direction:column;gap:5px;width:100%;display:flex}.status-viewport{background:#ff00ff0d;border-color:#f0f}.upgrades-viewport{background:#00ffff0d;border-color:#0ff}.story-viewport{background:#ffff000d;border-color:#ff0}.standings-row{clip-path:polygon(0 0,99% 0,100% 20%,100% 100%,1% 100%,0 80%);background:#00ffff08;border-bottom:1px solid #00ffff1a;justify-content:space-between;align-items:center;width:95%;max-width:none;margin-bottom:5px;padding:1.5vh 3vw;font-size:1.2rem;transition:all .3s;display:flex}.standings-row.player{color:#0ff;background:#00ffff26;border-left:4px solid #0ff;font-weight:700;box-shadow:0 0 20px #00ffff1a}#race-progress-container{z-index:100;background:#0009;border:1px solid #0ff;width:40%;height:12px;position:absolute;top:20px;left:50%;overflow:visible;transform:translate(-50%);box-shadow:0 0 10px #00ffff4d}#race-progress-bar{background:#0f0;width:0%;height:100%;transition:width .1s linear,background-color .3s;box-shadow:0 0 15px}.lap-marker{background:#fff;width:2px;height:calc(100% + 4px);position:absolute;top:-2px;box-shadow:0 0 5px #fff}#hud-leaderboard{color:#fff;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);clip-path:polygon(0 0,90% 0,100% 10%,100% 100%,0 100%);background:linear-gradient(135deg,#001414cc 0%,#000505e6 100%);border-left:.4vw solid #0ff;width:18vw;min-width:250px;padding:1.5vh 1.5vw;font-size:1.1rem;position:absolute;top:2vh;left:2vw;box-shadow:0 10px 30px #00000080}.hud-lb-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;margin-bottom:.5vh;padding:.2vh 0;display:flex}.hud-lb-row.player{color:#0ff;text-shadow:0 0 10px #00ffff80;font-weight:700}.lb-row{justify-content:space-between;margin-bottom:4px;display:flex}.lb-row.player{color:#ff0;background:#ffff001a}#hud-pilot-box{align-items:flex-end;gap:20px;display:flex;position:absolute;bottom:20px;left:20px}#hud-pilot-pic{background:#111;border:2px solid #0ff;width:80px;height:80px;overflow:hidden;box-shadow:0 0 10px #0ff}#hud-pilot-pic canvas,#hud-pilot-pic img{object-fit:cover;width:100%;height:100%}.hud-left-stats-container{color:#ff0;text-shadow:2px 2px #000,0 0 10px #ff0;flex-direction:column;align-items:flex-start;gap:5px;font-size:1.5rem;font-weight:700;display:flex}#energy-bar-container{background:#00ffff1a;border:2px solid #0ff;width:200px;height:15px;margin-bottom:5px}#energy-bar-fill{background:#0ff;width:100%;height:100%;transition:width .1s;box-shadow:0 0 10px #0ff}#throttle-bar-container{background:#ffff001a;border:1px solid #ff0;width:200px;height:25px;margin-bottom:5px;position:relative;overflow:hidden}#throttle-bar-fill{z-index:1;background:#ff0;width:0%;height:100%;position:relative;box-shadow:0 0 5px #ff0}#throttle-good-spot{z-index:0;background:#00ffff1a;border-left:1px dashed #00ffff80;width:50%;height:100%;position:absolute;left:50%}#throttle-sweet-spot{z-index:2;background:#ffffff4d;border-left:2px solid #fff;border-right:2px solid #fff;width:10%;height:100%;position:absolute;left:80%}.throttle-label{color:#fff;text-shadow:1px 1px 2px #000;pointer-events:none;z-index:3;font-size:.6rem;font-weight:700;position:absolute;top:50%;transform:translateY(-50%)}.throttle-label.good{color:#0ff;left:52%}.throttle-label.perfect{color:#fff;left:81%}.tutorial-box{text-align:left;width:500px;padding:30px;font-size:1.2rem}.tutorial-box p{margin-bottom:15px}.tutorial-box hr{border:none;border-top:1px solid #0ff;margin:20px 0}.tutorial-box em{color:#f0f;margin-top:10px;display:block}.settings-layout{background:#00ffff0d;border:1px solid #0ff;flex-direction:column;align-items:center;gap:20px;width:600px;padding:20px;display:flex}.settings-tabs{gap:10px;margin-bottom:20px;display:flex}.tab-btn{padding:5px 15px;font-size:.9rem}.settings-content{flex-direction:column;gap:15px;width:100%;display:none}.settings-content.active{display:flex}.setting-row{color:#0ff;justify-content:space-between;align-items:center;width:100%;font-size:1.2rem;display:flex}.setting-row input[type=range]{width:200px}.mapping-list{flex-direction:column;gap:8px;width:100%;max-height:250px;padding-right:10px;display:flex;overflow-y:auto}.mapping-row{background:#ffffff0d;border:1px solid #333;justify-content:space-between;align-items:center;padding:5px 10px;display:flex}.mapping-row span{color:#ff0;font-size:.9rem}.mapping-row button{min-width:120px;padding:4px 8px;font-size:.8rem}.small-btn{align-self:center;margin-top:10px;padding:5px 10px;font-size:.8rem}.stat-bars{flex-direction:column;gap:8px;width:100%;margin-top:10px;display:flex}.stat-row{flex-direction:column;align-items:center;gap:2px;width:100%;display:flex}.stat-label{color:#aaa;text-align:center;font-size:.7rem;font-weight:700}.stat-bar-bg{background:#ffffff1a;border:1px solid #333;width:100%;height:8px;position:relative;overflow:hidden}.stat-bar-base{z-index:1;background:#ff0;height:100%;position:absolute;top:0;left:0;box-shadow:0 0 5px #ffff0080}.stat-bar-upgrade{z-index:2;background:#f80;height:100%;position:absolute;top:0;left:0;box-shadow:0 0 5px #ff800080}#shop-vehicle-scroller{background:#00ffff1a;border:1px solid #0ff;justify-content:center;align-items:center;gap:20px;margin-bottom:20px;padding:10px 20px;display:flex}#shop-vehicle-name{color:#ff0;text-align:center;min-width:250px;font-size:1.5rem;font-weight:700}.scroll-btn{color:#0ff;border-color:#0ff;padding:5px 15px;font-size:1.5rem}.scroll-btn:hover{color:#000;background:#0ff}#pos-display{color:#0ff;text-shadow:2px 2px #000,0 0 10px #0ff;font-size:2rem}#lap-display{color:#f0f;text-shadow:2px 2px #000,0 0 10px #f0f}#message-display{color:#f0f;text-shadow:0 0 20px #f0f;text-align:center;font-size:4rem;font-style:italic;font-weight:700;position:absolute;top:30%;left:50%;transform:translate(-50%,-50%)}#comms-box{pointer-events:none;z-index:1000;background:#000000d9;border:2px solid #0ff;border-right-width:8px;align-items:center;gap:15px;min-width:350px;padding:10px;transition:transform .5s cubic-bezier(.175,.885,.32,1.275);display:flex;position:absolute;top:20px;right:20px;transform:translate(500px)}#comms-box.active{transform:translate(0)}#comms-portrait,#comms-portrait-receiver{background:#111;border:2px solid #0ff;flex-shrink:0;width:60px;height:60px;overflow:hidden}#comms-portrait-receiver{border:2px solid #f0f;display:none}#comms-portrait canvas,#comms-portrait img,#comms-portrait-receiver canvas,#comms-portrait-receiver img{object-fit:cover;width:100%;height:100%}.comms-content{flex-direction:column;flex-grow:1;justify-content:center;display:flex}#comms-name{color:#ff0;margin-bottom:2px;font-size:.8rem;font-weight:700}#comms-text{color:#fff;font-size:.9rem;line-height:1.2}#mobile-controls{pointer-events:none;display:none;position:absolute;inset:0}body.is-mobile #mobile-controls{display:block}.touch-zone{pointer-events:auto;-webkit-tap-highlight-color:transparent;width:50%;height:100%;position:absolute;top:0}#touch-left{left:0}#touch-right{right:0}#mobile-buttons-container{pointer-events:auto;gap:10px;display:flex;position:absolute;bottom:20px;right:20px}.touch-btn{color:#0ff;pointer-events:auto;-webkit-tap-highlight-color:transparent;background:#00000080;border:2px solid #0ff;width:100px;height:60px;font-size:.8rem;font-weight:700}.touch-btn:active{color:#000;background:#0ff}.gallery-grid{background:#00ffff0d;border:1px solid #0ff;grid-template-columns:repeat(4,1fr);gap:20px;width:90%;max-width:1200px;max-height:60vh;padding:20px;display:grid;overflow-y:auto}.gallery-item{aspect-ratio:1;cursor:pointer;background:#111;border:2px solid #555;width:100%;transition:all .2s;position:relative;overflow:hidden}.gallery-item:hover{z-index:10;border-color:#0ff;transform:scale(1.05);box-shadow:0 0 15px #0ff}.gallery-item img{object-fit:cover;width:100%;height:100%}.gallery-item.locked{cursor:default;background:#000;border-style:dashed;justify-content:center;align-items:center;display:flex}.gallery-item.locked:after{content:"LOCKED";color:#333;letter-spacing:2px;font-size:.8rem}.gallery-item.locked:hover{box-shadow:none;border-color:#555;transform:none}@media screen and (width<=1000px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}@media screen and (width<=700px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (width<=900px){h1{font-size:2.5rem}h2{margin-bottom:1rem;font-size:1.8rem}.char-selection-layout{gap:15px;height:75vh}.char-preview-panel{width:200px}#char-pic-container canvas,#char-pic-container img{width:180px;height:180px}.list-container{grid-template-columns:repeat(2,1fr);max-width:350px}#char-list{grid-template-columns:repeat(3,1fr);max-width:none;max-height:none}.info-box{padding:10px;font-size:.9rem}.tutorial-box{width:100%;padding:15px}.button-group-vertical{width:250px}.main-btn{padding:10px 20px;font-size:1.2rem}#multiplayer-menu .button-group-vertical,#host-setup .settings-layout,#lobby-browser .list-container,#mp-lobby>div{width:95%!important;max-width:none!important}#mp-lobby>div{flex-direction:column;overflow-y:auto;gap:10px!important;width:100%!important;height:auto!important}}@media screen and (height<=500px){h1{margin-bottom:.2rem;font-size:2rem}h2{margin-bottom:.5rem;font-size:1.5rem}.char-selection-layout{gap:10px}.char-preview-panel{width:160px}#char-pic-container canvas,#char-pic-container img{width:120px;height:120px}.story-img-container{margin-bottom:5px}#char-list{grid-template-columns:repeat(3,1fr);max-width:none;max-height:none}.info-box{margin:5px 0;padding:8px;font-size:.85rem}.main-btn{margin-top:.5rem}}#portrait-message{color:#0ff;z-index:9999;text-align:center;background:#000;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:none;position:fixed;top:0;left:0}@media screen and (orientation:portrait){body.is-mobile #portrait-message{display:flex}}