:root {--primary-color:#2563eb;--primary-hover:#1d4ed8;--secondary-color:#64748b;--success-color:#059669;--error-color:#dc2626;--warning-color:#d97706;--background-color:#f8fafc;--card-background:#ffffff;--text-primary:#1e293b;--text-secondary:#64748b;--border-color:#e2e8f0;--border-radius:8px;--shadow:0 1px 3px 0 rgb(0 0 0 / 0.1);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.1)}* {margin:0;padding:0;box-sizing:border-box}body {font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;color:var(--text-primary);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);background-attachment:fixed;min-height:100vh;font-size:16px}.container {max-width:1200px;margin:0 auto;padding:20px;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,0.1);margin-top:20px;margin-bottom:40px}.header {text-align:center;margin-bottom:40px;padding:40px 20px;background:linear-gradient(135deg,var(--primary-color),#3b82f6);color:white;border-radius:var(--border-radius);box-shadow:var(--shadow-lg)}.header h1 {font-size:2.5rem;margin-bottom:16px;font-weight:700}.header .description {font-size:1.1rem;margin-bottom:20px;opacity:0.95;line-height:1.7}.process-steps {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin:20px 0;max-width:900px;margin-left:auto;margin-right:auto}.step {background:rgba(255,255,255,0.15);padding:12px 16px;border-radius:12px;font-size:0.95rem;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);transition:all 0.3s ease;text-align:left}.step:hover {background:rgba(255,255,255,0.25);transform:translateY(-2px)}.sub-description {font-size:0.95rem;margin-bottom:20px;opacity:0.85;line-height:1.6;font-style:italic}.features {display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-top:20px}.feature {background:rgba(255,255,255,0.2);padding:8px 16px;border-radius:20px;font-size:0.9rem;backdrop-filter:blur(10px)}.section {background:var(--card-background);border-radius:var(--border-radius);padding:30px;margin-bottom:30px;box-shadow:var(--shadow);border:1px solid var(--border-color)}.section h2 {color:var(--text-primary);margin-bottom:20px;font-size:1.5rem;font-weight:600}.form-group {margin-bottom:20px}.form-group label {display:block;margin-bottom:8px;font-weight:500;color:var(--text-primary)}input[type="text"],textarea {width:100%;padding:12px 16px;border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:16px;transition:border-color 0.2s;font-family:inherit}input[type="text"]:focus,textarea:focus {outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(37,99,235,0.1)}textarea {min-height:100px;resize:vertical}#schools-input {min-height:120px}.btn {display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border:none;border-radius:var(--border-radius);font-size:16px;font-weight:500;text-decoration:none;cursor:pointer;transition:all 0.2s;position:relative}.btn-primary {background-color:var(--primary-color);color:white}.btn-primary:hover:not(:disabled) {background-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-secondary {background-color:var(--secondary-color);color:white}.btn-secondary:hover:not(:disabled) {background-color:#475569;transform:translateY(-1px)}.btn:disabled {opacity:0.6;cursor:not-allowed;transform:none !important}.payment-info {margin-bottom:32px}.pricing-card {background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;border-radius:12px;padding:24px;text-align:center;box-shadow:0 8px 32px rgba(102,126,234,0.3)}.price-header {display:flex;align-items:baseline;justify-content:center;margin-bottom:16px}.currency {font-size:1.5rem;font-weight:500}.amount {font-size:3rem;font-weight:700;margin:0 4px}.period {font-size:1.5rem;font-weight:500}.price-details {margin-top:16px}.price-details p {margin-bottom:8px;opacity:0.95;font-size:14px}.stripe-header {margin-bottom:20px;text-align:center}.secure-badge {display:inline-flex;align-items:center;gap:6px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:8px 16px;font-size:12px;font-weight:500;color:#475569}.stripe-logo {margin-left:4px}.payment-form {background:#fafbfc;border:1px solid #e6ebf1;border-radius:8px;padding:24px}.payment-instructions {background:#f0f9ff;border:1px solid #0ea5e9;border-radius:6px;padding:12px 16px;margin-bottom:20px}.payment-instructions p {margin:0;color:#0c4a6e;font-size:14px;font-weight:500}.stripe-element {background:white;padding:14px 16px;border:1px solid #e6ebf1;border-radius:6px;transition:all 0.15s ease;box-shadow:0 1px 3px rgba(50,50,93,0.15)}.stripe-element:focus-within {border-color:#635bff;box-shadow:0 1px 3px rgba(50,50,93,0.15),0 0 0 3px rgba(99,91,255,0.1);transform:translateY(-1px)}.stripe-button {background:#635bff;border:none;border-radius:6px;padding:14px 24px;font-weight:600;font-size:16px;transition:all 0.15s ease;box-shadow:0 4px 8px rgba(99,91,255,0.35);position:relative;overflow:hidden;display:block;margin:20px auto 0;width:fit-content}.stripe-button:hover:not(:disabled) {background:#5a52d5;transform:translateY(-2px);box-shadow:0 6px 12px rgba(99,91,255,0.4)}.stripe-button:active {transform:translateY(0)}.button-content {display:flex;align-items:center;justify-content:center;gap:8px}.key-icon {opacity:0.8}.payment-footer {margin-top:20px;text-align:center}.security-badges {display:flex;justify-content:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.badge {background:#f1f5f9;color:#475569;padding:4px 12px;border-radius:12px;font-size:11px;font-weight:500;border:1px solid #e2e8f0}.powered-by {font-size:12px;color:#64748b;margin:0;display:flex;align-items:center;justify-content:center;gap:4px}.powered-by a {color:#635bff;text-decoration:none;display:inline-flex;align-items:center}.powered-by a:hover {opacity:0.8}.stripe-logo {margin-left:4px;vertical-align:middle;fill:#635bff}.token-display {background:#f0fdf4;border:1px solid var(--success-color);border-radius:var(--border-radius);padding:20px;margin-top:20px}.token-display h3 {color:var(--success-color);margin-bottom:12px}.token-display code {background:#dcfce7;padding:4px 8px;border-radius:4px;font-family:'Monaco','Menlo',monospace;font-size:14px;word-break:break-all}.status-message {padding:16px;border-radius:var(--border-radius);margin-bottom:20px;font-weight:500}.status-message.success {background:#f0fdf4;color:var(--success-color);border:1px solid #bbf7d0}.status-message.error {background:#fef2f2;color:var(--error-color);border:1px solid #fecaca}.status-message.info {background:#eff6ff;color:var(--primary-color);border:1px solid #bfdbfe}#payment-message {color:#dc2626;font-size:14px;margin-top:8px;min-height:20px}#payment-element {margin-bottom:16px}.job-status {background:#fffbeb;border:1px solid var(--warning-color);border-radius:var(--border-radius);padding:20px;margin-top:20px}.job-status h3 {color:var(--warning-color);margin-bottom:12px}.job-status code {background:#fef3c7;padding:4px 8px;border-radius:4px;font-family:'Monaco','Menlo',monospace;font-size:14px}.results-table {width:100%;border-collapse:collapse;margin-top:20px}.results-table th,.results-table td {padding:12px;text-align:left;border-bottom:1px solid var(--border-color)}.results-table th {background-color:var(--background-color);font-weight:600;color:var(--text-primary)}.results-table tr:hover {background-color:var(--background-color)}.transport-mode {display:inline-block;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500;margin-right:8px}.mode-walking {background:#dbeafe;color:#1e40af}.mode-transit {background:#f3e8ff;color:#7c3aed}.mode-driving {background:#fef3c7;color:#d97706}.spinner {width:20px;height:20px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite;display:inline-block}@keyframes spin {0% {transform:rotate(0deg)}100% {transform:rotate(360deg)}}.status-check {display:flex;gap:12px;align-items:flex-end}.status-check input {flex:1}.help-text {color:var(--text-secondary);font-size:14px;margin-bottom:16px}.token-list {display:flex;flex-direction:column;gap:12px}.token-item {background:#f8fafc;border:1px solid var(--border-color);border-radius:var(--border-radius);padding:16px;display:flex;justify-content:space-between;align-items:flex-start;transition:background-color 0.2s}.token-item:hover {background:#f1f5f9}.token-info {flex:1}.token-code {font-family:'Monaco','Menlo',monospace;font-size:14px;background:#e2e8f0;padding:4px 8px;border-radius:4px;margin-right:12px;word-break:break-all}.token-meta {font-size:12px;color:var(--text-secondary);margin-top:4px}.token-actions {display:flex;gap:8px;margin-top:2px}.btn-small {padding:6px 12px;font-size:12px;min-width:auto}.copy-success {animation:wiggle 0.6s ease-in-out;background-color:var(--success-color) !important}@keyframes wiggle {0% {transform:rotate(0deg) scale(1)}25% {transform:rotate(-3deg) scale(1.05)}50% {transform:rotate(3deg) scale(1.1)}75% {transform:rotate(-2deg) scale(1.05)}100% {transform:rotate(0deg) scale(1)}}.btn-copying {animation:pulse 1s infinite}@keyframes pulse {0% {transform:scale(1)}50% {transform:scale(1.02)}100% {transform:scale(1)}}.hidden {display:none !important}.text-center {text-align:center}@media (max-width:768px) {.container {padding:16px}.header {padding:30px 20px}.header h1 {font-size:2rem}.features {flex-direction:column;align-items:center}.section {padding:20px}.status-check {flex-direction:column;align-items:center}.status-check input {margin-bottom:12px;width:100%}.load-controls {flex-direction:column;align-items:center}.load-controls input {margin-bottom:12px;width:100%}.results-table {font-size:14px}.results-table th,.results-table td {padding:8px}.job-status {margin-top:15px}}.job-status {background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;margin:20px 0;box-shadow:var(--shadow)}.job-status h3 {margin-bottom:15px;color:var(--primary-color)}.job-status p {margin:8px 0}.job-status code {background:#f1f5f9;padding:2px 6px;border-radius:4px;font-family:'SF Mono',Monaco,Inconsolata,'Roboto Mono',monospace;font-size:14px}.results-summary {background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;margin-bottom:20px;box-shadow:var(--shadow)}.results-summary h3 {margin-bottom:15px;color:var(--primary-color)}.results-table-container {overflow-x:auto;margin-bottom:20px;border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow)}.results-table {width:100%;border-collapse:collapse;background:var(--card-background);font-size:14px}.results-table th {background:#f8fafc;border-bottom:2px solid var(--border-color);padding:12px 8px;text-align:left;font-weight:600;color:var(--text-primary);font-size:13px}.results-table td {border-bottom:1px solid var(--border-color);padding:12px 8px;vertical-align:top}.results-table tr:last-child td {border-bottom:none}.results-table tr:hover {background:#f8fafc}.status-check {display:flex;gap:10px;align-items:center;flex-wrap:wrap}.status-check input {flex:1;min-width:250px;padding:12px;border:1px solid var(--border-color);border-radius:var(--border-radius);font-size:14px}.status-check input:focus {outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgb(37 99 235 / 0.1)}.error-summary {font-weight:600;margin-bottom:10px}.error-details {margin-top:10px;border:1px solid #fecaca;border-radius:4px;background:#fef2f2}.error-details summary {padding:8px 12px;cursor:pointer;font-weight:500;background:#fee2e2;border-bottom:1px solid #fecaca}.error-details summary:hover {background:#fecaca}.error-stack {padding:12px;margin:0;background:#fefefe;font-family:'SF Mono',Monaco,Inconsolata,'Roboto Mono',monospace;font-size:12px;line-height:1.4;white-space:pre-wrap;overflow-x:auto;color:#991b1b}.error-close {position:absolute;top:10px;right:10px;background:none;border:none;font-size:20px;font-weight:bold;cursor:pointer;color:#991b1b;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.error-close:hover {background:rgba(220,38,38,0.1);border-radius:50%}.error-popup {margin-top:15px;padding:12px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#991b1b}.error-popup.hidden {display:none}.error-content {display:flex;align-items:center;justify-content:space-between}.error-text {flex:1;font-weight:500}.error-popup .error-close {position:static;margin-left:10px;background:none;border:none;font-size:18px;font-weight:bold;cursor:pointer;color:#991b1b;padding:2px 6px;border-radius:4px}.error-popup .error-close:hover {background:rgba(220,38,38,0.1)}.token-jobs-results {margin-top:20px;padding:20px;background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius)}.token-jobs-results.hidden {display:none}.job-item {padding:15px;margin-bottom:15px;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc}.job-item.completed {border-color:var(--success-color);background:#f0fdf4}.job-item.failed {border-color:var(--error-color);background:#fef2f2}.job-item.processing {border-color:var(--warning-color);background:#fffbeb}.job-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.job-id {font-family:'Monaco','Menlo',monospace;font-size:14px;background:rgba(0,0,0,0.05);padding:2px 6px;border-radius:4px}.job-status {padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase}.job-status.completed {background:var(--success-color);color:white}.job-status.failed {background:var(--error-color);color:white}.job-status.processing {background:var(--warning-color);color:white}.job-status.pending {background:var(--secondary-color);color:white}.job-details {font-size:14px;color:var(--text-secondary)}.job-actions {margin-top:10px}.job-actions .btn {margin-right:10px;padding:6px 12px;font-size:12px}.status-message.error {position:relative;padding-right:40px}.ranking-section {margin-top:30px;padding:20px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px}.ranking-section h3 {margin-bottom:10px;color:#1e40af}.ranking-controls {display:flex;flex-direction:column;gap:15px;margin:20px 0}.transport-preference {background:white;padding:15px;border-radius:8px;border:1px solid #e2e8f0}.transport-preference label {display:block;margin-bottom:8px;font-weight:500}.preference-details {margin-left:25px;margin-top:10px;display:flex;align-items:center;gap:10px}.preference-details input[type="number"] {width:80px;padding:4px 8px;border:1px solid #d1d5db;border-radius:4px}.ranking-sort-options {background:white;padding:15px;border-radius:8px;border:1px solid #e2e8f0;display:flex;align-items:center;gap:10px}.ranking-sort-options select {padding:6px 12px;border:1px solid #d1d5db;border-radius:4px;background:white}.ranked-results {margin-top:20px;padding:20px;background:#f0f9ff;border:1px solid #7dd3fc;border-radius:12px}.ranked-results h4 {margin-bottom:15px;color:#0c4a6e}.ranked-school-item {background:white;margin:10px 0;padding:15px;border-radius:8px;border-left:4px solid #3b82f6;box-shadow:0 2px 4px rgba(0,0,0,0.1)}.ranked-school-item.rank-walk {border-left-color:#10b981;background:#f0fdf4}.ranked-school-item.rank-transit {border-left-color:#3b82f6;background:#eff6ff}.ranked-school-item.rank-driving {border-left-color:#f59e0b;background:#fffbeb}.ranked-school-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.school-rank {font-size:18px;font-weight:bold;color:#1e40af;min-width:40px}.school-name {flex:1;font-weight:600;margin-left:15px}.preferred-transport {padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;text-transform:uppercase}.preferred-transport.walk {background:#d1fae5;color:#065f46}.preferred-transport.transit {background:#dbeafe;color:#1e40af}.preferred-transport.driving {background:#fef3c7;color:#92400e}.ranked-school-details {display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;font-size:14px;color:#64748b}.transport-time {display:flex;align-items:center;gap:5px}.transport-time strong {color:#1e40af}.school-preview-section {margin-top:10px}.school-preview-section .btn-small {margin-right:8px;margin-bottom:8px}.btn-small {padding:6px 12px;font-size:14px}.school-preview {margin-top:15px;padding:15px;border:1px solid #d1d5db;border-radius:8px;background-color:#f9fafb;max-height:300px;overflow-y:auto}.preview-header {margin-bottom:10px;font-weight:600}.success-text {color:#059669}.warning-text {color:#d97706;margin:0}.error-text {color:#dc2626;margin:0}.schools-list {display:grid;gap:5px}.school-item {padding:5px 10px;background-color:white;border-radius:4px;border-left:3px solid #3b82f6;font-size:14px}.help-text {font-size:14px;color:#6b7280;margin:5px 0 10px 0;line-height:1.4}.ranking-load {background:#f8fafc;padding:15px;border-radius:8px;margin:15px 0;border:1px solid #e2e8f0}.ranking-load h3 {margin-bottom:10px;color:#1e40af}.load-controls {display:flex;gap:12px}.load-controls input {flex:1}.upload-help {font-size:12px;color:#64748b;margin-top:5px}.ranking-board {background:#f0f9ff;padding:20px;border-radius:12px;border:1px solid #7dd3fc;margin:20px 0}.ranking-preferences {display:flex;flex-direction:column;gap:15px;margin-bottom:20px}.preference-row {background:white;padding:15px;border-radius:8px;border:1px solid #e2e8f0}.preference-label {display:block;margin-bottom:10px;font-size:16px}.preference-controls {display:flex;align-items:center;gap:10px;margin-left:25px}.preference-controls input[type="range"] {flex:1;max-width:200px}.preference-controls span {font-weight:bold;min-width:30px;text-align:center}.sort-controls {background:white;padding:15px;border-radius:8px;border:1px solid #e2e8f0;display:flex;align-items:center;gap:10px;margin-bottom:20px}.sort-controls select {padding:6px 12px;border:1px solid #d1d5db;border-radius:4px;background:white}.ranking-stats {display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;background:white;padding:15px;border-radius:8px;border:1px solid #e2e8f0}.stat-item {text-align:center;padding:10px;background:#f8fafc;border-radius:6px}.stat-item strong {display:block;font-size:24px;color:#1e40af}.ranking-results-board {margin-top:20px}.board-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding:15px;background:#f0f9ff;border-radius:8px;border:1px solid #7dd3fc}.ranking-board-item {background:white;margin:8px 0;padding:15px;border-radius:8px;border-left:4px solid #3b82f6;box-shadow:0 1px 3px rgba(0,0,0,0.1);display:grid;grid-template-columns:50px 1fr auto;gap:15px;align-items:center}.ranking-board-item.transport-walk {border-left-color:#10b981;background:#f0fdf4}.ranking-board-item.transport-transit {border-left-color:#3b82f6;background:#eff6ff}.ranking-board-item.transport-driving {border-left-color:#f59e0b;background:#fffbeb}.board-rank {font-size:20px;font-weight:bold;color:#1e40af;text-align:center}.board-school-info h4 {margin:0 0 5px 0;color:#1e293b}.board-school-details {font-size:14px;color:#64748b}.board-transport-badge {padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase;white-space:nowrap}.board-transport-badge.walk {background:#d1fae5;color:#065f46}.board-transport-badge.transit {background:#dbeafe;color:#1e40af}.board-transport-badge.driving {background:#fef3c7;color:#92400e}.confirm-notification {position:relative;margin-top:15px;background:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;padding:12px 16px;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:1000;max-width:100%}.confirm-content {display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}.confirm-icon {font-size:16px;flex-shrink:0}.confirm-text {flex:1;min-width:200px;color:#856404;font-weight:500}.btn-small {padding:6px 12px;font-size:12px;min-width:auto;margin-left:4px;cursor:pointer;border:none;border-radius:4px;transition:background-color 0.2s}.btn-small.btn-primary {background-color:#28a745;color:white}.btn-small.btn-primary:hover {background-color:#218838}.btn-small.btn-secondary {background-color:#6c757d;color:white}.btn-small.btn-secondary:hover {background-color:#5a6268}.btn-small.btn-danger {background-color:#dc3545;color:white}.btn-small.btn-danger:hover {background-color:#c82333}.modal-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);display:flex;justify-content:center;align-items:center;z-index:1000;backdrop-filter:blur(5px)}.modal-content {background:white;border-radius:16px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:0 20px 40px rgba(0,0,0,0.3);animation:modalSlideIn 0.3s ease-out}@keyframes modalSlideIn {from {opacity:0;transform:translateY(-50px) scale(0.9)}to {opacity:1;transform:translateY(0) scale(1)}}.modal-header {padding:20px 24px 16px;border-bottom:1px solid #e2e8f0;background:linear-gradient(135deg,#fee2e2,#fef3c7)}.modal-header h3 {margin:0;color:#dc2626;font-size:1.2rem;text-align:center}.modal-body {padding:24px}.warning-message {background:#fef2f2;border:2px solid #fca5a5;border-radius:12px;padding:16px;text-align:center;margin-bottom:20px;animation:pulse 2s infinite}@keyframes pulse {0%,100% {transform:scale(1)}50% {transform:scale(1.02)}}.warning-icon {font-size:2rem;margin-bottom:8px}.warning-text {color:#dc2626;font-weight:bold;font-size:1.1rem;margin:0}.confirmation-details {background:#f8fafc;border-radius:8px;padding:16px;margin-bottom:20px}.confirmation-details h4 {margin:0 0 12px 0;color:#334155;font-size:1rem}.detail-item {margin-bottom:8px;padding:8px 0;border-bottom:1px solid #e2e8f0}.detail-item:last-child {border-bottom:none;margin-bottom:0}.detail-item strong {color:#475569;display:inline-block;width:80px}.detail-item span {color:#1e293b;font-family:monospace;background:#e2e8f0;padding:2px 6px;border-radius:4px}.final-question {text-align:center;font-weight:600;color:#334155;margin:0;font-size:1.05rem}.modal-footer {padding:16px 24px 24px;display:flex;gap:12px;justify-content:center}.modal-footer .btn {min-width:120px;font-weight:600}@media (max-width:768px) {.container {max-width:100%;margin:10px;padding:15px;border-radius:12px;margin-top:10px;margin-bottom:20px}.process-steps {grid-template-columns:1fr;gap:8px}.step {padding:10px 14px;font-size:0.9rem}.header {padding:30px 15px}.header h1 {font-size:1.8rem}.features {flex-direction:column;gap:8px}.feature {text-align:center}.preference-controls {flex-direction:column;align-items:flex-start;gap:8px;margin-left:0}.preference-controls input[type="range"] {width:100%;max-width:100%;margin:8px 0}.preference-controls label {font-size:14px;margin-bottom:4px}.sort-controls {flex-direction:column;align-items:flex-start;gap:12px}.sort-controls label {font-weight:bold;margin-bottom:8px}.sort-controls select {width:100%;margin-bottom:8px}}@media (min-width:1200px) {.container {max-width:1200px;padding:30px}}@media (min-width:768px) {body::before {content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="white" opacity="0.1"/><circle cx="75" cy="75" r="1" fill="white" opacity="0.05"/><circle cx="50" cy="10" r="0.5" fill="white" opacity="0.08"/><circle cx="10" cy="60" r="0.8" fill="white" opacity="0.06"/><circle cx="90" cy="30" r="1.2" fill="white" opacity="0.04"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>') repeat;pointer-events:none;z-index:-1}.container {box-shadow:0 20px 40px rgba(0,0,0,0.1),0 0 0 1px rgba(255,255,255,0.2),inset 0 1px 0 rgba(255,255,255,0.3)}}.main-nav {background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(0,0,0,0.1);position:sticky;top:0;z-index:1000;margin-bottom:20px}.nav-container {max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;height:60px}.nav-logo {font-size:1.2rem;font-weight:bold;color:var(--primary-color);text-decoration:none;display:flex;align-items:center;gap:6px}.nav-logo:hover {color:var(--primary-hover)}.nav-links {display:flex;list-style:none;gap:30px;margin:0;padding:0}.nav-link {color:var(--text-primary);text-decoration:none;font-weight:500;padding:8px 12px;border-radius:6px;transition:all 0.2s ease;position:relative;display:flex;align-items:center;gap:6px;font-size:0.95rem}.nav-link:hover,.nav-link.active {background:rgba(37,99,235,0.1);color:var(--primary-color)}.nav-link.active::after {content:'';position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);width:20px;height:2px;background:var(--primary-color);border-radius:1px}.nav-toggle {display:none;flex-direction:column;cursor:pointer;gap:4px;padding:8px}.nav-toggle span {width:25px;height:3px;background:var(--text-primary);border-radius:2px;transition:all 0.3s ease;transform-origin:center}.nav-toggle.active span:nth-child(1) {transform:rotate(45deg) translate(6px,6px)}.nav-toggle.active span:nth-child(2) {opacity:0}.nav-toggle.active span:nth-child(3) {transform:rotate(-45deg) translate(6px,-6px)}@media (max-width:768px) {.nav-toggle {display:flex}.nav-links {position:absolute;top:100%;left:0;right:0;background:rgba(255,255,255,0.98);backdrop-filter:blur(10px);display:flex;flex-direction:column;padding:20px;box-shadow:0 4px 6px rgba(0,0,0,0.1);border-radius:0 0 12px 12px;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all 0.3s ease;gap:5px;z-index:999}.nav-links.active {transform:translateY(0);opacity:1;visibility:visible}.nav-link {width:100%;text-align:center;padding:12px 16px;border-radius:8px;justify-content:center;font-size:0.9rem}.main-nav {position:relative}}.main-footer {background:rgba(30,41,59,0.95);backdrop-filter:blur(10px);color:#e2e8f0;margin-top:40px}.footer-content {max-width:1200px;margin:0 auto;padding:40px 20px 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}.footer-section h4 {color:#fff;margin-bottom:15px;font-size:1.1rem}.footer-section p,.footer-section a {color:#cbd5e1;text-decoration:none;line-height:1.6}.footer-section a:hover {color:#fff}.footer-section ul {list-style:none;padding:0;margin:0}.footer-section li {margin-bottom:8px}.footer-bottom {border-top:1px solid #475569;padding:20px;text-align:center;color:#94a3b8;max-width:1200px;margin:0 auto}.navbar {background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:12px;padding:15px 25px;margin-bottom:20px;box-shadow:0 4px 6px rgba(0,0,0,0.05)}.navbar-content {display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}.navbar-brand {font-size:1.5rem;font-weight:bold;color:var(--primary-color);text-decoration:none}.navbar-brand:hover {color:var(--primary-hover)}.navbar-menu {display:flex;list-style:none;gap:30px;margin:0;padding:0}.navbar-menu a {color:var(--text-primary);text-decoration:none;font-weight:500;padding:8px 16px;border-radius:6px;transition:all 0.2s ease}.navbar-menu a:hover,.navbar-menu a.active {background:rgba(37,99,235,0.1);color:var(--primary-color)}.navbar-toggle {display:none;background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-primary)}@media (max-width:768px) {.navbar-toggle {display:block}.navbar-menu {display:none;position:absolute;top:100%;left:0;right:0;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);flex-direction:column;padding:20px;border-radius:12px;margin-top:10px;box-shadow:0 4px 6px rgba(0,0,0,0.1)}.navbar-menu.active {display:flex}.navbar {position:relative}}.footer {background:rgba(30,41,59,0.95);backdrop-filter:blur(10px);color:#e2e8f0;padding:40px 20px 20px;border-radius:12px;margin-top:40px}.footer-content {max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-bottom:30px}.footer-section h3 {color:#fff;margin-bottom:15px;font-size:1.1rem}.footer-section p,.footer-section a {color:#cbd5e1;text-decoration:none;line-height:1.6}.footer-section a:hover {color:#fff}.footer-links {list-style:none;padding:0}.footer-links li {margin-bottom:8px}.footer-bottom {border-top:1px solid #475569;padding-top:20px;text-align:center;color:#94a3b8}.page-header {text-align:center;margin-bottom:40px;padding:30px 0}.page-header h1 {font-size:1.8rem;color:var(--text-primary);margin-bottom:10px}.page-subtitle {font-size:1.2rem;color:var(--text-secondary);margin:0}.legal-page,.contact-page,.analytics-page {max-width:900px;margin:0 auto}.legal-content {background:var(--card-background);border-radius:var(--border-radius);padding:30px;box-shadow:var(--shadow)}.legal-section {margin-bottom:30px}.legal-section h2 {color:var(--primary-color);margin-bottom:15px;font-size:1.5rem}.legal-section h3 {color:var(--text-primary);margin:20px 0 10px 0;font-size:1.2rem}.legal-section p {margin-bottom:15px;line-height:1.7}.legal-section ul {margin:15px 0;padding-left:25px}.legal-section li {margin-bottom:8px;line-height:1.6}.contact-info {background:rgba(37,99,235,0.05);padding:20px;border-radius:var(--border-radius);margin:20px 0}.contact-info p {margin-bottom:8px}.contact-content {background:var(--card-background);border-radius:var(--border-radius);padding:30px;box-shadow:var(--shadow)}.contact-grid {display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:40px}.contact-item {display:flex;align-items:flex-start;gap:15px;margin-bottom:25px}.contact-icon {font-size:1.5rem;width:40px;text-align:center}.contact-details h3 {margin-bottom:5px;color:var(--text-primary)}.contact-details small {color:var(--text-secondary);font-size:0.9rem}.contact-form {display:flex;flex-direction:column;gap:20px}.form-row {display:grid;grid-template-columns:1fr 1fr;gap:20px}.contact-form .form-group label {display:block;margin-bottom:5px;font-weight:500;color:var(--text-primary)}.contact-form input,.contact-form select,.contact-form textarea {width:100%;padding:12px;border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:16px;transition:border-color 0.2s ease}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus {outline:none;border-color:var(--primary-color)}.checkbox-label {display:flex;align-items:flex-start;gap:10px;cursor:pointer}.checkbox-label input[type="checkbox"] {width:auto;margin:0}.success-message,.error-message {padding:15px;border-radius:var(--border-radius);margin:20px 0}.success-message {background:rgba(5,150,105,0.1);color:var(--success-color);border:1px solid rgba(5,150,105,0.2)}.error-message {background:rgba(220,38,38,0.1);color:var(--error-color);border:1px solid rgba(220,38,38,0.2)}.faq-section {margin:40px 0}.faq-item {background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;margin-bottom:15px}.faq-item h3 {color:var(--primary-color);margin-bottom:10px}.support-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:20px 0}.support-item {background:var(--card-background);padding:25px;border-radius:var(--border-radius);text-align:center;box-shadow:var(--shadow)}.support-icon {font-size:2rem;margin-bottom:15px;display:block}.map-placeholder {background:var(--border-color);height:250px;border-radius:var(--border-radius);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text-secondary)}.analytics-content {background:var(--card-background);border-radius:var(--border-radius);padding:30px;box-shadow:var(--shadow)}.analytics-section {margin-bottom:40px}.analytics-section h2 {color:var(--primary-color);margin-bottom:20px;font-size:1.5rem}.stats-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:20px 0}.stat-card {background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;padding:25px;border-radius:12px;display:flex;align-items:center;gap:20px}.stat-icon {font-size:2rem;opacity:0.9}.stat-number {font-size:2rem;font-weight:bold;margin-bottom:5px}.stat-change {font-size:0.9rem;opacity:0.9}.stat-change.positive {color:#86efac}.geo-list,.transport-list {display:flex;flex-direction:column;gap:10px}.geo-item,.transport-item {display:flex;align-items:center;gap:15px;padding:10px;background:rgba(37,99,235,0.05);border-radius:var(--border-radius)}.geo-bar,.transport-bar {height:8px;background:var(--primary-color);border-radius:4px;transition:width 0.3s ease}.performance-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.performance-card {background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:25px}.performance-metrics {display:flex;flex-direction:column;gap:15px;margin-top:15px}.perf-metric {display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-color)}.perf-value {font-weight:bold;color:var(--primary-color)}.insights-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.insight-card {background:var(--card-background);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:25px}.insight-icon {font-size:2rem;margin-bottom:15px;display:block}.data-sources {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.source-item {background:rgba(37,99,235,0.05);padding:20px;border-radius:var(--border-radius)}.analytics-footer {margin-top:40px;padding-top:20px;border-top:1px solid var(--border-color);color:var(--text-secondary);font-size:0.9rem}@media (max-width:768px) {.contact-grid {grid-template-columns:1fr;gap:30px}.form-row {grid-template-columns:1fr;gap:15px}.stats-grid,.performance-grid,.insights-grid {grid-template-columns:1fr}.page-header h1 {font-size:2rem}.footer-content {grid-template-columns:1fr;gap:20px}}.extension-section {background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);border:2px solid #0ea5e9;border-radius:var(--border-radius);position:relative;overflow:hidden}.extension-section::before {content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(14,165,233,0.05) 0%,transparent 50%);animation:pulse-bg 4s ease-in-out infinite}@keyframes pulse-bg {0%,100% {opacity:0.3}50% {opacity:0.1}}.extension-info {position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}.extension-description {padding-right:20px}.extension-highlight {font-size:1.1rem;margin-bottom:20px;padding:16px 20px;background:rgba(14,165,233,0.1);border-left:4px solid #0ea5e9;border-radius:0 var(--border-radius) var(--border-radius) 0}.extension-features {display:flex;flex-direction:column;gap:12px}.feature-item {display:flex;align-items:center;gap:12px;padding:12px 0}.feature-icon {font-size:1.2rem;width:24px;text-align:center}.feature-text {flex:1;font-size:0.95rem}.extension-download {background:rgba(255,255,255,0.8);padding:24px;border-radius:var(--border-radius);border:1px solid rgba(14,165,233,0.2)}.extension-download h3 {color:var(--text-primary);margin-bottom:16px;font-size:1.2rem;font-weight:600}.download-options {display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.download-btn {display:block;text-decoration:none;padding:16px 20px;border-radius:var(--border-radius);transition:all 0.3s ease;border:2px solid transparent}.download-btn.chrome-store {background:linear-gradient(135deg,#34d399,#10b981);color:white;box-shadow:0 4px 12px rgba(16,185,129,0.3)}.download-btn.chrome-store:hover {transform:translateY(-2px);box-shadow:0 6px 20px rgba(16,185,129,0.4)}.download-btn.direct-download {background:#f8fafc;color:var(--text-primary);border-color:#e2e8f0}.download-btn.direct-download:hover {background:#f1f5f9;border-color:#cbd5e1;transform:translateY(-1px)}.download-content {display:flex;align-items:center;gap:16px}.download-icon {font-size:1.5rem;opacity:0.9}.download-text {display:flex;flex-direction:column}.download-title {font-weight:600;font-size:1rem}.download-subtitle {font-size:0.85rem;opacity:0.8}.extension-notice {background:rgba(251,191,36,0.1);border:1px solid rgba(251,191,36,0.3);border-radius:var(--border-radius);padding:16px;font-size:0.9rem}.extension-notice p {margin-bottom:8px}.extension-notice p:last-child {margin-bottom:0}@media (max-width:768px) {.extension-info {grid-template-columns:1fr;gap:20px}.extension-description {padding-right:0}.download-options {gap:10px}.download-btn {padding:14px 16px}.download-content {gap:12px}.download-icon {font-size:1.3rem}}