:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg-gradient:linear-gradient(135deg, #eef4ff 0%, #e0eaff 100%);--card-bg:#fff;--text-primary:#111827;--text-secondary:#4b5563;--primary-color:#007bff;--primary-hover:#0069d9;--border-color:#e5e7eb;--focus-ring:#007bff40;--shadow-premium:0 25px 50px -12px #00000014}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-gradient);min-height:100vh;color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;justify-content:center;align-items:center;display:flex}#root{justify-content:center;align-items:center;width:100%;min-height:100vh;padding:20px;display:flex}.landing-container{flex-direction:column;align-items:center;width:100%;max-width:540px;margin:0 auto;padding:20px 10px;display:flex}.header{text-align:center;flex-direction:column;align-items:center;margin-bottom:28px;display:flex}.logo{object-fit:contain;height:60px;margin-bottom:24px}.title{color:#111827;letter-spacing:-.5px;margin-bottom:8px;font-size:32px;font-weight:700}.subtitle{color:#6b7280;font-size:16px;font-weight:400}.card{background:var(--card-bg);width:100%;box-shadow:var(--shadow-premium);border:1px solid #e5e7eb80;border-radius:28px;padding:40px}.form-group{flex-direction:column;margin-bottom:24px;display:flex}.form-label{color:#1f2937;align-items:center;margin-bottom:8px;font-size:15px;font-weight:600;display:flex}.required-star{color:#ef4444;margin-left:4px}.input-container{align-items:center;display:flex;position:relative}.input-icon{color:#9ca3af;pointer-events:none;justify-content:center;align-items:center;width:20px;height:20px;display:flex;position:absolute;left:18px}.form-input,.form-select{color:#1f2937;background-color:#fff;border:1px solid #e5e7eb;border-radius:50px;outline:none;width:100%;padding:14px 16px 14px 48px;font-family:inherit;font-size:15px;transition:all .2s}.form-select{appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-position:right 20px center;background-repeat:no-repeat;background-size:16px;padding-right:48px}.form-input::placeholder{color:#9ca3af}.form-input:focus,.form-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px var(--focus-ring);background-color:#fff}.form-input.error,.form-select.error{border-color:#ef4444;box-shadow:0 0 0 4px #ef44441a}.error-text{color:#ef4444;margin-top:6px;padding-left:16px;font-size:13px}.submit-btn{color:#fff;background-color:var(--primary-color);cursor:pointer;border:none;border-radius:50px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:8px;padding:16px;font-size:16px;font-weight:600;transition:all .2s;display:flex;box-shadow:0 4px 12px #0070f333}.submit-btn:hover{background-color:var(--primary-hover);transform:translateY(-1px);box-shadow:0 6px 16px #0070f34d}.submit-btn:active{transform:translateY(0)}.btn-icon{stroke-width:2.5px;width:18px;height:18px}.success-container{text-align:center;flex-direction:column;align-items:center;padding:20px 0;animation:.4s ease-out fadeIn;display:flex}.success-icon-wrap{color:#10b981;background-color:#ecfdf5;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin-bottom:20px;display:flex;box-shadow:0 10px 15px -3px #10b9811a}.success-title{color:#065f46;margin-bottom:8px;font-size:22px;font-weight:700}.success-subtitle{color:#047857;margin-bottom:24px;font-size:14px}.success-details{text-align:left;background-color:#f9fafb;border:1px solid #f3f4f6;border-radius:16px;width:100%;margin-bottom:24px;padding:16px}.detail-row{justify-content:space-between;margin-bottom:8px;font-size:14px;display:flex}.detail-row:last-child{margin-bottom:0}.detail-label{color:#6b7280;font-weight:500}.detail-value{color:#1f2937;font-weight:600}.reset-btn{color:#4b5563;cursor:pointer;background:0 0;border:1px solid #d1d5db;border-radius:50px;padding:10px 24px;font-size:14px;font-weight:500;transition:all .2s}.reset-btn:hover{color:#1f2937;background-color:#f9fafb;border-color:#9ca3af}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (width<=480px){.card{border-radius:24px;padding:24px}.title{font-size:26px}.form-input,.form-select{padding:12px 16px 12px 44px}.input-icon{left:14px}}.button-group{gap:12px;width:100%;display:flex}.toggle-btn{color:#4b5563;cursor:pointer;background-color:#fff;border:1px solid #e5e7eb;border-radius:50px;flex:1;padding:12px 16px;font-family:inherit;font-size:15px;font-weight:500;transition:all .2s}.toggle-btn:hover{background-color:#f9fafb;border-color:#d1d5db}.toggle-btn.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color);box-shadow:0 4px 12px #0070f333}.toggle-btn.error{border-color:#ef4444;box-shadow:0 0 0 4px #ef44441a}.subjects-grid{flex-direction:column;gap:12px;width:100%;display:flex}.subject-card{color:#1f2937;background-color:#fff;border:1px solid #f3f4f6;border-radius:16px;align-items:center;padding:16px;text-decoration:none;transition:all .2s;display:flex;box-shadow:0 2px 8px #00000005}.subject-card:hover{border-color:#e5e7eb;transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.subject-icon-wrap{border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;margin-right:16px;display:flex}.subject-emoji{font-size:24px}.subject-text-content{flex-direction:column;flex:1;display:flex}.subject-name{color:#111827;margin-bottom:2px;font-size:16px;font-weight:700}.subject-subtitle{color:#6b7280;font-size:13px}.subject-arrow{color:#d1d5db;width:20px;height:20px;transition:transform .2s,color .2s}.subject-card:hover .subject-arrow{color:#9ca3af;transform:translate(4px)}