body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;min-height:100vh}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#1f2937}::-webkit-scrollbar-thumb{background:#4b5563;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#6b7280}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.text-center{text-align:center}.hidden{display:none}.animate-spin{animation:spin 1s linear infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.btn{border-radius:.5rem;font-weight:500}.btn-primary{background:linear-gradient(135deg,#3b82f6,#06b6d4)}.btn-primary:hover{background:linear-gradient(135deg,#2563eb,#0891b2)}.btn-secondary{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#4b556380;color:#fff}.btn-secondary:hover{background:#4b5563b3}.btn-disabled{background:#4b556380;color:#9ca3af;cursor:not-allowed}.btn-disabled:hover{transform:none}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}@media (min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.dead-zone-blocker{background:#0000;height:80px;left:0;pointer-events:all;position:absolute;top:0;width:80px;z-index:10}.login-success{align-items:center;background:#22c55e1a;border:1px solid #22c55e4d;border-radius:.5rem;display:flex;gap:.75rem;margin-bottom:1.5rem;padding:1rem}.login-success-icon{color:#22c55e;flex-shrink:0}.login-success-text{color:#22c55e;font-size:.875rem}.login-password-field{align-items:center;display:flex;position:relative}.login-password-toggle{align-items:center;background:none;border:none;color:#9ca3af;cursor:pointer;display:flex;justify-content:center;padding:0;position:absolute;right:.75rem;transition:color .2s ease}.login-password-toggle:hover{color:#d1d5db}.password-strength{margin-top:.5rem}.password-strength-bar{border-radius:1.5px;height:3px;margin-bottom:.25rem;transition:all .3s ease}.password-strength-text{font-size:.75rem;font-weight:500;transition:color .3s ease}.password-mismatch{color:#ef4444;font-size:.75rem;font-weight:500;margin-top:.5rem}.login-mode-switch{margin-top:1.5rem;text-align:center}.login-mode-switch p{color:#9ca3af;font-size:.875rem}.login-mode-link{background:none;border:none;color:#3b82f6;cursor:pointer;font-weight:500;text-decoration:none;transition:color .2s ease}.login-mode-link:hover{color:#2563eb;text-decoration:underline}.login-password-field .login-input{padding-right:2.5rem}.mobile-signup-container{align-items:center;background:#07080c;color:#fff;display:flex;justify-content:center;min-height:100vh;padding:1rem}.mobile-signup-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#111827cc;border:1px solid #4b55634d;border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;max-width:400px;padding:1.5rem;width:100%}.mobile-header{display:flex;justify-content:flex-start;margin-bottom:1rem}.mobile-back-btn{align-items:center;background:#4b556380;border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;justify-content:center;padding:.5rem;transition:background .3s ease}.mobile-back-btn:hover{background:#4b5563b3}.mobile-signup-header{margin-bottom:2rem;text-align:center}.mobile-logo{align-items:center;display:flex;gap:.75rem;justify-content:center;margin-bottom:1.5rem}.mobile-logo .logo-icon-overlap__phone{fill:url(#phone-gradient-mobile)}.mobile-logo .logo-icon-overlap__arrow{fill:url(#phone-gradient-mobile);opacity:.8}.mobile-logo-text h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#3b82f6,#06b6d4);-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:700}.mobile-title{color:#fff;font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.mobile-subtitle{color:#9ca3af;font-size:.875rem}.mobile-form{display:flex;flex-direction:column;gap:1rem}.mobile-error{align-items:center;background:#ef44441a;border:1px solid #ef44444d;border-radius:.5rem;color:#ef4444;display:flex;font-size:.875rem;gap:.5rem;padding:.75rem}.mobile-error-icon{flex-shrink:0}.mobile-success{align-items:center;background:#22c55e1a;border:1px solid #22c55e4d;border-radius:.5rem;color:#22c55e;display:flex;font-size:.875rem;gap:.5rem;padding:.75rem}.mobile-success-icon{flex-shrink:0}.mobile-success-content{padding:2rem 0;text-align:center}.mobile-success-icon-large{align-items:center;display:flex;height:4rem;justify-content:center;margin:0 auto 1.5rem;width:4rem}.mobile-success-icon-large .logo-icon-overlap__arrow,.mobile-success-icon-large .logo-icon-overlap__phone{fill:url(#phone-gradient-mobile);height:3rem;width:3rem}.mobile-success-icon-large .logo-icon-overlap__arrow{opacity:.8}.mobile-success-message{color:#d1d5db;font-size:1rem;margin-bottom:1rem}.mobile-redirect-notice{color:#9ca3af;font-size:.875rem;font-style:italic}.mobile-field{display:flex;flex-direction:column;gap:.5rem}.mobile-label{color:#d1d5db;font-size:.875rem;font-weight:500}.mobile-input{background:#1f2937b3;border:1px solid #4b556380;border-radius:.5rem;color:#fff;font-size:1rem;padding:.75rem;transition:all .3s ease}.mobile-input:focus{background:#1f2937e6;border-color:#3b82f6;outline:none}.mobile-input::placeholder{color:#9ca3af}.mobile-password-field{align-items:center;display:flex;position:relative}.mobile-password-field .mobile-input{padding-right:2.5rem}.mobile-password-toggle{align-items:center;background:none;border:none;color:#9ca3af;cursor:pointer;display:flex;justify-content:center;padding:0;position:absolute;right:.75rem;transition:color .2s ease}.mobile-password-toggle:hover{color:#d1d5db}.mobile-password-strength{margin-top:.5rem}.mobile-password-strength-bar{border-radius:1.5px;height:3px;margin-bottom:.25rem;transition:all .3s ease}.mobile-password-strength-text{font-size:.75rem;font-weight:500;transition:color .3s ease}.mobile-password-mismatch{color:#ef4444;font-size:.75rem;font-weight:500;margin-top:.25rem}.mobile-button{align-items:center;background:linear-gradient(135deg,#3b82f6,#06b6d4);border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;margin-top:.5rem;padding:.875rem;transition:all .3s ease;width:100%}.mobile-button:hover:not(:disabled){background:linear-gradient(135deg,#2563eb,#0891b2);transform:translateY(-2px)}.mobile-button:disabled{background:#4b556380;color:#9ca3af;cursor:not-allowed;transform:none}.mobile-button-spinner{animation:spin 1s linear infinite;border:2px solid #0000;border-radius:50%;border-top-color:currentcolor;height:1rem;width:1rem}.mobile-help{margin-top:1rem;text-align:center}.mobile-help p{color:#9ca3af;font-size:.875rem}.mobile-link{background:none;border:none;color:#3b82f6;cursor:pointer;font-weight:500;text-decoration:none;transition:color .2s ease}.mobile-link:hover{color:#2563eb;text-decoration:underline}.mobile-footer{border-top:1px solid #4b55634d;margin-top:2rem;padding-top:1rem;text-align:center}.mobile-footer p{color:#6b7280;font-size:.75rem}@media (max-width:480px){.mobile-signup-container{padding:.5rem}.mobile-signup-card{padding:1rem}.mobile-title{font-size:1.125rem}}.device-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;display:flex;flex-direction:column;height:100%;overflow:hidden;position:relative;transition:all .3s ease}.device-card-disabled:hover{border-color:#ffffff14;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;transform:none}.device-card-disabled .device-card-body,.device-card-disabled .device-card-footer,.device-card-disabled .device-card-header{pointer-events:none}.device-card-overlay{align-items:center;background:#0000008c;border-radius:1rem;bottom:0;display:flex;justify-content:center;left:0;pointer-events:auto;position:absolute;right:0;top:0;z-index:10}.payment-required-button{background:linear-gradient(135deg,#fbbf24,#f59e0b);border:1px solid #fbbf244d;border-radius:.625rem;box-shadow:0 4px 12px #fbbf244d;color:#1a1a1f;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:600;padding:.75rem 1.5rem;pointer-events:auto;transition:all .3s ease}.payment-required-button:hover{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 8px 20px #fbbf2466;transform:translateY(-2px)}.device-card:hover{border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff0a,0 20px 40px #0009,0 8px 20px #0006,0 0 30px #5c60ff33;transform:translateY(-5px)}.device-card-header{border-bottom:1px solid #ffffff0a;display:flex;flex-direction:column;gap:.75rem;padding:1rem 1.25rem;position:relative}.device-card:before{background:linear-gradient(90deg,#5c60ff,#8b5cf6);content:"";height:3px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.device-card:hover:before{opacity:1}.device-info{align-items:center;display:flex;gap:.75rem}.device-icon{border-radius:.625rem;box-shadow:0 4px 10px #0003;height:1.75rem;padding:.375rem;transition:all .3s ease;width:1.75rem}.device-card:hover .device-icon{box-shadow:0 6px 15px #5c60ff4d}.device-details{text-align:left}.device-name{font-size:1rem;font-weight:700;margin:0 0 .2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-model{color:#a1a8b3;font-size:.8125rem;margin:0}.status-badge{align-items:center;align-self:flex-end;display:inline-flex;font-size:.5625rem;padding:.3rem .5rem;white-space:nowrap}.status-online{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.status-online:before{animation:pulse 2s infinite;background:#34d399;border-radius:50%;box-shadow:0 0 0 2px #10b9814d;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}.status-offline{background:#ef444426;border:1px solid #ef44444d;color:#f87171}.status-offline:before{background:#f87171;border-radius:50%;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}.status-streaming-only{background:#3b82f626;border:1px solid #3b82f64d;color:#60a5fa}.status-streaming-only:before{animation:pulse 2s infinite;background:#60a5fa;border-radius:50%;box-shadow:0 0 0 2px #3b82f64d;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}.status-unknown{background:#ef444426;border:1px solid #ef44444d;color:#f87171}.status-unknown:before{background:#f87171;border-radius:50%;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}@keyframes pulse{0%{box-shadow:0 0 0 0 #10b98166;transform:scale(.95)}70%{box-shadow:0 0 0 6px #10b98100;transform:scale(1)}to{box-shadow:0 0 0 0 #10b98100;transform:scale(.95)}}@keyframes pulse-blue{0%{box-shadow:0 0 0 0 #3b82f666;transform:scale(.95)}70%{box-shadow:0 0 0 6px #3b82f600;transform:scale(1)}to{box-shadow:0 0 0 0 #3b82f600;transform:scale(.95)}}.status-streaming-only:before{animation:pulse-blue 2s infinite}.status-reconnecting{animation:pulse-orange 2s ease-in-out infinite;background:#fb923c26;border:1px solid #fb923c4d;color:#fb923c}.status-reconnecting:before{animation:pulse-orange 2s infinite;background:#fb923c;border-radius:50%;box-shadow:0 0 0 2px #fb923c4d;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}@keyframes pulse-orange{0%{box-shadow:0 0 0 0 #fb923c66;transform:scale(.95)}70%{box-shadow:0 0 0 6px #fb923c00;transform:scale(1)}to{box-shadow:0 0 0 0 #fb923c00;transform:scale(.95)}}.device-card-body{display:flex;flex:1 1;flex-direction:column;gap:1rem;padding:1rem 1.25rem}.streaming-indicator{align-items:center;background:#3b82f61a;border:1px solid #3b82f633;border-radius:.625rem;color:#60a5fa;display:flex;font-size:.8125rem;font-weight:600;gap:.625rem;padding:.625rem .875rem}.streaming-dot{background:#60a5fa;border-radius:50%;height:.5rem;position:relative;width:.5rem}.streaming-dot:before{animation:stream-pulse 1.5s cubic-bezier(.4,0,.6,1) infinite;background:#3b82f666;border-radius:50%;content:"";height:.75rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:.75rem}@keyframes stream-pulse{0%,to{opacity:0;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.6)}}.streaming-text{animation:stream-text-pulse 2s ease infinite}@keyframes stream-text-pulse{0%,to{opacity:1}50%{opacity:.7}}.device-stats,.stat-row{display:flex;flex-direction:column;gap:.75rem}.stat-item{border-radius:.625rem;gap:.625rem}.device-stat-label{color:#a1a8b3;font-size:.625rem;line-height:1.2;margin-bottom:.25rem}.device-stat-value{color:#e5e7eb;font-size:1rem;font-weight:600;line-height:1.2}.device-card-meta{border-top:1px solid #ffffff0a;display:flex;flex-direction:column;gap:.625rem;margin-top:auto;padding-top:.75rem}.device-card-meta-item{align-items:center;color:#a1a8b3;display:flex;font-size:.6875rem;gap:.5rem}.device-card-meta-label{color:#a1a8b3;flex-shrink:0}.device-card-meta-value{color:#e5e7eb;flex-shrink:0;font-weight:500}.device-card-footer{border-top:1px solid #ffffff0a;display:flex;flex-wrap:wrap;gap:.75rem;padding:1rem 1.25rem}.terminate-button{align-items:center;background:linear-gradient(135deg,#dc2626,#b91c1c);border:none;border-radius:.625rem;box-shadow:0 4px 12px #dc26264d;color:#fff;cursor:pointer;display:flex;flex:1 1;font-size:.8125rem;font-weight:600;gap:.5rem;justify-content:center;min-width:120px;padding:.625rem 1rem;transition:all .3s ease}.terminate-button:hover:not(:disabled){background:linear-gradient(135deg,#b91c1c,#991b1b);box-shadow:0 8px 20px #dc262666;transform:translateY(-2px)}.terminate-button:disabled{cursor:not-allowed;opacity:.5}.terminate-button-icon{align-items:center;background:linear-gradient(135deg,#dc2626,#b91c1c);border:none;border-radius:.625rem;box-shadow:0 4px 12px #dc26264d;color:#fff;cursor:pointer;display:flex;height:40px;justify-content:center;min-width:40px;padding:.625rem;transition:all .3s ease}.terminate-button-icon:hover:not(:disabled){background:linear-gradient(135deg,#b91c1c,#991b1b);box-shadow:0 8px 20px #dc262666;transform:translateY(-2px)}.terminate-button-icon:disabled{cursor:not-allowed;opacity:.5}.modal-overlay{background-color:#00000080}.modal-content{animation:scaleIn .2s ease-out;background-color:#fff;border-radius:.625rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-width:400px;padding:1.5rem}.status-terminated{background:#dc262626;border:1px solid #dc26264d;color:#f87171}.status-terminated:before{background:#f87171;border-radius:50%;content:"";display:inline-block;height:.5rem;margin-right:.5rem;width:.5rem}.view-button{align-items:center;border:none;border-radius:.625rem;cursor:pointer;display:flex;flex:1 1;font-size:.8125rem;font-weight:600;gap:.5rem;justify-content:center;padding:.625rem 1rem;transition:all .3s ease}.view-button.btn-primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.view-button.btn-primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.view-button.btn-warning{background:linear-gradient(135deg,#fb923c,#f97316);box-shadow:0 4px 12px #f973164d;color:#fff}.view-button.btn-warning:hover{background:linear-gradient(135deg,#fb923c,#ea580c);box-shadow:0 8px 20px #f9731666;transform:translateY(-2px)}.view-button:disabled{cursor:not-allowed;opacity:.5;transform:none!important}.view-button:disabled:hover{box-shadow:0 4px 12px #5c60ff4d;transform:none!important}.access-message{align-items:center;background:#fb923c1a;border:1px solid #fb923c33;border-radius:.625rem;color:#fb923c;display:flex;font-size:.8125rem;font-weight:600;justify-content:center;padding:.625rem .875rem;text-align:center}@media (max-width:768px){.device-card-header{align-items:flex-start;flex-direction:column;gap:1rem}.status-badge{align-self:flex-start}.stat-row{grid-template-columns:1fr}}@media (max-width:480px){.device-card-body,.device-card-footer,.device-card-header{padding:1.25rem}.device-name{font-size:1rem}.device-model{font-size:.8125rem}.device-card-meta{gap:.5rem}.device-card-meta-item{font-size:.75rem}}.device-viewer{background:#07080c;color:#e5e7eb;display:flex;flex-direction:column;min-height:100vh;position:relative}.device-viewer:before{background:url(https://www.transparenttextures.com/patterns/asfalt-light.png) repeat;content:"";inset:0;opacity:.02;position:absolute;z-index:-1}.viewer-header{animation:slideDown .6s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;margin-bottom:2.5rem;margin-left:auto;margin-right:auto;max-width:1200px;position:relative;top:1.5rem;transition:all .3s ease;width:calc(100% - 3rem);z-index:100}.viewer-header:hover{box-shadow:inset 0 1px 0 #ffffff05,0 15px 40px #000000b3,0 8px 16px #00000080,0 0 30px #5c60ff33}.viewer-header-content{align-items:center;display:flex;justify-content:space-between;padding:1rem 2rem;width:100%}.header-left{gap:2rem}.back-button,.header-left{align-items:center;display:flex}.back-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.75rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;gap:.5rem;overflow:hidden;padding:.75rem 1.5rem;position:relative;transition:all .3s ease}.back-button:before{background:linear-gradient(90deg,#0000,#ffffff26,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.back-button:hover:before{left:100%}.back-button:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.device-info .device-name{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fff,#a5a5a5);-webkit-background-clip:text;color:#e5e7eb;font-size:1.25rem;font-weight:700;margin:0}.device-info .device-subtitle{color:#a1a8b3;font-size:.875rem;margin:.25rem 0 0}.header-right{gap:1rem}.header-right,.help-button{align-items:center;display:flex}.help-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.75rem;color:#e5e7eb;cursor:pointer;justify-content:center;overflow:hidden;padding:.75rem;position:relative;transition:all .3s ease}.help-button:hover{background:#5c60ff33;border-color:#5c60ff4d;transform:translateY(-2px)}.help-button.help-glow{animation:help-pulse 2s infinite;box-shadow:0 0 0 2px #5c60ff66,0 0 20px #5c60ff99,0 4px 12px #5c60ff66}@keyframes help-pulse{0%,to{box-shadow:0 0 0 2px #5c60ff66,0 0 20px #5c60ff99,0 4px 12px #5c60ff66}50%{box-shadow:0 0 0 3px #5c60ff99,0 0 30px #5c60ffcc,0 6px 16px #5c60ff99}}.connection-status{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #0000;border-radius:.75rem;display:flex;font-size:.875rem;font-weight:600;gap:.75rem;padding:.75rem 1rem;transition:all .3s ease}.connection-status .status-dot{border-radius:50%;height:.5rem;position:relative;width:.5rem}.status-connected{background:#22c55e26;border-color:#22c55e4d;color:#22c55e}.status-connected .status-dot{animation:pulse-green 2s infinite;background:#22c55e;box-shadow:0 0 0 2px #22c55e4d}.status-encrypted{background:#3b82f626;border-color:#3b82f64d;color:#3b82f6}.status-e2ee,.status-encrypted svg{color:#3b82f6}.status-e2ee{background:#3b82f626;border-color:#3b82f64d}.status-e2ee svg{color:#3b82f6}.status-establishing{background:#fbbf2426;border-color:#fbbf244d;color:#fbbf24}.status-establishing svg{color:#fbbf24}.fps-counter{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.75rem;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006;display:flex;font-size:.875rem;font-weight:600;padding:.75rem 1rem;transition:all .3s ease}.fps-value{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace;font-size:.8rem;font-weight:700;letter-spacing:.5px;text-shadow:0 1px 2px #0006}.fps-value.fps-excellent{color:#22c55e}.fps-value.fps-good{color:#3b82f6}.fps-value.fps-fair{color:#f59e0b}.fps-value.fps-poor{color:#ef4444}.fps-counter:has(.fps-value.fps-excellent){background:#22c55e26;border-color:#22c55e4d;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006,0 0 0 1px #22c55e33}.fps-counter:has(.fps-value.fps-good){background:#3b82f626;border-color:#3b82f64d;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006,0 0 0 1px #3b82f633}.fps-counter:has(.fps-value.fps-fair){background:#f59e0b26;border-color:#f59e0b4d;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006,0 0 0 1px #f59e0b33}.fps-counter:has(.fps-value.fps-poor){background:#ef444426;border-color:#ef44444d;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006,0 0 0 1px #ef444433}.fps-counter:hover{box-shadow:inset 0 1px 0 #ffffff05,0 6px 16px #00000080;transform:translateY(-1px)}.status-connecting{background:#fbbf2426;border-color:#fbbf244d;color:#fbbf24}.status-connecting .status-dot{animation:pulse-yellow 2s infinite;background:#fbbf24;box-shadow:0 0 0 2px #fbbf244d}.status-warning{background:#fbbf241a;border:1px solid #fbbf2433;color:#f59e0b}.status-warning .status-dot{background:#f59e0b;box-shadow:0 0 0 4px #fbbf241a}.status-disconnected,.status-error{background:#ef444426;border-color:#ef44444d;color:#ef4444}.status-disconnected .status-dot,.status-error .status-dot{background:#ef4444;box-shadow:0 0 0 2px #ef44444d}@keyframes pulse-green{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}@keyframes pulse-yellow{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}.viewer-main{flex:1 1;justify-content:center;min-height:calc(100vh - 100px);padding:2rem}.viewer-container,.viewer-main{align-items:center;display:flex}.viewer-container{flex-direction:column;gap:2rem;position:relative}.fade-in-up{animation:fadeInUp .5s ease-out forwards}.ai-panel{animation:slideInLeft .3s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006,0 0 20px #ffd70033;padding:1.5rem;right:-370px;top:50%;transform:translateY(-50%);width:350px;z-index:20}.ai-panel,.premium-badge{border-radius:1rem;position:absolute}.premium-badge{align-items:center;background:linear-gradient(135deg,gold,#ffb700);box-shadow:0 2px 10px #ffd70066;color:#000;display:flex;font-size:.75rem;font-weight:700;gap:.25rem;padding:.25rem .75rem;right:20px;top:-10px;z-index:1}.premium-icon{font-size:.875rem}.ai-panel h3{align-items:center;border-bottom:1px solid #ffffff14;color:#e5e7eb;display:flex;font-size:1.125rem;font-weight:600;justify-content:space-between;margin:0 0 1rem;padding-bottom:.75rem}.ai-panel h3 svg{color:gold;margin-right:.5rem}.ai-status{border-radius:.5rem;font-size:.75rem;font-weight:500;padding:.25rem .5rem}.ai-status.idle{background:#94a3b833;color:#cbd5e1}.ai-status.analyzing{animation:pulse-yellow 2s infinite;background:#fbbf2433;color:#fbbf24}.ai-status.active{background:#22c55e33;color:#22c55e}.ai-content{display:flex;flex-direction:column;gap:1rem}.ai-observations{background:#ffffff08;border:1px solid #ffffff0d;border-radius:.75rem;padding:1rem}.ai-label{align-items:center;color:#e5e7eb;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;margin-bottom:.75rem}.ai-label svg{color:gold}.ai-observation-text{color:#a1a8b3;font-size:.875rem;line-height:1.5}.ai-observation-text ul{margin:.5rem 0 0;padding-left:1.5rem}.ai-observation-text li{margin-bottom:.5rem}.ai-thinking{align-items:center;display:flex;gap:.5rem;justify-content:center;padding:1rem 0}.ai-thinking .dot{animation:dotPulse 1.5s infinite;background:#a1a8b3;border-radius:50%;height:.5rem;width:.5rem}.ai-thinking .dot:nth-child(2){animation-delay:.2s}.ai-thinking .dot:nth-child(3){animation-delay:.4s}@keyframes dotPulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.5)}}.ai-actions{display:flex;flex-direction:column;gap:.75rem}.ai-action-buttons{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:1fr 1fr}.ai-action-btn{background:#ffd7001a;border:1px solid #ffd70033;border-radius:.5rem;color:gold;cursor:pointer;font-size:.875rem;font-weight:600;padding:.75rem;transition:all .3s ease}.ai-action-btn:hover{background:#ffd70033;transform:translateY(-2px)}@keyframes slideInLeft{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.stats-panel{animation:slideInRight .3s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;padding:1.5rem;position:absolute;right:1rem;top:1rem;width:350px;z-index:20}@keyframes slideInRight{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.stats-panel h3{align-items:center;border-bottom:1px solid #ffffff14;color:#e5e7eb;display:flex;font-size:1.125rem;font-weight:600;gap:.5rem;margin:0 0 1rem;padding-bottom:.75rem}.stats-panel h3 svg{color:#5c60ff}.stats-grid{grid-gap:1rem;gap:1rem;grid-template-columns:1fr 1fr}.stat-item{align-items:center;background:#ffffff08;border:1px solid #ffffff0a;border-radius:.75rem;display:flex;gap:.75rem;padding:.75rem;transition:all .2s ease}.stat-item:hover{background:#ffffff0d;box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.stat-item svg{color:#5c60ff;flex-shrink:0}.stat-content{display:flex;flex-direction:column;min-width:0}.stat-label{line-height:1}.stat-value{font-size:.875rem;font-weight:600;line-height:1.2}.stat-dot{border-radius:50%;height:.5rem;margin-right:.5rem;width:.5rem}.stat-dot.error{background:#ef4444}.iphone-frame{background:linear-gradient(145deg,#1a1a1a,#000);border:2px solid #2a2a2a;border-radius:2.625rem;box-shadow:0 25px 50px #00000080,0 0 0 1px #ffffff1a,inset 0 0 0 1px #ffffff0d;height:638px;overflow:hidden;padding:.5625rem;position:relative;width:304px}.iphone-frame:hover{box-shadow:0 30px 60px #0009,0 0 0 1px #ffffff26,inset 0 0 0 1px #ffffff14,0 0 40px #5c60ff33}.iphone-screen{background:#000;border-radius:2.25rem;box-shadow:inset 0 0 20px #000c;height:100%;overflow:hidden;position:relative;width:100%}.video-canvas{cursor:crosshair;height:100%;inset:0;object-fit:cover;position:absolute;transition:all .2s ease;width:100%}.video-canvas:hover{cursor:none}.connection-overlay{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000d9;border-radius:2.25rem;display:flex;inset:0;justify-content:center;position:absolute;z-index:30}.overlay-content{color:#e5e7eb;max-width:80%;padding:2rem;text-align:center}.overlay-content .loading-spinner{animation:spin 1.2s cubic-bezier(.55,.055,.675,.19) infinite;border:3px solid #5c60ff4d;border-radius:50%;border-top-color:#5c60ff;box-shadow:0 0 20px #5c60ff66;height:3rem;margin:0 auto 2rem;width:3rem}.overlay-title{color:#e5e7eb;font-size:1.25rem;font-weight:600;margin:0 0 .75rem}.overlay-message{color:#a1a8b3;font-size:.9rem;line-height:1.6;margin:0}.reconnect-button{background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.75rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;margin-top:1.5rem;padding:.75rem 1.5rem;transition:all .3s ease}.reconnect-button:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.error-details{background:#ef44441a;border:1px solid #ef444433;border-radius:.75rem;color:#ef4444;font-size:.8rem;margin-top:1.5rem;padding:1rem;text-align:left}.error-details p{margin-bottom:.5rem}.error-details p:last-child{margin-bottom:0}.viewer-controls{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14141999;border:1px solid #ffffff08;border-radius:1rem;box-shadow:0 10px 20px #0000004d;display:flex;flex-wrap:nowrap;gap:.75rem;justify-content:center;justify-content:space-between;margin-left:auto;margin-right:auto;margin-top:-15px;padding:1rem;position:relative;width:180px;z-index:25}.viewer-container:has(.ai-panel) .viewer-controls{transform:translateX(-92.5px);transition:transform .3s ease-out;width:320px}.control-btn{align-items:center;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#ffffff08;border:1px solid #ffffff14;border-radius:1rem;box-shadow:inset 0 1px 0 #ffffff05,0 4px 12px #0006;color:#e5e7eb;cursor:pointer;display:flex;flex-shrink:0;height:52px;justify-content:center;overflow:hidden;padding:1rem;position:relative;transition:all .3s ease;width:52px}.control-btn:before{background:linear-gradient(90deg,#0000,#ffffff1a,#0000);content:"";height:100%;left:-100%;pointer-events:none;position:absolute;top:0;transition:left .5s ease;width:100%}.control-btn:hover:before{left:100%}.control-btn:hover{background:#5c60ff33;border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff05,0 8px 20px #0006;color:#fff;transform:translateY(-2px)}.control-btn.active{background:#5c60ff4d;border-color:#5c60ff80;box-shadow:inset 0 1px 0 #ffffff05,0 0 0 2px #5c60ff4d,0 4px 12px #5c60ff66;color:#60a5fa}.control-btn.premium-feature{display:none;overflow:hidden;position:relative}.control-btn.premium-feature:after{background:linear-gradient(135deg,gold,#ffb700);border-radius:50%;box-shadow:0 0 5px #ffd70099;content:"";height:12px;overflow:visible;pointer-events:none;position:absolute;right:-2px;top:-2px;width:12px;z-index:2}.control-btn.premium-feature.active{background:#ffd70033;border-color:#ffd70066;box-shadow:inset 0 1px 0 #ffffff05,0 0 0 2px #ffd70033,0 4px 12px #ffd7004d;color:gold}.control-btn[title="Toggle Keyboard Mode"].active{background:#5c60ff66;border-color:#5c60ff99}.dead-zone-blocker{background:#0000001a;border:1px dashed #fff3;opacity:0;transition:opacity .3s ease}.iphone-frame:hover .dead-zone-blocker{opacity:.3}.mobile-trackpad-container{animation:fadeInUp .5s ease-out forwards;animation-delay:.2s;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14141999;border:1px solid #ffffff0a;border-radius:1rem;box-shadow:0 10px 30px #0006;display:flex;flex-direction:column;margin-top:24px;opacity:0;padding:1.5rem;width:100%}.help-overlay{align-items:center;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000b3;display:flex;inset:0;justify-content:center;position:fixed;z-index:1000}.mobile-warning-modal{border-left:3px solid #fbbf2499}.mobile-warning-modal .help-header{border-bottom-color:#fbbf2433}.mobile-warning-modal .help-icon{filter:drop-shadow(0 0 10px rgba(251,191,36,.4));font-size:2.5rem}.help-modal{animation:slideInUp .4s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#141419f2;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1.5rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 20px 50px #000c,0 10px 30px #0009;max-width:500px;padding:2rem;position:relative;width:90%}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.help-header{align-items:center;border-bottom:1px solid #ffffff14;display:flex;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem}.help-icon{flex-shrink:0;font-size:2.5rem}.help-header h2{color:#e5e7eb;flex:1 1;font-size:1.5rem;font-weight:700;margin:0}.help-close{align-items:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.5rem;color:#e5e7eb;cursor:pointer;display:flex;flex-shrink:0;font-size:1.25rem;height:32px;justify-content:center;transition:all .3s ease;width:32px}.help-close:hover{background:#ef444433;border-color:#ef44444d;color:#ef4444}.help-body{margin-bottom:2rem}.help-body p{color:#a1a8b3;font-size:1rem;line-height:1.6;margin:0}.help-progress{align-items:center;display:flex;gap:.5rem;justify-content:center;margin-bottom:1.5rem}.progress-dot{background:#fff3;border-radius:50%;height:8px;transition:all .3s ease;width:8px}.progress-dot.active{background:#5c60ff;box-shadow:0 0 10px #5c60ff99;transform:scale(1.3)}.progress-dot.completed{background:#22c55e}.help-footer{align-items:center;display:flex;gap:1rem;justify-content:space-between}.help-nav-btn{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.75rem;color:#e5e7eb;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition:all .3s ease}.help-nav-btn:disabled{cursor:not-allowed;opacity:.5}.help-nav-btn:not(:disabled):hover{background:#5c60ff33;border-color:#5c60ff4d;transform:translateY(-2px)}.help-nav-btn.primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);border-color:#0000}.help-nav-btn.primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 4px 12px #5c60ff66}.help-skip-btn{background:#0000;border:none;color:#a1a8b3;cursor:pointer;font-size:.9rem;font-weight:500;padding:.75rem 1rem;transition:all .3s ease}.help-skip-btn:hover{color:#e5e7eb}@media (max-width:768px){.help-modal{max-width:90%;padding:1.5rem}.help-header h2{font-size:1.25rem}.help-icon{font-size:2rem}.help-body p{font-size:.9rem}.help-footer{flex-wrap:wrap}.help-nav-btn{font-size:.85rem;padding:.625rem 1.25rem}}@media (max-width:992px){.viewer-header{width:calc(100% - 2rem)}.ai-panel,.stats-panel{max-height:60vh;overflow-y:auto;position:fixed;width:320px}.stats-panel{bottom:1rem;right:1rem;top:auto}.ai-panel{right:1rem;top:5rem;transform:none}.viewer-container:has(.ai-panel){margin-right:0}.iphone-frame{height:600px;width:281px}}@media (max-width:768px){.viewer-header{margin-bottom:1rem}.viewer-header-content{gap:.5rem;justify-content:space-between;padding:.75rem 1rem}.header-left,.viewer-header-content{align-items:center;flex-direction:row;text-align:left}.header-left{flex:1 1;gap:.75rem;min-width:0}.back-button{flex-shrink:0;font-size:.8rem;gap:.25rem;padding:.5rem .75rem}.device-info{flex:1 1;min-width:0}.device-info .device-name{font-size:1rem}.device-info .device-name,.device-info .device-subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-info .device-subtitle{font-size:.75rem}.connection-status{flex-shrink:0;font-size:.65rem;gap:.35rem;padding:.4rem .5rem}.header-right{gap:.5rem}.viewer-main{padding:1rem}.iphone-frame{border-radius:2.625rem;height:638px;margin:0 auto;width:304px}.iphone-frame .video-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.viewer-controls{flex-wrap:nowrap;gap:.5rem;justify-content:space-around;margin-top:-10px;max-width:400px;padding:.5rem;width:100%}.control-btn{height:38px;padding:.5rem;width:38px}.control-btn svg{height:18px;width:18px}.ai-panel,.stats-panel{left:50%;max-height:80vh;max-width:350px;position:fixed;top:50%;transform:translate(-50%,-50%);width:90%;z-index:100}.ai-action-buttons{grid-template-columns:1fr}.mobile-trackpad-container{padding:1rem}}@media (max-width:480px){.viewer-header{top:1rem;width:calc(100% - 1.5rem)}.viewer-header-content{gap:.5rem;padding:.5rem .75rem}.header-left{gap:.5rem}.back-button{font-size:.7rem;padding:.4rem .6rem}.device-info .device-name{font-size:.9rem}.device-info .device-subtitle{font-size:.7rem}.connection-status{font-size:.6rem;gap:.3rem;padding:.35rem .45rem}.header-right{gap:.4rem}.connection-status svg{height:12px;width:12px}.viewer-main{padding:.5rem}.iphone-frame{border-radius:2.625rem;height:638px;touch-action:manipulation;width:304px}.iphone-screen{border-radius:2.25rem}.control-btn{height:36px;padding:.5rem;width:36px}.control-btn svg{height:16px;width:16px}.stats-grid{gap:.75rem;grid-template-columns:1fr}}.viewer-status-bar{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14141999;border:1px solid #ffffff14;border-radius:.75rem;box-shadow:0 4px 12px #0000004d;color:#a1a8b3;display:flex;font-size:.8rem;gap:0;justify-content:center;margin-top:1rem;min-width:280px;padding:.5rem 1rem}.status-bar-section{align-items:center;display:flex;flex-direction:column;gap:.125rem;padding:.25rem .75rem}.status-bar-divider{background:#ffffff1a;height:24px;width:1px}.status-bar-label{color:#e5e7eb;font-size:.75rem;font-weight:500}.status-bar-value{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace;font-size:.875rem;font-weight:700}.status-bar-sublabel{color:#6b7280;font-size:.625rem;letter-spacing:.5px;text-transform:uppercase}.status-bar-section.latency-low .status-bar-value{color:#22c55e}.status-bar-section.latency-medium .status-bar-value{color:#f59e0b}.status-bar-section.latency-high .status-bar-value{color:#ef4444}.status-bar-section.input-indicator{transition:all .15s ease}.status-bar-section.input-indicator.sending{background:#5c60ff33;border-radius:.375rem}.status-bar-section.input-indicator.sending .status-bar-label{color:#5c60ff}@media (max-width:768px){.viewer-status-bar{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0f111ae6;font-size:.7rem;max-width:320px;min-width:auto;padding:.375rem .5rem;width:100%}.status-bar-section{padding:.125rem .5rem}.status-bar-label{font-size:.65rem}.status-bar-value{font-size:.75rem}.status-bar-sublabel{font-size:.5rem}.status-bar-divider{height:18px}}@media (max-width:480px){.viewer-status-bar{gap:0;max-width:280px;padding:.25rem .375rem}.status-bar-section{padding:.125rem .375rem}}@keyframes glow-border{0%,to{box-shadow:0 0 5px #5c60ff80}50%{box-shadow:0 0 20px #5c60ffcc}}.video-canvas[style*="outline: 2px solid #3b82f6"]{animation:glow-border 2s ease-in-out infinite}.streaming-text{animation:pulse-text 2s ease-in-out infinite}@keyframes pulse-text{0%,to{opacity:1}50%{opacity:.7}}@media (max-width:768px){.navbar-gradient-svg{display:none}.ai-panel,.stats-panel,.viewer-header{background:#0f111af2!important;border:1px solid #ffffff1a!important}.ai-panel,.stats-panel,.viewer-controls,.viewer-header{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.viewer-controls{background:#0f111ae6!important}.control-btn{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#ffffff14!important}.viewer-header{box-shadow:0 4px 12px #0006!important}.viewer-header:hover{box-shadow:0 6px 16px #00000080!important}.iphone-frame{box-shadow:0 10px 25px #0006!important}.iphone-frame:hover{box-shadow:0 15px 35px #00000080!important}.ai-panel,.stats-panel{box-shadow:0 5px 15px #0006!important}.control-btn{box-shadow:0 2px 8px #0000004d!important}.control-btn:hover{box-shadow:0 4px 12px #0000004d!important}.back-button:before,.control-btn:before{display:none!important}.ai-status.analyzing,.ai-thinking .dot,.status-connected .status-dot,.status-connecting .status-dot{animation:none!important}.overlay-content .loading-spinner{border-width:2px!important;box-shadow:none!important}.video-canvas[style*="outline: 2px solid #3b82f6"]{animation:none!important}.control-btn.premium-feature:after{box-shadow:0 0 3px #ffd70066!important}.video-canvas{image-rendering:optimizeSpeed!important;image-rendering:-webkit-optimize-contrast!important;will-change:auto!important}.ai-panel,.stats-panel,.viewer-header{border-radius:.75rem!important}.streaming-text{animation:none!important}}@media (max-width:480px){.iphone-frame{border-radius:2.625rem!important}.iphone-screen{border-radius:2.25rem!important}.ai-panel,.control-btn,.stats-panel,.viewer-controls,.viewer-header{border-radius:.5rem!important;box-shadow:0 2px 8px #0000004d!important}.ai-panel,.stats-panel{-webkit-overflow-scrolling:touch;overflow-scrolling:touch}}@media (min-width:992px){.device-viewer{display:flex;flex-direction:row;min-height:100vh}.viewer-header{display:none}.viewer-main{align-items:stretch;display:flex;flex-direction:row;justify-content:center;min-height:100vh;padding:0;width:100%}.side-panel-left{background:#07080c;border-right:1px solid #ffffff0f;display:flex;flex-direction:column;gap:1.5rem;height:100vh;left:0;min-width:220px;padding:1.5rem 1rem;position:fixed;top:0;width:220px;z-index:50}.side-panel-left .panel-section{display:flex;flex-direction:column;gap:.75rem}.side-panel-left .panel-title{color:#6b7280;font-size:.7rem;letter-spacing:1px;margin-bottom:.25rem;text-transform:uppercase}.side-panel-left .back-button{font-size:.85rem;justify-content:center;padding:.625rem 1rem;width:100%}.side-panel-left .device-info{text-align:center}.side-panel-left .device-info .device-name{font-size:1rem;word-break:break-word}.side-panel-left .device-info .device-subtitle{font-size:.75rem}.side-panel-left .connection-status{font-size:.75rem;height:auto;justify-content:center;min-height:44px;padding:.75rem;width:100%}.side-panel-right{background:#0c0d12f2;border-left:1px solid #ffffff0f;display:flex;flex-direction:column;gap:1.5rem;height:100vh;min-width:220px;padding:1.5rem 1rem;position:fixed;right:0;top:0;width:220px;z-index:50}.side-panel-right .panel-section{display:flex;flex-direction:column;gap:.75rem}.side-panel-right .panel-title{color:#6b7280;font-size:.7rem;letter-spacing:1px;margin-bottom:.25rem;text-transform:uppercase}.side-panel-left .control-btn{align-items:center;display:flex;gap:.75rem;height:auto;justify-content:center;padding:.75rem;width:100%}.side-panel-left .control-btn-label{font-size:.85rem;font-weight:500}.side-panel-right .control-btn{align-items:center;display:flex;gap:.75rem;height:auto;justify-content:center;padding:.75rem;width:100%}.side-panel-right .control-btn-label{font-size:.85rem;font-weight:500}.network-stat-card{align-items:center;background:#ffffff08;border:1px solid #ffffff0d;border-radius:.75rem;display:flex;flex-direction:column;gap:.25rem;padding:.75rem 1rem}.network-stat-card .stat-label{color:#9ca3af;font-size:.7rem;text-align:center}.network-stat-card .stat-value{font-family:SF Mono,Monaco,monospace;font-size:.75rem;font-weight:600;text-align:center}.side-panel-right .stat-value.low{color:#22c55e}.side-panel-right .stat-value.medium{color:#f59e0b}.side-panel-right .stat-value.high{color:#ef4444}.remote-indicator{align-items:center;background:#ffffff08;border:1px solid #ffffff0d;border-radius:.75rem;display:flex;flex-direction:column;gap:.5rem;justify-content:center;padding:.75rem 1rem}.remote-label{color:#9ca3af;font-size:.75rem;font-weight:500}.remote-icons{gap:.5rem;justify-content:center}.remote-dots,.remote-icons{align-items:center;display:flex}.remote-dots{gap:.25rem;height:16px}.remote-dots .dot{animation:dotPulse 1.4s infinite;background:#22c55e;border-radius:50%;height:4px;width:4px}.remote-dots .dot:first-child{animation-delay:0s}.remote-dots .dot:nth-child(2){animation-delay:.2s}.remote-dots .dot:nth-child(3){animation-delay:.4s}@keyframes dotPulse{0%,60%,to{opacity:.3;transform:scale(1)}30%{opacity:1;transform:scale(1.2)}}.viewer-container{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-left:220px;margin-right:220px;min-height:100vh;padding:2rem;position:relative;width:calc(100% - 440px)}.viewer-container .iphone-frame{flex-grow:0;flex-shrink:0}.viewer-container .viewer-controls,.viewer-container .viewer-status-bar{display:none}}@media (max-width:991px){.side-panel-left,.side-panel-right{display:none}.mobile-bottom-sheet{background:#0c0d12fa;border-radius:1.5rem 1.5rem 0 0;border-top:1px solid #ffffff1a;bottom:0;left:0;max-height:70vh;overflow:hidden;position:fixed;right:0;transition:transform .3s ease;z-index:100}.mobile-bottom-sheet.collapsed{transform:translateY(calc(100% - 80px))}.mobile-bottom-sheet.expanded{transform:translateY(0)}.sheet-handle{cursor:pointer;display:flex;justify-content:center;padding:.75rem;width:100%}.sheet-handle-bar{background:#ffffff4d;border-radius:2px;height:4px;width:40px}.sheet-peek{align-items:center;display:flex;gap:.5rem;justify-content:space-around;padding:0 1rem .75rem}.sheet-peek .control-btn{border-radius:.75rem;height:48px;width:48px}.sheet-peek .control-btn:first-child{background:linear-gradient(135deg,#5c60ff,#8b5cf6)!important;border-color:#0000!important;box-shadow:0 4px 12px #5c60ff4d!important}.sheet-peek .control-btn:first-child:hover{background:linear-gradient(135deg,#6366f1,#9333ea)!important;box-shadow:0 6px 16px #5c60ff66!important}.sheet-peek .peek-status{align-items:center;background:#ffffff0d;border-radius:.5rem;display:flex;font-size:.75rem;gap:.75rem;padding:.5rem 1rem}.sheet-peek .peek-latency{font-family:SF Mono,monospace;font-weight:600}.sheet-peek .latency-btn{min-width:70px;padding:.5rem .75rem}.latency-content{align-items:center;display:flex;flex-direction:column;gap:.25rem}.latency-value{font-family:SF Mono,Monaco,monospace;font-size:.75rem;font-weight:700;line-height:1}.latency-dots{align-items:center;display:flex;gap:.2rem;height:8px}.latency-dots .dot{animation:dotPulse 1.4s infinite;background:#22c55e;border-radius:50%;height:3px;width:3px}.latency-dots .dot:first-child{animation-delay:0s}.latency-dots .dot:nth-child(2){animation-delay:.2s}.latency-dots .dot:nth-child(3){animation-delay:.4s}.sheet-remote-indicator{align-items:center;background:#ffffff08;border:1px solid #ffffff0d;border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem;margin-top:.75rem;padding:.75rem}.sheet-remote-label{color:#9ca3af;font-size:.7rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase}.sheet-remote-icons{align-items:center;display:flex;gap:.4rem;justify-content:center}.sheet-remote-dots{align-items:center;display:flex;gap:.2rem;height:14px}.sheet-remote-dots .dot{animation:dotPulse 1.4s infinite;background:#22c55e;border-radius:50%;height:3px;width:3px}.sheet-remote-dots .dot:first-child{animation-delay:0s}.sheet-remote-dots .dot:nth-child(2){animation-delay:.2s}.sheet-remote-dots .dot:nth-child(3){animation-delay:.4s}.sheet-content{max-height:calc(70vh - 100px);overflow-y:auto;padding:0 1rem 1.5rem}.sheet-section{margin-bottom:1.5rem}.sheet-section-title{color:#6b7280;font-size:.7rem;letter-spacing:1px;margin-bottom:.75rem;text-transform:uppercase}.sheet-stats-grid{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:1fr 1fr}.sheet-stat-item{background:#ffffff08;border-radius:.5rem;padding:.75rem;text-align:center}.sheet-stat-label{color:#9ca3af;font-size:.65rem;letter-spacing:.5px;margin-bottom:.25rem;text-transform:uppercase}.sheet-stat-value{font-family:SF Mono,monospace;font-size:1rem;font-weight:700}.sheet-section .connection-status{align-items:center;display:flex;font-size:.75rem;gap:.5rem;justify-content:center;min-height:50px;padding:.625rem .75rem;text-align:center}.sheet-section .connection-status svg{flex-shrink:0;height:14px;width:14px}.sheet-status-grid{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:1fr 1fr}.viewer-main{padding-bottom:100px}.viewer-controls,.viewer-header,.viewer-status-bar{display:none}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.ai-panel,.control-btn,.stats-panel,.viewer-controls,.viewer-header{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#0f111af2!important}}.inactivity-modal-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000bf;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:10000}.inactivity-modal-content{animation:modalSlideIn .3s ease-out;background:#ffffff08;border:1px solid #ffffff14;border-radius:.75rem;box-shadow:0 8px 24px #0006;max-width:360px;padding:1.75rem;text-align:center;width:90%}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.inactivity-modal-content h2{color:#e5e7eb;font-size:1.25rem;font-weight:600;margin:0 0 .75rem}.inactivity-message{color:#9ca3af;font-size:.875rem;line-height:1.5;margin:0 0 1rem}.countdown-text{background:#ffffff0d;border:1px solid #ffffff14;border-radius:.5rem;color:#ffffffe6;font-size:1rem;font-weight:500;margin:0 0 1.5rem;padding:.75rem}.countdown-text strong{color:#fff;display:inline-block;font-size:1.5rem;font-weight:700;min-width:2ch}.still-here-button{background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.75rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;font-size:.95rem;font-weight:600;padding:.75rem 1.5rem;transition:all .3s ease;width:100%}.still-here-button:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.still-here-button:active{box-shadow:0 2px 8px #5c60ff4d;transform:translateY(0)}@media (max-width:768px){.inactivity-modal-content{max-width:90%;padding:1.5rem}.inactivity-modal-content h2{font-size:1.125rem}.inactivity-message{font-size:.8125rem}.countdown-text{font-size:.9375rem}.countdown-text strong{font-size:1.375rem}.still-here-button{font-size:.875rem;padding:.625rem 1.25rem}}.session-takeover-modal-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000bf;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:10000}.session-takeover-modal-content{animation:modalSlideIn .3s ease-out;background:#ffffff08;border:1px solid #ffffff14;border-radius:.75rem;box-shadow:0 8px 24px #0006;max-width:360px;padding:1.75rem;text-align:center;width:90%}.session-takeover-modal-content h2{color:#e5e7eb;font-size:1.25rem;font-weight:600;margin:0 0 .75rem}.session-takeover-message{color:#9ca3af;font-size:.875rem;line-height:1.5;margin:0 0 1.5rem}.session-takeover-button{background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.75rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;font-size:.95rem;font-weight:600;padding:.75rem 1.5rem;transition:all .3s ease;width:100%}.session-takeover-button:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.session-takeover-button:active{box-shadow:0 2px 8px #5c60ff4d;transform:translateY(0)}@media (max-width:768px){.session-takeover-modal-content{max-width:90%;padding:1.5rem}.session-takeover-modal-content h2{font-size:1.125rem}.session-takeover-message{font-size:.8125rem}.session-takeover-button{font-size:.875rem;padding:.625rem 1.25rem}}.frame-stall-warning{animation:slideDown .3s ease-out;background:#fbbf24f2;border:1px solid #f59e0b;border-radius:8px;box-shadow:0 4px 12px #00000026;left:50%;max-width:90%;padding:12px 20px;position:absolute;top:60px;transform:translateX(-50%);z-index:100}.frame-stall-warning .stall-content{text-align:center}.frame-stall-warning h4{color:#92400e;font-size:14px;font-weight:600;margin:0}.frame-stall-warning p{color:#78350f;font-size:12px;margin:4px 0 0}.frame-stall-warning .stall-hint{opacity:.8}@media (max-width:768px){.frame-stall-warning{padding:10px 16px;top:40px}.frame-stall-warning h4{font-size:13px}.frame-stall-warning p{font-size:11px}}.system-metrics{margin:0 auto;max-width:1400px;padding:20px}.metrics-header{margin-bottom:30px}.metrics-header h2{font-size:1.5rem;font-weight:700;margin:0 0 8px}.metrics-header p{color:#9ca3af;font-size:.9375rem}.throughput-summary{margin-bottom:30px}.summary-stat{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:.75rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;flex:1 1;gap:10px;min-width:250px;padding:16px 20px;transition:all .3s ease}.summary-stat:hover{box-shadow:inset 0 1px 0 #ffffff05,0 15px 40px #000000b3,0 8px 16px #00000080,0 0 30px #5c60ff33;transform:translateY(-2px)}.summary-stat svg{color:#5c60ff;flex-shrink:0}.summary-label{color:#9ca3af;font-size:14px}.summary-value{font-size:16px;font-weight:600;margin-left:auto}.metrics-grid{grid-gap:24px;gap:24px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin-top:20px}.metric-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;overflow:hidden;transition:all .3s ease}.metric-card:hover{box-shadow:inset 0 1px 0 #ffffff05,0 15px 40px #000000b3,0 8px 16px #00000080,0 0 30px #5c60ff33;transform:translateY(-3px)}.card-content{display:flex;flex-direction:column;gap:0;padding:1.25rem}.metric-card-title{align-items:center;border-bottom:1px solid #ffffff0a;display:flex;gap:.75rem;margin-bottom:1rem;padding-bottom:1rem}.metric-card-title h3{color:#e5e7eb;font-size:1.125rem;font-weight:600;margin:0}.card-title-icon{color:#5c60ff;flex-shrink:0}.metric-stat-box{background:#ffffff08;border:1px solid #ffffff0d;border-radius:.625rem;box-sizing:border-box;display:flex;flex-direction:column;gap:.375rem;margin-bottom:.75rem;padding:.75rem 1rem;transition:all .2s ease;width:100%}.metric-stat-box:last-child{margin-bottom:0}.metric-stat-box:hover{background:#ffffff0d;transform:translateX(2px)}.metric-stat-box-placeholder{opacity:0;pointer-events:none}.metric-stat-label{color:#9ca3af;font-size:.6875rem;font-weight:500;letter-spacing:.05em;line-height:1.2;text-transform:uppercase}.metric-stat-value{color:#e5e7eb;font-size:1.75rem;font-weight:700;line-height:1}@media (max-width:1024px){.metrics-grid{gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}@media (max-width:768px){.system-metrics{padding:1rem}.metrics-header h2{font-size:1.25rem}.metrics-header p{font-size:.875rem}.throughput-summary{flex-direction:column;gap:.75rem}.summary-stat{min-width:100%}.metrics-grid{gap:1rem;grid-template-columns:1fr}.card-content{padding:1rem 1.25rem}}@media (max-width:480px){.metrics-header h2{font-size:1.125rem}.summary-stat{flex-wrap:wrap;justify-content:center;text-align:center}.summary-value{margin-left:0;margin-top:.5rem;width:100%}.card-content{padding:1rem 1.25rem}.metric-stat-box{padding:.75rem .875rem}.metric-stat-label{font-size:.6875rem}.metric-stat-value{font-size:1.25rem}}.empty-state{color:#9ca3af;font-size:16px;justify-content:center;min-height:400px}.superuser-panel{position:relative;width:100%}.corner-loading-spinner{align-items:center;background:#5c60ff1a;border:1px solid #5c60ff4d;border-radius:50%;box-shadow:0 4px 12px #5c60ff33;display:flex;justify-content:center;padding:.5rem;position:absolute;right:2rem;top:2rem;z-index:100}.corner-loading-spinner svg{color:#5c60ff}.spinning{animation:spin 1s linear infinite}.superuser-content{margin:0 auto;max-width:1400px}.tab-navigation{border-bottom:1px solid #ffffff14;display:flex;flex-wrap:wrap;gap:.25rem;margin-bottom:20px}.tab-navigation button{align-items:center;background:none;border:none;border-radius:.375rem .375rem 0 0;color:#a1a8b3;cursor:pointer;display:flex;font-size:13px;gap:6px;padding:10px 16px;transition:all .2s ease;white-space:nowrap}.tab-navigation button.active{border-bottom:3px solid #5c60ff;color:#5c60ff;font-weight:500}.tab-navigation button:hover:not(.active){background-color:#ffffff0d}.tab-navigation button svg{color:#a1a8b3}.tab-navigation button.active svg{color:#5c60ff}.tab-refresh-btn{align-items:center;background:#5c60ff1a!important;border:1px solid #5c60ff33!important;border-radius:.375rem!important;cursor:pointer;display:flex;justify-content:center;margin-left:auto!important;padding:10px 12px!important;transition:all .2s ease}.tab-refresh-btn:hover:not(:disabled){background:#5c60ff33!important;border-color:#5c60ff66!important}.tab-refresh-btn:disabled{cursor:not-allowed;opacity:.6}.tab-refresh-btn svg{color:#5c60ff}.tab-content{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;padding:20px}.loading-indicator{align-items:center;color:#a1a8b3;display:flex;flex-direction:column;gap:10px;padding:40px;text-align:center}.error-message{background:#ef444426;border:1px solid #ef44444d;color:#ef4444;margin-bottom:20px;padding:15px}.empty-state{color:#a1a8b3;font-style:italic;padding:40px}.metrics-header{margin-bottom:20px}.metrics-header h2{color:#e5e7eb;font-size:18px;margin:0 0 5px}.metrics-header p{color:#a1a8b3;font-size:14px;margin:0}.metrics-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-bottom:30px}.metric-card{background:#0003;border:1px solid #ffffff0d;border-radius:8px;box-shadow:0 4px 12px #0003;display:flex;gap:15px;padding:15px}.metric-icon{align-items:center;background:linear-gradient(45deg,#5c60ff,#45caff);border-radius:8px;color:#fff;display:flex;height:48px;justify-content:center;width:48px}.metric-content h3{color:#e5e7eb;font-size:16px;margin:0 0 10px}.metric-stats{display:flex;flex-direction:column;gap:8px}.metric-stat{display:flex;gap:20px;justify-content:space-between}.stat-label,.stat-value{font-size:13px}.stat-value{font-weight:500}.status-indicators{border-top:1px solid #ffffff14;display:flex;flex-wrap:wrap;gap:20px;margin-top:20px;padding-top:15px}.status-indicator{align-items:center;color:#a1a8b3;display:flex;font-size:13px;gap:8px}.indicator-label{font-weight:500}.indicator-value{color:#e5e7eb}.metrics-table{border-collapse:collapse;margin-top:15px;width:100%}.metrics-table th{background:#ffffff0d;color:#a1a8b3;cursor:pointer;font-size:13px;font-weight:500;padding:12px 15px;text-align:left;-webkit-user-select:none;user-select:none}.metrics-table th:hover{background:#ffffff1a}.metrics-table td{border-bottom:1px solid #ffffff14;font-size:13px;padding:12px 15px}.user-cell{align-items:center;display:flex;gap:10px}.user-name{font-weight:400}.user-role{color:#a1a8b3;font-size:12px}.center-cell{text-align:center}.metric-value{align-items:center;display:flex;gap:5px;justify-content:center}.connections-toolbar{align-items:center;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-bottom:15px}.filter-buttons{display:flex;flex-wrap:wrap;gap:5px}.filter-buttons button{align-items:center;background:#ffffff0d;border:1px solid #ffffff14;border-radius:4px;color:#a1a8b3;cursor:pointer;display:flex;font-size:13px;gap:5px;padding:8px 12px}.filter-buttons button.active{background-color:#5c60ff;border-color:#5c60ff;color:#fff}.filter-buttons button.active svg{color:#fff}.search-box{align-items:center;display:flex;position:relative}.search-box svg{color:#a1a8b3;left:10px;position:absolute}.search-box input{background:#ffffff0d;border:1px solid #ffffff14;border-radius:4px;color:#e5e7eb;font-size:13px;min-width:200px;padding:8px 10px 8px 35px}.clear-search{align-items:center;background:none;border:none;color:#a1a8b3;cursor:pointer;display:flex;font-size:18px;justify-content:center;padding:0;position:absolute;right:8px}.connections-table{border-collapse:collapse;width:100%}.type-cell{align-items:center;display:flex;gap:8px}.status-badge{border-radius:20px;font-size:12px;font-weight:500;padding:4px 8px}.status-authenticated{background:#22c55e26;border:1px solid #22c55e4d;color:#22c55e}.status-anonymous{background:#f9731626;border:1px solid #f973164d;color:#f59e0b}.throughput-summary{background:#0003;border:1px solid #ffffff0d;border-radius:8px;display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px;padding:15px}.summary-stat{align-items:center;display:flex;gap:8px}.summary-label{color:#a1a8b3;font-size:13px;font-weight:500}.summary-value{color:#e5e7eb;font-size:13px}.device-name{align-items:center;display:flex;gap:5px}.stream-icon{color:#5c60ff}.sort-asc .sort-indicator,.sort-desc .sort-indicator{display:inline-block;margin-left:4px}.sort-asc .sort-indicator{transform:rotate(180deg)}.user-management{padding:1rem}.user-management-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.user-management-header h2{color:#e5e7eb;font-size:1.5rem;margin:0}.search-filters{align-items:flex-end;display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem}.search-filters .search-bar{align-items:center;display:flex;flex:1 1;min-width:250px;position:relative}.search-filters .search-bar svg{color:#a1a8b3;left:.75rem;position:absolute}.search-filters .search-bar input{padding:.5rem .75rem .5rem 2.5rem;width:100%}.search-filters .search-bar input,.search-filters select{background:#ffffff0d;border:1px solid #ffffff14;border-radius:.375rem;color:#e5e7eb;font-size:.875rem}.search-filters select{cursor:pointer;padding:.5rem .75rem}.checkbox-label{align-items:center;color:#d1d5db;cursor:pointer;display:flex;flex-direction:row-reverse;font-size:.875rem;gap:.625rem;justify-content:flex-end;margin-top:.25rem;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{cursor:pointer;flex-shrink:0;height:1rem;margin:0;width:1rem}.form-group .checkbox-label{margin-top:0;padding-top:.25rem}.user-table-container{-webkit-overflow-scrolling:touch;border-radius:.5rem;margin-top:.5rem;overflow-x:auto}.user-table{background:#0003;border-collapse:collapse;border-radius:.5rem;overflow:hidden;width:100%}.user-table thead{background:#ffffff0d}.user-table th{color:#a1a8b3;font-weight:500;text-align:left}.user-table td,.user-table th{border-bottom:1px solid #ffffff14;font-size:.875rem;padding:.75rem 1rem}.user-table td{color:#e5e7eb}.user-table tbody tr:hover{background:#ffffff08}.user-table tbody tr.deleted-user{background:#ef44440d;opacity:.6}.tier-badge{border-radius:.25rem;font-weight:500;padding:.25rem .5rem;text-transform:uppercase}.tier-badge.tier-free{background:#9ca3af26;color:#9ca3af}.tier-badge.tier-core{background:#3b82f626;color:#3b82f6}.tier-badge.tier-pro{background:#a855f726;color:#a855f7}.tier-badge.tier-pro-max{background:#ec489926;color:#ec4899}.tier-badge.tier-enterprise{background:#fbbf2426;color:#fbbf24}.user-table .actions{gap:.5rem}.btn-icon,.user-table .actions{align-items:center;display:flex}.btn-icon{background:none;border:none;border-radius:.25rem;color:#a1a8b3;cursor:pointer;justify-content:center;padding:.25rem;transition:all .2s}.btn-icon:hover{background:#ffffff1a;color:#e5e7eb}.btn-icon.btn-danger:hover{background:#ef444426;color:#ef4444}.btn-delete-separated{margin-left:.5rem;position:relative}.btn-delete-separated:before{background:#ffffff1a;content:"";height:60%;left:-.5rem;position:absolute;top:50%;transform:translateY(-50%);width:1px}.modal-overlay{background:#0009}.modal-content{background:linear-gradient(135deg,#1a1d24,#15171d);border:1px solid #5c60ff33;box-shadow:0 25px 60px #000000b3,0 10px 30px #5c60ff1a,inset 0 1px 0 #ffffff0d;max-height:85vh;max-width:900px}.modal-header{background:#5c60ff0d;border-bottom:1px solid #5c60ff26;border-radius:1rem 1rem 0 0;padding:1.75rem 2rem}.modal-header h3{font-size:1.375rem;font-weight:600}.btn-close{align-items:center;background:none;border:none;border-radius:.25rem;color:#a1a8b3;cursor:pointer;display:flex;font-size:1.5rem;height:2rem;justify-content:center;padding:0;transition:all .2s;width:2rem}.btn-close:hover{background:#ffffff1a;color:#e5e7eb}.modal-content form{display:flex;flex:1 1;flex-direction:column;overflow:hidden}.modal-form-content{-ms-overflow-style:none;flex:1 1;overflow-y:auto;padding:1.5rem 2rem;scrollbar-width:none}.modal-form-content::-webkit-scrollbar{display:none}.form-group label{color:#d1d5db;letter-spacing:.01em;margin-bottom:.625rem}.form-group input,.form-group select,.form-group textarea{background:#ffffff08;border:1px solid #ffffff1a;border-radius:.5rem;color:#e5e7eb;font-size:.9375rem;padding:.625rem .875rem;transition:all .2s ease;width:100%}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{background:#5c60ff0d;border-color:#5c60ff;box-shadow:0 0 0 3px #5c60ff1a;outline:none}.form-group input:disabled{cursor:not-allowed;opacity:.5}.form-group textarea{font-family:inherit;resize:vertical}.form-row{grid-gap:1.25rem;display:grid;gap:1.25rem;grid-template-columns:1fr 1fr}.warning-box{background:linear-gradient(135deg,#ef444414,#ef44441f);border:1px solid #ef444459;border-radius:.75rem;box-shadow:0 4px 12px #ef44441a;margin-bottom:1.25rem;padding:1.25rem}.warning-box p{color:#fca5a5;line-height:1.6;margin:.375rem 0}.info-box{background:linear-gradient(135deg,#3b82f614,#3b82f61f);border:1px solid #3b82f659;border-radius:.75rem;box-shadow:0 4px 12px #3b82f61a;margin-bottom:1.25rem;padding:1.25rem}.info-box p{color:#93c5fd;line-height:1.6;margin:.375rem 0}.modal-actions{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1d24cc;border-top:1px solid #5c60ff26;display:flex;flex-shrink:0;gap:.875rem;justify-content:flex-end;margin:0;padding:1.5rem 2rem}.success-message{background:#22c55e26;border:1px solid #22c55e4d;border-radius:.5rem;color:#22c55e;margin-bottom:1rem;padding:.75rem 1rem}.manual-provisioning{padding:1rem}.manual-provisioning h2{color:#e5e7eb;font-size:1.5rem;margin:0 0 1.5rem}.provisioning-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.provisioning-nav button{align-items:center;background:#ffffff0d;border:1px solid #ffffff14;border-radius:.375rem;color:#a1a8b3;cursor:pointer;display:flex;font-size:.875rem;gap:.5rem;padding:.75rem 1rem;transition:all .2s}.provisioning-nav button:hover{background:#ffffff1a}.provisioning-nav button.active{background:#5c60ff;border-color:#5c60ff;color:#fff}.provisioning-form-container{background:#0003;border:1px solid #ffffff14;border-radius:.75rem;padding:1.5rem}.provisioning-form h3{color:#e5e7eb;font-size:1.125rem;margin:0 0 1.5rem}.audit-log{padding:1rem}.audit-log-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.audit-log-header h2{color:#e5e7eb;font-size:1.5rem;margin:0}.audit-filters{background:#0003;border:1px solid #ffffff14;border-radius:.5rem;margin-bottom:1.5rem;padding:1rem}.filter-row{display:flex;flex-wrap:wrap;gap:1rem}.filter-group{flex:1 1;min-width:200px}.filter-group label{color:#a1a8b3;display:block;font-size:.875rem;font-weight:500;margin-bottom:.5rem}.filter-group input,.filter-group select{background:#ffffff0d;border:1px solid #ffffff14;border-radius:.375rem;color:#e5e7eb;font-size:.875rem;padding:.5rem .75rem;width:100%}.audit-table-container{overflow-x:auto}.audit-table{background:#0003;border-collapse:collapse;border-radius:.5rem;overflow:hidden;width:100%}.audit-table thead{background:#ffffff0d}.audit-table th{color:#a1a8b3;font-weight:500;text-align:left}.audit-table td,.audit-table th{border-bottom:1px solid #ffffff14;font-size:.875rem;padding:.75rem 1rem}.audit-table td{color:#e5e7eb}.audit-table tbody tr:hover{background:#ffffff08}.audit-table code{background:#ffffff0d;font-family:monospace}.action-badge,.audit-table code{border-radius:.25rem;font-size:.75rem;padding:.25rem .5rem}.action-badge{font-weight:500;text-transform:capitalize}.action-badge-create{background:#22c55e26;color:#22c55e}.action-badge-delete{background:#ef444426;color:#ef4444}.action-badge-update{background:#3b82f626;color:#3b82f6}.action-badge-restore{background:#fbbf2426;color:#fbbf24}.action-badge-default{background:#9ca3af26;color:#9ca3af}.audit-detail-modal{max-width:800px}.audit-detail-content{padding:1.5rem}.detail-section{margin-bottom:1.5rem}.detail-section:last-child{margin-bottom:0}.detail-section h4{border-bottom:1px solid #ffffff14;color:#e5e7eb;font-size:1rem;margin:0 0 1rem;padding-bottom:.5rem}.detail-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:1fr 1fr}.detail-item{display:flex;flex-direction:column;gap:.25rem}.detail-item label{color:#a1a8b3;font-size:.75rem;font-weight:500}.detail-item code,.detail-item span{color:#e5e7eb;font-size:.875rem}.detail-json{background:#0000004d;border:1px solid #ffffff14;border-radius:.5rem;overflow-x:auto;padding:1rem}.detail-json pre{color:#e5e7eb;font-family:monospace;font-size:.75rem;margin:0}.user-details-modal{max-width:800px}.user-details-content{-ms-overflow-style:none;max-height:70vh;overflow-y:auto;padding:1.5rem 2rem;scrollbar-width:none}.user-details-content::-webkit-scrollbar{display:none}.user-details-content .detail-section{margin-bottom:2rem}.user-details-content .detail-section h4{align-items:center;border-bottom:1px solid #5c60ff33;color:#e5e7eb;display:flex;font-size:1.125rem;gap:.5rem;margin:0 0 1rem;padding-bottom:.75rem}.user-details-content .detail-section h4 svg{color:#5c60ff}.usage-stats{background:#0003;border:1px solid #ffffff14;border-radius:.5rem;padding:1rem}.usage-stat-item{margin-bottom:.5rem}.usage-stat-item label{color:#a1a8b3;display:block;font-size:.75rem;font-weight:500;margin-bottom:.5rem}.usage-value{align-items:baseline;display:flex;gap:.5rem;margin-bottom:.5rem}.value-primary{color:#5c60ff;font-size:1.5rem;font-weight:700}.value-secondary{color:#a1a8b3;font-size:1rem}.usage-progress{background:#ffffff0d;border-radius:4px;height:8px;overflow:hidden;width:100%}.usage-progress-bar{background:linear-gradient(90deg,#5c60ff,#8b5cf6);border-radius:4px;height:100%;transition:width .3s ease}.device-list{display:flex;flex-direction:column;gap:1rem}.device-item{border:1px solid #ffffff14}.device-item,.usage-history-table{background:#0003;border-radius:.5rem}.usage-history-table{border-collapse:collapse;margin-top:.5rem;overflow:hidden;width:100%}.usage-history-table thead{background:#ffffff0d}.usage-history-table th{color:#a1a8b3;font-weight:500;text-align:left}.usage-history-table td,.usage-history-table th{border-bottom:1px solid #ffffff14;font-size:.875rem;padding:.75rem 1rem}.usage-history-table td{color:#e5e7eb}.usage-history-table tbody tr:hover{background:#ffffff08}.usage-history-table tbody tr:last-child td{border-bottom:none}.transaction-list{display:flex;flex-direction:column;gap:.75rem}.transaction-item{background:#0003;border:1px solid #ffffff14;border-radius:.5rem;padding:1rem}.transaction-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem}.transaction-type{border-radius:.25rem;font-size:.75rem;font-weight:500;padding:.25rem .5rem;text-transform:capitalize}.transaction-type.type-purchase{background:#22c55e26;color:#22c55e}.transaction-type.type-subscription{background:#3b82f626;color:#3b82f6}.transaction-type.type-refund{background:#ef444426;color:#ef4444}.transaction-type.type-payment{background:#a855f726;color:#a855f7}.transaction-amount{color:#e5e7eb;font-size:1rem}.transaction-details{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.transaction-description{color:#d1d5db;font-size:.875rem}.transaction-date{font-size:.75rem}.transaction-stripe-id{border-top:1px solid #ffffff0d;margin-top:.5rem;padding-top:.5rem}.transaction-stripe-id code{color:#a1a8b3;font-size:.75rem}.status-badge.status-active{background:#22c55e26;color:#22c55e}.status-badge.status-active,.status-badge.status-past_due{border-radius:.25rem;font-size:.75rem;font-weight:500;padding:.25rem .5rem;text-transform:capitalize}.status-badge.status-past_due{background:#fbbf2426;color:#fbbf24}.status-badge.status-canceled,.status-badge.status-none{border-radius:.25rem;font-size:.75rem;font-weight:500;padding:.25rem .5rem;text-transform:capitalize}.status-badge.status-none{background:#9ca3af26}.user-details-content .loading-indicator{min-height:300px}.spinner{border:3px solid #5c60ff4d;border-top-color:#5c60ff;height:2rem;margin-bottom:1rem;width:2rem}.security-events{padding:1rem}.security-events .empty-state{color:#a1a8b3;padding:3rem 1rem;text-align:center}.security-events .empty-state svg{color:#fbbf24;margin-bottom:1rem}.security-events .empty-state h3{color:#e5e7eb;font-size:1.125rem;margin:0 0 .5rem}.security-events .empty-state p{font-size:.875rem;margin:0}.security-events .filter-controls{align-items:center;background:#0003;border:1px solid #ffffff14;border-radius:.5rem;display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem;padding:.75rem}.security-events .filter-group{align-items:center;display:flex;gap:.5rem}.security-events .filter-group svg{color:#a1a8b3;flex-shrink:0}.security-events .filter-group select{background:#ffffff0d;border:1px solid #ffffff14;border-radius:.375rem;color:#e5e7eb;cursor:pointer;font-size:.8125rem;padding:.375rem .625rem}.security-events .event-count{color:#a1a8b3;font-size:.8125rem;font-weight:500;margin-left:auto}.security-events .events-table{-webkit-overflow-scrolling:touch;background:#0003;border:1px solid #ffffff14;border-radius:.5rem;overflow-x:auto}.security-events table{border-collapse:collapse;font-size:.8125rem;width:100%}.security-events thead{background:#ffffff0d;position:-webkit-sticky;position:sticky;top:0;z-index:10}.security-events th{border-bottom:1px solid #ffffff14;color:#a1a8b3;font-size:.75rem;font-weight:500;padding:.625rem .75rem;text-align:left;white-space:nowrap}.security-events td{border-bottom:1px solid #ffffff0d;color:#e5e7eb;font-size:.8125rem;padding:.5rem .75rem}.security-events tbody tr{transition:background .15s ease}.security-events tbody tr:hover{background:#ffffff08}.security-events tbody tr:nth-child(2n){background:#ffffff03}.security-events tbody tr:nth-child(2n):hover{background:#ffffff0a}.security-events .event-status-success{border-left:2px solid #22c55e4d}.security-events .event-status-failure{border-left:2px solid #ef44444d}.security-events .timestamp{align-items:center;color:#a1a8b3;display:flex;font-size:.75rem;gap:.375rem;white-space:nowrap}.security-events .timestamp svg{flex-shrink:0}.security-events .status{text-align:center;width:40px}.security-events .success-icon{color:#22c55e}.security-events .failure-icon{color:#ef4444}.security-events .event-type{color:#e5e7eb;font-weight:500;white-space:nowrap}.security-events .client-type{align-items:center;display:flex;font-size:.75rem;gap:.375rem}.security-events .client-type svg{color:#5c60ff;flex-shrink:0}.security-events .user-email{font-size:.75rem;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.security-events .ip-address{color:#d1d5db;font-family:monospace;font-size:.75rem;white-space:nowrap}.security-events .user-agent{color:#a1a8b3;font-size:.75rem;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.security-events .details{color:#d1d5db;font-size:.75rem;max-width:180px}.security-events .details div{line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width:768px){.metrics-grid{grid-template-columns:1fr}.throughput-summary{flex-direction:column;gap:10px}.connections-toolbar{align-items:flex-start;flex-direction:column}.search-box,.search-box input{width:100%}.metrics-table{display:block;overflow-x:auto}.detail-grid,.form-row{grid-template-columns:1fr}.audit-log-header,.user-management-header{align-items:flex-start;flex-direction:column;gap:1rem}.security-events .filter-controls{align-items:stretch;flex-direction:column}.security-events .event-count{margin-left:0}}.trial-badge{align-items:center;border-radius:.375rem;display:inline-flex;font-size:.75rem;font-weight:600;gap:.25rem;padding:.25rem .5rem;white-space:nowrap}.trial-badge--active{background:#22c55e26;border:1px solid #22c55e4d;color:#22c55e}.trial-badge--expired{background:#ef444426;border:1px solid #ef44444d;color:#ef4444}.trial-badge--converted{background:#3b82f626;border:1px solid #3b82f64d;color:#3b82f6}.support-tickets-panel{display:flex;flex-direction:column;gap:1.5rem;height:100%;width:100%}.loading-state{color:#ffffffb3;flex-direction:column;gap:1rem;justify-content:center;padding:4rem 2rem}.loading-spinner{animation:spin 1s linear infinite;border:3px solid #ffffff1a;height:2rem;width:2rem}.panel-header{border-bottom:1px solid #ffffff14;justify-content:space-between;padding-bottom:1rem}.panel-header,.panel-title{align-items:center;display:flex}.panel-title{gap:.75rem}.panel-title svg{color:#5c60ff}.panel-title h2{color:#e5e7eb;font-size:1.5rem;font-weight:700;margin:0}.ticket-count{background:#5c60ff26;border:1px solid #5c60ff4d;border-radius:2rem;color:#8b5cf6;font-size:.875rem;font-weight:600;padding:.25rem .625rem}.ticket-filters{display:flex;flex-wrap:wrap;gap:.75rem}.filter-btn{align-items:center;background:#ffffff05;border:1px solid #ffffff14;border-radius:.5rem;color:#a1a8b3;cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;padding:.625rem 1rem;transition:all .2s ease}.filter-btn:hover{background:#ffffff0a;border-color:#5c60ff4d;color:#e5e7eb}.filter-btn.active{background:#5c60ff26;border-color:#5c60ff4d;color:#8b5cf6}.filter-btn .count{background:#ffffff1a;border-radius:1rem;font-size:.75rem;padding:.125rem .375rem}.filter-btn.active .count{background:#5c60ff4d;color:#e5e7eb}.tickets-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));overflow-y:auto;padding-right:.5rem}.ticket-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:.75rem;border-style:solid;border-width:1px;cursor:pointer;display:flex;flex-direction:column;gap:1rem;padding:1.25rem;transition:all .2s ease}.ticket-card:hover{border-top-color:#5c60ff33;box-shadow:0 8px 20px #0006;transform:translateY(-2px)}.ticket-header{align-items:center;display:flex;gap:1rem;justify-content:space-between}.ticket-id{color:#a1a8b3;font-family:Courier New,monospace;font-size:.75rem}.ticket-badges{display:flex;gap:.5rem}.priority-badge,.status-badge{border-radius:2rem;font-size:.6875rem;font-weight:600;padding:.25rem .625rem;text-transform:capitalize}.ticket-subject{-webkit-line-clamp:2;color:#e5e7eb;font-size:1rem;font-weight:600;line-height:1.4}.ticket-message,.ticket-subject{-webkit-box-orient:vertical;display:-webkit-box;margin:0;overflow:hidden}.ticket-message{-webkit-line-clamp:3;color:#a1a8b3;font-size:.875rem;line-height:1.5}.ticket-footer{align-items:center;border-top:1px solid #ffffff0a;display:flex;gap:1rem;justify-content:space-between;padding-top:.75rem}.ticket-date,.ticket-user{align-items:center;color:#a1a8b3;display:flex;font-size:.75rem;gap:.375rem}.ticket-date svg,.ticket-user svg{color:#5c60ff;flex-shrink:0}.ticket-updated{border-top:1px solid #ffffff05;color:#6b7280;font-size:.6875rem;font-style:italic;margin-top:-.5rem;padding-top:.5rem}.tickets-empty{align-items:center;color:#a1a8b3;display:flex;flex-direction:column;gap:1rem;grid-column:1/-1;padding:4rem 2rem}.tickets-empty svg{color:#ffffff1a}.tickets-empty p{font-size:1rem;margin:0}.ticket-detail-section{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.detail-row{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.5rem;display:flex;justify-content:space-between;padding:.75rem}.detail-label{color:#a1a8b3}.detail-value.mono{font-family:Courier New,monospace;font-size:.8125rem}.ticket-detail-divider{background:#ffffff14;height:1px;margin:1.5rem 0}.ticket-detail-section h4{color:#e5e7eb;font-size:.875rem;font-weight:600;letter-spacing:.5px;margin:0 0 .5rem;text-transform:uppercase}.ticket-detail-subject{color:#e5e7eb;font-size:1rem;font-weight:600;line-height:1.5;margin:0}.ticket-detail-message{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0;white-space:pre-wrap}.existing-notes{align-items:center;background:#3b82f614;border:1px solid #3b82f633;border-radius:.5rem;color:#60a5fa;display:flex;font-size:.8125rem;gap:.5rem;margin-bottom:1rem;margin-top:-.5rem;padding:.75rem}.existing-notes svg{flex-shrink:0}.modal-overlay{align-items:flex-start;padding:2rem 1rem 1rem;top:-10px}.modal-content.modal-large{max-width:800px}@media (max-width:768px){.tickets-grid{grid-template-columns:1fr}.ticket-filters{-webkit-overflow-scrolling:touch;overflow-x:auto}.filter-btn{white-space:nowrap}.ticket-footer{align-items:flex-start;flex-direction:column}.modal-content{align-self:flex-end;border-radius:1rem 1rem 0 0;max-width:100%}.modal-body,.modal-footer,.modal-header{padding:1rem}.modal-footer{flex-direction:column}.modal-footer .btn{width:100%}}.device-provisioning{margin:0;max-width:1000px;padding:0;width:100%}.provisioning-content{display:flex;flex-direction:column;gap:1.5rem}.provisioning-section{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;padding:2rem}.section-label{color:#e5e7eb;font-weight:600;gap:.5rem;margin-bottom:1rem}.loading-state,.section-label{align-items:center;display:flex;font-size:.95rem}.loading-state{background:#ffffff05;border-radius:8px;color:#9ca3af;gap:.75rem;padding:1rem}.loading-spinner{animation:spin .8s linear infinite;border:2px solid #e5e7eb;border-top-color:#667eea;height:20px;width:20px}.user-select{background:#ffffff05;border:1px solid #ffffff14;border-radius:8px;color:#e5e7eb;cursor:pointer;font-size:1rem;margin-bottom:1rem;padding:.75rem 1rem;transition:all .3s;width:100%}.user-select option{background:#141419;color:#e5e7eb}.user-select:focus,.user-select:hover:not(:disabled){background:#ffffff0a;border-color:#5c60ff}.user-select:focus{box-shadow:0 0 0 3px #5c60ff33;outline:none}.user-select:disabled{cursor:not-allowed;opacity:.5}.user-details{background:#ffffff05;border:1px solid #ffffff14;border-radius:8px;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem;padding:1rem}.user-detail-item{align-items:center;display:flex;justify-content:space-between}.detail-label{color:#9ca3af;font-size:.875rem;font-weight:500}.detail-value{color:#e5e7eb;font-size:.875rem;font-weight:600}.detail-value.tier-free{color:#6b7280}.detail-value.tier-core{color:#3b82f6}.detail-value.tier-pro{color:#8b5cf6}.detail-value.tier-pro-max{color:#ec4899}.detail-value.tier-enterprise{color:#f59e0b}.detail-value.has-device{color:#10b981}.detail-value.no-device{color:#ef4444}.generate-btn{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;margin-top:.5rem;padding:.875rem 1.5rem;transition:all .3s ease;width:100%}.generate-btn:hover:not(:disabled){box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;transform:translateY(-2px)}.generate-btn:active:not(:disabled){transform:translateY(0)}.generate-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.btn-spinner{animation:spin .8s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:16px;width:16px}.error-message{align-items:center;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#dc2626;display:flex;font-size:.95rem;gap:.75rem;padding:1rem 1.25rem}.token-display{animation:slideIn .3s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#10b9814d #0000004d #0000004d #10b9814d;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #10b9810d,0 10px 30px #0009,0 4px 12px #0006,0 0 30px #10b98126;padding:2rem}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.token-header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem}.token-header h3{color:#e5e7eb;font-size:1.25rem;font-weight:600;margin:0}.token-timer{align-items:center;background:#ecfdf5;border:1px solid #10b981;border-radius:6px;color:#059669;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;padding:.5rem 1rem}.token-timer.warning{background:#fef3c7;border-color:#f59e0b;color:#d97706}.token-info{gap:1.5rem}.token-field,.token-info{display:flex;flex-direction:column}.token-field{gap:.5rem}.token-field label{color:#e5e7eb;font-size:.875rem;font-weight:600}.token-value-container{display:flex;gap:.5rem}.token-value{color:#fff;flex:1 1;font-family:Courier New,monospace;font-size:1.1rem;font-weight:600;letter-spacing:.05em;padding:1rem}.copy-btn,.token-value{background:#ffffff05;border:1px solid #ffffff14;border-radius:8px}.copy-btn{align-items:center;color:#9ca3af;cursor:pointer;display:flex;justify-content:center;min-width:48px;padding:.75rem 1rem;transition:all .3s ease}.copy-btn:hover{background:#5c60ff26;border-color:#5c60ff;box-shadow:0 4px 12px #5c60ff4d;color:#5c60ff;transform:translateY(-2px)}.copy-btn.copied{background:#10b98126;border-color:#10b981;color:#34d399;transform:scale(1.05)}.token-details-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.token-detail{display:flex;flex-direction:column;gap:.25rem}.token-detail label{color:#9ca3af;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.token-detail code{background:#ffffff05;border-radius:4px;font-family:Courier New,monospace;padding:.25rem .5rem}.token-detail code,.token-detail span{color:#e5e7eb;font-size:.9rem}.provisioning-instructions{border-top:1px solid #e5e7eb;margin-top:1.5rem;padding-top:1.5rem}.provisioning-instructions h4{color:#e5e7eb;font-size:1rem;font-weight:600;margin:0 0 1rem}.provisioning-instructions ol{display:flex;flex-direction:column;gap:.75rem;margin:0;padding-left:1.5rem}.provisioning-instructions li{color:#9ca3af;font-size:.95rem;line-height:1.6}.provisioning-instructions code{background:#ffffff0d;border:1px solid #ffffff14;border-radius:4px;color:#f87171;font-family:Courier New,monospace;font-size:.85rem;padding:.2rem .4rem}.instruction-note{align-items:center;background:#fef3c7;border:1px solid #fbbf24;border-radius:6px;color:#92400e;display:flex;font-size:.875rem;gap:.5rem;margin-top:1rem;padding:.75rem 1rem}@media (max-width:768px){.device-provisioning{padding:0}.provisioning-section{border-radius:12px;padding:1.5rem}.token-header{align-items:flex-start;flex-direction:column;gap:1rem}.token-details-grid{grid-template-columns:1fr}.token-value{font-size:.9rem;padding:.875rem}.token-display{border-radius:12px;padding:1.5rem}.generate-btn{font-size:.95rem;padding:.75rem 1.25rem}}.announcement-banner-container{max-width:100%;width:100%;z-index:1000}.announcement-banner{align-items:center;animation:slideDown .3s ease-out;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:.5rem;box-shadow:0 4px 6px -1px #0003;display:flex;gap:1rem;margin-bottom:.5rem;padding:1rem 1.5rem;transition:opacity .3s ease-out,transform .3s ease-out}.announcement-banner.hidden{opacity:0;transform:translateY(-10px)}.announcement-banner.visible{opacity:1;transform:translateY(0)}.announcement-banner.announcement-info{background:#3b82f626;border:1px solid #3b82f64d;color:#d1d5db}.announcement-banner.announcement-info .announcement-icon{color:#3b82f6}.announcement-banner.announcement-warning{background:#f59e0b26;border:1px solid #f59e0b4d;color:#d1d5db}.announcement-banner.announcement-warning .announcement-icon{color:#f59e0b}.announcement-banner.announcement-critical{background:#ef444426;border:1px solid #ef44444d;color:#d1d5db}.announcement-banner.announcement-critical .announcement-icon{color:#ef4444}.announcement-icon{align-items:center;display:flex;flex-shrink:0;justify-content:center}.announcement-content{flex:1 1;margin:0}.announcement-content p{font-size:.95rem;font-weight:500;line-height:1.5;margin:0}.announcement-dismiss{align-items:center;background:#4b55634d;border:none;border-radius:4px;color:#9ca3af;cursor:pointer;display:flex;flex-shrink:0;justify-content:center;padding:.35rem;transition:all .2s ease}.announcement-dismiss:hover{background:#4b556380;color:#d1d5db}.announcement-dismiss:active{background:#4b556399}@media (max-width:768px){.announcement-banner{gap:.75rem;padding:.875rem 1rem}.announcement-content p{font-size:.875rem}.announcement-icon svg{height:18px;width:18px}}.no-device-banner{animation:slideDown .5s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:.75rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;margin:0 0 1.5rem;overflow:hidden;padding:1rem 1.25rem;position:relative}.no-device-banner:before{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="none" stroke="rgba%28255,255,255,0.03%29" stroke-width="1" d="M10,10 L90,90 M30,10 L90,70 M50,10 L90,50 M70,10 L90,30 M10,30 L70,90 M10,50 L50,90 M10,70 L30,90"/></svg>') repeat;content:"";height:100%;opacity:.5;pointer-events:none;position:absolute;right:0;top:0;width:400px;z-index:0}.banner-content{flex-wrap:wrap;gap:1rem;margin-bottom:0;position:relative;z-index:1}.banner-content,.banner-icon{align-items:center;display:flex}.banner-icon{background:linear-gradient(135deg,#5c60ff33,#8b5cf626);border:1px solid #5c60ff4d;border-radius:.75rem;box-shadow:0 8px 20px #5c60ff33;flex-shrink:0;height:48px;justify-content:center;width:48px}.banner-icon svg{color:#5c60ff;height:24px;width:24px}.banner-text{flex:1 1;min-width:200px}.banner-text h2{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fff,#a5a5a5);-webkit-background-clip:text;color:#e5e7eb;font-size:1rem;font-weight:700;margin:0 0 .25rem}.banner-text p{color:#9ca3af;font-size:.8125rem;line-height:1.4;margin:0}.banner-actions{display:flex;flex-wrap:wrap;gap:.625rem}.banner-actions button{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;border-radius:.625rem;cursor:pointer;display:inline-flex;font-size:.8125rem;font-weight:600;gap:.375rem;overflow:hidden;padding:.5rem 1rem;position:relative;text-decoration:none;transition:all .3s ease}.banner-actions button svg{height:16px;width:16px}.banner-actions button:before{background:linear-gradient(90deg,#0000,#ffffff26,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.banner-actions button:hover:before{left:100%}.banner-actions .btn-primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.banner-actions .btn-primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.banner-actions .btn-secondary{background:#ffffff08;border:1px solid #ffffff14;box-shadow:0 2px 8px #0000001a;color:#e5e7eb}.banner-actions .btn-secondary:hover{background:#ffffff14;border-color:#ffffff26;box-shadow:0 6px 16px #0003;color:#fff;transform:translateY(-2px)}.banner-features,.feature-icon,.feature-item,.features-list{display:none}.feature-icon.blue{background:#3b82f626;border:1px solid #3b82f64d;color:#60a5fa}.feature-icon.purple{background:#8b5cf626;border:1px solid #8b5cf64d;color:#a78bfa}.feature-icon.green{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.feature-icon.cyan{background:#06b6d426;border:1px solid #06b6d44d;color:#22d3ee}.feature-item span{color:#9ca3af;font-size:.9375rem;line-height:1.5}@media (max-width:768px){.no-device-banner{margin:0 0 1rem;padding:1rem}.banner-content{gap:.75rem}.banner-icon{height:40px;width:40px}.banner-icon svg{height:20px;width:20px}.banner-text h2{font-size:.9375rem}.banner-text p{font-size:.75rem}.banner-actions{flex-direction:row;width:100%}.banner-actions button{flex:1 1;font-size:.75rem;min-width:100px;padding:.5rem .75rem}}.payment-method-banner{animation:slideDown .5s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#fbbf2426 #0000004d #0000004d #fbbf2426;border-radius:.75rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #fbbf240d,0 10px 30px #0009,0 4px 12px #0006;margin:0 0 1.5rem;overflow:hidden;padding:1rem 1.25rem;position:relative}.payment-method-banner:before{background:linear-gradient(90deg,#0000,#fbbf2405);content:"";height:100%;pointer-events:none;position:absolute;right:0;top:0;width:400px;z-index:0}.payment-method-banner .banner-content{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:0;position:relative;z-index:1}.payment-method-banner .banner-icon{align-items:center;background:linear-gradient(135deg,#fbbf2433,#f59e0b26);border:1px solid #fbbf244d;border-radius:.75rem;box-shadow:0 8px 20px #fbbf2433;display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.payment-method-banner .banner-icon.warning svg{color:#fbbf24;height:32px;width:32px}.payment-method-banner .banner-text{flex:1 1;min-width:200px}.payment-method-banner .banner-text h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fbbf24,#f59e0b);-webkit-background-clip:text;color:#e5e7eb;font-size:1rem;font-weight:700;margin:0 0 .25rem}.payment-method-banner .banner-text p{color:#9ca3af;font-size:.8125rem;line-height:1.4;margin:0}.payment-method-banner .banner-actions{display:flex;flex-wrap:wrap;gap:.625rem}.payment-method-banner .banner-actions button{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;border-radius:.625rem;cursor:pointer;display:inline-flex;font-size:.8125rem;font-weight:600;gap:.375rem;overflow:hidden;padding:.5rem 1rem;position:relative;text-decoration:none;transition:all .3s ease}.payment-method-banner .banner-actions button svg{height:16px;width:16px}.payment-method-banner .banner-actions button:before{background:linear-gradient(90deg,#0000,#ffffff26,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.payment-method-banner .banner-actions button:hover:before{left:100%}.payment-method-banner .banner-actions .btn-primary{background:linear-gradient(135deg,#fbbf24,#f59e0b);box-shadow:0 4px 12px #fbbf244d;color:#1f2937;font-weight:700}.payment-method-banner .banner-actions .btn-primary:hover{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 8px 20px #fbbf2466;transform:translateY(-2px)}@media (max-width:768px){.payment-method-banner{margin:0 0 1rem;padding:1rem}.payment-method-banner .banner-content{gap:.75rem}.payment-method-banner .banner-icon{height:40px;width:40px}.payment-method-banner .banner-icon.warning svg{height:24px;width:24px}.payment-method-banner .banner-text h3{font-size:.9375rem}.payment-method-banner .banner-text p{font-size:.75rem}.payment-method-banner .banner-actions{width:100%}.payment-method-banner .banner-actions button{flex:1 1;font-size:.75rem;padding:.5rem .75rem}}.trial-banner{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-bottom:1px solid #0000004d;border-radius:.75rem;border-right:1px solid #0000004d;border-top:1px solid #ffffff14;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;margin-bottom:20px;padding:12px 20px;transition:all .3s ease;width:100%}.trial-banner__container{align-items:center;display:flex;gap:16px;justify-content:space-between;margin:0 auto;max-width:1200px}.trial-banner__content{align-items:center;display:flex;flex:1 1;gap:12px}.trial-banner__icon{align-items:center;border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;transition:all .3s ease;width:40px}.trial-banner__text{display:flex;flex-direction:column;gap:4px}.trial-banner__title{font-size:16px;font-weight:600;line-height:1.2}.trial-banner__subtitle{font-size:14px;line-height:1.2;opacity:.9}.trial-banner__actions{align-items:center;display:flex;gap:12px}.trial-banner__button{border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;padding:8px 16px;transition:all .2s ease;white-space:nowrap}.trial-banner__button--primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.trial-banner__button--primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.trial-banner__button--dismiss{align-items:center;background:#0000;color:#9ca3af;display:flex;justify-content:center;opacity:.7;padding:4px 8px}.trial-banner__button--dismiss:hover{background:#ffffff14;color:#e5e7eb;opacity:1}.trial-banner--normal{background:#3b82f60d;border-left:3px solid #60a5fa;color:#e5e7eb}.trial-banner__icon--normal{background:#3b82f626;color:#60a5fa}.trial-banner--warning{background:#f59e0b14;border-left:3px solid #f59e0b;color:#e5e7eb}.trial-banner__icon--warning{background:#f59e0b26;color:#fbbf24}.trial-banner--critical{background:#ef44441f;border-left:3px solid #ef4444;color:#e5e7eb}.trial-banner__icon--critical{background:#ef444426;color:#f87171}.trial-banner--expired{background:#ef44441f;border-left:3px solid #ef4444;color:#e5e7eb}.trial-banner__icon--expired{background:#ef444426;color:#f87171}@media (max-width:768px){.trial-banner{padding:12px 16px}.trial-banner__container{align-items:flex-start;flex-direction:column;gap:12px}.trial-banner__actions{justify-content:space-between;width:100%}.trial-banner__button--primary{flex:1 1}.trial-banner__title{font-size:15px}.trial-banner__subtitle{font-size:13px}}.trial-banner--compact{margin-bottom:12px;padding:8px 16px}.trial-banner--compact .trial-banner__title{font-size:14px}.trial-banner--compact .trial-banner__subtitle{font-size:12px}.trial-banner--compact .trial-banner__icon{font-size:20px}.store-container{margin:0 auto;max-width:1400px;padding:0}.store-section{margin-bottom:2rem}.store-container .section-title{align-items:center;color:#e5e7eb;display:flex;font-size:1.5rem;font-weight:700;gap:.75rem;margin-bottom:1rem}.store-container .section-title svg{color:#5c60ff}.store-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(300px,340px))}.store-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;display:flex;flex-direction:column;height:100%;overflow:hidden;transition:all .3s ease}.store-card:hover{border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff0a,0 20px 40px #0009,0 8px 20px #0006,0 0 30px #5c60ff33;transform:translateY(-5px)}.store-card.featured:before{opacity:1}.store-card.featured:before,.store-card:before{background:linear-gradient(90deg,#5c60ff,#8b5cf6);content:"";height:3px;left:0;position:absolute;right:0;top:0}.store-card:before{opacity:0;transition:opacity .3s ease}.store-card:hover:before{opacity:1}.store-card-header{align-items:flex-start;border-bottom:1px solid #ffffff0a;display:flex;justify-content:space-between;padding:1rem 1.25rem;position:relative}.store-card-info{align-items:center;display:flex;gap:.75rem}.store-card-icon{align-items:center;background:#5c60ff1a;border-radius:.625rem;box-shadow:0 4px 10px #0003;color:#5c60ff;display:flex;height:1.75rem;justify-content:center;padding:.375rem;transition:all .3s ease;width:1.75rem}.store-card:hover .store-card-icon{box-shadow:0 6px 15px #5c60ff4d;transform:scale(1.1) rotate(5deg)}.store-card-icon.basic{background:#3b82f61a;color:#60a5fa}.store-card-icon.pro{background:#5c60ff1a;color:#8b5cf6}.store-card-icon.enterprise{background:#fbbf241a;color:#fbbf24}.store-card-details{flex:1 1;min-width:0}.store-card-name{color:#e5e7eb;font-size:1rem;font-weight:700;margin:0 0 .2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.store-card-model{color:#a1a8b3;font-size:.8125rem;margin:0}.store-badge{align-items:center;border-radius:2rem;display:flex;font-size:.6875rem;font-weight:600;padding:.375rem .625rem;white-space:nowrap}.store-badge.popular{background:#5c60ff26;border:1px solid #5c60ff4d;color:#8b5cf6}.store-badge.current{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.store-card-body{display:flex;flex:1 1;flex-direction:column;gap:.75rem;padding:1.25rem}.store-card-description{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0;padding-bottom:.25rem}.store-card-features{display:flex;flex-direction:column;gap:.5rem}.store-feature-item{align-items:center;background:#ffffff08;border:1px solid #ffffff0a;border-radius:.5rem;color:#a1a8b3;display:flex;font-size:.8125rem;gap:.625rem;padding:.5rem .75rem;transition:all .2s ease}.store-feature-item:hover{background:#ffffff0d;box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.store-feature-item svg{color:#34d399;flex-shrink:0}.store-card-footer{align-items:center;border-top:1px solid #ffffff0a;display:flex;gap:1rem;justify-content:space-between;padding:1rem 1.25rem}.store-card-price{display:flex;flex-direction:column}.store-price-amount{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#5c60ff,#8b5cf6);-webkit-background-clip:text;font-size:1.5rem;font-weight:700;line-height:1}.store-price-label{color:#a1a8b3;font-size:.75rem;margin-top:.25rem}.store-btn{align-items:center;border:none;border-radius:.625rem;cursor:pointer;display:flex;font-size:.8125rem;font-weight:600;gap:.5rem;justify-content:center;padding:.625rem 1rem;transition:all .3s ease;white-space:nowrap}.store-btn.btn-primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.store-btn.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.store-btn.btn-secondary{background:#ffffff08;border:1px solid #ffffff14;box-shadow:0 2px 8px #0000001a;color:#e5e7eb}.store-btn.btn-secondary:hover:not(:disabled){background:#ffffff14;border-color:#ffffff26;box-shadow:0 6px 16px #0003;color:#fff;transform:translateY(-2px)}.store-btn:disabled{background:#4b556380;box-shadow:none;cursor:not-allowed;transform:none}.store-card.skeleton{pointer-events:none;-webkit-user-select:none;user-select:none}.skeleton-body,.skeleton-footer,.skeleton-header,.skeleton-line{animation:skeleton-loading 1.5s ease-in-out infinite;background:linear-gradient(90deg,#ffffff08,#ffffff14 50%,#ffffff08);background-size:200% 100%;border-radius:8px}.skeleton-header{height:60px;margin-bottom:1.5rem}.skeleton-body{display:flex;flex:1 1;flex-direction:column;gap:.75rem;padding:.5rem 0}.skeleton-line{height:16px;width:100%}.skeleton-line.short{width:60%}.skeleton-footer{height:80px;margin-top:1.5rem}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:1024px){.store-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:768px){.store-container{padding:0}.store-section{margin-bottom:1.5rem}.section-title{font-size:1.25rem}.store-grid{gap:1rem;grid-template-columns:1fr}.store-card-footer{align-items:stretch;flex-direction:column}.store-btn{width:100%}}@media (max-width:480px){.store-card-body,.store-card-footer,.store-card-header{padding:1rem}.section-title{font-size:1.125rem}}.store-notice{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-bottom:1px solid #0000004d;border-radius:.75rem;border-right:1px solid #0000004d;border-top:1px solid #ffffff14;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;gap:1rem;margin-bottom:2rem;padding:1.25rem 1.5rem}.store-notice,.store-notice__icon{align-items:center;display:flex;transition:all .3s ease}.store-notice__icon{border-radius:8px;flex-shrink:0;height:40px;justify-content:center;width:40px}.store-notice__content{flex:1 1}.store-notice__title{color:#e5e7eb;font-size:1rem;font-weight:600;margin:0 0 .375rem}.store-notice__message{color:#9ca3af;font-size:.875rem;line-height:1.5;margin:0}.store-notice--trial{background:#f59e0b14;border-left:3px solid #f59e0b;color:#e5e7eb}.store-notice--trial .store-notice__icon{background:#f59e0b26;color:#fbbf24}.store-notice--expired{background:#ef44441f;border-left:3px solid #ef4444;color:#e5e7eb}.store-notice--expired .store-notice__icon{background:#ef444426;color:#f87171}.store-notice--enterprise{background:#5c60ff14;border-left:3px solid #5c60ff;color:#e5e7eb}.store-notice--enterprise .store-notice__icon{background:#5c60ff26;color:#818cf8}.store-section--disabled{opacity:.6;pointer-events:none;position:relative}.store-section--disabled:after{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#ffffff0d;border-radius:8px;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.store-section--disabled .store-card{filter:grayscale(30%)}@media (max-width:768px){.store-notice{align-items:flex-start;flex-direction:column;padding:1.25rem}.store-notice__icon{font-size:1.75rem}.store-notice__title{font-size:1rem}.store-notice__message{font-size:.875rem}}.profile-container{margin:0 auto;max-width:1600px;padding:0}.profile-error,.profile-loading{align-items:center;color:#ffffffb3;display:flex;flex-direction:column;gap:1rem;justify-content:center;padding:4rem 2rem}.profile-error svg{color:#ef4444}.profile-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr);margin-bottom:1.5rem}@media (min-width:1025px){.profile-grid{grid-template-columns:repeat(3,1fr)!important}}.profile-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;display:flex;flex-direction:column;overflow:hidden;position:relative;transition:all .3s ease}.profile-card:before{background:linear-gradient(90deg,#5c60ff,#8b5cf6);content:"";height:3px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.profile-card:hover{border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff0a,0 20px 40px #0009,0 8px 20px #0006,0 0 30px #5c60ff33;transform:translateY(-5px)}.profile-card:hover:before{opacity:1}.profile-card-header{align-items:center;border-bottom:1px solid #ffffff0a;display:flex;justify-content:space-between;padding:1rem 1.25rem}.profile-card-title{align-items:center;display:flex;gap:.75rem}.profile-card-title svg{color:#5c60ff;transition:all .3s ease}.profile-card:hover .profile-card-title svg{filter:drop-shadow(0 4px 8px rgba(92,96,255,.4))}.profile-card-title h3{color:#e5e7eb;font-size:1.125rem;font-weight:700;margin:0}.device-count-badge{background:#5c60ff26;border:1px solid #5c60ff4d;border-radius:2rem;color:#8b5cf6;font-size:.75rem;font-weight:600;padding:.25rem .625rem}.profile-card-body{flex:1 1;padding:1.25rem}.user-info-section{align-items:center;border-bottom:1px solid #ffffff0a;display:flex;gap:1rem;margin-bottom:1.25rem;padding-bottom:1.25rem}.user-avatar{align-items:center;background:linear-gradient(135deg,#5c60ff,#8b5cf6);border-radius:50%;box-shadow:0 4px 12px #5c60ff4d;color:#fff;display:flex;flex-shrink:0;font-size:1.5rem;font-weight:700;height:60px;justify-content:center;width:60px}.user-details{flex:1 1;min-width:0}.user-name{color:#e5e7eb;font-size:1.25rem;font-weight:700;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-email{color:#a1a8b3;font-size:.875rem;margin:0}.subscription-info{display:flex;flex-direction:column;gap:.875rem;margin-bottom:1.25rem}.subscription-row{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.5rem;display:flex;justify-content:space-between;padding:.75rem}.subscription-label{color:#a1a8b3;font-size:.875rem}.subscription-value{align-items:center;color:#e5e7eb;display:flex;font-size:.875rem;font-weight:600;gap:.5rem}.tier-badge{background:#5c60ff26;border:1px solid #5c60ff4d;color:#8b5cf6}.status-badge,.tier-badge{border-radius:2rem;font-size:.75rem;font-weight:600;padding:.25rem .625rem}.status-badge.status-active{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.status-badge.status-canceled{background:#ef444426;border:1px solid #ef44444d;color:#ef4444}.status-badge.status-past-due{background:#fbbf2426;border:1px solid #fbbf244d;color:#fbbf24}.status-badge.status-trial{background:#3b82f626;border:1px solid #3b82f64d;color:#60a5fa}.status-badge.status-none{background:#6b728026;border:1px solid #6b72804d;color:#9ca3af}.subscription-actions{display:flex;gap:.75rem}.subscription-actions .btn{flex:1 1}.usage-current-period{margin-bottom:1.5rem}.usage-all-time h4,.usage-current-period h4{color:#a1a8b3;font-size:.875rem;font-weight:600;letter-spacing:.5px;margin:0 0 1rem;text-transform:uppercase}.usage-stat-large{align-items:baseline;display:flex;gap:.5rem;margin-bottom:1rem}.usage-number{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#5c60ff,#8b5cf6);-webkit-background-clip:text;font-size:2.5rem;font-weight:700;line-height:1}.usage-unit{color:#a1a8b3;font-size:1rem}.usage-progress-bar{background:#ffffff0d;border-radius:1rem;height:8px;margin-bottom:.5rem;overflow:hidden;width:100%}.usage-progress-fill{background:linear-gradient(90deg,#5c60ff,#8b5cf6);border-radius:1rem;height:100%;transition:width .3s ease}.usage-progress-fill.warning{background:linear-gradient(90deg,#f59e0b,#ef4444)}.usage-percentage{color:#a1a8b3;font-size:.75rem;margin:0 0 1rem}.usage-info-row{align-items:center;color:#a1a8b3;display:flex;font-size:.875rem;gap:.5rem}.usage-info-row svg{color:#5c60ff;flex-shrink:0}.usage-divider{background:#ffffff0a;height:1px;margin:1.5rem 0}.usage-stats-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}.usage-stat{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.5rem;display:flex;flex-direction:column;padding:1rem}.stat-value{color:#e5e7eb;font-size:1.5rem;font-weight:700;line-height:1;margin-bottom:.5rem}.stat-label{color:#a1a8b3;font-size:.75rem;text-align:center}.devices-list{display:flex;flex-direction:column;gap:1rem}.device-item{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.75rem;display:flex;gap:1rem;padding:1rem;transition:all .2s ease}.device-item:hover{background:#ffffff0a;transform:translateX(4px)}.device-icon{align-items:center;background:#5c60ff1a;border-radius:.5rem;color:#5c60ff;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.device-details{flex:1 1;min-width:0}.device-name{color:#e5e7eb;font-size:.875rem;font-weight:600;margin:0 0 .25rem}.device-id{color:#a1a8b3;font-family:Courier New,monospace;font-size:.75rem;margin:0}.device-meta{align-items:flex-end;display:flex;flex-direction:column;gap:.5rem}.device-status{border-radius:2rem;font-size:.75rem;font-weight:600;padding:.25rem .625rem}.device-status.status-active{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.device-status.status-pending_activation{background:#fbbf2426;border:1px solid #fbbf244d;color:#fbbf24}.device-status.status-inactive{background:#6b728026;border:1px solid #6b72804d;color:#9ca3af}.device-date{align-items:center;color:#a1a8b3;display:flex;font-size:.75rem;gap:.25rem}.device-date svg{flex-shrink:0}.devices-empty,.transactions-empty{align-items:center;color:#a1a8b3;display:flex;flex-direction:column;gap:1rem;padding:3rem 2rem}.devices-empty svg,.transactions-empty svg{color:#ffffff1a}.devices-empty p,.transactions-empty p{color:#a1a8b3;margin:0}.devices-empty-hint,.transactions-empty-hint{color:#fff6;font-size:.875rem}.transactions-table{overflow-x:auto}.transactions-table table{border-collapse:collapse;width:100%}.transactions-table thead{border-bottom:1px solid #ffffff14}.transactions-table th{color:#a1a8b3;font-size:.75rem;font-weight:600;letter-spacing:.5px;padding:.75rem;text-align:left;text-transform:uppercase}.transactions-table tbody tr{border-bottom:1px solid #ffffff0a;transition:background .2s ease}.transactions-table tbody tr:hover{background:#ffffff05}.transactions-table td{color:#e5e7eb;font-size:.875rem;padding:1rem .75rem}.transaction-date{color:#a1a8b3}.transaction-description{font-weight:500}.transaction-amount{color:#22c55e;font-weight:600}.transaction-status{border-radius:2rem;font-size:.75rem;font-weight:600;padding:.25rem .625rem}.transaction-status.status-completed,.transaction-status.status-paid{background:#10b98126;border:1px solid #10b9814d;color:#34d399}.transaction-status.status-pending{background:#fbbf2426;border:1px solid #fbbf244d;color:#fbbf24}.transaction-status.status-failed{background:#ef444426;border:1px solid #ef44444d;color:#ef4444}.btn{border-radius:.625rem;justify-content:center;padding:.75rem 1.25rem;white-space:nowrap}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.btn:disabled{background:#4b556380;box-shadow:none;cursor:not-allowed;transform:none}.spinner{animation:spin 1s linear infinite;border:2px solid #fff;border-radius:50%;border-top-color:#0000;height:1rem;width:1rem}@media (max-width:1024px){.profile-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.profile-grid{grid-template-columns:1fr}.usage-stats-grid{grid-template-columns:repeat(2,1fr)}.profile-container{padding:0}.profile-grid{gap:1rem;margin-bottom:1rem}.profile-card{border-radius:.75rem}.profile-card-header{padding:1rem 1.25rem}.profile-card-body{padding:1.25rem}.user-avatar{font-size:1.25rem;height:50px;width:50px}.user-name{font-size:1.125rem}.usage-stat-large{align-items:flex-start;flex-direction:column}.usage-number{font-size:2rem}.usage-stats-grid{grid-template-columns:1fr}.device-item{align-items:flex-start;flex-direction:column}.device-meta{align-items:center;flex-direction:row;justify-content:space-between;width:100%}.transactions-table{font-size:.8125rem}.transactions-table td,.transactions-table th{padding:.625rem .5rem}.subscription-actions{flex-direction:column}}@media (max-width:480px){.profile-card-body,.profile-card-header{padding:1rem}.user-info-section{flex-direction:column;text-align:center}.subscription-row{align-items:flex-start;flex-direction:column;gap:.5rem}}.warnings-banner{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.warning-item{align-items:flex-start;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-left:4px solid;border-radius:.75rem;box-shadow:0 4px 12px #0000004d;display:flex;gap:1rem;padding:1rem 1.25rem}.warning-item.severity-info{background:#3b82f614;border-left-color:#3b82f6}.warning-item.severity-warning{background:#f59e0b14;border-left-color:#f59e0b}.warning-item.severity-error{background:#ef444414;border-left-color:#ef4444}.warning-item svg{flex-shrink:0;margin-top:.125rem}.warning-item.severity-info svg{color:#60a5fa}.warning-item.severity-warning svg{color:#fbbf24}.warning-item.severity-error svg{color:#ef4444}.warning-content h4{color:#e5e7eb;font-size:.875rem;font-weight:600;margin:0 0 .25rem}.warning-content p{color:#a1a8b3;font-size:.875rem;line-height:1.5;margin:0}.billing-card .profile-card-body{padding:1.25rem}.billing-summary{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.billing-stat-row{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.5rem;display:flex;justify-content:space-between;padding:.75rem}.billing-stat-row.projection{background:#5c60ff0d;border-color:#5c60ff26}.billing-label{color:#a1a8b3;font-size:.875rem}.billing-value{color:#e5e7eb;font-size:.875rem;font-weight:600}.billing-value.highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#5c60ff,#8b5cf6);-webkit-background-clip:text;font-size:1.125rem}.billing-divider{background:#ffffff14;height:1px;margin:.5rem 0}.billing-info{margin-top:1rem}.billing-note{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.5rem;color:#a1a8b3;display:flex;font-size:.75rem;gap:.5rem;margin:0;padding:.75rem}.billing-note svg{color:#5c60ff;flex-shrink:0}.optimization-card .profile-card-body{padding:1.25rem}.optimization-content{display:flex;flex-direction:column;gap:1rem}.optimization-content h4{color:#e5e7eb;font-size:1.125rem;font-weight:700;margin:0}.optimization-description{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0}.optimization-savings{background:#22c55e14;border:1px solid #22c55e33;border-radius:.75rem;display:flex;flex-direction:column;gap:.5rem;padding:1rem}.savings-label{color:#a1a8b3;font-size:.75rem;letter-spacing:.5px;text-transform:uppercase}.savings-amount{color:#22c55e;font-size:1.875rem;font-weight:700}.support-card .profile-card-body{padding:1.25rem}.support-options{display:flex;flex-direction:column;gap:1rem}.support-option-btn{align-items:center;background:#ffffff05;border:1px solid #ffffff0a;border-radius:.75rem;cursor:pointer;display:flex;gap:1rem;padding:1.25rem;text-align:left;transition:all .2s ease}.support-option-btn:hover{background:#ffffff0a;border-color:#5c60ff4d;transform:translateX(4px)}.support-option-btn svg{color:#5c60ff;flex-shrink:0}.support-option-text h4{color:#e5e7eb;font-size:.9375rem;font-weight:600;margin:0 0 .25rem}.support-option-text p{color:#a1a8b3;font-size:.8125rem;margin:0}.modal-overlay{animation:fadeIn .2s ease;background:#0000;bottom:100px;top:150px;z-index:1000}.modal-content{animation:slideUp .3s ease;border:1px solid #ffffff1a;box-shadow:0 20px 60px #0009;display:flex;flex-direction:column;max-height:70vh;max-width:500px;width:100%}.modal-content.modal-large{max-width:700px}.modal-header{border-bottom:1px solid #ffffff14;padding:1.25rem 1.5rem}.modal-close{background:#ffffff0d;border:1px solid #ffffff1a;height:32px;width:32px}.modal-close:hover{background:#ffffff1a;color:#e5e7eb}.modal-body{-ms-overflow-style:none;flex:1 1;scrollbar-width:none}.modal-body::-webkit-scrollbar{display:none}.modal-footer{border-top:1px solid #ffffff14;gap:.75rem;padding:1.25rem 1.5rem}.form-group{margin-bottom:1.25rem}.form-input,.form-select,.form-textarea{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.5rem;color:#e5e7eb;font-family:inherit;font-size:.875rem;padding:.75rem;transition:all .2s ease;width:100%}.form-input:focus,.form-select:focus,.form-textarea:focus{background:#ffffff14;border-color:#5c60ff80;box-shadow:0 0 0 3px #5c60ff1a;outline:none}.form-textarea{min-height:100px}.form-input::placeholder,.form-textarea::placeholder{color:#6b7280}.btn-secondary{background:#ffffff0d;border:1px solid #ffffff1a}.btn-secondary:hover:not(:disabled){background:#ffffff1a;border-color:#fff3}.setup-guide-content{display:flex;flex-direction:column;gap:1.5rem}.guide-section h4{align-items:center;color:#e5e7eb;display:flex;font-size:1rem;font-weight:700;gap:.5rem;margin:0 0 .75rem}.guide-section p{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0}.guide-section a{color:#5c60ff;text-decoration:none;transition:color .2s ease}.guide-section a:hover{color:#8b5cf6;text-decoration:underline}.submit-message{align-items:center;animation:slideDown .3s ease;border-radius:.5rem;display:flex;gap:.5rem;margin-bottom:1.25rem}.submit-message-success{background:#10b98126}.submit-message-error{background:#ef444426;color:#ef4444}@media (max-width:640px){.modal-content{align-self:flex-end;border-radius:1rem 1rem 0 0;max-width:100%}.modal-body,.modal-footer,.modal-header{padding:1rem}.modal-footer{flex-direction:column}.modal-footer .btn{width:100%}}.support-container{margin:0 auto;max-width:1400px;padding:0}.support-section{margin-bottom:3.5rem}.support-container .section-title{align-items:center;color:#e5e7eb;display:flex;font-size:1.5rem;font-weight:700;gap:.75rem;margin-bottom:2rem}.support-container .section-title svg{color:#5c60ff}.support-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(4,1fr)}.support-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;overflow:hidden;padding:1.5rem;transition:all .3s ease}.support-card:hover{border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff0a,0 20px 40px #0009,0 8px 20px #0006,0 0 30px #5c60ff33;transform:translateY(-5px)}.support-card:before{background:linear-gradient(90deg,#5c60ff,#8b5cf6);content:"";height:3px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.support-card:hover:before{opacity:1}.support-card-header{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem}.support-card-icon{align-items:center;background:#5c60ff1a;border-radius:.75rem;box-shadow:0 4px 10px #0003;color:#5c60ff;display:flex;height:2.5rem;justify-content:center;padding:.625rem;transition:all .3s ease;width:2.5rem}.support-card:hover .support-card-icon{box-shadow:0 6px 15px #5c60ff4d;transform:scale(1.1) rotate(5deg)}.support-card-title{color:#e5e7eb;font-size:1.125rem;font-weight:700;margin:0}.support-card-body{color:#a1a8b3;font-size:.875rem;line-height:1.6}.support-card-body p{margin:0}.support-content{display:flex;flex-direction:column;gap:1.5rem}.support-step{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;display:flex;gap:1.25rem;padding:1.5rem;transition:all .3s ease}.support-step:hover{box-shadow:inset 0 1px 0 #ffffff0a,0 15px 35px #0009,0 6px 16px #0006;transform:translateY(-3px)}.step-number{align-items:center;background:linear-gradient(135deg,#5c60ff,#8b5cf6);border-radius:50%;box-shadow:0 4px 12px #5c60ff4d;color:#fff;display:flex;flex-shrink:0;font-size:1.125rem;font-weight:700;height:2.5rem;justify-content:center;width:2.5rem}.step-content h3{color:#e5e7eb;font-size:1rem;font-weight:700;margin:0 0 .5rem}.step-content p{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0}.support-faq{display:flex;flex-direction:column;gap:1rem}.faq-item{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;padding:1.5rem;transition:all .3s ease}.faq-item:hover{box-shadow:inset 0 1px 0 #ffffff0a,0 15px 35px #0009,0 6px 16px #0006;transform:translateY(-3px)}.faq-item h3{color:#e5e7eb;font-size:1rem;font-weight:700;margin:0 0 .75rem}.faq-item p{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:0}.support-contact{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.contact-card{align-items:center;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;display:flex;flex-direction:column;gap:1rem;padding:2rem;text-align:center;transition:all .3s ease}.contact-card:hover{border-color:#5c60ff4d;box-shadow:inset 0 1px 0 #ffffff0a,0 20px 40px #0009,0 8px 20px #0006,0 0 30px #5c60ff33;transform:translateY(-5px)}.contact-card svg{color:#5c60ff}.contact-card h3{color:#e5e7eb;font-size:1.25rem;font-weight:700;margin:0}.contact-card p{color:#a1a8b3;font-size:.875rem;margin:0}.contact-link{color:#5c60ff;font-weight:600;text-decoration:none;transition:color .3s ease}.contact-link:hover{color:#8b5cf6;text-decoration:underline}.legals-dropdown{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #00000080,0 4px 12px #0000004d;overflow:hidden;transition:all .3s ease}.legals-header{align-items:center;border-left:3px solid #0000;cursor:pointer;display:flex;justify-content:space-between;padding:1.5rem;transition:all .3s ease}.legals-header:hover{background:#5c60ff0d;border-left-color:#5c60ff99}.legals-title{align-items:center;display:flex;gap:.75rem}.legals-title svg{color:#5c60ff}.legals-title h2{color:#e5e7eb;font-size:1.25rem;font-weight:700;margin:0}.legals-header svg{color:#a1a8b3;transition:transform .3s ease}.legals-content{animation:slideDown .3s ease-out;max-height:600px;overflow-y:auto;padding:0 1.5rem 1.5rem}@keyframes slideDown{0%{max-height:0;opacity:0}to{max-height:600px;opacity:1}}.legal-section{border-bottom:1px solid #ffffff0a;padding:1.5rem 0}.legal-section:last-child{border-bottom:none}.legal-section h3{color:#fff;font-size:1.125rem;font-weight:700;margin:0 0 1rem}.legal-section p{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin:.75rem 0}.legal-section ul{list-style:none;margin:1rem 0;padding-left:0}.legal-section ul li{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin-bottom:.75rem;padding-left:1.5rem;position:relative}.legal-section ul li:before{color:#5c60ff;content:"•";font-weight:700;left:.5rem;position:absolute}.legal-section p strong,.legal-section ul li strong{color:#e5e7eb;font-weight:600}.legal-email{color:#5c60ff;font-weight:600;text-decoration:none;transition:color .2s ease}.legal-email:hover{color:#8b5cf6;text-decoration:underline}.modal-overlay{align-items:center;animation:fadeIn .2s ease-out;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:1rem;position:fixed;right:0;top:0;z-index:9999}.modal-content{animation:slideUp .3s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#141419f2;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 20px 60px #000c,0 10px 30px #0009;flex-shrink:0;margin:auto;max-height:90vh;max-width:600px;overflow:hidden;position:relative;width:90%}.help-modal-large{max-width:800px}.help-modal-body{padding:1.5rem 2rem}.help-modal-body h4{color:#e5e7eb;font-size:1.125rem;font-weight:700;margin-bottom:.75rem;margin-top:1.5rem}.help-modal-body h4:first-child{margin-top:0}.help-modal-body p{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin-bottom:1rem}.help-modal-body ul{list-style:none;margin:.75rem 0 1.5rem;padding-left:0}.help-modal-body ul li{color:#a1a8b3;font-size:.875rem;line-height:1.6;margin-bottom:.5rem;padding-left:1.5rem;position:relative}.help-modal-body ul li:before{color:#5c60ff;content:"•";font-weight:700;left:.5rem;position:absolute}.help-modal-body strong{color:#e5e7eb;font-weight:600}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-header{align-items:center;border-bottom:1px solid #ffffff0a;display:flex;justify-content:space-between;padding:1.5rem}.modal-header h3{color:#e5e7eb;font-size:1.25rem;font-weight:700;margin:0}.modal-close{align-items:center;background:none;border:none;border-radius:.5rem;color:#a1a8b3;cursor:pointer;display:flex;justify-content:center;padding:.5rem;transition:all .2s ease}.modal-close:hover{background:#ffffff0d;color:#fff}.modal-body{max-height:calc(90vh - 140px);overflow-y:auto;padding:1.5rem}.modal-footer{border-top:1px solid #ffffff0a;display:flex;gap:1rem;justify-content:flex-end;padding:1.5rem}.form-group{margin-bottom:1.5rem}.form-group label{color:#e5e7eb;display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem}.form-input,.form-textarea{background:#ffffff05;border:1px solid #ffffff14;border-radius:.625rem;box-sizing:border-box;color:#fff;font-family:inherit;font-size:.875rem;padding:.75rem 1rem;transition:all .3s ease;width:100%}.form-input:focus,.form-textarea:focus{background:#ffffff0a;border-color:#5c60ff;box-shadow:0 0 0 3px #5c60ff33;outline:none}.form-textarea{min-height:150px;resize:vertical}.form-input::placeholder,.form-textarea::placeholder{color:#9ca3af99}.submit-message{border-radius:.625rem;font-size:.875rem;font-weight:500;margin-bottom:1.5rem;padding:1rem}.submit-message-success{background:#10b9811a;border:1px solid #10b9814d;color:#34d399}.submit-message-error{background:#ef44441a;border:1px solid #ef44444d;color:#f87171}@media (max-width:1200px){.support-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:1024px){.support-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.support-container{padding:0}.support-section{margin-bottom:1.5rem}.section-title{font-size:1.25rem}.support-grid{gap:1rem}.support-contact,.support-grid{grid-template-columns:1fr}}@media (max-width:480px){.contact-card,.faq-item,.support-card,.support-step{padding:1rem}.section-title{font-size:1.125rem}.support-step{gap:1rem}.step-number{font-size:1rem;height:2rem;width:2rem}}.checkout-result-container{align-items:center;background:linear-gradient(135deg,#0a0b1e,#1a1b3e 50%,#0a0b1e);display:flex;justify-content:center;min-height:100vh;padding:2rem}.checkout-result-card{animation:fadeInUp .5s ease-out;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff05;border:1px solid #ffffff0d;border-radius:20px;box-shadow:0 8px 32px #0000004d,inset 0 0 0 1px #ffffff05;max-width:600px;padding:3rem;text-align:center;width:100%}.checkout-result-card.success{border-top:2px solid #22c55e4d}.checkout-result-card.cancel{border-top:2px solid #ef44444d}.checkout-result-icon{align-items:center;animation:scaleIn .6s ease-out .2s both;border-radius:50%;display:inline-flex;height:120px;justify-content:center;margin-bottom:2rem;width:120px}.checkout-result-icon.success{background:linear-gradient(135deg,#22c55e1a,#22c55e0d);border:2px solid #22c55e33;color:#22c55e}.checkout-result-icon.cancel{background:linear-gradient(135deg,#ef44441a,#ef44440d);border:2px solid #ef444433;color:#ef4444}.checkout-result-title{animation:fadeInUp .5s ease-out .3s both;color:#fff;font-size:2rem;font-weight:700;margin-bottom:1rem}.checkout-result-message{animation:fadeInUp .5s ease-out .4s both;color:#ffffffb3;font-size:1.1rem;line-height:1.6;margin-bottom:2rem}.checkout-result-details{animation:fadeInUp .5s ease-out .5s both;background:#ffffff05;border:1px solid #ffffff0d;border-radius:12px;margin-bottom:2rem;padding:1.5rem;text-align:left}.checkout-result-details h3{color:#fff;font-size:1.1rem;font-weight:600;margin-bottom:1rem}.checkout-result-details p{color:#ffffffb3;line-height:1.6;margin:0}.checkout-result-details ul{list-style:none;margin:0;padding:0}.checkout-result-details li{color:#ffffffb3;line-height:1.6;padding:.5rem 0 .5rem 1.5rem;position:relative}.checkout-result-details li:before{color:#22c55e;content:"✓";font-weight:700;left:0;position:absolute}.checkout-session-info{animation:fadeInUp .5s ease-out .6s both;background:#ffffff05;border-radius:8px;margin-bottom:2rem;padding:.75rem}.checkout-session-info small{color:#fff6;font-family:Courier New,monospace;font-size:.85rem}.checkout-result-button{align-items:center;animation:fadeInUp .5s ease-out .7s both;background:linear-gradient(135deg,#5c60ff,#4a4eff);border:none;border-radius:12px;box-shadow:0 4px 16px #5c60ff4d,inset 0 0 0 1px #ffffff1a;color:#fff;cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;gap:.5rem;padding:1rem 2rem;transition:all .3s ease}.checkout-result-button:hover{box-shadow:0 8px 24px #5c60ff66,inset 0 0 0 1px #fff3;transform:translateY(-2px)}.checkout-result-button:active{transform:translateY(0)}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (max-width:768px){.checkout-result-container{padding:1rem}.checkout-result-card{padding:2rem 1.5rem}.checkout-result-icon{height:100px;width:100px}.checkout-result-icon svg{height:48px;width:48px}.checkout-result-title{font-size:1.5rem}.checkout-result-message{font-size:1rem}.checkout-result-button{justify-content:center;padding:.875rem 1.5rem;width:100%}}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%;overflow-x:hidden;scroll-behavior:smooth}body{color:#b0b0b0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6}.app,body{background:#07080c}.app{display:flex;flex-direction:column;min-height:100vh;position:relative}.app:before{background:url(https://www.transparenttextures.com/patterns/asfalt-light.png) repeat;content:"";inset:0;opacity:.02;position:absolute;z-index:-1}.dashboard-layout{display:flex;min-height:100vh;width:100%}.sidebar{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-style:solid;border-width:1px;bottom:0;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;display:flex;flex-direction:column;left:0;padding:1.5rem 0;position:fixed;top:0;transition:all .3s ease;width:260px;z-index:100}.sidebar-collapsed{width:70px}.sidebar-toggle{align-items:center;background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:2px solid #141419cc;border-radius:50%;box-shadow:0 2px 8px #0000004d;cursor:pointer;display:flex;height:24px;justify-content:center;position:absolute;right:-12px;top:30px;transition:all .3s ease;width:24px;z-index:10}.sidebar-toggle:hover{box-shadow:0 4px 12px #5c60ff66;transform:scale(1.1)}.sidebar-logo{align-items:center;display:flex;gap:.875rem;justify-content:center;margin-bottom:2rem;padding:0 1.25rem}.sidebar-collapsed .sidebar-logo{justify-content:center;padding:0}.sidebar-hero{font-size:2.2rem!important;margin-bottom:0!important}.sidebar-hero.collapsed{display:flex;font-size:1rem!important;justify-content:center;width:100%}.sidebar-hero .icon-overlap{height:.8em;margin:0 .2em;width:.8em}.sidebar-hero.collapsed .icon-overlap{height:2rem;left:.5rem;margin:0 auto;position:relative;width:2rem}.sidebar-hero .hero-text{font-size:1em}.sidebar-hero .hero-badge{font-size:.4rem;height:1rem;margin-left:-.3rem;margin-top:.8rem;width:1rem}.sidebar-hero .hero-subtext{font-size:.5rem;margin-left:.1rem;margin-top:.8rem}.sidebar .icon-overlap__phone{stroke:url(#phone-gradient-nav)!important;fill:none;color:#0000}.sidebar .icon-overlap__arrow{color:#fff}.sidebar-nav{flex:1 1;overflow-y:auto;padding:0 .75rem}.sidebar-collapsed .sidebar-nav{padding:0}.nav-section{margin-bottom:1.5rem}.nav-section-title{color:#9ca3afcc;font-size:.75rem;font-weight:600;letter-spacing:.05em;margin-bottom:.75rem;padding:0 .75rem;text-transform:uppercase}.sidebar-collapsed .nav-section-title{display:none}.nav-item{align-items:center;border-radius:.75rem;color:#9ca3af;cursor:pointer;display:flex;gap:.75rem;margin-bottom:.25rem;padding:.75rem;text-decoration:none;transition:all .2s ease}.sidebar-collapsed .nav-item{justify-content:center;padding:.75rem 0}.nav-item:hover{background:#ffffff0d;color:#fff}.nav-item.active{background:#5c60ff26;color:#5c60ff}.nav-icon{flex-shrink:0;height:20px;width:20px}.sidebar-collapsed .nav-text{display:none}.sidebar-footer{border-top:1px solid #ffffff0a;padding:1rem 1.5rem}.sidebar-collapsed .sidebar-footer{display:flex;justify-content:center;padding:1rem 0}.content-area{flex:1 1;margin-left:260px;padding:1.5rem 2rem 2rem;transition:all .3s ease;width:calc(100% - 260px)}.content-area-expanded{margin-left:70px;width:calc(100% - 70px)}.dashboard-card,.device-card,.device-viewer,.empty-state,.glass-panel,.header,.loading-container{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006}.dashboard-card{display:flex;flex-direction:column;height:100%;padding:1.5rem;transition:all .3s ease}.dashboard-card:hover{box-shadow:inset 0 1px 0 #ffffff05,0 15px 40px #000000b3,0 8px 16px #00000080,0 0 30px #5c60ff33;transform:translateY(-3px)}.dashboard-card-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.dashboard-card-title{align-items:center;color:#e5e7eb;display:flex;font-size:1.125rem;font-weight:600;gap:.5rem}.dashboard-card-title svg{color:#5c60ff}.dashboard-card-content{flex:1 1}.dashboard-card-footer{align-items:center;border-top:1px solid #ffffff0a;display:flex;justify-content:space-between;margin-top:1rem;padding-top:1rem}.header{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:.75rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0009,0 4px 12px #0006;margin-bottom:2rem;position:relative;transition:all .3s ease;z-index:50}.header-content{justify-content:space-between;padding:1rem 1.5rem;width:100%}.header-content,.logo-section{align-items:center;display:flex}.logo-section{gap:.3rem}.logo-icon{display:inline-block;flex-shrink:0;height:3rem;position:relative;transition:all .3s ease;width:3rem}.logo-icon:hover{transform:scale(1.1)}.logo-icon-overlap{display:inline-block;height:3rem;position:relative;width:3rem}.logo-icon-overlap__arrow,.logo-icon-overlap__phone{height:2.5rem;left:85%;position:absolute;top:45%;transform-origin:center center;width:auto}.logo-icon-overlap__phone{stroke-width:.06rem;fill:none;stroke:url(#phone-gradient-nav);color:#0000;transform:translate(-50%,-48%) scale(.82) scaleX(1.1);z-index:1}.logo-icon-overlap__arrow{stroke-width:.06rem;animation:arrow-nudge-nav 2s ease-in-out infinite;color:#fff;left:59%;transform:translate(-50%,-48%) scale(.8);z-index:2}@keyframes arrow-nudge-nav{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-54%,-50%)}}.navbar-gradient-svg{height:0;pointer-events:none;position:absolute;width:0}.logo-text{align-items:center;display:flex;gap:.625rem}.logo-text h1{color:#f5f5f5;font-family:Roboto,sans-serif;font-size:1.75rem;font-weight:900;letter-spacing:-.02em;margin:0;text-shadow:-2px -2px 3px #ffffff40,2px 2px 3px #00000080,8px 8px 12px #0003;text-transform:uppercase;transition:all .3s ease}.logo-text h1:hover{text-shadow:-2px -2px 3px #ffffff59,2px 2px 3px #0009,8px 8px 12px #0000004d;transform:scale(1.05)}.logo-version{align-items:center;display:flex}.version-badge{align-items:center;background:linear-gradient(135deg,#5c60ff,#8b5cf6);border-radius:50%;box-shadow:0 4px 8px #0006,inset 0 1px 0 #ffffff26,0 0 15px #5c60ff66;color:#fff;display:inline-flex;font-size:.4rem;font-weight:700;height:1rem;justify-content:center;margin-left:-.8rem;margin-top:.2rem;text-transform:uppercase;transition:all .3s ease;width:1rem}.version-badge:hover{box-shadow:0 6px 12px #00000080,inset 0 1px 0 #fff3,0 0 20px #5c60ff99;transform:scale(1.1)}.nav{gap:1.5rem}.nav,.user-info{align-items:center;display:flex}.user-info{background:#ffffff08;border:1px solid #ffffff0d;border-radius:.75rem;box-sizing:border-box;color:#a1a8b3;font-size:.875rem;gap:.75rem;height:2.5rem;max-height:2.5rem;overflow:hidden;padding:.625rem 1rem;transition:all .3s ease;white-space:nowrap}.user-info:hover{background:#ffffff0d;color:#fff}.user-info span[style*=fontWeight]{color:#5c60ff!important;font-weight:600!important}.nav .btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;border-radius:.75rem;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:600;gap:.5rem;overflow:hidden;padding:.625rem 1rem;position:relative;text-decoration:none;transition:all .3s ease}.nav .btn:before{background:linear-gradient(90deg,#0000,#ffffff26,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.nav .btn:hover:before{left:100%}.nav .btn-primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.nav .btn-primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.nav .btn-secondary{background:#ffffff08;border:1px solid #ffffff14;box-shadow:0 2px 8px #0000001a;color:#e5e7eb}.nav .btn-secondary:hover{background:#ffffff14;border-color:#ffffff26;box-shadow:0 6px 16px #0003;color:#fff;transform:translateY(-2px)}.nav button[onClick*=handleLogout]{background:#ef44441a;border:1px solid #ef444433;color:#f87171}.nav button[onClick*=handleLogout]:hover{background:#ef444433;border-color:#ef444466;box-shadow:0 6px 16px #ef44444d;color:#fff;transform:translateY(-2px)}.dashboard-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(12,1fr);margin-bottom:2rem}.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-6{grid-column:span 6}.span-4{grid-column:span 4}.span-3{grid-column:span 3}.welcome-section{background:linear-gradient(135deg,#5c60ff33,#8b5cf61a);border:1px solid #5c60ff4d;border-radius:.875rem;margin-bottom:1.5rem;overflow:hidden;padding:1.25rem 1.5rem;position:relative}.welcome-section:before{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="none" stroke="rgba%28255,255,255,0.05%29" stroke-width="1" d="M10,10 L90,90 M30,10 L90,70 M50,10 L90,50 M70,10 L90,30 M10,30 L70,90 M10,50 L50,90 M10,70 L30,90"/></svg>') repeat;content:"";height:100%;opacity:.5;position:absolute;right:0;top:0;width:400px;z-index:0}.welcome-content{position:relative;z-index:1}.welcome-title{color:#e5e7eb;font-size:1.5rem;font-weight:700;margin-bottom:.375rem}.welcome-subtitle{color:#9ca3af;font-size:.9375rem;margin-bottom:0;max-width:700px}.welcome-actions{display:flex;gap:1rem}.stats-grid{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:repeat(2,minmax(100px,140px));margin-bottom:1.25rem;max-width:320px}.stat-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#14141999;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:.5rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 6px 16px #0006,0 3px 8px #00000040;display:flex;flex-direction:column;padding:.625rem;transition:all .3s ease}.stat-card:hover{box-shadow:inset 0 1px 0 #ffffff05,0 8px 20px #00000080,0 4px 10px #00000059,0 0 15px #5c60ff26;transform:translateY(-1px)}.stat-icon{align-items:center;border-radius:6px;display:flex;height:24px;justify-content:center;margin-bottom:.5rem;width:24px}.stat-icon svg{height:14px;width:14px}.stat-icon.blue{background:#3b82f626;color:#60a5fa}.stat-icon.green{background:#10b98126;color:#34d399}.stat-icon.red{background:#ef444426;color:#f87171}.stat-number{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fff,#a5a5a5);-webkit-background-clip:text;font-size:1.25rem;font-weight:700;margin-bottom:.25rem}.stat-number.blue{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#60a5fa,#3b82f6);-webkit-background-clip:text}.stat-number.green{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#34d399,#10b981);-webkit-background-clip:text}.stat-number.red{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f87171,#ef4444);-webkit-background-clip:text}.stat-label{color:#9ca3af;font-size:.625rem;font-weight:500;letter-spacing:.05em;text-align:left;text-transform:uppercase}.stat-change{align-items:center;display:flex;font-size:.625rem;gap:.25rem;margin-top:.375rem}.stat-change.positive{color:#34d399}.stat-change.negative{color:#f87171}.devices-section{margin-bottom:3rem}.section-header{justify-content:space-between;margin-bottom:1.5rem}.section-header,.section-title{align-items:center;display:flex}.section-title{color:#e5e7eb;font-size:1.5rem;font-weight:700;gap:.75rem;margin:0}.section-title svg{color:#5c60ff}.features-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(300px,340px));margin-bottom:3rem}.loading-container{align-items:center;color:#e5e7eb;display:flex;flex-direction:column;justify-content:center;padding:4rem 2rem;text-align:center}.loading-spinner{animation:spin 1.2s cubic-bezier(.55,.055,.675,.19) infinite;border:3px solid #5c60ff4d;border-radius:50%;border-top-color:#5c60ff;box-shadow:0 0 20px #5c60ff66;height:3rem;margin-bottom:1.5rem;width:3rem}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.empty-state{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14141966;border:1px solid #ffffff0d;border-radius:1rem;color:#e5e7eb;display:flex;flex-direction:column;gap:1.5rem;padding:4rem 2rem;text-align:center}.empty-icon{color:#9ca3af99;height:4rem;margin:0 auto 1.5rem;position:relative;width:4rem}.empty-icon:after{background:radial-gradient(circle,#5c60ff33 0,#0000 70%);border-radius:50%;content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}.empty-title{color:#e5e7eb;font-size:1.5rem;font-weight:600;margin-bottom:.75rem}.empty-description{color:#9ca3af;font-size:1rem;line-height:1.6;margin-bottom:2rem}.btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;border-radius:.75rem;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:600;gap:.5rem;padding:.75rem 1.5rem;text-decoration:none;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#5c60ff,#8b5cf6);box-shadow:0 4px 12px #5c60ff4d;color:#fff}.btn-primary:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.btn-secondary{background:#ffffff05;border:1px solid #ffffff14;box-shadow:0 2px 8px #0000001a;color:#e5e7eb}.btn-secondary:hover{background:#ffffff14;box-shadow:0 4px 12px #0003;color:#fff;transform:translateY(-1px)}.hero-title{align-items:center;color:#f5f5f5;display:inline-flex;font-family:Roboto,sans-serif;font-size:3.5rem;font-weight:900;letter-spacing:-.02em;margin-bottom:.375rem;margin-left:-2.5rem;text-shadow:0 1px 2px #00000080,0 0 1px rgba(0,0,0,.737);text-transform:uppercase}.hero-title .icon-overlap{display:inline-block;height:1em;margin:-.1em .3em 0;position:relative;width:1em}.icon-overlap__arrow,.icon-overlap__phone{height:100%;left:90%;position:absolute;top:45%;transform-origin:center center;width:auto}.icon-overlap__phone{stroke-width:.1rem;color:#5c5fff;transform:translate(-50%,-48%) scale(.82) scaleX(1.1);z-index:1}.icon-overlap__arrow{stroke-width:.1rem;animation:arrow-nudge 2s ease-in-out infinite;left:59%;transform:translate(-50%,-48%) scale(.8);z-index:2}@keyframes arrow-nudge{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-54%,-50%)}}.icon-overlap__phone,.icon-overlap__phone path{stroke:url(#phone-gradient)!important;stroke-width:.08rem;fill:none;color:#0000;transform:translate(-50%,-48%) scale(.82) scaleX(1.1)}.hero-text{text-shadow:-2px -2px 3px #ffffff40,2px 2px 3px #00000080,8px 8px 12px #0003}.hero-badge{align-items:center;background:#5c60ff;border-radius:50%;box-shadow:0 4px 8px #0006,inset 0 1px 0 #ffffff26;color:#fff;display:inline-flex;font-size:.5rem;font-weight:700;height:1.2rem;justify-content:center;letter-spacing:.01em;line-height:1;margin-left:-.5rem;margin-top:1.4rem;text-transform:uppercase;transform:translateY(-.15em);width:1.2rem}.hero-subtext{color:#a0a0a07e;font-size:.8rem;letter-spacing:.1em;margin-left:.2rem;margin-top:1.6rem;text-transform:uppercase}@media (max-width:480px){.hero-title{font-size:4rem;margin-left:-3rem}.hero-title .icon-overlap{margin-top:.1rem}.hero-badge{font-size:.4rem;height:1rem;margin-left:-.4rem;margin-top:.9rem;transform:translateY(-.1em);width:1rem}.hero-subtext{font-size:.6rem;margin-top:1.2rem}}.login-container{align-items:center;background:#07080c;display:flex;justify-content:center;min-height:100vh;padding:1rem;position:relative}.login-container:before{background:url(https://www.transparenttextures.com/patterns/asfalt-light.png) repeat;content:"";inset:0;opacity:.02;position:absolute;z-index:-1}.login-card{animation:fadeInUp .6s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#141419cc;border-color:#ffffff14 #0000004d #0000004d #ffffff14;border-radius:1.25rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff05,0 25px 50px #000c,0 10px 25px #0009;max-width:420px;padding:2rem 2.5rem;width:100%}.login-header{margin-bottom:1.75rem;text-align:center}.login-logo{align-items:center;display:flex;flex-wrap:nowrap;gap:.375rem;justify-content:center;margin-bottom:1.5rem}.login-logo .logo-icon{display:inline-block;flex-shrink:0;height:3.5rem;position:relative;transition:all .3s ease;width:3.5rem}.login-logo .logo-icon:hover{transform:scale(1.1)}.login-logo .logo-icon-overlap{display:inline-block;height:3.5rem;position:relative;width:3.5rem}.login-logo-text{flex-shrink:0}.login-logo-text h1{color:#f5f5f5;font-family:Roboto,sans-serif;font-size:2.25rem;font-weight:900;letter-spacing:-.02em;margin:0;text-shadow:-2px -2px 3px #ffffff40,2px 2px 3px #00000080;text-transform:uppercase;white-space:nowrap}.login-version-badge{align-items:center;background:#5c60ff;border-radius:50%;box-shadow:0 4px 8px #0006;color:#fff;display:inline-flex;flex-shrink:0;font-size:.6rem;font-weight:700;height:1.25rem;justify-content:center;margin:0 -.15rem 0 -.4rem;position:relative;text-transform:uppercase;top:.2rem;width:1.25rem}.login-pronunciation{color:#9ca3af;flex-shrink:0;font-family:"Noto Sans, Arial, sans-serif";font-size:.8rem;position:relative;top:.45rem}.login-title{color:#e5e7eb;font-size:1.25rem;font-weight:600;margin:0 0 .375rem}.login-subtitle{color:#9ca3af;font-size:.9rem;margin:0}.login-form{display:flex;flex-direction:column;gap:1.25rem}.login-error{align-items:center;background:#ef44441a;border:1px solid #ef44444d;border-radius:.625rem;display:flex;gap:.625rem;padding:.75rem}.login-error-icon{color:#ef4444;flex-shrink:0;height:1.125rem;width:1.125rem}.login-error-text{color:#ef4444;font-size:.85rem}.login-field{display:flex;flex-direction:column}.login-label{color:#e5e7eb;font-size:.85rem;font-weight:600;margin-bottom:.5rem}.login-input{background:#ffffff05;border:1px solid #ffffff14;border-radius:.625rem;box-sizing:border-box;color:#fff;font-size:.875rem;padding:.75rem 1rem;transition:all .3s ease;width:100%}.login-input:focus{background:#ffffff0a;border-color:#5c60ff;box-shadow:0 0 0 3px #5c60ff33;outline:none}.login-input::placeholder{color:#9ca3af99}.login-button{align-items:center;background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.625rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;display:flex;font-size:.9375rem;font-weight:600;gap:.5rem;justify-content:center;padding:.875rem 1.125rem;transition:all .3s ease;width:100%}.login-button:hover:not(:disabled){background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}.login-button:disabled{background:#4b556380;box-shadow:none;cursor:not-allowed;transform:none}.login-button-spinner{animation:spin 1s linear infinite;border:2px solid #fff;border-radius:50%;border-top-color:#0000;height:1.25rem;width:1.25rem}.login-demo{border-top:1px solid #4b55634d;margin-top:2rem;padding-top:2rem;text-align:center}.login-demo-text{color:#9ca3af;font-size:.9rem;margin-bottom:1rem}.login-demo-button{background:#ffffff05;border:1px solid #ffffff14;border-radius:.75rem;color:#d1d5db;cursor:pointer;font-size:.9rem;padding:.75rem 1.25rem;transition:all .3s ease}.login-demo-button:hover{background:#ffffff14;color:#fff}.login-footer{color:#9ca3af;font-size:.8125rem;margin-top:1.75rem;text-align:center}.login-footer p{margin:.25rem 0}.mobile-logo-768{display:none}.mobile-logo-768 .hero-title{align-items:center;color:#f5f5f5;display:inline-flex;font-family:Roboto,sans-serif;font-size:2rem;font-weight:900;letter-spacing:-.02em;margin:0 0 0 -15px;text-shadow:0 1px 2px #00000080,0 0 1px rgba(0,0,0,.737);text-transform:uppercase}.mobile-logo-768 .hero-title .icon-overlap{display:inline-block;height:1em;margin:0 .3em;position:relative;width:1em}.mobile-logo-768 .icon-overlap__arrow,.mobile-logo-768 .icon-overlap__phone{height:100%;left:90%;position:absolute;top:43%;transform-origin:center center;width:auto}.mobile-logo-768 .icon-overlap__phone{stroke-width:.1rem;color:#5c5fff;transform:translate(-50%,-48%) scale(.82) scaleX(1.1);z-index:1}.mobile-logo-768 .icon-overlap__arrow{stroke-width:.1rem;animation:arrow-nudge 2s ease-in-out infinite;left:59%;transform:translate(-50%,-48%) scale(.8);z-index:2}.mobile-logo-768 .icon-overlap__phone,.mobile-logo-768 .icon-overlap__phone path{stroke:url(#phone-gradient)!important;stroke-width:.1rem;fill:none;color:#0000;transform:translate(-50%,-48%) scale(.82) scaleX(1.1)}.mobile-logo-768 .hero-text{text-shadow:-2px -2px 3px #ffffff40,2px 2px 3px #00000080,8px 8px 12px #0003}.mobile-logo-768 .hero-badge{align-items:center;background:#5c60ff;border-radius:50%;box-shadow:0 4px 8px #0006,inset 0 1px 0 #ffffff26;color:#fff;display:inline-flex;font-size:.65rem;font-weight:700;height:1rem;justify-content:center;letter-spacing:.01em;line-height:1;margin-left:1.2rem;margin-top:.7rem;text-transform:uppercase;transform:translateY(-.15em);width:1rem}.mobile-logo-768 .hero-subtext{color:#a0a0a07e;font-size:.8rem;letter-spacing:.1em;margin-left:.2rem;margin-top:2.2rem;text-transform:uppercase}@media (max-width:480px){.mobile-logo-768 .hero-title{font-size:1.5rem}.mobile-logo-768 .hero-badge{font-size:.4rem;height:1rem;margin-left:-.4rem;margin-top:.9rem;transform:translateY(-.1em);width:1rem}.mobile-logo-768 .hero-subtext{font-size:.6rem;margin-top:1.2rem}}.desktop-only{display:flex}.mobile-logout,.tablet-logo{display:none}@media (min-width:993px){.tablet-logo{display:none!important}}@media (max-width:1200px){.stats-grid{grid-template-columns:repeat(3,1fr)}.dashboard-grid .span-3{grid-column:span 4}.dashboard-grid .span-4,.dashboard-grid .span-6{grid-column:span 6}.dashboard-grid .span-8{grid-column:span 12}}@media (max-width:992px){.sidebar{display:none!important}.sidebar-toggle{display:none}.dashboard-title{display:none!important}.tablet-logo{display:flex!important}.tablet-logo .icon-overlap__phone{stroke:url(#phone-gradient-nav)!important;fill:none;color:#0000}.tablet-logo .icon-overlap__arrow{color:#fff}.sidebar.sidebar-visible{transform:translateX(0)}.content-area{margin-left:0;width:100%}.sidebar-toggle{background:#5c60ff;right:-50px}.features-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.stats-grid{gap:1rem;grid-template-columns:repeat(2,1fr)}.dashboard-grid .span-3,.dashboard-grid .span-4{grid-column:span 6}.dashboard-grid .span-12,.dashboard-grid .span-6,.dashboard-grid .span-8{grid-column:span 12}}@media (max-width:768px){.sidebar{display:none!important}.content-area{margin-left:0!important;width:100%!important}.dashboard-title,.tablet-logo{display:none!important}.mobile-logo-768{display:flex!important;flex-shrink:1;min-width:0;transform:translateX(0)}.mobile-logo-768 .hero-title{font-size:2rem!important}.mobile-logo-768 .hero-text{margin-left:-.1rem}.mobile-logo-768 .hero-badge{margin-left:-.2rem}.mobile-logout{display:flex;flex-shrink:0}.header-content{align-items:center;flex-direction:row;gap:.5rem;justify-content:space-between;padding:.75rem 1rem}.tablet-logo .hero-title{font-size:1.5rem!important}.tablet-logo .icon-overlap{height:.6em;width:.6em}.tablet-logo .hero-text{font-size:1em}.tablet-logo .hero-badge{font-size:.35rem;height:.8rem;margin-left:-.25rem;margin-top:.6rem;width:.8rem}.nav{align-items:center;flex-direction:row;gap:.5rem}.user-info{display:none!important}.mobile-logout{font-size:.875rem!important;padding:.625rem .75rem!important}.mobile-logout svg{height:16px;width:16px}.dashboard-grid{grid-template-columns:1fr}.dashboard-grid .span-12,.dashboard-grid .span-3,.dashboard-grid .span-4,.dashboard-grid .span-6,.dashboard-grid .span-8{grid-column:span 1}.welcome-section{margin-bottom:1rem;padding:1rem 1.25rem}.welcome-title{font-size:1.125rem}.welcome-subtitle{font-size:.8125rem}.stats-grid{gap:.5rem;grid-template-columns:repeat(2,1fr);margin-bottom:1rem;max-width:100%}.stat-card{padding:.5rem}.stat-number{font-size:1.125rem}.stat-icon{border-radius:4px;height:20px;margin-bottom:.25rem;width:20px}.stat-icon svg{height:12px;width:12px}.stat-change,.stat-label{font-size:.55rem}.stat-change{align-items:center;display:flex;min-height:1.5rem}.section-header.mobile-hide{display:none}.section-header{flex-direction:column;gap:1rem;text-align:center}.section-header .btn{justify-content:center;width:100%}}@media (max-width:480px){.header{margin-bottom:1.5rem}.header-content{gap:.5rem;padding:.5rem .75rem}.tablet-logo .hero-title{font-size:1.2rem!important}.tablet-logo .icon-overlap{height:.5em;width:.5em}.tablet-logo .hero-text{font-size:1em}.tablet-logo .hero-badge{font-size:.3rem;height:.6rem;margin-left:-.2rem;margin-top:.5rem;width:.6rem}.nav{gap:.5rem}.user-info{font-size:.65rem;padding:.25rem .5rem}.logo-section{gap:.5rem}.logo-icon{height:2.5rem;width:2.5rem}.logo-text h1{font-size:1.5rem}.version-badge{font-size:.6rem;height:1.5rem;width:1.5rem}.pronunciation{font-size:.75rem}.content-area{padding:1rem}.welcome-title{font-size:1.5rem}.stat-number{font-size:1.75rem}.features-grid{grid-template-columns:1fr}.login-card{padding:1.5rem 1.75rem}}.bottom-nav{align-items:center;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#141419f2;border-top:1px solid #ffffff14;bottom:0;box-shadow:0 -4px 20px #0006;display:none;height:65px;justify-content:space-around;left:0;padding:0 .5rem env(safe-area-inset-bottom,0);position:fixed;right:0;z-index:1000}.bottom-nav-item{-webkit-tap-highlight-color:transparent;align-items:center;border-radius:.75rem;color:#9ca3af;cursor:pointer;display:flex;flex:1 1;flex-direction:column;gap:.25rem;justify-content:center;max-width:100px;padding:.5rem 1rem;position:relative;transition:all .3s ease;-webkit-user-select:none;user-select:none}.bottom-nav-item svg{height:20px;transition:all .3s ease;width:20px}.bottom-nav-item span{font-size:.625rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;transition:all .3s ease}.bottom-nav-item:active{transform:scale(.95)}.bottom-nav-item.active{background:#5c60ff1a;color:#5c60ff}.bottom-nav-item.active svg{transform:scale(1.1)}.content-with-bottom-nav{padding-bottom:calc(65px + env(safe-area-inset-bottom, 0px))!important}@media (max-width:768px){.bottom-nav{display:flex}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in-up{animation:fadeInUp .4s ease-out forwards}.fade-in{animation:fadeIn .4s ease-out forwards;opacity:0}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}.welcome-popup-overlay{align-items:center;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:9999}.welcome-popup{animation:fadeInUp .4s ease-out;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);background:#141419f2;border-color:#ffffff1f #0006 #0006 #ffffff1f;border-radius:1.25rem;border-style:solid;border-width:1px;box-shadow:inset 0 1px 0 #ffffff0a,0 25px 60px #000c,0 10px 30px #0009,0 0 40px #5c60ff33;max-width:480px;overflow:hidden;width:100%}.welcome-popup:before{background:linear-gradient(90deg,#00fff0,#00a6ff,#f0f,#ff006a);border-radius:1.25rem 1.25rem 0 0;content:"";height:4px;left:0;position:absolute;right:0;top:0}.welcome-popup-content{padding:2rem 2rem 1.75rem;position:relative;text-align:center}.welcome-popup-title{color:#e5e7eb;font-size:1.5rem;font-weight:700;line-height:1.3;margin-bottom:1rem}.welcome-popup-subtitle{color:#9ca3af;font-size:.9375rem;line-height:1.6;margin-bottom:1.5rem}.welcome-popup-dismiss{background:linear-gradient(135deg,#5c60ff,#8b5cf6);border:none;border-radius:.75rem;box-shadow:0 4px 12px #5c60ff4d;color:#fff;cursor:pointer;font-size:.9375rem;font-weight:600;padding:.75rem 2rem;transition:all .3s ease}.welcome-popup-dismiss:hover{background:linear-gradient(135deg,#6366f1,#9333ea);box-shadow:0 8px 20px #5c60ff66;transform:translateY(-2px)}@media (max-width:480px){.welcome-popup{margin:1rem;max-width:calc(100% - 2rem)}.welcome-popup-content{padding:1.5rem 1.25rem 1.25rem}.welcome-popup-title{font-size:1.25rem}.welcome-popup-subtitle{font-size:.875rem}}
/*# sourceMappingURL=main.32d072d5.css.map*/