.city-3d{position:fixed;inset:0;z-index:60;background:#cadbdf;color:#293e35;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--glass:#fffaf0e8;--line:#ffffffaa;--ink:#304c3f;--gold:#b88a50}.city3d-stage,.city3d-stage>canvas,.city3d-labels,.city3d-vignette{position:absolute;inset:0;width:100%;height:100%}.city3d-stage>canvas{display:block;touch-action:none;outline:0}.city3d-vignette{pointer-events:none;background:linear-gradient(180deg,#e9f0ed55,transparent 25%,transparent 70%,#253d2822);box-shadow:inset 0 0 90px #b4c8bd33}.city3d-header{position:absolute;top:28px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.city3d-header>div{pointer-events:auto}.city3d-brand{display:flex;align-items:center;gap:20px;text-shadow:0 2px 12px #fff9}.city3d-brand>span{font:46px Georgia,'Songti SC',serif;letter-spacing:-5px;position:relative}.city3d-brand>span>span{font-size:17px;color:#b78343;position:absolute;top:-8px;right:-9px}.city3d-brand small{font-size:8px;letter-spacing:2.4px;font-weight:600}.city3d-brand h2{font:24px Georgia,'Times New Roman',serif;margin:7px 0 0;letter-spacing:-.6px}.city3d-account{display:flex;gap:10px;align-items:center}.city3d-account>span{background:var(--glass);border:1px solid var(--line);border-radius:16px;padding:11px 21px;box-shadow:0 8px 28px #26453010;backdrop-filter:blur(12px)}.city3d-account small{display:block;font-size:7px;letter-spacing:1.4px;color:#9a947b}.city3d-account b{display:block;font-size:19px;font-weight:500;margin-top:3px}.city3d-account button{border:1px solid var(--line);background:var(--glass);border-radius:15px;padding:13px 17px;display:flex;align-items:center;gap:8px;font-size:11px}.city3d-account svg,.city3d-toolbar svg{width:18px;height:18px}.city3d-account #city3dExit{font-size:24px;padding:7px 13px;background:#fff8eabb;color:#63775f;border-radius:50%}.city3d-toolbar{position:absolute;top:115px;left:32px;display:flex;gap:7px}.city3d-toolbar button{background:var(--glass);border:1px solid var(--line);display:flex;align-items:center;gap:9px;padding:12px 16px;border-radius:11px;box-shadow:0 6px 20px #28472e0c;font-size:10px;color:#4b5f4e;backdrop-filter:blur(12px)}.city3d-toolbar button:hover{background:#fffbee}.city3d-toolbar button.active{color:#fff5db;background:#345b49;border-color:#577a60}.city3d-chapter{position:absolute;left:34px;top:179px;display:flex;flex-direction:column;gap:9px;pointer-events:none;text-shadow:0 2px 9px #fff8}.city3d-chapter>span{font-size:8px;letter-spacing:2px;color:#596e56}.city3d-chapter>b{font:19px Georgia,serif;letter-spacing:-.3px;color:#3f594a}.city3d-chapter>small{font-size:9px;color:#64806b}.city3d-place-label{position:absolute;left:0;top:0;padding:7px 11px;border-radius:9px;background:#fffcf0e0;border:1px solid #ffffffb0;box-shadow:0 4px 16px #2b3a3222;white-space:nowrap;text-align:center;pointer-events:auto;backdrop-filter:blur(8px);transition:background .2s;will-change:transform}.city3d-place-label span{display:block;font:13px Georgia,'Songti SC',serif;letter-spacing:1px}.city3d-place-label b{display:block;font-size:8px;font-weight:500;margin-top:3px;color:#6d8067}.city3d-place-label:after{content:'';position:absolute;bottom:-4px;left:calc(50% - 4px);width:7px;height:7px;transform:rotate(45deg);background:#faf7e7}.city3d-place-label.selected{background:#2e5546;color:#fff5da;border-color:#88a27b}.city3d-place-label.selected b{color:#e0dfc1}.city3d-place-label.selected:after{background:#2e5546}.city3d-labels{pointer-events:none}.city3d-camera{position:absolute;right:30px;top:42%;display:grid;gap:5px}.city3d-camera button{width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:var(--glass);font-size:22px;box-shadow:0 6px 20px #29402a15}.city3d-camera span{height:6px}.city3d-minimap{position:absolute;right:30px;bottom:28px;width:174px;padding:7px;background:var(--glass);border:1px solid var(--line);border-radius:15px;box-shadow:0 12px 40px #30402a24}.city3d-minimap canvas{width:100%;height:auto;display:block;border-radius:9px;opacity:.88}.city3d-minimap button{width:100%;background:transparent;font-size:7px;letter-spacing:1.2px;padding:10px 0 2px;color:#778168}.city3d-vehicle{position:absolute;bottom:35px;left:208px;display:flex;align-items:center;gap:17px;border:1px solid var(--line);border-radius:17px;padding:15px 22px;background:var(--glass);backdrop-filter:blur(18px);box-shadow:0 10px 35px #31432d12}.city3d-speed{border-right:1px solid #dddcc4;padding-right:19px;display:grid;min-width:54px;text-align:center}.city3d-speed strong{font:36px Georgia,serif;line-height:1}.city3d-speed span{font-size:7px;letter-spacing:2px;margin-top:7px;color:#93997b}.city3d-vehicle small{font-size:7px;letter-spacing:1.6px;color:#9b8e6c}.city3d-vehicle b{display:block;font-size:12px;font-weight:500;margin:6px 0}.city3d-vehicle button{background:transparent;padding:0;color:#648168;font-size:9px;text-align:left}.city3d-drivepad{position:absolute;left:30px;bottom:26px;width:145px;height:145px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:3px;touch-action:none}.city3d-drivepad button,.city3d-brake{touch-action:none;user-select:none;-webkit-user-select:none;background:#fcf8eecf;border:1px solid #ffffffb3;border-radius:13px;box-shadow:0 6px 22px #314b3418;backdrop-filter:blur(8px);font-size:25px;color:#385744}.city3d-drivepad #driveUp{grid-column:2;grid-row:1}.city3d-drivepad #driveDown{grid-column:2;grid-row:3}.city3d-drivepad #driveLeft{grid-column:1;grid-row:2}.city3d-drivepad #driveRight{grid-column:3;grid-row:2}.city3d-drivepad>span{grid-column:2;grid-row:2;display:grid;place-items:center;font-size:5px;color:#4e674f;letter-spacing:.4px}.city3d-drivepad button.held,.city3d-brake.held{background:#345e49;color:#fff5d5;transform:scale(.94)}.city3d-brake{position:absolute;bottom:44px;right:229px;width:66px;height:66px;background:#f7e7d7e3;display:grid;place-content:center;gap:4px}.city3d-brake small{font-size:7px;letter-spacing:1px}.city3d-instructions{position:absolute;bottom:15px;left:210px;font-size:8px;color:#4d6750;text-shadow:0 1px 8px white}.city3d-instructions>span{font-size:7px;background:#fff9e2bd;border-radius:3px;padding:3px 4px;margin:0 4px 0 11px}.city3d-instructions>span:first-child{margin-left:0}.city3d-instructions i{font-size:7px;margin-left:14px;font-style:normal;opacity:.8}.city3d-drawer{position:absolute;left:28px;top:168px;bottom:185px;width:315px;max-height:600px;background:#fffaf0f2;border:1px solid #fff;border-radius:19px;box-shadow:0 20px 80px #20372733;backdrop-filter:blur(18px);padding:20px;overflow:auto;scrollbar-width:thin;z-index:5}.city3d-drawer-head{display:flex;justify-content:space-between;align-items:center}.city3d-drawer-head small{font-size:7px;letter-spacing:1.4px;color:#8b9577}.city3d-drawer-head h3{font:25px Georgia,serif;margin:7px 0 18px}.city3d-drawer-head button{background:#ebe8d6;border-radius:50%;font-size:21px;width:30px;height:30px;flex-shrink:0}.city3d-drawer input{font-size:10px;padding:11px;border:1px solid #dfdfca;border-radius:9px;background:#f6f3e6}.city3d-drawer #city3dPlaces{display:grid;gap:6px;margin-top:15px}.city3d-drawer [data-city3d-place]{display:flex;align-items:center;gap:11px;background:#f0efdf;padding:11px;border:1px solid #e1e4d0;border-radius:10px;text-align:left}.city3d-drawer [data-city3d-place]>span{width:30px;height:30px;display:grid;place-items:center;background:#e0e7d3;border-radius:9px}.city3d-drawer [data-city3d-place] svg{width:16px;height:16px}.city3d-drawer [data-city3d-place] b{display:block;font-size:11px;font-weight:500}.city3d-drawer [data-city3d-place] small{display:block;font-size:10px;color:#8b9679;margin-top:3px}.city3d-drawer [data-city3d-place] i{margin-left:auto;color:#9ba385;font-style:normal}.city3d-selected{position:absolute;bottom:162px;left:50%;transform:translateX(-50%);max-width:510px;width:calc(100% - 420px);background:#fffaedf0;border:1px solid #fff;border-radius:17px;padding:18px 22px;display:flex;align-items:center;gap:22px;box-shadow:0 10px 50px #2e4b2b30;backdrop-filter:blur(15px)}.city3d-selected>div:first-of-type{flex:1}.city3d-selected small{font-size:7px;letter-spacing:1.1px;color:#929977}.city3d-selected h3{font:21px Georgia,serif;margin:8px 0 6px}.city3d-selected p{font-size:9px;line-height:1.6;color:#84906e;margin:0}.city3d-selection-close{position:absolute;right:9px;top:6px;background:transparent;font-size:19px;color:#8d9a7e}.city3d-destination-actions{display:grid;gap:7px}.city3d-main-action{background:#365e49;color:#fff4d6;padding:12px 17px;border-radius:9px;white-space:nowrap;font-size:10px}.city3d-test-action{background:#e9d8b8;color:#735632;padding:10px 13px;border-radius:9px;white-space:nowrap;font-size:10px}.city3d-trial{position:absolute;top:174px;left:50%;transform:translateX(-50%);background:#986347e8;color:#fff4d9;padding:10px 18px;border:1px solid #f1c497;border-radius:25px;font-size:9px;letter-spacing:1.6px;box-shadow:0 10px 35px #5d482629}.city3d-notice{position:absolute;top:230px;left:50%;transform:translate(-50%,-10px);background:#294d3fed;color:#fff6dd;padding:13px 21px;border-radius:12px;max-width:550px;text-align:center;font-size:11px;line-height:1.7;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 8px 25px #29492f22}.show-notice .city3d-notice{opacity:1;transform:translate(-50%,0)}.close-view .city3d-chapter{opacity:.6}.city-3d button:focus-visible{outline:3px solid #c29156;outline-offset:3px}
@media(max-width:900px){.city3d-brand h2{font-size:20px}.city3d-brand small{font-size:7px;letter-spacing:1.8px}.city3d-vehicle{left:185px;padding:12px 15px;gap:10px}.city3d-brake{right:190px}.city3d-minimap{width:142px}.city3d-instructions{left:188px}.city3d-instructions i{display:none}.city3d-selected{width:calc(100% - 280px)}}
@media(max-width:700px){.city3d-header{top:max(18px,env(safe-area-inset-top));left:17px;right:17px;align-items:flex-start}.city3d-brand{gap:11px}.city3d-brand>span{font-size:32px;letter-spacing:-4px}.city3d-brand>span>span{font-size:12px;right:-6px}.city3d-brand small{font-size:5px;letter-spacing:1px}.city3d-brand h2{font-size:15px;margin-top:5px;max-width:135px;line-height:1.2}.city3d-account{gap:5px}.city3d-account>span{padding:8px 11px;border-radius:11px}.city3d-account small{font-size:5px;letter-spacing:.6px}.city3d-account b{font-size:15px}.city3d-account button{padding:9px;border-radius:11px}.city3d-account svg{width:16px;height:16px}.city3d-account button>span{display:none}.city3d-account #city3dExit{font-size:19px;padding:6px 9px}.city3d-toolbar{top:max(86px,calc(env(safe-area-inset-top) + 68px));left:14px;right:14px;gap:5px}.city3d-toolbar button{flex:1;justify-content:center;gap:5px;font-size:8px;padding:10px 7px;border-radius:9px}.city3d-toolbar svg{width:14px;height:14px}.city3d-toolbar #city3dDay{flex:0;padding:10px}.city3d-toolbar #city3dDay span{display:none}.city3d-chapter{top:140px;left:18px;gap:7px}.city3d-chapter>span{font-size:6px;letter-spacing:1.3px}.city3d-chapter>b{font-size:16px}.city3d-chapter>small{font-size:7px;max-width:235px;line-height:1.5}.city3d-camera{right:13px;top:38%;gap:5px}.city3d-camera button{width:32px;height:32px;font-size:20px;border-radius:9px}.city3d-place-label{padding:5px 7px;border-radius:7px}.city3d-place-label span{font-size:11px}.city3d-place-label b{font-size:7px}.city3d-minimap{width:100px;right:14px;bottom:182px;padding:5px;border-radius:10px}.city3d-minimap button{font-size:5px;letter-spacing:.5px;padding:6px 0 1px}.city3d-vehicle{left:16px;bottom:max(20px,env(safe-area-inset-bottom));right:16px;padding:10px 14px;border-radius:14px;gap:13px;height:72px;pointer-events:none}.city3d-vehicle button{pointer-events:auto;font-size:9px}.city3d-speed{padding-right:13px;min-width:48px}.city3d-speed strong{font-size:29px}.city3d-speed span{font-size:6px;letter-spacing:1px;margin-top:3px}.city3d-vehicle small{font-size:6px}.city3d-vehicle b{font-size:11px;margin:4px 0}.city3d-drivepad{width:129px;height:129px;left:16px;bottom:105px}.city3d-drivepad button{font-size:24px;border-radius:12px}.city3d-brake{right:19px;bottom:107px;width:56px;height:56px;border-radius:17px}.city3d-instructions{display:none}.city3d-drawer{top:132px;left:14px;right:14px;width:auto;bottom:265px;padding:16px;max-height:none}.city3d-selected{bottom:272px;left:14px;right:14px;transform:none;width:auto;max-width:none;padding:15px 18px;gap:12px;border-radius:13px;flex-wrap:wrap}.city3d-selected h3{font-size:19px}.city3d-selected small{font-size:6px}.city3d-selected p{font-size:8px}.city3d-destination-actions{display:flex;flex:1 0 100%;gap:8px}.city3d-destination-actions button{flex:1;font-size:9px;padding:11px 8px}.city3d-trial{top:190px;font-size:7px;letter-spacing:1px;white-space:nowrap;padding:9px 13px}.city3d-notice{top:226px;left:18px;right:18px;transform:translateY(-8px);max-width:none;font-size:10px;padding:11px 16px}.show-notice .city3d-notice{transform:translateY(0)}.is-driving .city3d-chapter>small{display:none}}
@media(max-height:650px) and (min-width:701px){.city3d-header{top:15px}.city3d-toolbar{top:90px}.city3d-chapter{display:none}.city3d-selected{bottom:135px}.city3d-drawer{top:140px;bottom:145px}.city3d-trial{top:142px}}
@media(prefers-reduced-motion:reduce){.city-3d button,.city3d-notice{transition:none}}
