@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.modal-overlay{align-items:center;animation:fadeIn .3s cubic-bezier(.19,1,.22,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background-color:#000c;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.modal-content{animation:modalAppear .5s cubic-bezier(.19,1,.22,1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background-color:#141428b3;border:1px solid #ffffff1a;border-radius:16px;box-shadow:0 0 30px #00e5ff4d,0 0 60px #ff00dd4d;color:#fff;max-width:90%;padding:2.5rem;position:relative;text-align:center;width:400px}.modal-content p{font-size:1.1rem;line-height:1.6;margin-bottom:1.5rem}.modal-overlay.closing{animation:fadeOut .3s cubic-bezier(.19,1,.22,1) forwards}.modal-overlay.closing .modal-content{animation:modalDisappear .3s cubic-bezier(.19,1,.22,1) forwards}@media (max-width:480px){.modal-content{padding:2rem 1.5rem;width:95%}.modal-content p{font-size:1rem}}.train-details-modal-overlay{align-items:center;animation:fadeIn .3s cubic-bezier(.19,1,.22,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background-color:#000c;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.train-details-modal-content{animation:modalAppear .5s cubic-bezier(.19,1,.22,1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background-color:#141428b3;border:1px solid #ffffff1a;border-radius:16px;box-shadow:0 0 30px #00e5ff4d,0 0 60px #ff00dd4d;display:flex;flex-direction:column;max-height:90vh;max-width:700px;overflow-y:auto;padding:2.5rem;position:relative;width:90%}@keyframes modalAppear{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.train-details-modal-content h2{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#00e5ff,#f0d);-webkit-background-clip:text;background-clip:text;margin-bottom:1.5rem;margin-top:0;text-align:left}.train-info{grid-gap:.5rem;animation:fadeIn .5s cubic-bezier(.19,1,.22,1) .1s both;background-color:#ffffff0d;border:1px solid #ffffff0d;border-radius:16px;display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-bottom:1.5rem;padding:1.25rem}.train-info p{border-bottom:1px solid #ffffff0d;display:flex;justify-content:space-between;margin:.75rem 0;padding-bottom:.75rem}.train-info p:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.train-info p strong{color:#00e5ff;font-weight:500}.stop-times-container{animation:fadeIn .5s cubic-bezier(.19,1,.22,1) .2s both;flex-grow:1;margin:1rem 0;max-height:500px;min-height:400px;overflow-y:auto}.stop-times{background-color:#ffffff05;border:1px solid #ffffff1a;border-radius:16px;display:flex;flex-direction:column;height:100%;overflow:hidden;padding:1.5rem 0;position:relative}.timeline{background:linear-gradient(180deg,#00e5ff80,#ff00dd80);bottom:0;left:40px;position:absolute;top:0;width:4px;z-index:1}.stop-time{align-items:center;display:flex;font-size:1.05rem;margin-left:60px;padding:1rem 1.5rem 1rem 0;position:relative;transition:all .3s cubic-bezier(.19,1,.22,1)}.station-circle{background-color:#1e1e30;border:3px solid #ffffff4d;border-radius:50%;height:16px;left:-26px;position:absolute;transition:all .3s ease;width:16px;z-index:2}.stop-time.past .station-circle{background-color:#00e5ff33;border-color:#00e5ffb3}.stop-time.current .station-circle{background-color:#00e5ff80;border-color:#00e5ff;box-shadow:0 0 15px #00e5ffb3;transform:scale(1.2)}.train-indicator{animation:trainPulse 2s infinite alternate;filter:drop-shadow(0 0 8px rgba(255,255,255,.7));height:20px;left:-39px;position:absolute;transition:all .5s cubic-bezier(.34,1.56,.64,1);width:40px;z-index:5}.train-indicator-bg{background-color:#141428e6;border-radius:4px;height:28px;left:-43px;position:absolute;width:48px;z-index:4}@keyframes trainPulse{0%{transform:scale(1)}to{transform:scale(1.1)}}.stop-time{opacity:.8}.stop-time.past{opacity:.6}.stop-time.current{font-size:1.1rem;font-weight:600;opacity:1}.stop-time:hover{background-color:#ffffff0d;opacity:1}.station-content{display:flex;justify-content:space-between;padding-left:10px;width:100%}.station-name{flex:1 1;font-weight:500}.time-info{align-items:flex-end;color:var(--text-color);display:flex;flex-direction:column;text-align:right}.scheduled-time{font-weight:400}.delayed-time{color:#ff9500;font-size:.9em;margin-top:.2rem}.close-button{align-items:center;background-color:#ffffff1a;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.5rem;height:36px;justify-content:center;padding:0;position:absolute;right:15px;top:15px;transition:all .3s cubic-bezier(.19,1,.22,1);width:36px}.close-button:hover{background-color:#fff3;color:#00e5ff;transform:rotate(90deg)}.stop-times-container::-webkit-scrollbar,.train-details-modal-content::-webkit-scrollbar{width:6px}.stop-times-container::-webkit-scrollbar-track,.train-details-modal-content::-webkit-scrollbar-track{background:#ffffff0d;border-radius:10px}.stop-times-container::-webkit-scrollbar-thumb,.train-details-modal-content::-webkit-scrollbar-thumb{background:linear-gradient(#00e5ff,#f0d);border-radius:10px}.stop-times-container::-webkit-scrollbar-thumb:hover,.train-details-modal-content::-webkit-scrollbar-thumb:hover{background:linear-gradient(#f0d,#00e5ff)}.train-details-modal-overlay.closing{animation:fadeOut .3s cubic-bezier(.19,1,.22,1) forwards}.train-details-modal-overlay.closing .train-details-modal-content{animation:modalDisappear .3s cubic-bezier(.19,1,.22,1) forwards}@keyframes modalDisappear{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.95) translateY(20px)}}.stop-times-header{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);background:linear-gradient(90deg,#00e5ff1a,#ff00dd1a);border-bottom:1px solid #ffffff1a;display:flex;font-weight:600;justify-content:space-between;padding:1rem 1.5rem 1rem 60px;position:sticky;top:0;z-index:4}@media (max-width:768px){.train-details-modal-content{padding:2rem 1.5rem;width:95%}.stop-time{font-size:1rem;margin-left:50px;padding:.85rem 1rem .85rem 0}.station-circle{height:14px;left:-25px;width:14px}.timeline{left:35px}.train-indicator{height:15px;left:-35px;width:30px}.train-info{grid-template-columns:1fr}.stop-times-container{min-height:350px}.stop-times-header{padding-left:50px}}@media (max-width:480px){.train-details-modal-content{padding:1.75rem 1rem}.train-details-modal-content h2{font-size:1.3rem}.train-info p{flex-direction:column;gap:.25rem}.stop-time{font-size:.95rem;margin-left:40px;padding:.75rem .75rem .75rem 0}.station-circle{border-width:2px;height:12px;left:-22px;width:12px}.timeline{left:30px;width:3px}.train-indicator{height:12px;left:-30px;width:24px}.stop-times-header{padding-left:40px}}:root{--primary-color:#00e5ff;--secondary-color:#f0d;--background-color:#0a0a1a;--card-bg:#14142880;--text-color:#fff;--text-secondary:#ffffffb3;--border-radius:16px;--transition-slow:0.5s cubic-bezier(0.19,1,0.22,1);--transition-normal:0.3s cubic-bezier(0.19,1,0.22,1);--transition-fast:0.15s cubic-bezier(0.19,1,0.22,1);--shadow-normal:0 10px 30px #00000040;--shadow-hover:0 15px 40px #00000059}*{box-sizing:border-box;padding:0}*,body{margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a1a;background-color:var(--background-color);color:#fff;color:var(--text-color);font-family:Poppins,sans-serif}.app{align-items:center;background-image:radial-gradient(circle at 10% 20%,#00e5ff26 0,#0000 30%),radial-gradient(circle at 90% 80%,#ff00dd26 0,#0000 30%);overflow:hidden;position:relative}.app:before{animation:rotate 60s linear infinite;background:linear-gradient(45deg,#00e5ff0d,#ff00dd0d);content:"";height:150%;left:-25%;position:absolute;top:-25%;width:150%;z-index:-1}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.container{animation:fadeIn .8s cubic-bezier(.19,1,.22,1) .5s;animation:fadeIn .8s var(--transition-slow);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background-color:#14142880;background-color:var(--card-bg);border:1px solid #ffffff1a;border-radius:16px;border-radius:var(--border-radius);box-shadow:0 10px 30px #00000040;box-shadow:var(--shadow-normal);max-width:800px;overflow:hidden;padding:2.5rem;position:relative;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal);width:100%}.container:after{background:linear-gradient(45deg,#00e5ff0d,#ff00dd0d);content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}.container:hover{box-shadow:0 15px 40px #00000059;box-shadow:var(--shadow-hover);transform:translateY(-5px)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}h1,h2{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#00e5ff,#f0d);background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;background-clip:text;font-weight:700;letter-spacing:1px;margin-bottom:2rem;position:relative;text-align:center;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}h1{font-size:2.2rem;margin-bottom:2.5rem}h1:after{background:linear-gradient(45deg,#00e5ff,#f0d);background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));border-radius:3px;bottom:-10px;content:"";height:3px;left:50%;position:absolute;transform:translateX(-50%);width:80px}h2{font-size:1.8rem;margin-bottom:1.5rem}.search-container{display:flex;margin-bottom:2rem;position:relative}.search-container,input[type=text]{transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}input[type=text]{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);background-color:#ffffff14;border:1px solid #ffffff0d;border-radius:50px;color:#fff;color:var(--text-color);flex-grow:1;font-family:Poppins,sans-serif;font-size:1rem;outline:none;padding:1rem 1.5rem}input[type=text]:focus{background-color:#ffffff1f;box-shadow:0 0 0 2px #00e5ff4d}button{background:linear-gradient(45deg,#00e5ff,#f0d);background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));border:none;border-radius:50px;color:#0a0a1a;color:var(--background-color);cursor:pointer;font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;overflow:hidden;padding:.85rem 1.75rem;position:relative;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal);z-index:1}.search-container button{position:absolute;right:5px;top:5px}button:before{background:linear-gradient(45deg,#f0d,#00e5ff);background:linear-gradient(45deg,var(--secondary-color),var(--primary-color));content:"";height:100%;left:-100%;position:absolute;top:0;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal);width:100%;z-index:-1}button:hover:not(:disabled):before{left:0}button:hover:not(:disabled){box-shadow:0 7px 15px #0000004d;transform:translateY(-2px)}button:active:not(:disabled){box-shadow:0 5px 10px #0003;transform:translateY(0)}button:disabled{cursor:not-allowed;opacity:.6}.result{animation:fadeIn .5s cubic-bezier(.19,1,.22,1) .5s;animation:fadeIn .5s var(--transition-slow);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background-color:#ffffff12;border:1px solid #ffffff0d;border-radius:16px;border-radius:var(--border-radius);margin-top:2rem;padding:1.5rem;transition:all .5s cubic-bezier(.19,1,.22,1);transition:all var(--transition-slow)}.info-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));max-height:600px;overflow-y:auto;padding-right:10px}.info-grid,.info-item{transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.info-item{animation:fadeIn .5s .5s cubic-bezier(.19,1,.22,1) 0s;animation:fadeIn .5s calc(var(--i, 0)*.1s) var(--transition-slow);background-color:#ffffff0d;border:1px solid #ffffff0d;border-radius:16px;border-radius:var(--border-radius);cursor:pointer;padding:1.25rem;position:relative}.info-item:hover{background-color:#ffffff1a;box-shadow:0 10px 20px #0003;transform:translateY(-5px) scale(1.02)}.info-item:active{transform:translateY(-2px) scale(1.01)}.info-item:after{background:linear-gradient(45deg,#0000,#00e5ff4d,#ff00dd4d,#0000);border-radius:16px;border-radius:var(--border-radius);content:"";inset:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;padding:1px;position:absolute;transition:opacity .3s ease}.info-item:hover:after{opacity:1}.label{color:#00e5ff;color:var(--primary-color);font-weight:500;margin-right:.5rem}.label,.value{transition:color .3s cubic-bezier(.19,1,.22,1);transition:color var(--transition-normal)}.value{color:#fff;color:var(--text-color)}.home-page{animation:fadeIn .5s cubic-bezier(.19,1,.22,1) .5s;animation:fadeIn .5s var(--transition-slow);text-align:center}.selection-buttons{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:30px}.selection-buttons,.selection-buttons button{transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.selection-buttons button{padding:1rem 1.5rem;width:200px}.train-header{align-items:center;display:flex;font-size:1.1rem;justify-content:space-between;margin-bottom:.75rem}.train-details,.train-header{transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.train-details{grid-gap:.5rem;display:grid;gap:.5rem}.train-details div{border-bottom:1px solid #ffffff0d;display:flex;justify-content:space-between;padding:.5rem 0;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.train-details div:last-child{border-bottom:none}.error,.info-message,.loading{animation:fadeIn .5s cubic-bezier(.19,1,.22,1) .5s;animation:fadeIn .5s var(--transition-slow);border-radius:16px;border-radius:var(--border-radius);margin-top:1.5rem;padding:1rem;text-align:center;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.loading{background-color:#00e5ff1a;color:#00e5ff;color:var(--primary-color);overflow:hidden;position:relative}.loading:after{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#0000,#fff3,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;width:100%}@keyframes shimmer{to{left:100%}}.error{background-color:#ff6b6b1a;color:#ff6b6b}.info-message{background-color:#ff00dd1a;color:#f0d;color:var(--secondary-color)}.header{justify-content:space-between;margin-bottom:2rem;position:relative;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal)}.back-button,.header{align-items:center;display:flex}.back-button{font-size:.9rem;gap:.5rem;padding:.6rem 1.2rem}.back-button:before{content:"←";display:inline-block;margin-right:.25rem;transition:transform .3s cubic-bezier(.19,1,.22,1);transition:transform var(--transition-normal)}.back-button:hover:before{transform:translateX(-3px)}.train-type{border-radius:50px;color:#fff;display:inline-block;font-size:.85rem;font-weight:600;letter-spacing:.5px;padding:.25rem .75rem;text-transform:uppercase}.train-type-local{background-color:#0072c6;box-shadow:0 0 10px #0072c680}.train-type-express{background-color:#ff6b00;box-shadow:0 0 10px #ff6b0080}.train-type-tze-chiang{background-color:#e60012;box-shadow:0 0 10px #e6001280}.train-type-chu-kuang{background-color:#00a040;box-shadow:0 0 10px #00a04080}.train-type-fu-hsing{background-color:#9e005d;box-shadow:0 0 10px #9e005d80}.train-type-other{background-color:#888;box-shadow:0 0 10px #88888880}.station-dropdown{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background-color:#141428f2;border:1px solid #00e5ff4d;border-radius:16px;border-radius:var(--border-radius);box-shadow:0 10px 30px #00000040;box-shadow:var(--shadow-normal);left:0;max-height:0;opacity:0;overflow-y:auto;position:absolute;right:0;top:100%;transition:all .3s cubic-bezier(.19,1,.22,1);transition:all var(--transition-normal);z-index:10}.station-dropdown.open{margin-top:5px;max-height:200px;opacity:1}.station-option{border-bottom:1px solid #ffffff0d;cursor:pointer;padding:.75rem 1rem;transition:all .15s cubic-bezier(.19,1,.22,1);transition:all var(--transition-fast)}.station-option:last-child{border-bottom:none}.station-option:hover{background-color:#ffffff1a;padding-left:1.5rem}.info-grid::-webkit-scrollbar-track,.station-dropdown::-webkit-scrollbar-track,.stop-times-container::-webkit-scrollbar-track,.train-details-modal-content::-webkit-scrollbar-track{background:#ffffff0d;border-radius:10px}.info-grid::-webkit-scrollbar-thumb,.station-dropdown::-webkit-scrollbar-thumb,.stop-times-container::-webkit-scrollbar-thumb,.train-details-modal-content::-webkit-scrollbar-thumb{background:linear-gradient(#00e5ff,#f0d);background:linear-gradient(var(--primary-color),var(--secondary-color));border-radius:10px}.info-grid::-webkit-scrollbar-thumb:hover,.station-dropdown::-webkit-scrollbar-thumb:hover,.stop-times-container::-webkit-scrollbar-thumb:hover,.train-details-modal-content::-webkit-scrollbar-thumb:hover{background:linear-gradient(#f0d,#00e5ff);background:linear-gradient(var(--secondary-color),var(--primary-color))}.fade-in{animation:fadeIn .5s cubic-bezier(.19,1,.22,1)}.fade-out{animation:fadeOut .3s cubic-bezier(.19,1,.22,1);opacity:0;pointer-events:none;transform:translateY(10px)}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}.info-item:first-child{--i:0}.info-item:nth-child(2){--i:1}.info-item:nth-child(3){--i:2}.info-item:nth-child(4){--i:3}.info-item:nth-child(5){--i:4}.info-item:nth-child(6){--i:5}.info-item:nth-child(7){--i:6}.info-item:nth-child(8){--i:7}.info-item:nth-child(9){--i:8}.info-item:nth-child(10){--i:9}@keyframes pulse-border{0%{box-shadow:0 0 0 0 #00e5ff66}70%{box-shadow:0 0 0 10px #00e5ff00}to{box-shadow:0 0 0 0 #00e5ff00}}.stop-time.current{animation:pulse-border 2s infinite}@media (max-width:768px){.container{padding:2rem 1.5rem}h1{font-size:1.8rem}h2{font-size:1.5rem}.selection-buttons{align-items:center;flex-direction:column}.selection-buttons button{max-width:250px;width:100%}.info-grid{grid-template-columns:1fr}.search-container{flex-direction:column}.search-container button{margin-top:1rem;position:static;width:100%}input[type=text]{width:100%}.header{flex-direction:column;gap:1rem}.back-button{align-self:flex-start}}@media (max-width:480px){.container{padding:1.5rem 1rem}h1{font-size:1.6rem}h2{font-size:1.3rem}}body,html{height:100%}body,html{overflow-y:auto}body{overflow-x:hidden}.app{align-items:flex-start;display:flex;justify-content:center;min-height:100vh;overflow-y:auto;padding:2rem 1rem}.container{margin:2rem auto}.container,.info-grid,.result{max-height:none;overflow:visible}.modal-overlay,.train-details-modal-overlay{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0}body,html{-ms-overflow-style:none;scrollbar-width:none}body::-webkit-scrollbar,html::-webkit-scrollbar{display:none}.app{-ms-overflow-style:none;scrollbar-width:none}.app::-webkit-scrollbar{display:none}.app,body,html{overflow-y:auto}.info-grid::-webkit-scrollbar,.station-dropdown::-webkit-scrollbar,.stop-times-container::-webkit-scrollbar,.train-details-modal-content::-webkit-scrollbar{display:block;width:6px}
/*# sourceMappingURL=main.431e4e54.css.map*/