:root{--primary: #2196F3;--secondary: #4CAF50;--accent: #FF5722;--text: #333;--bg: #FAFAFA;--card-bg: rgba(255, 255, 255, .9);--header-height: 45px;--font-main: "Inter", system-ui, -apple-system, sans-serif }body{background-color:#f7f9fc;min-height:100vh;margin:0;font-family:var(--font-main)}.app-container{display:flex;flex-direction:column;min-height:100vh;overflow:hidden}.app-header{height:var(--header-height);background:#d7d7d7;display:flex;justify-content:space-between;padding:0 2rem;box-shadow:0 2px 4px #0000000d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:100;align-items:center}.brand{font-weight:700;font-size:1.25rem;color:var(--primary);text-decoration:none;display:flex;align-items:center;gap:.5rem}.user-info{font-size:.875rem;color:#666}.brand-short{display:none}@media(max-width:600px){.brand-full{display:none}.brand-short{display:inline}}.main-content{flex:1;display:flex;justify-content:center;align-items:center}.upload-container{position:relative;background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;box-shadow:0 10px 30px #0000001a;padding:27px;width:100%;max-width:600px;text-align:center;transition:transform .2s}.upload-close-btn{position:absolute;top:15px;right:15px;width:32px;height:32px;border-radius:50%;background:#f0f4f8;color:#666;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:1.2rem;font-weight:700;border:1px solid #ddd;transition:all .2s;line-height:1}.upload-close-btn:hover{background:#e2e8f0;color:#111}.upload-zone{border:2px dashed #ccc;border-radius:12px;padding:3rem;margin:1.5rem 0;cursor:pointer;transition:all .2s ease;background:#ffffff80}.upload-zone:hover,.upload-zone.active{border-color:var(--primary);background:#2196f30d;transform:scale(1.01)}.upload-icon{font-size:3rem;color:#999;margin-bottom:1rem}.upload-text{font-size:1.1rem;color:#555;margin-bottom:.5rem}.upload-hint{font-size:.9rem;color:#888}.progress-container{margin-top:2rem;text-align:left}.progress-bar-bg{height:8px;background:#eee;border-radius:4px;overflow:hidden;margin-bottom:.5rem}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));transition:width .3s ease}.status-text{font-size:.9rem;color:#666;display:flex;justify-content:space-between}.result-card{margin-top:2rem;background:#e8f5e9;border:1px solid #c8e6c9;border-radius:8px;padding:1.5rem;animation:slideUp .3s ease}.view-link{display:inline-block;margin-top:1rem;padding:.8rem 1.5rem;background:var(--secondary);color:#fff;text-decoration:none;border-radius:6px;font-weight:600;transition:background .2s}.view-link:hover{background:#388e3c}.viewer-container{width:100%;height:calc(100vh - var(--header-height));position:absolute;top:var(--header-height);left:0;background:#fff}.map-iframe{width:100%;height:100%;border:none}.loading-spinner{border:4px solid #f3f3f3;border-top:4px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:2rem auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.auth-card{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:2.5rem;border-radius:16px;box-shadow:0 10px 30px #0000001a;width:100%;max-width:400px;text-align:center}.auth-card h2{margin-bottom:2rem;color:var(--primary)}.auth-card form{display:flex;flex-direction:column;gap:1rem}.auth-card input{padding:.8rem;border:1px solid #ddd;border-radius:8px;font-size:1rem}.primary-btn{padding:.8rem;background:var(--primary);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .2s}.primary-btn:hover{opacity:.9}.divider{margin:1.5rem 0;display:flex;align-items:center;color:#999;font-size:.8rem}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#eee;margin:0 1rem}.google-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:.8rem;background:#fff;border:1px solid #ddd;border-radius:8px;cursor:pointer;font-weight:500;transition:background .2s}.google-btn:hover{background:#f9f9f9}.google-btn img{width:18px}.toggle-auth{margin-top:1.5rem;font-size:.9rem;color:#666}.toggle-auth button{background:none;border:none;color:var(--primary);font-weight:600;cursor:pointer;margin-left:5px;text-decoration:underline}.error-text{color:#d32f2f;font-size:.85rem;margin:.5rem 0}.user-controls{display:flex;align-items:center;gap:1rem}.signout-btn{background:none;border:1px solid #ddd;padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:.8rem;transition:all .2s}.signout-btn:hover{background:#ffdada;border-color:#b1b1b1}.dashboard-container{max-width:1200px;margin:0 auto;padding:2rem}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.dashboard-header h2{color:var(--primary);margin:0}.maps-grid{display:flex;overflow-x:auto;gap:1.5rem;padding-bottom:1rem;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;flex-wrap:wrap;justify-content:center;max-height:478px;background-color:#f0f8ff}.maps-grid::-webkit-scrollbar{height:8px}.maps-grid::-webkit-scrollbar-track{background:transparent}.maps-grid::-webkit-scrollbar-thumb{background-color:#cbd5e1;border-radius:4px}.maps-grid .map-card{min-width:300px;flex:0 0 auto}.maps-list{display:flex;flex-direction:column;gap:1rem}.maps-list .map-card{flex-direction:row;align-items:center}.maps-list .map-icon{width:80px;height:auto;align-self:stretch}.maps-list .map-info{flex-direction:row;align-items:center;justify-content:space-between;gap:1.5rem;padding:.5rem 1.5rem}.maps-list .map-info h3{margin:0;min-width:150px;flex:1}.maps-list .map-stats{margin:0}.maps-list .map-date{margin:0;white-space:nowrap}.maps-list .map-actions{margin:0;flex-wrap:nowrap!important}.map-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 6px #0000000d;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}.map-card:hover{transform:translateY(-4px);box-shadow:0 8px 12px #0000001a}.map-icon{background:#f0f4f8;height:120px;display:flex;align-items:center;justify-content:center;font-size:3rem;color:#bdc3c7}.map-info{padding:1rem;flex:1;display:flex;flex-direction:column}.map-info h3{margin:0 0 .5rem;font-size:1.1rem;color:#2c3e50;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-date{font-size:.8rem;color:#7f8c8d;margin-bottom:1rem}.map-actions{margin-top:auto;display:flex;gap:.8rem}.view-btn{flex:1;text-align:center;padding:.5rem;background:var(--primary);color:#fff;text-decoration:none;border-radius:6px;font-size:.9rem;font-weight:500}.delete-btn{padding:.5rem .8rem;background:none;border:1px solid #e74c3c;color:#e74c3c;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s}.delete-btn:hover{background:#e74c3c;color:#fff}.copy-btn{padding:.5rem .8rem;background:#f0f4f8;border:1px solid #bdc3c7;color:#2c3e50;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s}.copy-btn:hover{background:#bdc3c7}.copy-btn-large{padding:.8rem 1.5rem;background:#f0f4f8;border:1px solid #bdc3c7;color:#2c3e50;border-radius:6px;cursor:pointer;font-weight:600;transition:all .2s;height:45px}.copy-btn-large:hover{background:#bdc3c7}.map-stats{display:flex;gap:1rem;font-size:.85rem;color:#666;margin-bottom:.5rem}.map-stats span{display:flex;align-items:center;gap:4px}.empty-state{text-align:center;padding:4rem 2rem;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000000d}.empty-state p{color:#7f8c8d;margin-bottom:1.5rem;font-size:1.1rem}.upload-link{display:inline-block;padding:.8rem 1.5rem;background:var(--secondary);color:#fff;text-decoration:none;border-radius:8px;font-weight:600;transition:opacity .2s}.upload-link:hover{opacity:.9}.email-display{font-weight:600;color:#333;padding:.5rem;background:#f5f5f5;border-radius:4px;margin:1rem 0}.verify-controls{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.secondary-btn{padding:.8rem;background:#fff;border:1px solid #ccc;color:#555;border-radius:8px;cursor:pointer;font-weight:600}.secondary-btn:hover{background:#f9f9f9}.nav-links{display:flex;gap:1.5rem;margin-right:auto;margin-left:2rem}.nav-item{color:#000;text-decoration:none;font-weight:500;transition:color .2s;font-size:.95rem}.nav-item:hover,.nav-item.active{color:var(--primary)}.viewer-loader-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff6;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;transition:opacity .8s ease,visibility .8s;opacity:1;visibility:visible}.viewer-loader-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.viewer-loader-overlay p{margin-top:1rem;color:#666;font-weight:500}.collector-form{display:flex;gap:8px;align-items:center}.collector-form input{padding:6px 12px;border:1px solid #ddd;border-radius:4px;font-size:.85rem;outline:none;width:200px}.collector-form input:focus{border-color:var(--primary)}.collector-form button{padding:6px 12px;background:#333;color:#fff;border:none;border-radius:4px;font-size:.85rem;font-weight:500;cursor:pointer}.collector-form button:hover{background:#000}.collector-success{font-size:.85rem;color:#2e7d32;font-weight:500}@media(max-width:768px){.app-header{padding:0 .75rem;height:auto;min-height:50px;flex-wrap:nowrap;align-items:center;gap:.5rem;position:relative}.brand{font-size:1.1rem;flex-shrink:0}.header-email-collector{flex:1;display:flex;justify-content:flex-end;min-width:0}.collector-form{width:100%;max-width:240px;gap:4px;justify-content:flex-end}.collector-form input{flex:1;min-width:80px;width:0;font-size:.75rem;padding:5px 8px}.collector-form button{padding:5px 8px;font-size:.75rem;white-space:nowrap}.nav-links{display:none}.app-container:not(.is-viewer-path) .nav-links{display:flex;order:3;width:100%;margin:5px 0;justify-content:center;gap:1.5rem}.app-header:has(.header-email-collector) .nav-links{display:none}.app-header:not(:has(.header-email-collector)) .nav-links{order:3;width:100%;margin:5px 0;justify-content:center;gap:1.5rem}.viewer-container{position:relative;top:0;height:100%}.app-container{height:100vh}.main-content{padding:0;-webkit-overflow-scrolling:touch}.dashboard-header{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}.dashboard-header .primary-btn{width:100%;text-align:center}.maps-list .map-card{flex-direction:column}.maps-list .map-icon{width:100%;height:120px}.maps-list .map-info{flex-direction:column;align-items:stretch}.maps-list .map-actions{flex-wrap:wrap!important;margin-top:1rem}.auth-card{padding:1.5rem}}@media(max-width:600px){.collector-form input{width:140px}}@media(max-width:400px){.brand{font-size:1rem}.user-info{display:none}.signout-btn{padding:.3rem .6rem}}.progress-bar-minimal{width:200px;height:4px;background:#eee;border-radius:2px;margin-top:10px;overflow:hidden}.progress-bar-minimal .progress-bar-fill{height:100%;background:var(--primary);transition:width .3s ease}
