.hotspot-login-container{--hotspot-primary:var(--soft-blue-dark,#4a7ba7);--hotspot-primary-dark:var(--soft-blue,#6b9bd1);--hotspot-bg:var(--white,#fff);--hotspot-bg-light:var(--white,#fff);--hotspot-bg-card:var(--gray-50,#fafafa);--hotspot-text:var(--gray-900,#212121);--hotspot-text-muted:var(--gray-600,#757575);--hotspot-border:var(--gray-200,#eee);--hotspot-error:var(--accent-coral,#ff8a80);--hotspot-success:var(--accent-teal,#4db6ac)}body[data-theme=dark] .hotspot-login-container{--hotspot-primary:#00c9a7;--hotspot-primary-dark:#00a085;--hotspot-bg:#0f0f0f;--hotspot-bg-light:#1a1a1a;--hotspot-bg-card:#232323;--hotspot-text:#fff;--hotspot-text-muted:#ccc;--hotspot-border:#333;--hotspot-error:#e74c3c;--hotspot-success:#2ecc71}body[data-theme=light] .hotspot-login-container{--hotspot-primary:var(--soft-blue-dark,#4a7ba7);--hotspot-primary-dark:var(--soft-blue,#6b9bd1);--hotspot-bg:var(--white,#fff);--hotspot-bg-light:var(--white,#fff);--hotspot-bg-card:var(--gray-50,#fafafa);--hotspot-text:var(--gray-900,#212121);--hotspot-text-muted:var(--gray-600,#757575);--hotspot-border:var(--gray-200,#eee);--hotspot-error:var(--accent-coral,#ff8a80);--hotspot-success:var(--accent-teal,#4db6ac)}body[data-theme=pastel] .hotspot-login-container{--hotspot-primary:#a8d8ea;--hotspot-primary-dark:#7fb3c8;--hotspot-bg-card:#fff;--hotspot-text:#5a5a5a;--hotspot-text-muted:#8b8b8b;--hotspot-border:#e8d5d5;--hotspot-error:#ff8b94;--hotspot-success:#c7ceea}body[data-theme=ocean] .hotspot-login-container{--hotspot-primary:#4a90e2;--hotspot-primary-dark:#357abd;--hotspot-bg-card:#1e3a5f;--hotspot-text:#e3f2fd;--hotspot-text-muted:#90caf9;--hotspot-border:#1e3a5f;--hotspot-error:#ef5350;--hotspot-success:#66bb6a}body[data-theme=forest] .hotspot-login-container{--hotspot-primary:#2e7d32;--hotspot-primary-dark:#1b5e20;--hotspot-bg-card:#3d4e3d;--hotspot-text:#e8f5e9;--hotspot-text-muted:#a5d6a7;--hotspot-border:#3d4e3d;--hotspot-error:#e57373;--hotspot-success:#81c784}body[data-theme=sunset] .hotspot-login-container{--hotspot-primary:#ff6b35;--hotspot-primary-dark:#e55a2b;--hotspot-bg-card:#4d2e1f;--hotspot-text:#fff3e0;--hotspot-text-muted:#ffcc80;--hotspot-border:#4d2e1f;--hotspot-error:#ff5252;--hotspot-success:#ffb74d}body[data-theme=purple] .hotspot-login-container{--hotspot-primary:#9c27b0;--hotspot-primary-dark:#7b1fa2;--hotspot-bg-card:#3d2747;--hotspot-text:#f3e5f5;--hotspot-text-muted:#ce93d8;--hotspot-border:#3d2747;--hotspot-error:#e91e63;--hotspot-success:#ab47bc}body[data-theme=minimal] .hotspot-login-container{--hotspot-primary:#424242;--hotspot-primary-dark:#212121;--hotspot-bg-card:#fff;--hotspot-text:#212121;--hotspot-text-muted:#757575;--hotspot-border:#e0e0e0;--hotspot-error:#d32f2f;--hotspot-success:#388e3c}body[data-theme=neon] .hotspot-login-container{--hotspot-primary:#0f8;--hotspot-primary-dark:#00cc6f;--hotspot-bg-card:#252525;--hotspot-text:#fff;--hotspot-text-muted:#b0b0b0;--hotspot-border:#333;--hotspot-error:#ff0080;--hotspot-success:#0f8}body[data-theme=warm] .hotspot-login-container{--hotspot-primary:#d4a574;--hotspot-primary-dark:#b8936a;--hotspot-bg-card:#fff;--hotspot-text:#5c4a37;--hotspot-text-muted:#8b7355;--hotspot-border:#e8ddd4;--hotspot-error:#c97d60;--hotspot-success:#a67c52}.hotspot-login-container{background:var(--white);width:100%;padding:20px;scroll-margin-top:0;scroll-padding-top:0;position:relative;overflow:visible}@media (min-width:769px){.hotspot-login-container{max-width:600px;min-height:auto;margin:40px auto;padding:40px}}@media (max-width:768px){.hotspot-login-container{min-height:100vh;padding:0 16px 50vh}.form-group{margin-bottom:24px}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{z-index:10;scroll-margin-top:25vh;scroll-margin-bottom:40vh;position:relative}.form-group input:focus~*,.form-group textarea:focus~*,.form-group select:focus~*{margin-top:0}:is(.form-group:has(input:focus),.form-group:has(textarea:focus),.form-group:has(select:focus)){scroll-margin-top:20vh;scroll-margin-bottom:35vh}}.hotspot-login-container input:focus,.hotspot-login-container textarea:focus,.hotspot-login-container select:focus{scroll-margin-top:0;scroll-padding-top:0}.header{text-align:center;box-sizing:border-box;z-index:1;isolation:isolate;width:100%;margin-bottom:24px;padding:0;position:relative}.header h1{color:var(--soft-blue-dark);margin-bottom:8px;font-size:24px;font-weight:600}.header p{color:var(--gray-600);font-size:14px}.interface-name{background:var(--soft-blue-light);border-radius:var(--radius-sm);color:var(--soft-blue-dark);margin-top:-4px;padding:6px 12px;font-size:13px;font-weight:500;display:inline-block}.wifi-connect-text{text-align:center;color:var(--gray-600);margin-top:4px;margin-bottom:0;font-size:18px;font-weight:400}@media (max-width:768px){.wifi-connect-text{font-size:20px}}.interface-name-bold{color:var(--soft-blue-dark);font-style:italic;font-weight:700}.form-group{z-index:0;margin-bottom:20px;position:relative}.form-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:20px;display:grid}.form-row .form-group{margin-bottom:0}.form-group label{color:var(--gray-700);margin-bottom:8px;font-size:14px;font-weight:500;display:block}.form-group input,.form-group select{background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius-sm);width:100%;color:var(--gray-900);z-index:0;box-sizing:border-box;padding:12px 16px;font-size:15px;transition:all .2s;position:relative}.form-group input[readonly],.form-group select[readonly],.form-group textarea[readonly]{cursor:default;opacity:.8}.form-group input[tabindex="-1"]:focus,.form-group select[tabindex="-1"]:focus,.form-group textarea[tabindex="-1"]:focus{box-shadow:none!important;outline:none!important}.form-group input:focus,.form-group select:focus{border-color:var(--soft-blue);outline:none;box-shadow:0 0 0 3px #6b9dd11a}.form-group input:disabled,.form-group select:disabled{background-color:var(--gray-100);cursor:not-allowed;opacity:.6}.form-group input::placeholder{color:#666}.optional-badge{color:var(--text-muted);margin-left:6px;font-size:11px;font-weight:400;display:inline-block}.btn{background:var(--soft-blue-dark);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;width:100%;margin-top:8px;padding:14px;font-size:16px;font-weight:600;transition:all .2s}.btn:hover{background:var(--soft-blue);box-shadow:var(--shadow-medium);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.error-message{text-align:center;letter-spacing:.5px;border-radius:8px;max-width:600px;margin:30px auto;padding:20px 24px;font-size:18px;font-weight:700;display:none;box-shadow:0 4px 12px #f443364d;color:#c62828!important;background:#ffebee!important;border:3px solid #f44336!important}.error-message.show{display:block}.loading{text-align:center;color:var(--text-muted);padding:20px;display:none}.loading.show{display:block}.form-container{opacity:0;z-index:0;clear:both;isolation:isolate;border-top:none;margin-top:0;padding-top:0;transition:opacity .3s ease-in-out;display:none;position:relative}.form-container.active{opacity:1;display:block}.form-type-selector{margin-bottom:24px}.form-type-selector select{width:100%}.hidden{display:none!important}.required-badge{color:var(--error);margin-left:6px;font-size:11px;font-weight:400;display:inline-block}.checkbox-group{background:var(--gray-50);border-radius:var(--radius-sm);border:1px solid var(--gray-200);margin:20px 0;padding:16px}.checkbox-group label{cursor:pointer;color:var(--text);align-items:flex-start;margin-bottom:0;font-size:14px;display:flex}.checkbox-group input[type=checkbox]{cursor:pointer;flex-shrink:0;width:18px;height:18px;margin-top:2px;margin-right:10px}.logo-container{text-align:center;box-sizing:border-box;clear:both;z-index:1;isolation:isolate;justify-content:center;align-items:center;width:100%;min-height:80px;margin-bottom:4px;padding:0;display:flex;position:relative;overflow:hidden}.logo-img{object-fit:contain;vertical-align:middle;z-index:1;flex-shrink:0;width:auto;max-width:200px;height:auto;max-height:80px;margin:0;display:block;position:relative}@media (max-width:768px){.logo-container{min-height:100px;margin-top:-20px;margin-bottom:8px;padding-top:0}.logo-img{width:auto;max-width:280px;height:auto;max-height:120px}.hotspot-login-container{margin-top:0}.wifi-connect-text{margin-top:4px}}@media (min-width:481px) and (max-width:1024px){.hotspot-login-container{max-width:500px;padding:40px}.header h1{font-size:28px}.form-group input,.form-group select{padding:14px 18px;font-size:16px}.btn{padding:16px;font-size:17px}}@media (max-width:480px){.hotspot-login-container{border-radius:var(--radius-md);padding:24px}.header h1{font-size:20px}.form-row{grid-template-columns:1fr;gap:16px}}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.modal-overlay.show{display:flex}.modal-content{background:var(--white);border-radius:var(--radius-md);width:100%;max-width:600px;max-height:80vh;box-shadow:var(--shadow-large);position:relative;overflow-y:auto}.modal-header{border-bottom:1px solid var(--gray-200);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-header h3{color:var(--gray-900);margin:0;font-size:20px;font-weight:600}.modal-close{color:var(--gray-600);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:28px;transition:all .2s;display:flex}.modal-close:hover{background:var(--gray-100);color:var(--gray-900)}.modal-body{color:var(--gray-700);white-space:pre-wrap;padding:24px;line-height:1.6}.disclaimer-icon{opacity:.7;margin-left:8px;font-size:16px;transition:opacity .2s;display:inline-block}.disclaimer-icon:hover{opacity:1}.connecting-overlay{z-index:9999;background:#fffffff2;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-in-out fadeIn;display:flex;position:fixed;top:0;left:0}.connecting-content{text-align:center;flex-direction:column;align-items:center;gap:16px;display:flex}.connecting-spinner{border:4px solid var(--gray-200);border-top-color:var(--soft-blue);border-radius:50%;width:48px;height:48px;animation:1s linear infinite spin}.connecting-text{color:var(--soft-blue-dark);margin:0;font-size:16px;font-weight:500;animation:1.5s ease-in-out infinite pulse}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.hotspot-login-container.connecting{pointer-events:none;opacity:.7}