:root{--nav-h:60px;--primary:#006994;--sidebar-w:350px}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%;font-family:'Noto Sans TC',sans-serif;background:var(--primary);overflow:hidden}#app-container{display:flex;margin-top:var(--nav-h);height:calc(100vh - var(--nav-h));width:100%}.sidebar{width:var(--sidebar-w);background:#fff;display:flex;flex-direction:column;border-right:1px solid #ddd;z-index:10}.sidebar-header{padding:20px;border-bottom:1px solid #eee}.sidebar-header h2{margin:0 0 15px;font-size:1.2rem;color:var(--primary)}.search-box input{width:100%;padding:10px;border:1px solid #ddd;border-radius:8px}.filter-bar{padding:10px 20px;display:flex;gap:8px}.filter-btn{padding:6px 12px;border-radius:20px;border:1px solid #ddd;background:#fff;cursor:pointer;font-size:13px}.filter-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.spot-list{flex:1;overflow-y:auto}.spot-item{padding:15px 20px;border-bottom:1px solid #f5f5f5;cursor:pointer;transition:.2s}.spot-item:hover{background:#f0f7fa}.spot-item h3{margin:0 0 5px;font-size:16px}.spot-item p{margin:0;font-size:13px;color:#666}#map-area{flex:1;position:relative}#map{width:100%;height:100%}.float-btn{position:absolute;right:20px;bottom:30px;width:50px;height:50px;border-radius:50%;background:#fff;border:none;box-shadow:0 4px 10px rgba(0,0,0,.2);cursor:pointer;z-index:500;font-size:20px;color:var(--primary)}.mobile-card{position:absolute;bottom:-100%;left:0;width:100%;background:#fff;border-radius:20px 20px 0 0;transition:.3s cubic-bezier(.4, 0, .2, 1);z-index:1000;padding:15px 20px 30px;box-shadow:0 -5px 15px rgba(0,0,0,.1)}.mobile-card.active{bottom:0}.drag-handle{width:40px;height:5px;background:#ddd;border-radius:3px;margin:0 auto 15px}.info-title{font-size:1.3rem;font-weight:900;margin:0 0 10px;display:flex;justify-content:space-between}.info-tag{font-size:12px;background:#e0f2f1;color:#00796b;padding:2px 8px;border-radius:4px}.info-row{margin-bottom:10px;font-size:14px;line-height:1.5}.info-row i{color:var(--primary);margin-right:8px;width:15px}.btn-nav{display:block;width:100%;padding:12px;background:var(--primary);color:#fff;text-align:center;text-decoration:none;border-radius:10px;font-weight:700;margin-top:15px}@media (max-width:768px){.sidebar{display:none}.float-btn{bottom:40px}}