:root{--gold:#ffd43b;--gold2:#ffb300;--glass:rgba(12,19,22,.78);--glass2:rgba(18,28,32,.90);--line:rgba(255,255,255,.13);--text:#f5f8f9;--muted:#aebbc0;--green:#15965a;--red:#b72735}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}body{font-family:'Cairo',system-ui,sans-serif;background:#0c1214;color:var(--text);-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.mb-auth-shell{position:relative;width:100%;height:100%;display:grid;place-items:center;padding:20px;overflow:auto;background:linear-gradient(#8db9cc 0 58%,#c6b18d 58% 100%)}.mb-egypt-sky{position:fixed;inset:0;background:radial-gradient(circle at 72% 15%,rgba(255,234,169,.8),transparent 18%),linear-gradient(#8fbed2,#d4d1bd 62%,#c6b18d);pointer-events:none}.mb-city-silhouette{position:fixed;left:0;right:0;bottom:0;height:31%;opacity:.38;background:linear-gradient(90deg,#765f49 0 8%,transparent 8% 10%,#8c7155 10% 19%,transparent 19% 21%,#6f5944 21% 37%,transparent 37% 40%,#866d52 40% 51%,transparent 51% 54%,#705944 54% 73%,transparent 73% 75%,#8b7053 75% 100%)}.mb-auth-card{position:relative;z-index:2;width:min(650px,100%);padding:30px;border:1px solid var(--line);border-radius:28px;background:rgba(10,17,20,.91);box-shadow:0 28px 90px rgba(0,0,0,.32);backdrop-filter:blur(18px)}.mb-auth-card.error{text-align:center}.mb-auth-logo{display:flex;align-items:center;gap:10px;color:var(--gold);font-weight:900;letter-spacing:.04em}.mb-auth-logo svg{width:30px;height:30px}.mb-kicker{font-size:.72rem;letter-spacing:.16em;color:#91a4ab}.mb-auth-card h1{font-size:3rem;line-height:1.05;margin:8px 0}.mb-auth-card h1 em{font-style:normal;color:var(--gold)}.mb-auth-sub{color:#c2cdd1;line-height:1.9}.mb-auth-features{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0}.mb-auth-features span{padding:10px;border:1px solid var(--line);border-radius:13px;background:#152025;display:flex;gap:7px;align-items:center;font-size:.83rem}.mb-auth-features svg{width:17px;color:var(--gold)}.mb-auth-tabs{display:flex;gap:8px;margin:18px 0 12px}.mb-auth-tabs button,.mb-auth-form button,.mb-auth-card>button,.mb-auth-card>a{border:0;border-radius:13px;padding:13px;background:#202a2d;color:white;text-decoration:none;display:flex;justify-content:center;align-items:center;gap:8px}.mb-auth-tabs .active,.mb-primary{background:linear-gradient(135deg,var(--gold),var(--gold2))!important;color:#181818!important;font-weight:900}.mb-auth-form{display:grid;gap:12px}.mb-auth-form label{display:grid;gap:7px;color:#dce4e7}.mb-auth-form input{width:100%;border:1px solid var(--line);border-radius:12px;background:#0e1416;color:white;padding:12px 14px;outline:none}.mb-auth-form input:focus{border-color:var(--gold)}.mb-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mb-auth-footer{display:flex;gap:8px;align-items:center;color:#9fafb5;font-size:.8rem;margin-top:17px}.mb-splash{color:#152126;text-align:center}.mb-splash-bus{font-size:6rem;animation:busfloat 1.7s ease-in-out infinite}@keyframes busfloat{50%{transform:translateY(-8px) rotate(-2deg)}}
.mb-game{position:relative;width:100%;height:100%;background:#8fbad0;overflow:hidden;user-select:none}.mb-scene,.mb-canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}.mb-topbar{position:absolute;top:14px;right:14px;left:14px;height:56px;display:flex;align-items:center;gap:8px;z-index:25;pointer-events:none}.mb-topbar>*{pointer-events:auto}.mb-brand,.mb-stat,.mb-icon-btn{height:52px;background:linear-gradient(180deg,rgba(20,30,34,.91),rgba(10,17,20,.82));backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;display:flex;align-items:center;gap:9px;box-shadow:0 8px 28px rgba(0,0,0,.2)}.mb-brand{padding:7px 14px}.mb-brand>svg{color:var(--gold)}.mb-brand span{display:grid;line-height:1.08}.mb-brand small{font-size:.58rem;color:#94a5ab;letter-spacing:.08em}.mb-stat{padding:0 12px;font-size:.9rem}.mb-stat svg{width:17px;color:var(--gold)}.mb-icon-btn{width:52px;justify-content:center;color:white;border:0}.mb-icon-btn.active{background:rgba(11,132,76,.92)}.mb-icon-btn.active-sound{box-shadow:inset 0 0 0 1px rgba(255,212,59,.34),0 8px 28px rgba(0,0,0,.2)}.mb-mobile-menu{display:none;margin-right:auto}
.mb-route-hud{position:absolute;top:82px;right:14px;z-index:18;width:330px;max-width:calc(100vw - 28px);background:linear-gradient(180deg,rgba(14,23,27,.90),rgba(9,16,19,.84));border:1px solid var(--line);border-radius:18px;padding:12px 13px;box-shadow:0 10px 32px rgba(0,0,0,.2);backdrop-filter:blur(12px)}.mb-route-line{display:flex;align-items:center;gap:9px;padding-left:75px}.mb-route-line svg{color:var(--gold);flex:0 0 auto}.mb-route-line div{display:grid;min-width:0}.mb-route-line small{color:#aebbc0;font-size:.72rem}.mb-route-line b{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mb-distance{position:absolute;top:12px;left:12px;background:#26353b;padding:5px 8px;border-radius:9px;font-size:.78rem;font-weight:800}.mb-trip-meta{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap}.mb-trip-meta span{background:#172227;border:1px solid rgba(255,255,255,.08);padding:5px 8px;border-radius:999px;font-size:.73rem}.mb-stop-action{width:100%;margin-top:9px;border:0;border-radius:11px;padding:9px;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#171717;font-weight:900;display:flex;justify-content:center;align-items:center;gap:7px}
.mb-menu{position:absolute;left:14px;top:82px;z-index:18;width:164px;display:grid;gap:6px}.mb-menu button,.mb-quick button{border:1px solid var(--line);background:rgba(12,19,22,.82);backdrop-filter:blur(12px);color:white;border-radius:12px;display:flex;align-items:center;gap:8px;box-shadow:0 7px 22px rgba(0,0,0,.14)}.mb-menu button{padding:9px 11px;font-size:.84rem}.mb-menu button svg,.mb-quick button svg{width:18px;height:18px}.mb-quick{position:absolute;left:14px;bottom:105px;z-index:17;display:flex;gap:7px}.mb-quick button{padding:9px 11px}.mb-quick button.horn{border-color:rgba(255,212,59,.32)}.mb-quick button.recording{background:rgba(170,25,40,.92);animation:recordpulse 1s ease-in-out infinite}@keyframes recordpulse{50%{box-shadow:0 0 0 8px rgba(170,25,40,.12)}}
.mb-dashboard{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:16;height:78px;min-width:275px;padding:8px 13px;background:radial-gradient(circle at 50% 20%,rgba(44,59,64,.96),rgba(9,15,18,.92));border:1px solid var(--line);border-radius:26px;box-shadow:0 12px 35px rgba(0,0,0,.28);display:flex;align-items:center;justify-content:center;gap:13px}.mb-gear{width:37px;height:37px;border-radius:11px;background:#0c1316;border:1px solid rgba(255,255,255,.09);display:grid;place-items:center;font-weight:900;color:var(--gold)}.mb-speed{display:grid;text-align:center;min-width:72px}.mb-speed strong{font-size:2rem;line-height:1}.mb-speed small{font-size:.64rem;color:#9ba9ae}.mb-rpm{display:grid;font-size:.62rem;color:#9ba9ae;text-align:center}.mb-rpm b{font-size:.85rem;color:#e9eeee}.mb-steer-meter{display:grid;text-align:center;color:#9ba9ae}.mb-steer-meter span{display:block;font-size:1.55rem;line-height:1;color:#dce4e7;transition:transform .08s linear}.mb-steer-meter small{font-size:.62rem}
.mb-controls{position:absolute;left:16px;right:16px;bottom:17px;z-index:17;display:flex;justify-content:space-between;align-items:end;pointer-events:none}.mb-controls button{pointer-events:auto;border:1px solid rgba(255,255,255,.18);color:white;box-shadow:0 6px 20px rgba(0,0,0,.25);touch-action:none;font-weight:800}.mb-steer{display:flex;gap:8px}.mb-steer button{width:72px;height:72px;border-radius:50%;background:radial-gradient(circle at 35% 28%,rgba(53,72,80,.98),rgba(13,21,24,.94));font-size:1.6rem}.mb-steer button:active{transform:scale(.95);background:#263941}.mb-pedals{display:flex;gap:8px;align-items:end}.mb-pedals button{height:68px;min-width:68px;border-radius:19px;padding:0 10px;background:rgba(22,31,35,.91)}.mb-pedals .gas{height:88px;min-width:82px;background:linear-gradient(180deg,#199b5d,#0d7645)}.mb-pedals .brake{background:linear-gradient(180deg,#b82f3e,#8d1f2b)}.mb-pedals .reverse{background:linear-gradient(180deg,#3d5663,#273943)}.mb-pedals button:active{transform:translateY(2px) scale(.97)}
.mb-bubbles{position:absolute;top:156px;left:50%;transform:translateX(-50%);z-index:13;width:min(460px,80vw);display:grid;gap:5px;text-align:center;pointer-events:none}.mb-bubbles div{background:rgba(7,10,11,.74);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:7px 13px;font-size:.82rem}.mb-voice-state{position:absolute;top:20px;left:50%;transform:translateX(-50%);z-index:24;background:rgba(10,112,67,.90);border:1px solid rgba(255,255,255,.13);border-radius:999px;padding:7px 12px;font-size:.76rem;box-shadow:0 5px 18px rgba(0,0,0,.18)}
.mb-panel{position:absolute;z-index:40;top:82px;right:18px;width:min(430px,calc(100vw - 36px));max-height:calc(100vh - 105px);background:rgba(10,17,20,.96);border:1px solid rgba(255,255,255,.14);border-radius:21px;box-shadow:0 28px 80px rgba(0,0,0,.4);overflow:hidden;backdrop-filter:blur(20px)}.mb-panel.wide{width:min(760px,calc(100vw - 36px))}.mb-panel>header{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line)}.mb-panel>header>div{display:flex;align-items:center;gap:8px}.mb-panel>header svg{color:var(--gold)}.mb-panel>header button{border:0;background:transparent;color:white}.mb-panel-body{padding:14px;overflow:auto;max-height:calc(100vh - 165px)}.mb-route-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.mb-route-cards button{display:grid;text-align:right;gap:4px;border:1px solid var(--line);background:#162126;color:white;border-radius:14px;padding:12px}.mb-route-cards button.selected{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}.mb-route-cards small{color:#9caab0}.mb-direction{display:flex;gap:8px;margin:12px 0}.mb-direction button{flex:1;border:1px solid var(--line);border-radius:12px;padding:10px;background:#182125;color:white}.mb-direction button.active{background:var(--gold);color:#111;font-weight:900}.mb-panel-body>.mb-primary{width:100%;border:0;border-radius:13px;padding:12px}.mb-queue-box,.mb-trip-box{display:grid;gap:7px;background:#162126;border:1px solid var(--line);padding:14px;border-radius:15px}.mb-queue-box>div{display:flex;gap:8px}.mb-danger{border:0;border-radius:11px;background:#8e2630;color:white;padding:9px 12px}.mb-vehicle-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.mb-vehicle-card{display:grid;gap:6px;background:#162126;border:1px solid var(--line);border-radius:16px;padding:13px}.mb-vehicle-card.equipped{border-color:var(--gold);box-shadow:inset 0 0 0 1px rgba(255,212,59,.3)}.mb-vehicle-card .emoji{font-size:2.4rem}.mb-vehicle-card small{color:#a4b0b5}.mb-vehicle-card strong{color:var(--gold)}.mb-vehicle-card button{border:0;border-radius:11px;padding:9px;background:#26343a;color:white}.mb-phrase-list{display:grid;gap:8px}.mb-phrase-list button{display:flex;gap:9px;align-items:center;text-align:right;border:1px solid var(--line);background:#162126;color:white;border-radius:12px;padding:10px}.mb-note{color:#b7c2c6;line-height:1.75;font-size:.84rem}.mb-sound-status{display:grid;gap:2px;margin-bottom:10px;padding:11px;border-radius:13px;background:#14231d;border:1px solid rgba(64,205,130,.15)}.mb-sound-status small{color:#a9bab2}.mb-test-sound{width:100%;border:0;border-radius:12px;padding:10px}.mb-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.mb-stats-grid div{display:grid;gap:4px;background:#162126;border-radius:14px;padding:13px}.mb-stats-grid small{color:#9fadb2}.mb-stats-grid b{color:var(--gold)}.mb-chat-form{display:flex;gap:8px}.mb-chat-form input{flex:1;border:1px solid var(--line);background:#0e1416;color:white;border-radius:12px;padding:11px}.mb-chat-form button{border:0;border-radius:12px;width:52px}
.mb-name-tag,.mb-stop-label,.mb-district,.mb-shop-sign,.mb-billboard{white-space:nowrap;background:rgba(13,18,20,.84);color:white;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:4px 8px;font-family:'Cairo',sans-serif;font-size:11px;box-shadow:0 4px 12px rgba(0,0,0,.24)}.mb-name-tag{background:rgba(0,0,0,.72);font-weight:700}.mb-stop-label.active{background:var(--gold);color:#171717;font-weight:900}.mb-district{font-size:15px;font-weight:900;background:rgba(105,73,49,.86)}.mb-shop-sign{background:#294a34}.mb-billboard{display:grid;gap:2px;text-align:center;padding:8px 15px;background:#123d55}.mb-billboard b{font-size:17px;color:var(--gold)}.mb-billboard small{font-size:9px}
.mb-tutorial-backdrop{position:absolute;inset:0;z-index:100;background:rgba(4,8,10,.72);display:grid;place-items:center;padding:18px;backdrop-filter:blur(7px)}.mb-tutorial{width:min(540px,100%);position:relative;background:linear-gradient(180deg,#17252a,#0c1417);border:1px solid rgba(255,255,255,.15);border-radius:25px;padding:25px;box-shadow:0 30px 100px rgba(0,0,0,.52);text-align:right}.mb-tutorial-progress{display:flex;gap:5px;direction:ltr;margin-bottom:17px}.mb-tutorial-progress i{height:4px;flex:1;border-radius:999px;background:#344248}.mb-tutorial-progress i.active{background:var(--gold)}.mb-tutorial-bus{font-size:3.3rem;line-height:1}.mb-step-count{position:absolute;top:28px;left:25px;color:#8fa2a9}.mb-tutorial h2{font-size:1.45rem;margin:8px 0}.mb-tutorial p{line-height:1.9;color:#d1dadd;margin:0}.mb-tutorial-tip{margin-top:14px;padding:11px 12px;border-radius:13px;background:rgba(255,212,59,.09);border:1px solid rgba(255,212,59,.17);color:#f5e5a3;font-size:.84rem}.mb-control-demo{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:10px;color:#a9bac0;font-size:.78rem}.mb-tutorial footer{display:flex;justify-content:space-between;gap:8px;margin-top:19px}.mb-tutorial footer button{border:0;border-radius:12px;padding:11px 16px}.mb-tutorial footer .skip{background:#263238;color:#d2dcdf}.mb-tutorial footer .next{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#151515;font-weight:900;min-width:120px}
@media(max-width:900px){.mb-auth-shell{padding:8px}.mb-auth-card{padding:20px;border-radius:20px}.mb-auth-features{grid-template-columns:1fr 1fr}.mb-form-grid{grid-template-columns:1fr}.mb-topbar{top:8px;right:8px;left:8px;height:48px;gap:6px}.mb-brand,.mb-stat,.mb-icon-btn{height:47px;border-radius:14px}.mb-brand{padding:6px 10px}.mb-brand small{display:none}.mb-stat{display:none}.mb-icon-btn{width:47px}.mb-mobile-menu{display:flex;margin-right:auto}.mb-route-hud{top:63px;right:8px;width:300px;max-width:calc(100vw - 16px);padding:9px 10px}.mb-route-line{padding-left:62px}.mb-route-line b{font-size:.9rem}.mb-distance{top:9px;left:9px;font-size:.7rem}.mb-menu{display:none;top:62px;left:8px;width:175px;z-index:30}.mb-menu.open{display:grid}.mb-quick{left:8px;bottom:101px;gap:5px}.mb-quick button{padding:8px}.mb-quick button span{display:none}.mb-dashboard{bottom:92px;height:55px;min-width:190px;padding:5px 9px;gap:7px;border-radius:20px}.mb-speed strong{font-size:1.45rem}.mb-rpm{display:none}.mb-steer-meter span{font-size:1.25rem}.mb-controls{bottom:10px;left:9px;right:9px}.mb-steer button{width:58px;height:58px}.mb-pedals button{height:56px;min-width:54px;border-radius:17px;padding:0 7px;font-size:.72rem}.mb-pedals .gas{height:70px;min-width:64px}.mb-panel,.mb-panel.wide{top:auto;bottom:0;right:0;width:100%;max-height:78vh;border-radius:22px 22px 0 0}.mb-panel-body{max-height:calc(78vh - 58px)}.mb-route-cards{grid-template-columns:1fr}.mb-vehicle-grid{grid-template-columns:1fr 1fr}.mb-voice-state{top:11px;font-size:.68rem}.mb-bubbles{top:126px;width:90vw}.mb-name-tag,.mb-stop-label,.mb-shop-sign{font-size:9px}.mb-district{font-size:11px}.mb-tutorial{padding:20px}.mb-step-count{top:23px;left:20px}}
@media(max-width:520px){.mb-auth-card h1{font-size:2.25rem}.mb-auth-features{font-size:.76rem}.mb-vehicle-grid{grid-template-columns:1fr}.mb-route-hud{width:calc(100vw - 16px)}.mb-trip-meta span:nth-child(2){display:none}.mb-stop-action{padding:8px}.mb-dashboard{min-width:165px}.mb-steer button{width:54px;height:54px}.mb-pedals button{min-width:49px}.mb-pedals .gas{min-width:58px}.mb-tutorial h2{font-size:1.25rem}.mb-tutorial p{font-size:.9rem}.mb-control-demo{display:grid}.mb-quick{bottom:94px}}