:root{
  --ink:#111d31;--ink-2:#263650;--muted:#758197;--muted-2:#9aa4b5;--line:#e8edf4;--surface:#fff;--surface-2:#f6f8fb;
  --blue:#2468e8;--blue-2:#0f53cb;--blue-soft:#edf4ff;--navy:#0e1a2d;--navy-2:#162842;--green:#33a36b;--green-soft:#eaf8ef;
  --orange:#f4913a;--orange-soft:#fff4e8;--red:#eb4d53;--red-soft:#fff0f1;--brown:#9a5a29;--shadow:0 14px 38px rgba(18,38,74,.14);
  --radius:24px;--safe-top:max(12px,env(safe-area-inset-top));--safe-bottom:max(12px,env(safe-area-inset-bottom));
  font-family:"Pretendard","Noto Sans KR",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)
}
*{box-sizing:border-box}html,body,#app,#map{width:100%;height:100%;margin:0}html,body{overflow:hidden}body{background:#eef2f7}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid rgba(36,104,232,.2);outline-offset:2px}.hidden{display:none!important}
#app{position:relative;isolation:isolate;overflow:hidden}#map{position:absolute;inset:0;z-index:0;background:#e9eef5}.map-softener{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(250,252,255,.20),transparent 26%,transparent 72%,rgba(241,245,250,.12))}.app-surface{background:rgba(255,255,255,.97);border:1px solid rgba(222,229,239,.9);box-shadow:var(--shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* common */
.eyebrow{display:block;font-size:10px;line-height:1.2;font-weight:850;letter-spacing:.14em;color:var(--blue);text-transform:uppercase}.icon-btn,.round-close{border:0;background:#f3f6fa;color:var(--ink);display:grid;place-items:center}.icon-btn{width:42px;height:42px;border-radius:14px;font-size:18px}.round-close{width:38px;height:38px;border-radius:50%;font-size:21px}.icon-btn:active,.round-close:active{transform:scale(.96)}
.topbar{position:absolute;z-index:20;top:var(--safe-top);left:14px;right:14px;height:62px;border-radius:20px;display:flex;align-items:center;justify-content:space-between;padding:8px 10px 8px 12px}.brand-button{display:flex;align-items:center;gap:10px;border:0;background:transparent;min-width:0;text-align:left}.brand-mark{width:38px;height:38px;border-radius:13px;background:linear-gradient(145deg,#10213a,#08111f);color:white;display:grid;place-items:center;box-shadow:0 5px 12px rgba(12,29,55,.25)}.brand-mark span{font-size:19px}.brand-copy{display:flex;flex-direction:column;min-width:0}.brand-copy b{font-size:15px;white-space:nowrap}.brand-copy small{font-size:10.5px;color:var(--muted);margin-top:2px;white-space:nowrap}.top-actions{display:flex;gap:7px}

/* home */
.home-panel{position:absolute;z-index:12;top:calc(var(--safe-top) + 76px);left:14px;width:min(420px,calc(100vw - 28px));max-height:calc(100vh - 164px - var(--safe-bottom));overflow:auto;border-radius:28px;padding:22px 18px 18px;scrollbar-width:none}.home-panel::-webkit-scrollbar{display:none}.home-greeting h1{font-size:27px;line-height:1.14;margin:5px 0 8px;letter-spacing:-.035em}.home-greeting p{font-size:13px;line-height:1.55;margin:0 0 17px;color:var(--muted)}
.search-shell{height:54px;border:2px solid #d9e5fb;background:white;border-radius:18px;display:flex;align-items:center;box-shadow:0 6px 16px rgba(35,81,145,.08);transition:.2s}.search-shell:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px rgba(36,104,232,.08)}.search-shell input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--ink);font-size:14px;font-weight:650;outline:none}.search-shell input::placeholder{color:#adb6c5;font-weight:500}.search-locate,.search-mic{width:48px;height:100%;border:0;background:transparent;color:var(--blue);font-size:22px}.search-mic{font-size:24px}
.search-results{margin-top:8px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 26px rgba(30,49,83,.13);overflow:hidden}.result-item{width:100%;border:0;border-bottom:1px solid #eef1f5;background:white;padding:12px 14px;text-align:left;display:flex;flex-direction:column;gap:3px}.result-item:last-child{border-bottom:0}.result-item b{font-size:13px}.result-item small{font-size:11px;color:var(--muted)}
.place-shortcuts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:11px 0 19px}.place-shortcuts button{height:39px;border:1px solid var(--line);border-radius:13px;background:#f9fafc;color:var(--ink-2);font-size:12px;font-weight:750}.place-shortcuts span{margin-right:5px;color:var(--blue)}
.home-section{padding-top:2px;margin-top:6px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.section-title b{font-size:14px}.section-title button,.section-title span{border:0;background:transparent;color:var(--muted);font-size:10px;padding:0}.recent-list{border:1px solid var(--line);border-radius:17px;overflow:hidden}.recent-item{width:100%;min-height:55px;border:0;border-bottom:1px solid #eef1f5;background:white;padding:8px 10px;display:grid;grid-template-columns:32px 1fr 20px;align-items:center;text-align:left;gap:8px}.recent-item:last-child{border-bottom:0}.recent-item span:nth-child(2){display:flex;flex-direction:column;gap:2px}.recent-item b{font-size:12.5px}.recent-item small{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-item i{font-style:normal;color:#a8b2c1;font-size:17px;text-align:center}.recent-icon{width:30px;height:30px;border-radius:10px;display:grid!important;place-items:center;font-size:12px}.recent-icon.warm{background:var(--orange-soft);color:var(--orange)}.recent-icon.blue{background:var(--blue-soft);color:var(--blue)}.recent-icon.navy{background:#edf0f5;color:#334863}.explore-section{margin-top:16px}.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.quick-actions button{border:1px solid var(--line);border-radius:15px;background:#fff;min-height:76px;padding:8px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--ink)}.quick-actions b{font-size:10.5px}.quick-actions small{font-size:8.5px;color:var(--muted)}.qa-icon{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;font-size:14px;margin-bottom:1px}.qa-icon.fuel{background:var(--orange-soft)}.qa-icon.cafe{background:#f7eee8}.qa-icon.store{background:var(--green-soft)}.qa-icon.charge{background:var(--blue-soft);color:var(--blue)}
.guide-intro-card{margin-top:16px;padding:12px;border-radius:18px;background:linear-gradient(145deg,#fff9f4,#f4f9ff);border:1px solid #eee6df}.guide-intro-head{display:flex;justify-content:space-between;align-items:flex-start}.guide-intro-head div{display:flex;flex-direction:column}.guide-intro-head b{font-size:13px}.guide-intro-head small{font-size:9.5px;color:var(--muted);margin-top:2px}.auto-pill{font-size:9px;font-weight:900;color:var(--blue);background:white;border:1px solid #dbe7fb;border-radius:999px;padding:4px 7px}.guide-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}.guide-selector button{border:1px solid rgba(223,228,236,.9);border-radius:14px;background:rgba(255,255,255,.88);min-height:75px;padding:6px;display:flex;align-items:center;gap:4px;overflow:hidden}.guide-selector button.active{border-color:#9ebff5;box-shadow:0 0 0 2px rgba(36,104,232,.08)}.guide-selector img{height:59px;width:42px;object-fit:contain;align-self:flex-end}.guide-selector span{display:flex;flex-direction:column;text-align:left;min-width:0}.guide-selector b{font-size:11px}.guide-selector small{font-size:8.5px;color:var(--muted);margin-top:2px}

/* map controls */
.right-controls{position:absolute;z-index:11;right:14px;top:150px;display:flex;flex-direction:column;gap:7px}.map-btn{width:42px;height:42px;border:1px solid #e1e7ef;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 8px 18px rgba(16,38,73,.12);font-size:20px;color:var(--ink)}.nav-focus{color:var(--blue)}

/* route sheet */
.route-sheet{position:absolute;z-index:18;left:50%;bottom:calc(82px + var(--safe-bottom));transform:translateX(-50%);width:min(520px,calc(100vw - 24px));border-radius:28px;padding:9px 16px 16px;max-height:min(73vh,720px);overflow:auto;scrollbar-width:none}.route-sheet::-webkit-scrollbar{display:none}.sheet-handle{width:42px;height:4px;background:#d8dee8;border-radius:999px;margin:1px auto 14px}.route-sheet-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.route-sheet-head h2{font-size:21px;letter-spacing:-.03em;margin:4px 0 3px}.route-sheet-head p{font-size:11px;color:var(--muted);margin:0}.route-options{display:flex;gap:7px;margin:15px 0 12px;overflow:auto}.chip{border:1px solid var(--line);background:#f7f9fc;color:#66758a;padding:8px 15px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}.chip.active{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 5px 12px rgba(36,104,232,.23)}
.selected-route-card{position:relative;border-radius:18px;background:linear-gradient(135deg,#f5f9ff,#fff);border:1px solid #dfeafc;padding:17px 13px 11px}.selected-route-badge{position:absolute;right:12px;top:11px;background:var(--blue);color:white;font-size:9px;font-weight:850;padding:4px 7px;border-radius:999px}.selected-route-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:7px}.selected-route-metrics div{display:flex;flex-direction:column}.selected-route-metrics small{font-size:9px;color:var(--muted)}.selected-route-metrics b{font-size:17px;margin-top:2px}.selected-route-meta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #e8eff9;margin-top:11px;padding-top:8px}.selected-route-meta span{font-size:8px;font-weight:900;color:var(--blue);letter-spacing:.08em}.selected-route-meta small{font-size:9px;color:var(--muted)}
.mini-panel-head{display:flex;justify-content:space-between;align-items:center;margin:16px 1px 8px}.mini-panel-head b{font-size:13px}.mini-panel-head small{font-size:9.5px;color:var(--muted)}.alternative-list{display:grid;gap:7px}.alternative-card{width:100%;border:1px solid var(--line);background:#fff;border-radius:15px;padding:10px 12px;display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:9px;text-align:left}.alternative-card.active{border-color:#91b6f5;background:#f6f9ff;box-shadow:inset 3px 0 var(--blue)}.alternative-card b{font-size:11px;color:var(--blue)}.alternative-card small{font-size:11px;color:var(--ink-2)}.alternative-card em{font-size:9px;font-style:normal;color:var(--muted)}
.parking-list{display:grid;gap:7px}.parking-card{width:100%;border:1px solid var(--line);border-radius:15px;background:#fff;padding:10px 11px;text-align:left;display:grid;grid-template-columns:1fr auto;gap:2px 10px}.parking-card b{font-size:11.5px}.parking-card small{grid-column:1/2;font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.parking-card span{grid-column:2;grid-row:1/3;font-size:9px;color:var(--muted);display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:5px}.park-go{font-style:normal;background:var(--blue);color:white;padding:5px 8px;border-radius:8px;font-weight:750}
.route-cta-row{display:grid;grid-template-columns:112px 1fr;gap:8px;margin-top:15px}.favorite-btn,.start-btn{height:48px;border-radius:14px;font-weight:850}.favorite-btn{border:1px solid var(--line);background:#fff;color:#5f6f84}.favorite-btn.active{color:#e59624;background:#fffaf1;border-color:#f3dbb3}.start-btn{border:0;background:linear-gradient(135deg,var(--blue),#1359d9);color:white;box-shadow:0 8px 20px rgba(36,104,232,.28)}

/* floating character */
.character-dock{position:absolute;z-index:17;left:calc(min(420px,calc(100vw - 28px)) + 30px);bottom:calc(92px + var(--safe-bottom));width:290px;min-height:86px;border-radius:22px;padding:8px 42px 8px 80px}.avatar-frame{position:absolute;left:6px;bottom:0;width:70px;height:88px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.avatar-frame img{max-width:68px;max-height:87px;object-fit:contain}.character-copy{display:flex;flex-direction:column;justify-content:center;min-height:67px}.character-head{display:flex;align-items:center;gap:6px}.character-head b{font-size:13px}.character-head span{font-size:8.5px;font-weight:800;color:var(--blue);background:var(--blue-soft);padding:3px 6px;border-radius:999px}.character-copy p{font-size:10px;line-height:1.45;color:#5e6c7f;margin:5px 0 0}.mode-btn{position:absolute;right:8px;top:9px;border:1px solid #dce7f9;background:white;color:var(--blue);font-size:8px;font-weight:900;border-radius:9px;padding:5px 6px}

/* driving */
.guidance{position:absolute;z-index:28;left:14px;right:14px;top:var(--safe-top);min-height:112px;border:0;border-radius:22px;background:linear-gradient(135deg,#286de9,#1354c7);color:white;box-shadow:0 16px 34px rgba(14,61,145,.3);padding:13px 14px;display:grid;grid-template-columns:78px 1fr 72px;gap:9px;align-items:center}.maneuver-icon{font-size:54px;font-weight:900;text-align:center;line-height:1}.guidance-main{min-width:0}.guidance-distance{font-size:27px;font-weight:900;letter-spacing:-.04em}.guidance-text{font-size:14px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}.road-caption{font-size:10px;color:rgba(255,255,255,.74);margin-top:4px}.eta-box{border-left:1px solid rgba(255,255,255,.2);padding-left:10px;display:flex;flex-direction:column}.eta-box b{font-size:16px}.eta-box small{font-size:9px;color:rgba(255,255,255,.75);margin-top:4px}
.lane-panel{position:absolute;z-index:27;left:50%;top:calc(var(--safe-top) + 124px);transform:translateX(-50%);width:min(500px,calc(100vw - 28px));border-radius:18px;background:rgba(14,26,45,.94);color:white;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 28px rgba(4,13,26,.27);padding:9px 12px}.lane-title,.lane-source{display:flex;justify-content:space-between;align-items:center}.lane-title span{font-size:10px;font-weight:800}.lane-title small,.lane-source{font-size:8px;color:#93a7c3}.lanes{display:flex;justify-content:center;gap:4px;margin:7px 0}.lane{position:relative;width:40px;height:31px;border-radius:7px;background:#23344f;color:#8ca0bd;display:grid;place-items:center;font-size:18px;font-weight:900}.lane.active{background:linear-gradient(180deg,#2d77f4,#1b5fd2);color:white;box-shadow:0 0 0 2px rgba(92,151,255,.25)}.lane.native.bus:after{content:'B';font-size:6px;position:absolute}.lane-source span:first-child{background:#273953;padding:2px 5px;border-radius:5px}.lane-source span.native{background:var(--green);color:#fff}
.intersection-panel{position:absolute;z-index:26;right:14px;top:calc(var(--safe-top) + 196px);width:180px;border-radius:18px;background:rgba(14,26,45,.94);color:white;border:1px solid rgba(255,255,255,.08);padding:9px}.intersection-head{display:flex;justify-content:space-between;font-size:9px}.intersection-head span{color:#8fa7c9}.intersection-image{width:100%;margin-top:7px;border-radius:12px}.intersection-fallback{height:100px;margin-top:7px;border-radius:12px;background:linear-gradient(145deg,#172b48,#0c1728);display:flex;align-items:center;justify-content:center;gap:12px}.intersection-fallback strong{font-size:43px;color:#69a7ff}.intersection-fallback span{max-width:87px;font-size:9px;line-height:1.4;color:#d7e3f5}
.drive-hud{position:absolute;z-index:24;left:14px;right:14px;bottom:calc(82px + var(--safe-bottom));height:91px;border-radius:22px;background:rgba(10,23,40,.94);color:white;box-shadow:0 14px 32px rgba(4,12,24,.3);display:grid;grid-template-columns:100px 1fr 110px;align-items:center;padding:9px 14px}.hud-speed{display:grid;grid-template-columns:auto auto;align-items:end;column-gap:5px;border-right:1px solid rgba(255,255,255,.09)}.hud-speed small{grid-column:1/3;font-size:8px;color:#91a4bd}.hud-speed b{font-size:37px;line-height:1;font-weight:900}.hud-speed span{font-size:9px;color:#aab8ca;margin-bottom:4px}.hud-road{display:flex;flex-direction:column;padding:0 13px;min-width:0}.hud-road small{font-size:8px;color:#91a4bd}.hud-road b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:2px 0}.hud-road>span{font-size:8px;color:#b5c1d0}.hud-speed-limit,.hud-safety,.hud-tunnel{display:inline-block!important;width:max-content;margin-top:3px;border-radius:5px;padding:2px 5px}.hud-speed-limit{background:#fff;color:#d7333d!important;font-weight:900}.hud-safety{background:#8f2f33;color:white!important}.hud-tunnel{background:#344e6b;color:#d9edff!important}.hud-trip{display:flex;flex-direction:column;align-items:flex-end;border-left:1px solid rgba(255,255,255,.09)}.hud-trip small{font-size:8px;color:#91a4bd}.hud-trip b{font-size:18px}.hud-trip span{font-size:8px;color:#aab8ca;margin-top:2px}
.nav-actions{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.nav-actions button{height:54px;border:1px solid var(--line);border-radius:14px;background:#fff;color:#4d5d72;font-size:8.5px;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.nav-actions button span{font-size:15px}.nav-actions .accent{background:var(--blue);color:white;border-color:var(--blue)}.nav-actions .danger{color:var(--red);background:var(--red-soft);border-color:#f8d8da}
.faster-route-banner{position:absolute;z-index:33;left:50%;top:calc(var(--safe-top) + 204px);transform:translateX(-50%);width:min(430px,calc(100vw - 28px));border-radius:18px;padding:10px;display:grid;grid-template-columns:36px 1fr auto auto;align-items:center;gap:7px}.faster-icon{width:34px;height:34px;border-radius:11px;background:#fff3d5;display:grid;place-items:center}.faster-route-banner>div:nth-child(2){display:flex;flex-direction:column}.faster-route-banner b{font-size:11px}.faster-route-banner small{font-size:8.5px;color:var(--muted);margin-top:2px}.faster-route-banner button{border:0;border-radius:9px;background:var(--blue);color:white;font-size:9px;font-weight:850;padding:8px}.faster-route-banner .ghost{background:#eef2f7;color:#6d7b8f}

/* AR */
.ar-view{position:absolute;z-index:100;inset:0;background:#09111c;color:white}.ar-view video,.ar-view canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ar-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,11,20,.55),transparent 28%,transparent 56%,rgba(4,10,18,.62));pointer-events:none}.ar-top{position:absolute;z-index:4;left:14px;right:14px;top:var(--safe-top);display:flex;justify-content:space-between}.ar-close,.ar-calibrate,.ar-badge{border:1px solid rgba(255,255,255,.22);background:rgba(12,24,41,.73);color:#fff;border-radius:12px;padding:9px 11px;font-size:10px;font-weight:750;backdrop-filter:blur(12px)}.ar-top-actions{display:flex;gap:6px}.ar-confidence{position:absolute;z-index:4;top:calc(var(--safe-top) + 50px);right:14px;border-radius:9px;background:rgba(9,23,40,.72);padding:6px 8px;display:flex;gap:6px;font-size:8px}.ar-direction{position:absolute;z-index:5;top:8.5%;left:50%;transform:translateX(-50%);background:rgba(10,22,38,.84);border:1px solid rgba(255,255,255,.13);border-radius:22px;padding:10px 24px;text-align:center;min-width:178px;box-shadow:0 16px 30px rgba(0,0,0,.25)}.ar-arrow{font-size:48px;font-weight:900;color:#79b2ff;line-height:.9}.ar-direction b{display:block;font-size:26px;margin-top:4px}.ar-direction span{display:block;font-size:10px;color:#dce7f5;margin-top:2px}.ar-character{position:absolute;z-index:5;right:12px;bottom:calc(110px + var(--safe-bottom));display:flex;align-items:flex-end}.ar-character img{height:min(27vh,235px);max-width:150px;object-fit:contain;filter:drop-shadow(0 12px 15px rgba(0,0,0,.25))}.ar-character span{position:absolute;right:90px;bottom:78px;width:160px;background:white;color:#24344c;border-radius:14px 14px 3px 14px;padding:9px 11px;font-size:10px;line-height:1.4;box-shadow:0 10px 22px rgba(0,0,0,.2)}.ar-speed-card,.ar-trip-card{position:absolute;z-index:5;bottom:calc(34px + var(--safe-bottom));background:rgba(9,20,35,.87);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:8px 12px}.ar-speed-card{left:14px}.ar-speed-card strong{font-size:27px}.ar-speed-card small{font-size:8px;margin-left:3px}.ar-trip-card{left:92px;min-width:122px}.ar-trip-card small,.ar-trip-card b{display:block}.ar-trip-card small{font-size:7px;color:#a8b8cc}.ar-trip-card b{font-size:10px;margin-top:2px}.ar-safety{position:absolute;z-index:4;left:50%;bottom:8px;transform:translateX(-50%);font-size:7px;color:rgba(255,255,255,.6);white-space:nowrap}

/* account */
.modal{position:absolute;z-index:80;inset:0;background:rgba(16,29,48,.36);display:flex;align-items:flex-end;justify-content:center;padding:14px 14px calc(12px + var(--safe-bottom));backdrop-filter:blur(5px)}.modal-card{width:min(520px,100%);max-height:min(86vh,760px);overflow:auto;border-radius:28px;padding:18px;scrollbar-width:none}.modal-card::-webkit-scrollbar{display:none}.modal-head{display:flex;justify-content:space-between;align-items:flex-start}.modal-head>div{display:flex;flex-direction:column}.modal-head b{font-size:21px;margin-top:3px}.modal-head small{font-size:9px;color:var(--muted);margin-top:2px}.profile-hero{margin-top:14px;padding:13px;border-radius:19px;background:linear-gradient(135deg,#1c5fda,#103f9d);color:white;display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:9px}.profile-orb{width:50px;height:50px;border-radius:50%;background:#fff;overflow:hidden}.profile-orb img{width:100%;height:100%;object-fit:cover;object-position:top}.profile-hero>div:nth-child(2){display:flex;flex-direction:column}.profile-hero b{font-size:13px}.profile-hero small{font-size:8px;color:#d8e6ff;margin-top:2px}.sync-pill{font-size:7px;font-weight:900;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);padding:4px 6px;border-radius:999px}.auth-box{margin-top:9px;border:1px solid var(--line);border-radius:15px;padding:10px}.auth-box p{font-size:9px;line-height:1.45;color:var(--muted);margin:0 0 8px}.auth-box small{display:block;margin-top:6px;font-size:7.5px;color:var(--muted)}.google-btn,.ghost-btn{height:37px;border-radius:10px;font-size:10px;font-weight:800}.google-btn{width:100%;border:1px solid var(--line);background:white;color:#34445c}.ghost-btn{border:1px solid var(--line);background:#f7f9fc;padding:0 14px}.account-quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}.account-quick-grid button{height:62px;border:1px solid var(--line);background:#fff;border-radius:13px;color:#55657a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.account-quick-grid button.active{background:var(--blue-soft);color:var(--blue);border-color:#cfe0fb}.account-quick-grid span{font-size:15px}.account-quick-grid b{font-size:8.5px}.account-list{border:1px solid var(--line);border-radius:15px;overflow:hidden;margin-bottom:10px}.account-item{min-height:51px;padding:8px 10px;border-bottom:1px solid #edf1f5;display:flex;align-items:center;justify-content:space-between;gap:8px}.account-item:last-child{border-bottom:0}.item-copy{display:flex;flex-direction:column;min-width:0}.item-copy b{font-size:10.5px}.item-copy small{font-size:8px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-item button{border:0;border-radius:8px;background:var(--blue-soft);color:var(--blue);font-size:8px;font-weight:800;padding:6px 8px}.list-empty{padding:18px;text-align:center;font-size:9px;color:var(--muted)}.settings-card{border:1px solid var(--line);border-radius:15px;padding:11px;margin-top:9px}.settings-title{display:flex;justify-content:space-between;align-items:center}.settings-title b{font-size:11px}.settings-title span{font-size:8px;color:var(--muted)}.volume-demo{display:grid;grid-template-columns:22px 1fr 30px;gap:8px;align-items:center;margin-top:10px}.volume-demo>div{height:4px;border-radius:999px;background:#e5eaf1;overflow:hidden}.volume-demo i{display:block;width:80%;height:100%;background:var(--blue)}.volume-demo b{font-size:8px;color:var(--muted)}.guide-mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:9px}.guide-mode-grid button{height:50px;border:1px solid var(--line);border-radius:11px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#536277}.guide-mode-grid button.active{border-color:#9cbdf4;background:var(--blue-soft);color:var(--blue)}.guide-mode-grid b{font-size:9.5px}.guide-mode-grid small{font-size:6.8px;color:inherit;margin-top:2px}

/* bottom nav */
.bottom-nav{position:absolute;z-index:25;left:50%;bottom:var(--safe-bottom);transform:translateX(-50%);width:min(520px,calc(100vw - 24px));height:64px;border-radius:20px;display:grid;grid-template-columns:repeat(4,1fr);padding:5px 8px}.bottom-nav button{border:0;background:transparent;color:#8a97aa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-nav span{font-size:18px;line-height:1}.bottom-nav b{font-size:9px}.bottom-nav button.active{color:var(--blue)}
.toast{position:absolute;z-index:150;left:50%;bottom:calc(92px + var(--safe-bottom));transform:translateX(-50%);max-width:min(380px,calc(100vw - 32px));background:#122139;color:white;border-radius:13px;padding:10px 14px;font-size:10px;box-shadow:0 12px 25px rgba(0,0,0,.24)}
.user-marker{width:22px;height:22px;border:4px solid white;background:var(--blue);border-radius:50%;box-shadow:0 0 0 5px rgba(36,104,232,.23),0 3px 8px rgba(0,0,0,.22)}.dest-marker{position:relative;width:30px;height:38px;background:var(--red);clip-path:polygon(50% 100%,4% 44%,5% 25%,17% 9%,35% 1%,55% 1%,73% 9%,86% 24%,91% 43%);border-radius:50% 50% 50% 50%}.dest-marker:after{content:'';position:absolute;width:10px;height:10px;background:white;border-radius:50%;left:10px;top:8px}

/* stage management */
body.ui-home .route-sheet,body.ui-home .character-dock{display:none}body.ui-route .home-panel{display:none}body.ui-route .character-dock{display:flex}body.ui-route .route-sheet{display:block}body.ui-route .right-controls{top:92px}body.ui-route .bottom-nav{display:grid}
body.driving .topbar,body.driving .home-panel,body.driving .bottom-nav,body.driving .character-dock{display:none!important}body.driving .route-sheet{bottom:calc(9px + var(--safe-bottom));background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding:0;max-height:none;width:min(520px,calc(100vw - 24px));overflow:visible}body.driving .sheet-handle{display:none}body.driving .right-controls{top:calc(var(--safe-top) + 196px)}body.driving #map{filter:saturate(.85) contrast(1.04)}
body.ui-account .bottom-nav{display:none}

@media (min-width:900px){
  .home-panel{left:24px;top:calc(var(--safe-top) + 82px);width:400px;max-height:calc(100vh - 130px)}.topbar{left:24px;right:24px;max-width:calc(100% - 48px)}.character-dock{left:444px;bottom:24px}.bottom-nav{right:24px;left:auto;transform:none;width:380px}.route-sheet{left:24px;transform:none;bottom:24px;width:420px;max-height:calc(100vh - 120px)}body.ui-route .bottom-nav{right:24px;left:auto;transform:none;bottom:24px}.right-controls{right:24px}.guidance{left:24px;right:24px}.drive-hud{left:24px;right:24px}.lane-panel{left:50%}.intersection-panel{right:24px}.modal{align-items:center}.modal-card{max-height:88vh}
}
@media (max-width:520px){
  .topbar{height:58px}.brand-copy small{display:none}.brand-copy b{font-size:13px}.home-panel{top:calc(var(--safe-top) + 70px);max-height:calc(100vh - 154px - var(--safe-bottom));padding:18px 15px 15px}.home-greeting h1{font-size:24px}.home-greeting p{font-size:11.5px}.guide-intro-head small{max-width:225px}.character-dock{left:14px;right:14px;width:auto;bottom:calc(86px + var(--safe-bottom))}.route-sheet{bottom:calc(77px + var(--safe-bottom));max-height:72vh}.guidance{grid-template-columns:68px 1fr 60px}.maneuver-icon{font-size:47px}.guidance-distance{font-size:24px}.guidance-text{font-size:12px}.drive-hud{grid-template-columns:82px 1fr 86px;height:82px}.hud-speed b{font-size:32px}.intersection-panel{width:150px}.bottom-nav{height:59px}.ar-character img{height:22vh}.ar-character span{right:75px;width:142px}.modal{padding:8px 8px calc(8px + var(--safe-bottom))}.modal-card{padding:15px}.guide-mode-grid small{font-size:6px}
}
@media (max-height:690px){.home-panel{max-height:calc(100vh - 142px)}.home-greeting p{display:none}.guide-intro-card{margin-top:10px}.quick-actions button{min-height:64px}.route-sheet{max-height:68vh}.modal-card{max-height:92vh}}