:root{--primary: #1565c0;--primary-container: #d3e3fd;--on-primary: #ffffff;--on-primary-container: #001d35;--secondary: #0277bd;--secondary-container: #c8e6f7;--tertiary: #00897b;--tertiary-container: #b2dfdb;--surface: #ffffff;--surface-container: #f5f5f5;--surface-container-high: #ececec;--surface-container-highest: #e0e0e0;--on-surface: #1c1b1f;--on-surface-variant: #49454f;--error: #ba1a1a;--error-container: #ffdad6;--on-error: #ffffff;--outline: #79747e;--shadow: rgba(0, 0, 0, .1);--direction-0: #1976d2;--direction-1: #00897b;font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Yu Gothic,Meiryo,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(prefers-color-scheme:dark){:root{--primary: #a8c7fa;--primary-container: #004a77;--on-primary: #003258;--on-primary-container: #d3e3fd;--surface: #1c1b1f;--surface-container: #2b2930;--surface-container-high: #36343b;--surface-container-highest: #413f47;--on-surface: #e6e1e5;--on-surface-variant: #cac4d0;--error: #ffb4ab;--error-container: #93000a;--outline: #938f99;--shadow: rgba(0, 0, 0, .3)}}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-height:100vh;background-color:var(--surface-container);color:var(--on-surface)}#root{min-height:100vh;display:flex;flex-direction:column}.card{background-color:var(--surface);border-radius:12px;padding:16px;box-shadow:0 2px 4px var(--shadow);transition:box-shadow .2s ease}.card:hover,.card-elevated{box-shadow:0 4px 8px var(--shadow)}.btn{padding:12px 24px;min-height:44px;border:none;border-radius:24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 4px #0000001a;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;text-decoration:none}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,#0d47a1 100%);color:var(--on-primary);box-shadow:0 3px 8px #1565c04d}.btn-primary:hover:not(:disabled){box-shadow:0 4px 12px #1565c066;transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:0 2px 6px #1565c04d}.btn-outlined{background:linear-gradient(135deg,#1565c014,#0277bd14);border:2.5px solid var(--primary);color:var(--primary);box-shadow:0 2px 8px #0000001a;font-weight:700;padding:14px 28px}.btn-outlined:hover:not(:disabled){background:linear-gradient(135deg,#1565c026,#0277bd26);box-shadow:0 4px 12px #1565c033;transform:translateY(-2px);border-color:#0d47a1}.btn-outlined:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:0 2px 6px #0000001a;background:linear-gradient(135deg,#1565c01f,#0277bd1f)}.btn-text{background:linear-gradient(135deg,#1565c01a,#0277bd1a);color:var(--primary);border:1.5px solid rgba(21,101,192,.3);box-shadow:0 2px 6px #0000000f;font-weight:700;padding:12px 20px;border-radius:20px}.btn-text:hover:not(:disabled){background:linear-gradient(135deg,#1565c02e,#0277bd2e);box-shadow:0 3px 10px #1565c026;border-color:#1565c080;transform:translateY(-1px)}.btn-text:active:not(:disabled){transform:translateY(0) scale(.98);background:linear-gradient(135deg,#1565c024,#0277bd24);box-shadow:0 2px 6px #0000000f}.btn-small{padding:8px 16px;font-size:12px;min-height:36px;border-radius:18px}.input{width:100%;padding:12px 16px;border:1px solid var(--outline);border-radius:8px;font-size:16px;background-color:var(--surface);color:var(--on-surface);transition:border-color .2s ease}.input:focus{outline:none;border-color:var(--primary)}.list-item{padding:12px 16px;border-bottom:1px solid var(--surface-container-high);cursor:pointer;transition:background-color .2s ease}.list-item:hover{background-color:var(--surface-container)}.list-item:last-child{border-bottom:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .3s ease}@keyframes spin{to{transform:rotate(360deg)}}.spinner{border:3px solid var(--surface-container-high);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:spin .8s linear infinite}@media(max-width:768px){.card{padding:12px}.btn{padding:8px 16px;font-size:13px}}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-2{gap:8px}.gap-4{gap:16px}.mt-2{margin-top:8px}.mt-4{margin-top:16px}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.p-4{padding:16px}.rounded{border-radius:8px}.shadow{box-shadow:0 2px 4px var(--shadow)}.home-page{min-height:100vh;background-color:var(--surface-container)}.header{background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);color:var(--on-primary);padding:24px 16px;text-align:center;box-shadow:0 2px 8px var(--shadow)}.header h1{font-size:24px;font-weight:600;margin:0}.main-content{max-width:1200px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:16px}.nearest-stop-card{background:linear-gradient(to bottom,var(--primary-container),var(--surface))}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.card-header h2{font-size:18px;font-weight:600;margin:0}.loading-state,.empty-state{display:flex;flex-direction:column;align-items:center;gap:16px;padding:32px 16px}.error-state{text-align:center;padding:32px 16px}.error-message{color:#d32f2f;font-weight:500;margin-bottom:16px}.location-help{background:#f5f5f5;border-radius:12px;padding:20px;margin:20px 0;text-align:left}.location-help h3{margin:0 0 16px;font-size:16px;color:#333;text-align:center}.help-section{margin-bottom:16px;padding:12px;background:#fff;border-radius:8px}.help-section:last-of-type{margin-bottom:0}.help-section h4{margin:0 0 8px;font-size:14px;color:#2196f3;font-weight:600}.help-section ol{margin:0;padding-left:20px;font-size:13px;color:#555}.help-section li{margin-bottom:6px;line-height:1.5}.help-note{margin:16px 0 0;font-size:13px;color:#666;text-align:center;font-style:italic}.nearest-stop-content{display:flex;flex-direction:column;gap:16px}.stop-info{background-color:var(--primary-container);padding:16px;border-radius:12px}.stop-info h3{font-size:20px;font-weight:600;margin:0 0 4px}.stop-info p{font-size:14px;opacity:.7;margin:0}.current-time{text-align:center;font-family:monospace;font-size:18px;font-weight:600;color:var(--primary)}.favorites-card h2{font-size:18px;font-weight:600;margin:0 0 16px}.favorites-list{display:flex;flex-direction:column;gap:12px}.favorite-item{background-color:var(--surface-container);padding:12px;border-radius:8px;display:flex;flex-direction:column;gap:8px}.favorite-item h3{font-size:16px;font-weight:600;margin:0}.direction-boxes-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-countdown{border:1px solid var(--outline);border-radius:8px;padding:8px;text-align:center}.mini-label{font-size:10px;font-weight:600;margin-bottom:4px}.mini-time{font-size:12px;font-weight:600}.menu-section h2{font-size:20px;font-weight:600;margin:0 0 12px}.menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}.menu-card{text-decoration:none;color:var(--on-surface);display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px;transition:transform .2s ease}.menu-card:hover{transform:translateY(-4px)}.menu-icon{font-size:48px}.menu-card h3{font-size:18px;font-weight:600;margin:0}.menu-card p{font-size:14px;opacity:.7;margin:0;text-align:center}.status-card{margin-top:16px}.status-card.loaded{background-color:var(--surface)}.status-card.not-loaded{background-color:var(--error-container)}.status-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.status-header span{font-size:24px}.status-header h3{font-size:16px;font-weight:600;margin:0}.data-counts{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}.data-counts span{background-color:var(--surface-container);padding:6px 12px;border-radius:16px;font-size:12px}.import-progress{display:flex;flex-direction:column;align-items:center;gap:8px;margin:12px 0}.import-progress p{font-size:14px;margin:0}.import-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease}.import-modal{background-color:var(--surface);border-radius:24px;padding:48px 32px;max-width:400px;width:90%;text-align:center;box-shadow:0 8px 32px #0000004d;animation:slideUp .4s ease}.import-icon{font-size:72px;margin-bottom:16px;animation:bounce 1s ease infinite}.import-modal h2{font-size:24px;font-weight:600;margin:0 0 8px;color:var(--on-surface)}.import-message{font-size:16px;opacity:.7;margin:0 0 24px}.progress-bar{width:100%;height:8px;background-color:var(--surface-container);border-radius:4px;overflow:hidden;margin-bottom:16px}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));transition:width .3s ease;border-radius:4px}.import-status{font-size:14px;font-weight:500;margin:0 0 4px;color:var(--primary)}.import-count{font-size:12px;opacity:.6;margin:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media(max-width:768px){.direction-boxes,.menu-grid{grid-template-columns:1fr}}.stops-page{min-height:100vh;background-color:var(--surface-container)}.back-button{color:var(--on-primary);text-decoration:none;font-size:24px;font-weight:600;padding:8px;border-radius:50%;transition:background-color .2s ease}.back-button:hover{background-color:#ffffff1a}.header h1{font-size:20px;font-weight:600;margin:0}.search-bar{padding:16px;background-color:var(--surface);position:relative}.search-bar .input{padding-right:40px}.clear-button{position:absolute;right:24px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:20px;color:var(--on-surface-variant);cursor:pointer;padding:8px}.count-bar{padding:8px 16px;background-color:var(--surface-container-high);font-size:14px;color:var(--on-surface-variant)}.stops-list{padding:8px 0}.stop-item{display:flex;align-items:center;gap:16px;padding:16px;background-color:var(--surface);border-bottom:1px solid var(--surface-container-high);text-decoration:none;color:var(--on-surface);transition:background-color .2s ease}.stop-item:hover{background-color:var(--surface-container)}.stop-icon{font-size:32px;background-color:var(--primary-container);padding:8px;border-radius:8px}.stop-info{flex:1}.stop-info h3{font-size:16px;font-weight:600;margin:0 0 4px}.stop-info p{font-size:12px;color:var(--on-surface-variant);margin:0}.chevron{font-size:24px;color:var(--on-surface-variant)}.loading-state,.empty-state{display:flex;justify-content:center;align-items:center;padding:64px 16px}.empty-state p{font-size:16px;color:var(--on-surface-variant)}.routes-page{min-height:100vh;background-color:var(--surface-container)}.routes-list{padding:16px;display:flex;flex-direction:column;gap:12px}.route-card{display:flex;align-items:center;gap:16px;cursor:pointer;transition:transform .2s ease}.route-card:hover{transform:translateY(-2px)}.route-badge{min-width:56px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-weight:700;font-size:18px}.route-info{flex:1}.route-info h3{font-size:16px;font-weight:600;margin:0 0 4px}.route-info p{font-size:12px;color:var(--on-surface-variant);margin:0}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal-content{background-color:var(--surface);border-radius:20px;max-width:600px;max-height:80vh;width:100%;overflow:hidden;display:flex;flex-direction:column;animation:fadeIn .3s ease}.modal-header{padding:16px;border-bottom:1px solid var(--surface-container-high);display:flex;align-items:center;gap:12px}.modal-header h2{flex:1;font-size:18px;font-weight:600;margin:0}.close-button{background:none;border:none;font-size:24px;color:var(--on-surface-variant);cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s ease}.close-button:hover{background-color:var(--surface-container)}.stops-timeline{padding:16px;overflow-y:auto}.timeline-item{display:flex;gap:16px;min-height:40px}.timeline-marker{display:flex;flex-direction:column;align-items:center;width:24px}.marker-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--primary);background-color:var(--surface);flex-shrink:0}.marker-dot.terminal{background-color:var(--primary)}.marker-line{width:2px;flex:1;background-color:var(--primary);min-height:20px}.timeline-content{flex:1;padding:2px 0}.stop-link{color:var(--on-surface);text-decoration:none;cursor:pointer;display:inline-block;padding:4px 8px;margin:-4px -8px;border-radius:4px;transition:background-color .2s ease}.stop-link:active{background-color:var(--surface-container-high)}.terminal-stop{font-weight:700}.timetable-page{min-height:100vh;background-color:var(--surface-container)}.header{background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);color:var(--on-primary);padding:16px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 8px var(--shadow)}.header h1{flex:1;font-size:20px;font-weight:600;margin:0}.favorite-button{background:none;border:none;font-size:28px;cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s ease}.favorite-button:hover{background-color:#ffffff1a}.timetable-content{padding:16px;display:flex;flex-direction:column;gap:16px}.countdown-card{background:linear-gradient(to bottom,var(--primary-container),var(--surface))}.countdown-card h2{font-size:18px;font-weight:600;margin:0 0 16px}.direction-boxes{display:grid;grid-template-columns:1fr 1fr;gap:12px}.direction-box{background-color:var(--surface);border:2px solid;border-radius:12px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:8px}.direction-label{font-size:12px;font-weight:600;text-align:center}.countdown{font-size:16px;font-weight:700}.arrival-time{font-size:24px;font-weight:700}.headsign{font-size:10px;text-align:center;opacity:.7}.no-bus{font-size:14px;opacity:.5;padding:16px 0}.date-card{display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.current-time{font-family:monospace;font-weight:600;color:var(--primary)}.route-times-card{overflow:hidden}.route-header{display:flex;align-items:center;gap:12px;padding:12px;background-color:var(--primary-container);border-radius:12px 12px 0 0;margin:-16px -16px 0}.route-badge{background-color:var(--primary);color:var(--on-primary);padding:6px 12px;border-radius:8px;font-weight:700;font-size:16px}.route-header h3{font-size:16px;font-weight:600;margin:0}.direction-section{margin-top:12px}.direction-section-label{padding:6px 12px;font-size:12px;font-weight:600;margin-bottom:8px}.timetable-grid{display:flex;flex-direction:column;gap:4px}.timetable-row{display:grid;grid-template-columns:40px 1fr;gap:8px;align-items:start}.hour-label{font-weight:600;color:var(--primary);padding:4px 0}.minutes-list{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}.minute{font-family:monospace;font-size:14px}.minute.past{opacity:.3;text-decoration:line-through}.route-footer{text-align:center;padding:8px;margin:12px -16px -16px;background-color:var(--surface-container);font-size:14px;color:var(--on-surface-variant);border-radius:0 0 12px 12px}@media(max-width:768px){.direction-boxes{grid-template-columns:1fr}}.map-page{min-height:100vh;background-color:var(--surface-container)}.map-placeholder{padding:16px;display:flex;flex-direction:column;gap:16px}.map-info{background-color:var(--surface);padding:32px;border-radius:12px;text-align:center;box-shadow:0 2px 4px var(--shadow)}.map-info h2{font-size:24px;margin:0 0 16px}.map-info p{margin:8px 0;color:var(--on-surface-variant)}.selected-stop-info{margin-top:24px;padding:16px;background-color:var(--primary-container);border-radius:8px}.selected-stop-info h3{margin:0 0 12px}.stops-list-mini{background-color:var(--surface);padding:16px;border-radius:12px;box-shadow:0 2px 4px var(--shadow)}.stops-list-mini h3{font-size:18px;font-weight:600;margin:0 0 12px}.stop-item-mini{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--surface-container-high);cursor:pointer;transition:background-color .2s ease}.stop-item-mini:hover{background-color:var(--surface-container)}.stop-item-mini:last-child{border-bottom:none}.stop-item-mini a{color:var(--primary);text-decoration:none;font-size:20px}.more-stops{text-align:center;padding:12px;color:var(--on-surface-variant);font-size:14px}.map-container{height:calc(100vh - 64px);width:100%;position:relative}.info-window-content{padding:8px}.info-window-content h3{margin:0 0 12px;font-size:16px;color:var(--on-surface)}.info-window-content .btn{width:100%}.about-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding-bottom:40px}.about-content{max-width:800px;margin:0 auto;padding:20px}.about-content .card{margin-bottom:20px;background:#fff;border-radius:16px;padding:24px;box-shadow:0 4px 12px #0000001a}.about-content h2{margin:0 0 16px;font-size:20px;color:#333;display:flex;align-items:center;gap:8px}.about-content p{margin:0 0 12px;line-height:1.6;color:#555}.about-content p:last-child{margin-bottom:0}.about-content strong{color:#d32f2f;font-weight:600}.official-link{margin-top:16px;padding-top:16px;border-top:1px solid #eee}.official-link a{color:#2196f3;text-decoration:none;font-weight:500}.official-link a:hover{text-decoration:underline}.data-info{display:flex;flex-direction:column;gap:12px}.info-row{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid #f0f0f0}.info-row:last-child{border-bottom:none}.info-row .label{font-weight:600;color:#666;min-width:140px}.info-row .value{color:#333;flex:1}.usage-steps{display:flex;flex-direction:column;gap:20px}.step{display:flex;gap:16px;align-items:flex-start}.step-number{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;flex-shrink:0}.step-content h3{margin:0 0 8px;font-size:16px;color:#333}.step-content p{margin:0;font-size:14px;color:#666;line-height:1.5}.feature-list{margin:0;padding-left:24px;color:#555}.feature-list li{margin-bottom:8px;line-height:1.6}.note{margin-top:16px;font-size:13px;color:#999;font-style:italic}.footer-card{text-align:center;background:linear-gradient(135deg,#f5f5f5,#e0e0e0)}.version{margin-top:12px;font-size:12px;color:#999;font-weight:600}@media(max-width:600px){.about-content{padding:16px}.about-content .card{padding:20px}.info-row{flex-direction:column;gap:4px}.info-row .label{min-width:auto;font-size:13px}.info-row .value{font-size:14px}}.install-prompt{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff;padding:16px;box-shadow:0 -4px 12px #00000026;z-index:1000;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.install-prompt-content{display:flex;align-items:center;gap:12px;max-width:600px;margin:0 auto}.install-prompt-icon{font-size:32px;flex-shrink:0}.install-prompt-text{flex:1}.install-prompt-text h3{margin:0 0 4px;font-size:16px;font-weight:600}.install-prompt-text p{margin:0;font-size:13px;opacity:.9;line-height:1.4}.install-prompt-actions{display:flex;gap:8px;flex-shrink:0}.btn-install{background:#fff;color:#2196f3;border:none;padding:8px 16px;border-radius:20px;font-weight:600;font-size:14px;cursor:pointer;transition:transform .2s}.btn-install:hover{transform:scale(1.05)}.btn-install:active{transform:scale(.95)}.btn-dismiss{background:#fff3;color:#fff;border:none;width:32px;height:32px;border-radius:50%;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.btn-dismiss:hover{background:#ffffff4d}@media(max-width:480px){.install-prompt{padding:12px}.install-prompt-icon{font-size:28px}.install-prompt-text h3{font-size:14px}.install-prompt-text p{font-size:12px}}
