:root{color:#f4f0e8;background:radial-gradient(circle at top left,rgba(255,158,68,.18),transparent 34%),radial-gradient(circle at top right,rgba(31,96,168,.22),transparent 28%),linear-gradient(180deg,#081018,#0f1d29 48%,#13293b);font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;--panel-bg: rgba(7, 15, 22, .82);--panel-border: rgba(255, 255, 255, .12);--panel-soft: rgba(255, 255, 255, .07);--text-main: #fff8ef;--text-muted: rgba(255, 248, 239, .72);--accent: #ff8f3d;--accent-2: #2d90ff;--success: rgba(34, 126, 71, .88);--error: rgba(170, 41, 49, .88);--info: rgba(24, 77, 126, .88);--shadow-lg: 0 24px 54px rgba(0, 0, 0, .26)}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%}body{overflow:hidden}button,input{font:inherit}button{touch-action:manipulation}button:disabled{opacity:.64;cursor:not-allowed}.app-shell{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;background:#081018}.map-container,.map-overlay{position:absolute;inset:0}.map-container{width:100%;height:100vh;height:100dvh}.map-overlay{pointer-events:none;background:linear-gradient(180deg,#04090e6b,#04090e0f,#04090e00 44%),linear-gradient(0deg,#04090e57,#04090e14 16%,#04090e00 36%)}.map-overlay.driving{background:linear-gradient(180deg,#04090e80,#04090e24,#04090e00 30%),linear-gradient(0deg,#04090e85,#04090e29,#04090e00 32%)}.top-bar,.status-stack,.bottom-panel,.phone-floating-stack,.driving-layout{position:absolute;z-index:30}.top-bar{z-index:40}.top-bar{top:0;left:0;right:0;padding:max(14px,env(safe-area-inset-top)) 20px 0}.search-card,.bottom-panel,.phone-mini-card,.phone-relay-card,.status-banner,.nav-instruction-card,.driving-bottom,.hud-warning-pill{border:1px solid var(--panel-border);background:var(--panel-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.search-card{width:min(1360px,calc(100vw - 40px));margin:0 auto;padding:18px 20px 16px;border-radius:26px;box-shadow:var(--shadow-lg)}.search-card.compact{padding:12px 14px;border-radius:22px;background:#070f16bd;box-shadow:0 14px 28px #00000038}.route-selected-top-panel{width:min(820px,calc(100vw - 360px));max-width:820px;margin:0 auto 0 0}.route-selected-top-panel h1{font-size:clamp(1rem,.6vw + .95rem,1.35rem)}.route-selected-top-panel .destination-chip{max-width:220px;overflow:hidden;text-overflow:ellipsis}.title-row,.top-card-actions,.panel-header,.panel-header-actions,.section-header,.favorite-card,.result-card,.route-option-head,.route-option-metrics,.phone-relay-head,.phone-relay-actions,.phone-button-row,.mini-card-meta,.compact-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.title-row{align-items:flex-start;margin-bottom:12px}.search-card.compact .title-row{margin-bottom:10px}.mode-badge,.panel-kicker{margin:0 0 6px;color:#ffddc2e0;font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.search-card h1,.panel-header h2,.section-header h3,.nav-instruction-card h1{margin:0;color:var(--text-main)}.search-card h1{font-size:clamp(1.1rem,1.1vw + 1rem,1.8rem);font-weight:800}.top-card-actions{flex-wrap:wrap;justify-content:flex-end}.calibration-pill,.destination-chip{padding:10px 16px;border-radius:999px;background:#ff8f3d29;color:#ffe1c3;white-space:nowrap}.search-panel-body{display:grid;gap:12px}.search-panel-body.collapsed .action-row{display:none}.search-form{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:12px}.search-form.compact{grid-template-columns:minmax(0,1fr) 176px}.search-form input,.search-form button,.action-row button,.toggle-chip,.result-action-button,.route-option-card,.collapse-button,.driving-action-row button,.subtle-button{min-height:48px;border-radius:16px;border:0}.search-form input{min-width:0;padding:0 18px;font-size:1rem;background:#fffaf5f5;color:#0f2131}.search-form button,.result-action-button,.collapse-button,.start-nav-button{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);color:#fff;font-weight:800;cursor:pointer}.action-row{display:flex;flex-wrap:wrap;gap:10px}.action-hint{display:inline-flex;align-items:center;min-height:48px;padding:0 14px;border-radius:16px;color:var(--text-muted);background:#ffffff0d;border:1px solid rgba(255,255,255,.08);font-size:.88rem;white-space:nowrap}.action-row.compact button,.action-row.compact .toggle-chip,.compact-toolbar .subtle-button{min-height:48px}.action-row button,.toggle-chip{padding:0 18px}.toggle-chip{display:inline-flex;align-items:center;gap:10px;color:#fff;background:#ffffff14;border:1px solid rgba(255,255,255,.14)}.toggle-chip input{width:18px;height:18px;accent-color:var(--accent)}.secondary-button,.ghost-button,.subtle-button{color:#fff;cursor:pointer}.secondary-button{background:#ffffff1f}.ghost-button,.subtle-button{background:#ffffff0f;border:1px solid rgba(255,255,255,.14)}.start-nav-button{min-width:160px;box-shadow:0 12px 28px #2d90ff3d}.compact-toolbar{flex-wrap:wrap;justify-content:flex-start;color:var(--text-muted);font-size:.9rem}.status-stack{top:176px;left:20px;right:20px;display:grid;gap:10px;pointer-events:none;z-index:24}.status-banner{width:min(1360px,100%);margin:0 auto;padding:12px 16px;border-radius:18px;color:#fff;pointer-events:auto;box-shadow:0 12px 28px #0000002e}.status-banner.info{background:var(--info)}.status-banner.error{background:var(--error)}.status-banner.success{background:var(--success)}.status-grid,.route-summary,.route-extra-grid,.phone-relay-grid,.phone-metrics,.driving-action-row,.driving-route-summary,.bottom-panel-grid{display:grid;gap:10px}.status-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.status-item span,.summary-card span,.result-main span,.result-meta span,.favorite-main span,.instruction-meta span,.step-list li span{display:block;color:#ffffffc7}.status-item span,.summary-card span{margin-bottom:4px;font-size:.82rem}.status-item strong,.favorite-main strong,.step-list li strong{display:block;word-break:break-word}.status-item-wide{grid-column:1 / -1}.phone-floating-stack{top:max(18px,env(safe-area-inset-top));right:20px;width:min(400px,calc(100vw - 40px));display:grid;gap:10px;z-index:35}.phone-floating-stack.routeSelected{top:24px;right:24px;width:252px;z-index:45}.phone-floating-stack.routeSelected.expanded{top:120px;width:min(340px,calc(100vw - 48px))}.phone-floating-stack.navigating{top:max(18px,env(safe-area-inset-top))}.phone-mini-card,.phone-relay-card,.favorite-card,.result-card,.summary-card,.route-option-card,.route-warning,.step-list li,.section-empty,.driving-routes-panel{padding:14px 16px;border-radius:18px;background:#ffffff12}.phone-mini-card strong,.hud-status-card strong,.summary-card strong,.route-option-head strong,.favorite-main strong,.result-main strong{color:var(--text-main)}.phone-gps-mini-card{width:100%;max-height:130px;display:grid;gap:8px;padding:12px 13px}.phone-gps-mini-card .panel-kicker{margin-bottom:4px;font-size:.68rem}.phone-gps-mini-card strong{font-size:.95rem}.phone-gps-mini-card .mini-card-meta{gap:3px;font-size:.8rem;line-height:1.25}.phone-gps-mini-card .subtle-button{min-height:34px;justify-self:start;padding:0 12px;border-radius:12px;font-size:.82rem}.mini-card-meta{flex-wrap:wrap;justify-content:flex-start;color:var(--text-muted);font-size:.9rem}.mini-card-meta.stacked{display:grid;gap:4px}.phone-relay-card.floating{max-height:min(56vh,560px);overflow:auto;box-shadow:0 16px 34px #0000003d}.phone-gps-detail-drawer{width:100%;max-height:calc(100vh - 160px);overflow-y:auto;padding:14px}.phone-head-actions{display:flex;align-items:center;gap:10px}.phone-status-pill{padding:8px 12px;border-radius:999px;font-size:.84rem;font-weight:700}.phone-status-pill.idle,.phone-status-pill.waiting{background:#ffffff1a;color:#ffffffdb}.phone-status-pill.connected{background:#227e473d;color:#b8ffd2}.phone-status-pill.disconnected{background:#aa29313d;color:#ffd4d8}.phone-pairing-code{margin-bottom:10px;font-size:clamp(1.8rem,1.4vw + 1rem,2.6rem);font-weight:900;letter-spacing:.18em;color:#fff8ef}.phone-relay-text{margin:0 0 14px;color:var(--text-muted)}.phone-relay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bottom-panel{left:20px;right:20px;bottom:16px;width:min(1360px,calc(100vw - 40px));max-width:1360px;margin:0 auto;min-height:180px;max-height:min(42vh,420px);padding:16px 18px calc(16px + env(safe-area-inset-bottom));border-radius:28px;overflow:auto;box-shadow:0 -12px 30px #00000038}.bottom-panel.route-dock{left:50%;right:auto;bottom:calc(28px + env(safe-area-inset-bottom));transform:translate(-50%);width:min(1040px,calc(100vw - 72px));min-width:min(860px,calc(100vw - 72px));max-width:calc(100vw - 72px);min-height:0;max-height:none;padding:14px 16px;background:#060c12b8;box-shadow:0 -10px 20px #00000029;overflow:visible}.bottom-panel.route-dock.drawer-open{left:24px;transform:none;width:min(900px,calc(100vw - 464px));min-width:min(760px,calc(100vw - 464px))}.panel-header{align-items:flex-start;margin-bottom:12px}.panel-header-actions{flex-wrap:wrap;color:var(--text-muted)}.section-header{margin-bottom:12px}.section-header span{color:var(--text-muted);font-size:.9rem}.favorites-section,.results-section,.route-detail,.steps-card{margin-bottom:14px}.bottom-panel-grid{grid-template-columns:1.1fr .9fr}.favorite-list,.result-list,.step-list{margin:0;padding:0;list-style:none}.favorite-list,.result-list{display:grid;gap:10px}.favorite-card,.result-card{align-items:stretch}.favorite-main,.result-main{flex:1;min-width:0}.result-main span,.favorite-main span{margin-top:4px;font-size:.92rem}.result-meta{min-width:180px;text-align:right;font-size:.84rem}.result-meta span+span,.favorite-main span+span{margin-top:4px}.favorite-actions,.result-actions{display:grid;grid-template-columns:repeat(2,minmax(120px,auto));gap:10px}.route-option-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.route-strip{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.hud-route-strip{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.route-option-card{text-align:left;cursor:pointer;color:var(--text-main);border:1px solid transparent}.route-option-card.selected{border-color:#4db8ffb8;background:#4db8ff29;box-shadow:inset 0 0 0 1px #4db8ff29}.route-option-head{margin-bottom:8px}.route-option-metrics{margin-bottom:8px;color:#ffffffd6;font-size:.92rem}.route-option-card p{margin:0;color:var(--text-muted);font-size:.88rem}.route-detail-with-start{margin-bottom:0}.bottom-panel.route-dock .route-selected-dock{display:grid;grid-template-columns:minmax(0,1fr) 176px;gap:12px 16px;align-items:stretch}.bottom-panel.route-dock .panel-header{grid-column:1 / -1;margin-bottom:0}.bottom-panel.route-dock .route-strip{grid-column:1;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));align-items:stretch}.bottom-panel.route-dock .route-selected-action-row.fixed-primary{grid-column:2;width:100%;max-width:none;margin-top:0;flex-direction:column;justify-content:stretch}.bottom-panel.route-dock .route-selected-action-row.fixed-primary .route-selected-start-hint{display:none}.bottom-panel.route-dock .route-dock-actions{width:100%;height:100%;flex:0 0 auto;grid-template-rows:56px 48px}.bottom-panel.route-dock .route-selected-start-button{width:100%;min-width:150px;min-height:56px;padding:0 16px;font-size:1.05rem}.route-selected-action-row{display:flex;align-items:stretch;justify-content:space-between;gap:12px;width:100%;max-width:calc(100vw - 56px);margin-top:14px}.route-selected-controls{display:grid;gap:10px;justify-items:stretch;flex:0 0 min(220px,100%)}.route-selected-start-hint{display:grid;gap:6px;min-width:0;flex:1 1 auto;padding:12px 14px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:#ffffff0a;color:var(--text-muted);font-size:.92rem}.route-selected-start-hint span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-selected-start-button,.start-navigation-primary{min-width:140px;min-height:56px;padding:0 22px;border:0;border-radius:18px;background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);color:#fff;font-size:1rem;font-weight:800;letter-spacing:.02em;cursor:pointer;box-shadow:0 16px 34px #2d90ff3d;flex:0 0 auto}.route-selected-start-button:disabled,.start-navigation-primary:disabled{box-shadow:none}.route-details-toggle{width:100%;min-height:48px;border-radius:18px;background:#ffffff14;color:var(--text-main)}.route-badge{padding:4px 10px;border-radius:999px;background:#ff8f3d33;color:#ffe1c3;font-size:.78rem;font-weight:700}.route-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.route-extra-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.route-summary-wide{grid-column:1 / -1}.summary-card strong{font-size:1.15rem}.summary-text{font-size:1rem;line-height:1.4}.route-warning{color:#ffd4d8;background:#aa293138;border:1px solid rgba(255,123,132,.32)}.collapse-button{min-width:112px;padding:0 16px}.step-list{display:grid;gap:10px}.empty-state,.section-empty{color:var(--text-muted)}.empty-state p{margin:0 0 8px}.route-details-panel{position:absolute;top:132px;right:20px;bottom:calc(24px + env(safe-area-inset-bottom));width:min(380px,calc(100vw - 40px));display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px;padding:18px;border:1px solid var(--panel-border);border-radius:28px;background:#060c12d1;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 20px 44px #00000047;transform:translate(calc(100% + 28px));opacity:0;pointer-events:none;transition:transform .22s ease,opacity .18s ease;z-index:32}.route-details-panel.open{transform:translate(0);opacity:1;pointer-events:auto}.route-details-panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.route-details-panel-header h3{margin:0;color:var(--text-main)}.route-details-panel-body{min-height:0;display:grid;align-content:start;gap:14px;overflow-y:auto;padding-right:4px}.route-details-summary,.route-details-extra-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.route-details-steps-card{margin-bottom:0}.driving-layout{inset:0;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none;z-index:40}.driving-top,.driving-bottom,.phone-floating-stack.navigating{pointer-events:auto}.driving-top{padding:max(18px,env(safe-area-inset-top)) 20px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.nav-instruction-card{max-width:min(38vw,640px);padding:14px 16px;border-radius:22px;box-shadow:0 16px 34px #0000003d}.nav-instruction-card h1{font-size:clamp(1.35rem,1.8vw,2.4rem);line-height:1.2}.instruction-meta{margin-top:8px}.hud-warning-pill{padding:10px 14px;border-radius:16px;color:#fff6e9;background:#aa2931b8;box-shadow:0 8px 18px #0000002e}.vehicle-anchor{position:absolute;left:50%;bottom:20%;transform:translate(-50%);z-index:55;pointer-events:none}.vehicle-anchor-icon,.vehicle-marker{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(180deg,#7ad6ff,#2d90ff);box-shadow:0 10px 28px #2d90ff75;color:#081018;font-size:1.2rem;font-weight:900}.vehicle-marker{width:28px;height:28px;border-radius:10px;font-size:.9rem}.driving-bottom-shell{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%);width:min(920px,calc(100vw - 56px));max-width:calc(100vw - 56px);display:grid;gap:12px;z-index:50;pointer-events:auto}.driving-bottom{display:flex;align-items:stretch;gap:12px;width:100%;max-width:100%;max-height:min(16vh,120px);padding:12px 14px;border-radius:22px;pointer-events:auto;box-shadow:0 -14px 30px #0000003d;overflow:visible}.driving-route-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.driving-route-mini{flex:0 1 320px;min-width:0}.driving-route-mini .summary-card{min-width:0;padding:12px 14px}.driving-route-mini .summary-card strong{font-size:1rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.driving-routes-panel{width:100%;border:1px solid rgba(255,255,255,.08);background:#060c12c7;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 16px 34px #00000038}.driving-action-row{display:flex;gap:10px}.driving-action-bar{flex:1 1 520px;min-width:0;align-items:stretch;justify-content:center;flex-wrap:nowrap;overflow:visible}.driving-action-row button{flex:1 1 0;min-width:96px;min-height:56px;padding:0 16px;font-weight:800;white-space:nowrap}.phone-relay-card,.phone-card,.phone-message,.phone-hero{border-radius:18px}.phone-page{min-height:100vh;min-height:100dvh;padding:24px 16px;background:radial-gradient(circle at top left,rgba(255,158,68,.2),transparent 36%),radial-gradient(circle at bottom right,rgba(45,144,255,.22),transparent 32%),linear-gradient(180deg,#071019,#102130);overflow:auto}.phone-page-shell{max-width:560px;margin:0 auto;display:grid;gap:16px}.phone-hero,.phone-card{border:1px solid rgba(255,255,255,.1);background:#060c12db;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 18px 46px #00000047}.phone-hero{padding:22px 18px;border-radius:24px}.phone-hero h1{margin:0 0 10px;font-size:2rem}.phone-hero p:last-child{margin-bottom:0;color:var(--text-muted)}.phone-card{display:grid;gap:16px;padding:18px}.phone-field{display:grid;gap:8px}.phone-field span{color:#ffffffd1;font-weight:700}.phone-field input{min-height:62px;padding:0 18px;border:0;border-radius:18px;background:#fffaf5f5;color:#0f2131;font-size:1.1rem;text-transform:uppercase}.phone-primary-button,.phone-secondary-button{min-height:62px;border:0;border-radius:18px;color:#fff;font-weight:800;font-size:1rem}.phone-primary-button{flex:1;background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%)}.phone-secondary-button{width:150px;background:#ffffff1a}.phone-message{padding:14px 16px;background:#ffffff12}.phone-message.info{color:#d6ecff}.phone-message.error{color:#ffd4d8;background:#aa29313d}@media(max-width:1280px){.status-grid-4,.route-option-list,.route-extra-grid,.bottom-panel-grid,.phone-relay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.route-selected-top-panel{width:min(760px,calc(100vw - 340px))}.bottom-panel.route-dock.drawer-open{width:min(720px,calc(100vw - 428px));min-width:min(560px,calc(100vw - 428px))}}@media(max-width:960px){.title-row,.panel-header,.section-header,.favorite-card,.result-card,.phone-relay-head,.phone-relay-actions{flex-direction:column;align-items:flex-start}.search-form,.search-form.compact,.bottom-panel-grid,.route-summary,.route-extra-grid,.driving-route-summary,.favorite-actions,.result-actions{grid-template-columns:1fr}.result-meta{min-width:0;text-align:left}.nav-instruction-card{max-width:min(72vw,640px)}.driving-bottom{flex-wrap:wrap;max-height:none}.driving-route-mini,.driving-action-bar{flex-basis:100%}.route-selected-action-row{flex-direction:column}.route-selected-controls{width:100%;flex-basis:auto}.route-selected-start-button,.start-navigation-primary{width:100%}.bottom-panel.route-dock.drawer-open{width:min(620px,calc(100vw - 404px));min-width:0}.route-details-panel{width:min(340px,calc(100vw - 40px))}}@media(max-width:760px){body{overflow:auto}.top-bar,.status-stack,.bottom-panel,.phone-floating-stack,.driving-top{left:14px;right:14px}.top-bar{padding-left:14px;padding-right:14px}.search-card,.bottom-panel,.driving-bottom,.driving-bottom-shell{width:calc(100vw - 28px)}.search-form,.search-form.compact,.status-grid-4,.route-option-list,.phone-relay-grid,.phone-metrics{grid-template-columns:1fr}.status-stack{top:208px}.route-selected-top-panel{width:calc(100vw - 28px);max-width:none}.phone-floating-stack,.phone-floating-stack.routeSelected,.phone-floating-stack.navigating{top:auto;bottom:calc(240px + env(safe-area-inset-bottom));width:calc(100vw - 28px)}.bottom-panel{bottom:12px;max-height:48vh}.bottom-panel.route-dock{min-width:0;max-width:calc(100vw - 28px);max-height:none}.bottom-panel.route-dock .route-selected-dock{grid-template-columns:1fr}.bottom-panel.route-dock .route-selected-action-row.fixed-primary{grid-column:1}.bottom-panel.route-dock.drawer-open{width:calc(100vw - 28px)}.route-selected-action-row{max-width:100%}.route-details-panel{top:150px;left:14px;right:14px;bottom:calc(210px + env(safe-area-inset-bottom));width:auto}.route-details-summary,.route-details-extra-grid{grid-template-columns:1fr}.driving-top{padding-left:14px;padding-right:14px;flex-direction:column}.nav-instruction-card{max-width:100%}.vehicle-anchor{bottom:26%}.driving-bottom{max-height:none;padding:12px}.driving-bottom-shell{bottom:calc(16px + env(safe-area-inset-bottom));max-width:calc(100vw - 28px);gap:10px}.driving-route-summary{grid-template-columns:1fr}.driving-action-bar{gap:8px}.driving-action-row button{min-width:84px}.phone-button-row{flex-direction:column;align-items:stretch}.phone-secondary-button{width:100%}}
