*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f172a;--bg-card: #1e293b;--bg-elevated: #334155;--text: #f1f5f9;--text-muted: #94a3b8;--text-dim: #64748b;--border: #334155;--accent: #3b82f6;--green: #22c55e;--orange: #f59e0b;--red: #ef4444;--darkred: #991b1b;--radius: 16px;--radius-sm: 10px;--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px)}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overflow:hidden;user-select:none;-webkit-user-select:none}#app{height:100%;position:relative;overflow:hidden}.view{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;padding:var(--sat) var(--sar) var(--sab) var(--sal);transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;-webkit-overflow-scrolling:touch}.view.active{transform:translate(0)}#dashboard{transform:translate(0);opacity:1;transition:opacity .3s ease}#dashboard:not(.active){opacity:0;pointer-events:none}header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-shrink:0}#route-header{flex:1;text-align:center}#route-name{font-size:17px;font-weight:600;letter-spacing:-.02em}.settings-title{flex:1;text-align:center;font-size:17px;font-weight:600}.icon-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:background .15s,color .15s;-webkit-tap-highlight-color:transparent}.icon-btn:active{background:var(--bg-elevated);color:var(--text)}.main-card{margin:8px 16px;padding:40px 24px;border-radius:var(--radius);background:var(--bg-card);border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;transition:background .5s ease,border-color .5s ease}.hidden{display:none!important}.skeleton{animation:pulse 1.5s ease-in-out infinite}.skeleton-text{background:var(--bg-elevated);border-radius:8px}.skeleton-text.large{width:120px;height:56px;margin-bottom:12px}.skeleton-text.small{width:160px;height:20px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.error{background:#ef444414;border-color:#ef44444d}.error-icon{width:48px;height:48px;border-radius:50%;background:#ef444426;color:var(--red);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;margin-bottom:12px}#error-message{color:var(--text-muted);font-size:15px;text-align:center;margin-bottom:16px}.retry-btn{padding:10px 24px;border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text);border:none;font-size:15px;font-weight:500;cursor:pointer;-webkit-tap-highlight-color:transparent}.retry-btn:active{opacity:.7}.setup{gap:16px}.setup p{color:var(--text-muted);font-size:17px}.setup-btn{padding:12px 32px;border-radius:var(--radius-sm);background:var(--accent);color:#fff;border:none;font-size:16px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}.setup-btn:active{opacity:.8}.travel-time{display:flex;align-items:baseline;gap:6px}#travel-time-value{font-size:72px;font-weight:700;line-height:1;letter-spacing:-.04em}.travel-time-unit{font-size:24px;font-weight:500;color:var(--text-muted)}.status-label{font-size:17px;font-weight:600;margin-top:8px;letter-spacing:.01em}.details{display:flex;justify-content:space-around;margin:16px;padding:16px;background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border)}.detail-item{display:flex;flex-direction:column;align-items:center;gap:4px}.detail-label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.detail-value{font-size:17px;font-weight:600;color:var(--text)}footer{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;margin-top:auto}#last-updated{font-size:13px;color:var(--text-dim)}footer .icon-btn{width:36px;height:36px}footer .icon-btn svg{width:18px;height:18px}@keyframes spin{to{transform:rotate(360deg)}}.refreshing svg{animation:spin .8s linear infinite}.settings-content{padding:8px 16px 32px;display:flex;flex-direction:column;gap:24px}.setting-group{display:flex;flex-direction:column;gap:8px}.setting-group label{font-size:14px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.setting-group input{width:100%;padding:14px 16px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-card);color:var(--text);font-size:16px;font-family:inherit;outline:none;transition:border-color .2s;-webkit-appearance:none}.setting-group input::placeholder{color:var(--text-dim)}.setting-group input:focus{border-color:var(--accent)}.setting-hint{font-size:13px;color:var(--text-dim)}.selected-address{font-size:14px;color:var(--green);padding:0 4px;min-height:20px;display:none}.selected-address.visible{display:block}.autocomplete-wrapper{position:relative}.suggestions{position:absolute;top:100%;left:0;right:0;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:4px;list-style:none;z-index:100;max-height:240px;overflow-y:auto;display:none;box-shadow:0 8px 32px #0006}.suggestions.visible{display:block}.suggestions li{padding:14px 16px;font-size:15px;color:var(--text);cursor:pointer;border-bottom:1px solid var(--border);-webkit-tap-highlight-color:transparent}.suggestions li:last-child{border-bottom:none}.suggestions li:active{background:var(--bg-card)}.save-btn{padding:16px;border-radius:var(--radius-sm);background:var(--accent);color:#fff;border:none;font-size:17px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;margin-top:8px}.save-btn:active{opacity:.8}@media (min-width: 500px){.main-card,.details{margin:16px auto;max-width:420px;width:calc(100% - 32px)}.settings-content{max-width:420px;margin:0 auto}}