@media (min-width: 768px) {
body .container {max-width: 85% !important;margin-left: auto !important;margin-right: auto !important;}
@media (min-width: 1400px) {body .container {max-width: 1100px !important;}}
body .card {width: 100% !important;}
body form.desktop-two-column {display: grid !important;grid-template-columns: 3fr 2fr !important;gap: 2rem !important;align-items: start !important;}
body .desktop-two-column .left-column {display: flex !important;flex-direction: column !important;}
body .desktop-two-column .right-column {position: sticky !important;top: 2rem !important;}
body .desktop-two-column .desktop-textarea {min-height: 180px !important;}
}
@media (max-width: 767px) {
.container {max-width: 100% !important;padding: 0.75rem !important;margin: 0 !important;}
.top-nav {position: fixed !important;top: 0 !important;left: 0 !important;right: 0 !important;background: rgba(0, 0, 0, 0.95) !important;backdrop-filter: blur(10px) !important;z-index: 1000 !important;padding: 0.75rem 1rem !important;justify-content: space-between !important;}
.top-nav a {color: #fff !important;font-size: 0.9rem !important;padding: 0.5rem 1rem !important;border-radius: 20px !important;background: rgba(255, 255, 255, 0.1) !important;text-decoration: none !important;transition: all 0.3s ease !important;}
.top-nav a:hover {background: rgba(255, 255, 255, 0.2) !important;transform: scale(1.05) !important;}
.logo {margin-top: 4rem !important;text-align: center !important;padding: 1rem 0 !important;}
.logo-text {font-size: 2.5rem !important;margin-bottom: 0.5rem !important;}
.subtitle {font-size: 0.8rem !important;line-height: 1.3 !important;opacity: 0.9 !important;}
.card {margin: 1rem 0 !important;padding: 1.25rem !important;border-radius: 16px !important;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;backdrop-filter: blur(20px) !important;}
input, textarea, select {font-size: 16px !important;padding: 1rem !important;border-radius: 12px !important;border: 2px solid rgba(255, 255, 255, 0.2) !important;background: rgba(255, 255, 255, 0.1) !important;color: #fff !important;width: 100% !important;box-sizing: border-box !important;margin-bottom: 1rem !important;transition: all 0.3s ease !important;}
input:focus, textarea:focus, select:focus {border-color: #4CAF50 !important;background: rgba(255, 255, 255, 0.15) !important;outline: none !important;box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.3) !important;}
textarea {min-height: 120px !important;resize: vertical !important;line-height: 1.5 !important;}
button, .button-link {min-height: 48px !important;padding: 1rem 1.5rem !important;font-size: 1rem !important;border-radius: 12px !important;border: none !important;background: linear-gradient(135deg, #4CAF50, #45a049) !important;color: white !important;font-weight: 600 !important;cursor: pointer !important;transition: all 0.3s ease !important;width: 100% !important;margin: 0.5rem 0 !important;display: flex !important;align-items: center !important;justify-content: center !important;text-decoration: none !important;}
button:hover, .button-link:hover {transform: translateY(-2px) !important;box-shadow: 0 6px 20px rgba(76, 175, 80, 0.4) !important;}
button:active, .button-link:active {transform: translateY(0) !important;}
.options-grid {display: grid !important;grid-template-columns: 1fr !important;gap: 0.75rem !important;margin: 1rem 0 !important;}
.option-card {padding: 1rem !important;border-radius: 12px !important;background: rgba(255, 255, 255, 0.1) !important;border: 2px solid rgba(255, 255, 255, 0.2) !important;cursor: pointer !important;transition: all 0.3s ease !important;min-height: 48px !important;display: flex !important;align-items: center !important;justify-content: center !important;}
.option-card:hover {background: rgba(255, 255, 255, 0.15) !important;border-color: #4CAF50 !important;transform: scale(1.02) !important;}
.security-badge {background: rgba(76, 175, 80, 0.2) !important;border: 1px solid rgba(76, 175, 80, 0.4) !important;border-radius: 12px !important;padding: 1rem !important;margin: 1rem 0 !important;display: flex !important;align-items: center !important;gap: 0.75rem !important;}
.security-icon {font-size: 1.5rem !important;}
.security-subtitle {font-size: 0.8rem !important;opacity: 0.8 !important;margin-top: 0.25rem !important;}
.footer {font-size: 0.7rem !important;line-height: 1.4 !important;padding: 1.5rem 0 !important;text-align: center !important;}
.footer-link {color: #4CAF50 !important;text-decoration: none !important;margin: 0 0.25rem !important;}
.error-alert, .warning-box {padding: 1rem !important;border-radius: 12px !important;margin: 1rem 0 !important;font-size: 0.9rem !important;line-height: 1.4 !important;}
.error-alert {background: rgba(244, 67, 54, 0.2) !important;border: 1px solid rgba(244, 67, 54, 0.4) !important;color: #ffcdd2 !important;}
.warning-box {background: rgba(255, 193, 7, 0.2) !important;border: 1px solid rgba(255, 193, 7, 0.4) !important;color: #fff3c4 !important;}
.css-tabs {margin: 1rem 0 !important;}
.tab-label {padding: 0.75rem 1rem !important;font-size: 0.9rem !important;border-radius: 8px 8px 0 0 !important;min-height: 44px !important;display: flex !important;align-items: center !important;justify-content: center !important;}
.css-tabs #tab1:checked ~ .tab-panels #panel1,
.css-tabs #tab2:checked ~ .tab-panels #panel2 {
    display: block !important;
}
.qr-container {text-align: center !important;padding: 1rem !important;background: rgba(255, 255, 255, 0.95) !important;border-radius: 12px !important;margin: 1rem 0 !important;}
.copy-button {background: rgba(33, 150, 243, 0.8) !important;color: white !important;border: none !important;padding: 0.5rem 1rem !important;border-radius: 8px !important;font-size: 0.8rem !important;margin-top: 0.5rem !important;min-height: 40px !important;}
}
@media (max-width: 480px) {
.logo-text {font-size: 2rem !important;}
.subtitle {font-size: 0.75rem !important;}
.card {padding: 1rem !important;margin: 0.75rem 0 !important;}
.container {padding: 0.5rem !important;}
.options-grid {grid-template-columns: 1fr !important;}
}
@media screen and (max-width: 1024px) {
body .container {max-width: 80% !important;}
body .card {padding: 1.5rem !important;}
}