#mobileControls{display:none}#drivePanels{z-index:8;flex-direction:column;align-items:flex-start;gap:8px;max-width:calc(100vw - 32px);display:flex;position:fixed;top:16px;left:16px}html:not(.touch-ui) #drivePanels #timeAttack{pointer-events:auto;max-width:100%;position:static}.touch-ui #drivePanels{display:contents}html:not(.touch-ui) #hud:has(#help:not([hidden])) #drivePanels{visibility:hidden}.touch-ui #drivePanels #timeAttack{pointer-events:auto}.traffic-setting{pointer-events:auto;background:#101c2cda;border-radius:12px;padding:8px 12px;font-size:12px}.traffic-setting select,.traffic-option select{color:#fff;font:inherit;background:#213247;border:1px solid #ffffff48;border-radius:8px;padding:6px 10px}.traffic-setting small,.traffic-option small{opacity:.8;margin-top:5px;font-size:11px;display:block}.traffic-option{margin-bottom:14px;display:block}.touch-ui .traffic-setting{display:none}.touch-ui{--edge-left:max(12px, env(safe-area-inset-left));--edge-right:max(12px, env(safe-area-inset-right));--edge-bottom:max(16px, env(safe-area-inset-bottom));--action-size:clamp(44px, 12dvh, 64px);--pedal-height:clamp(52px, 18dvh, 76px)}.touch-ui body{overscroll-behavior:none}.touch-ui #mobileControls{z-index:12;pointer-events:none;-webkit-user-select:none;user-select:none;display:block;position:fixed;inset:0}.touch-ui #mobileControls button,.touch-ui #mobileControls a{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}#mobileControls button{color:#edf6ff;background:#101c2cda;border:1px solid #ffffff48;border-radius:14px;min-height:44px;font:650 12px system-ui;box-shadow:0 3px 12px #0005}#mobileControls button:active,#mobileControls button.held{background:#205473ed;border-color:#7be4ff}#mobileControls button[aria-pressed=true]{color:#91e9ff;border-color:#5edcff}#mobileControls button:focus-visible,#mobileControls a:focus-visible{outline-offset:3px;outline:2px solid #90eaff}.mobile-toolbar{top:max(10px, env(safe-area-inset-top));left:var(--edge-left);gap:6px;display:flex;position:absolute}.mobile-toolbar button{min-width:44px;padding:0 12px}.touch-steering,.touch-pedals{bottom:var(--edge-bottom);gap:6px;display:flex;position:absolute}.touch-steering{left:var(--edge-left)}.touch-pedals{right:var(--edge-right)}.touch-steering button{width:clamp(50px,8vw,68px);height:var(--pedal-height);font-size:28px!important}.touch-pedals button{width:clamp(48px,7vw,66px);height:var(--pedal-height);padding:0}#mobileControls .touch-pedals button{white-space:nowrap;font-size:11px}.touch-pedals [data-hold=ArrowDown]{width:clamp(44px,5.6vw,52px)}#mobileControls .accelerator{background:#16584cd9;border-color:#8de8cb80}#mobileControls .brake{background:#662936d9;border-color:#ffa8b580}.touch-actions{bottom:calc(var(--edge-bottom) + var(--pedal-height) + 12px);grid-template-columns:var(--action-size);gap:6px;display:grid;position:absolute}.touch-actions-left{left:var(--edge-left)}.touch-actions-right{right:var(--edge-right)}.touch-actions button{height:var(--action-size);flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:3px;display:flex;min-height:var(--action-size)!important;font-size:11px!important}.touch-symbol{font-size:19px;font-weight:700;line-height:1}.touch-ui #skills,.touch-ui #dials,.touch-ui #timer,.touch-ui #pedals{display:none}.touch-ui #speed{top:max(10px, env(safe-area-inset-top));text-align:center;white-space:nowrap;bottom:auto;left:50%;right:auto;transform:translate(-50%)}.touch-ui #speed b{font-size:34px}.touch-ui #speed span{font-size:12px}.touch-ui #speed .gear{font-size:20px!important}.touch-ui #vlimit{font-size:10px}.touch-ui #modeName{letter-spacing:.16em;margin:2px 0 0;font-size:12px}.touch-ui #gauges{top:auto;bottom:var(--edge-bottom);box-sizing:border-box;background:#101c2cc9;border:1px solid #ffffff35;border-radius:20px;grid-template-columns:1fr 1fr .65fr;gap:10px;width:clamp(280px,38vw,360px);max-width:calc(100vw - 40px);padding:7px 10px;display:grid;left:50%;transform:translate(-50%)}.touch-ui .gauge{letter-spacing:0;white-space:nowrap;min-width:0;margin:0;font-size:9px}.touch-ui .bar{height:4px;margin-top:3px}@media (orientation:landscape){.touch-ui #gauges{max-width:calc(100vw - 330px)}}.touch-ui #mm{top:max(10px, env(safe-area-inset-top));right:var(--edge-right);border-radius:12px;width:116px}.touch-ui #mm canvas{width:116px!important;height:108px!important}.touch-ui #mm .hint{display:none}.touch-ui #mm .eta{padding:4px 6px;font-size:9px}.touch-ui #toast{width:min(300px,78vw);padding:8px 12px;top:38%;bottom:auto}.touch-ui #toast .t1{font-size:13px}.touch-ui #toast .t1 kbd,.touch-ui #toast .t2,.touch-ui #gameOver button kbd{display:none}#trafficLightEditor{z-index:70;box-sizing:border-box;color:#fff;pointer-events:auto;background:#0b1521ed;border:1px solid #ffe2a080;border-radius:12px;gap:8px;width:min(320px,100vw - 32px);padding:14px;font:13px system-ui;display:grid;position:fixed;bottom:16px;right:16px;box-shadow:0 12px 32px #000b}#trafficLightEditor>small{color:#aebbc9;line-height:1.35}#trafficLightEditor label{grid-template-columns:1fr auto;align-items:center;gap:6px;display:grid}#trafficLightEditor label input[type=range]{accent-color:#ffd36b;grid-column:1/-1;width:100%}#trafficLightEditor label.check{justify-content:flex-start;display:flex}#trafficLightEditor select,#trafficLightEditor button{color:#fff;min-height:30px;font:inherit;background:#172638;border:1px solid #ffffff30;border-radius:6px}#trafficLightEditor .actions{gap:6px;display:flex}#trafficLightEditor .actions button{cursor:pointer;flex:1;padding:4px 6px}#trafficLightEditor .studio{background:#ffffff0d;border-radius:8px;gap:6px;padding:8px;display:grid}#trafficLightEditor .studio[hidden]{display:none}#trafficLightEditor [data-light-fields]{gap:6px;display:grid}#trafficLightEditor{max-height:calc(100dvh - 32px);overflow:auto}.light-studio #hud,.light-studio #mm,.light-studio #mobileControls,.light-studio #timeAttack,.light-studio #turn,.light-studio #drivePanels{visibility:hidden!important}@media (width<=720px){#trafficLightEditor{bottom:max(16px, env(safe-area-inset-bottom));width:min(310px,100vw - 16px);right:8px}}.touch-ui #help{pointer-events:auto;max-height:65dvh;overflow:auto}.touch-ui #turn{top:62px;left:var(--edge-left);gap:6px;min-width:0;max-width:120px;padding:7px;font-size:11px}.touch-ui #turn .ar{font-size:24px}.touch-ui #turn .d{font-size:16px}.touch-ui #turn .n{font-size:10px}#mobileSettings{pointer-events:auto;background:#020610ad;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.mobile-panel{box-sizing:border-box;background:#101a29;border:1px solid #ffffff30;border-radius:20px;width:min(420px,100%);max-height:85dvh;padding:18px;overflow:auto}.mobile-panel h2{margin:0 0 16px;font-size:18px}.mobile-panel .options{grid-template-columns:1fr 1fr;gap:8px;display:grid}.mobile-panel a{color:#e7f5ff;background:#213247;border-radius:12px;place-items:center;min-height:44px;font-size:13px;text-decoration:none;display:grid}#mobileClose{width:100%;margin-top:14px}#mobileMapClose,.mobile-map-zoom{display:none}.touch-ui .mobile-map-zoom{right:var(--edge-right);bottom:var(--edge-bottom);gap:8px;display:flex;position:absolute}.touch-ui .mobile-map-zoom button{color:#fff;touch-action:manipulation;background:#101c2c;border:1px solid #fff5;border-radius:12px;min-width:48px;min-height:48px;font-size:24px}.touch-ui #bigmap{z-index:25}.touch-ui #bigmap .side{width:150px;top:64px;left:var(--edge-left);max-height:55dvh;padding:8px;font-size:11px}.touch-ui #bigmap .tip{display:none}.touch-ui #bigmap .fav,.touch-ui #bigmap .cancel{align-items:center;min-height:28px;display:flex}.touch-ui #bigmap #mobileMapClose{top:max(10px, env(safe-area-inset-top));left:var(--edge-left);color:#fff;background:#101c2c;border:1px solid #fff5;border-radius:12px;min-height:44px;padding:0 16px;display:block;position:absolute}.touch-ui #start{padding:max(14px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));gap:12px;overflow-y:auto}.touch-ui #start .brand{flex-shrink:0;margin-bottom:auto}.touch-ui #start .brand img{width:min(360px,75vw,65vh);margin:0 auto}.touch-ui #start .tag{font-size:11px}.touch-ui #start .maps{flex-shrink:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:min(760px,100%);display:grid}.touch-ui #start .map{border-radius:14px;width:100%;min-width:0;max-width:none}.touch-ui #start .map .art{height:clamp(90px,16vw,140px)}.touch-ui #start .map .txt{padding:10px}.touch-ui #start .map b{font-size:16px}.touch-ui #start .map b kbd,.touch-ui #start .keys,.touch-ui #loading .tip{display:none}.touch-ui #start .map p{font-size:11px;line-height:1.5}.touch-ui #start:after{content:"맵을 터치해 시작하세요";color:#bbcadb;flex-shrink:0;font-size:12px;position:relative}@media (width<=600px){.touch-ui #start .maps{grid-template-columns:repeat(2,minmax(0,1fr))}.touch-ui #start .map:last-child{grid-column:1/-1}}@media (orientation:portrait){.touch-ui .touch-actions{top:44%;bottom:auto;transform:translateY(-50%)}.touch-ui #gauges{bottom:calc(var(--edge-bottom) + var(--pedal-height) + 12px);width:330px}.touch-ui #speed{top:122px}.touch-ui #mm{width:96px}.touch-ui #mm canvas{width:96px!important;height:90px!important}.touch-ui .mobile-toolbar{gap:5px}.touch-ui .mobile-toolbar button{padding:0 8px;font-size:11px}}@media (height<=330px) and (orientation:landscape){.touch-ui .touch-actions{grid-template-columns:repeat(2,44px)}.touch-ui .gauge{font-size:8px}.touch-ui #mm{width:88px}.touch-ui #mm canvas{width:88px!important;height:70px!important}}@media (height<=450px){.touch-ui #start .brand{margin-bottom:0}.touch-ui #start .brand img{width:180px}.touch-ui #start .tag{display:none}.touch-ui #start .map .art{height:75px}.touch-ui #start .map p{display:none}.touch-ui #start .map .txt{padding:8px 12px}.touch-ui #start .map b{margin:0}.touch-ui #start:after{font-size:10px}.touch-ui #toast{top:30%}}
