*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f0f0f;--surface:#1a1a1a;--surface-2:#252525;--text:#e8e8e8;--text-dim:#888;--accent:#4285f4;--accent-hover:#5a9bf4;--success:#34a853;--danger:#ea4335;--radius:12px}html,body{background:var(--bg);height:100%;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;overflow:hidden}#app{height:100%}.hidden{display:none!important}#route-view{height:100%;display:flex}#map-container{flex:1;position:relative}#map{width:100%;height:100%}#route-panel{background:var(--surface);flex-direction:column;gap:16px;width:360px;padding:32px 24px;display:flex;overflow-y:auto}.app-title{align-items:center;gap:8px;display:flex}.app-logo{flex-shrink:0;width:28px;height:28px}.app-logo-lg{width:48px;height:48px}.cal-app-title{justify-content:center;font-size:36px}#route-panel h1{letter-spacing:-.5px;font-size:24px;font-weight:700}.subtitle{color:var(--text-dim);margin-top:-8px;font-size:14px}.input-group{flex-direction:column;gap:6px;display:flex}.input-group label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.input-group input{background:var(--surface-2);border-radius:var(--radius);color:var(--text);border:1px solid #0000;outline:none;padding:12px 16px;font-size:15px;transition:border-color .2s}.input-group input:focus{border-color:var(--accent)}#route-info{background:var(--surface-2);border-radius:var(--radius);color:var(--text-dim);padding:12px 16px;font-size:14px}button{border-radius:var(--radius);cursor:pointer;border:none;padding:14px 24px;font-size:15px;font-weight:600;transition:background .2s,opacity .2s}button:disabled{opacity:.4;cursor:not-allowed}#search-btn{background:var(--accent);color:#fff}#search-btn:hover:not(:disabled){background:var(--accent-hover)}#start-btn{background:var(--success);color:#fff}#start-btn:hover{opacity:.9}#nav-view{flex-direction:column;height:100%;display:flex;overflow:hidden}#nav-header{background:var(--surface);border-bottom:1px solid var(--surface-2);justify-content:space-between;align-items:center;padding:16px 24px;display:flex}#back-btn{color:var(--text);background:0 0;padding:8px 16px;font-size:14px}#back-btn:hover{background:var(--surface-2)}#nav-progress{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:14px}#nav-steps{flex-direction:column;flex:1;align-items:center;gap:20px;min-height:0;padding:24px;display:flex;overflow-y:auto}#nav-loading{color:var(--text-dim);flex-direction:column;align-items:center;gap:12px;padding:24px;display:flex}.nav-step{background:var(--surface);border-radius:var(--radius);flex-shrink:0;width:100%;max-width:640px;transition:opacity .3s,margin .3s ease-out;overflow:hidden}.nav-step.step-done{opacity:.3}.nav-step.step-collapsed{display:none}.step-header{background:var(--surface-2);align-items:center;gap:12px;padding:16px 20px;display:flex}.step-number{background:var(--accent);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:13px;font-weight:700;display:flex}.step-maneuver{font-size:15px;font-weight:600}.step-image-container{background:var(--surface-2);justify-content:center;align-items:center;width:100%;display:flex}.step-image{width:100%;height:auto;display:block}.step-placeholder{color:var(--text-dim);flex-direction:column;align-items:center;gap:12px;font-size:14px;display:flex}.step-error{color:var(--danger);font-size:14px}.step-description{padding:16px 20px}.step-raw-instruction{color:var(--text-dim);font-size:13px;line-height:1.5}.step-ai-description{color:var(--text);font-size:15px;line-height:1.7}.step-ai-description p{margin-bottom:.5em}.step-ai-description p:last-child{margin-bottom:0}.step-ai-description ul{margin:.5em 0;padding-left:1.5em}.step-ai-description li{margin-bottom:.25em}.step-ai-description strong{color:var(--accent)}.step-done-btn{background:var(--surface-2);width:calc(100% - 40px);color:var(--text);border-radius:8px;margin:0 20px 16px;padding:12px;font-size:14px;display:block}.step-done-btn:hover{background:var(--success);color:#fff}.nav-complete{text-align:center;width:100%;max-width:640px;padding:48px 24px}.nav-complete h2{margin-bottom:8px;font-size:28px}.nav-complete p{color:var(--text-dim)}.spinner{border:3px solid var(--surface-2);border-top-color:var(--accent);border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-screen{height:100%;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.error-screen h1{color:var(--danger)}#calibration-view{justify-content:center;align-items:center;height:100%;display:flex}#calibration-content{text-align:center;flex-direction:column;align-items:center;gap:20px;width:100%;max-width:600px;padding:48px 32px;display:flex}#calibration-content h2{letter-spacing:-.5px;font-size:28px;font-weight:700}.cal-subtitle{color:var(--text-dim);font-size:15px;line-height:1.8}.cal-progress{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:13px}.cal-instruction{font-size:20px;font-weight:600}.cal-hint{color:var(--text-dim);font-size:13px}.cal-countdown{color:var(--accent);font-variant-numeric:tabular-nums;font-size:72px;font-weight:700;animation:1s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.cal-image-wrapper{width:100%;position:relative}.cal-image{border-radius:var(--radius);width:100%;display:block}.cal-timer-bar{border-radius:0 0 var(--radius) var(--radius);background:#fff3;height:4px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.cal-timer-fill{background:var(--accent);width:100%;height:100%;animation:linear forwards timer-shrink}@keyframes timer-shrink{0%{width:100%}to{width:0%}}.cal-textarea{background:var(--surface-2);border-radius:var(--radius);width:100%;color:var(--text);resize:vertical;border:1px solid #0000;outline:none;padding:16px;font-family:inherit;font-size:15px;transition:border-color .2s}.cal-textarea:focus{border-color:var(--accent)}.cal-loading{color:var(--text-dim);flex-direction:column;align-items:center;gap:16px;display:flex}.cal-error{color:var(--danger)}.cal-result{text-align:left;flex-direction:column;gap:16px;width:100%;display:flex}.cal-result-section{background:var(--surface);border-radius:var(--radius);padding:16px}.cal-result-section label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.cal-result-value{color:var(--text);margin-top:8px;font-size:14px;line-height:1.6}#cal-start-btn,#cal-done-btn,#cal-next-btn{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:14px 32px;font-size:15px;font-weight:600}#cal-start-btn:hover,#cal-done-btn:hover,#cal-next-btn:hover:not(:disabled){background:var(--accent-hover)}.settings-toggle{color:var(--text-dim);border:1px solid var(--surface-2);background:0 0;border-radius:8px;align-self:flex-start;padding:6px 12px;font-size:13px}.settings-toggle:hover{background:var(--surface-2);color:var(--text)}#settings-panel{background:var(--surface-2);border-radius:var(--radius);flex-direction:column;gap:12px;padding:16px;display:flex}.settings-section{flex-direction:column;gap:6px;display:flex}.settings-section label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.settings-textarea{background:var(--surface);color:var(--text);resize:vertical;border:1px solid #0000;border-radius:8px;outline:none;padding:10px 12px;font-family:inherit;font-size:13px}.settings-textarea:focus{border-color:var(--accent)}.settings-actions{gap:8px;display:flex}.settings-btn{background:var(--accent);color:#fff;border-radius:8px;flex:1;padding:8px 12px;font-size:13px}.settings-btn:hover{background:var(--accent-hover)}.settings-btn-secondary{color:var(--text-dim);border:1px solid var(--surface);background:0 0}.settings-btn-secondary:hover{background:var(--surface);color:var(--text)}@media (width<=768px){#route-view{flex-direction:column}#map-container{height:50%}#route-panel{width:100%;height:50%}}.site-footer{color:var(--text-dim);pointer-events:none;z-index:10;padding:8px 16px;font-size:12px;position:fixed;bottom:0;right:0}.pac-container{margin-top:4px;background:var(--surface)!important;border:1px solid var(--surface-2)!important;border-radius:8px!important}.pac-item{background:var(--surface)!important;color:var(--text)!important;border-top:1px solid var(--surface-2)!important;padding:8px 12px!important}.pac-item:hover{background:var(--surface-2)!important}.pac-item-query{color:var(--text)!important}.pac-matched{color:var(--accent)!important}