:root{--primary-orange: #ff6b35;--primary-blue: #004e89;--accent-orange: #ff8c42;--accent-blue: #0077b6;--text-dark: #ffffff;--text-light: #b0b0b0;--bg-dark: #0a0e27;--bg-darker: #050810;--bg-card: #141829;--bg-light: #1a1f3a;--bg-white: #1a1f3a;--border-light: #2a3050;--border-dark: #1a1f3a;--success: #10b981;--danger: #ff4444;--warning: #f59e0b;--space-xs: clamp(.25rem, .5vw, .5rem);--space-sm: clamp(.5rem, 1vw, .75rem);--space-md: clamp(.75rem, 1.5vw, 1.25rem);--space-lg: clamp(1rem, 2vw, 2rem);--space-xl: clamp(1.5rem, 3vw, 3rem);--space-2xl: clamp(2rem, 4vw, 4rem);--font-xs: clamp(.7rem, .8vw + .4rem, .8rem);--font-sm: clamp(.8rem, .9vw + .4rem, .9rem);--font-base: clamp(.9rem, 1vw + .4rem, 1rem);--font-md: clamp(1rem, 1.2vw + .4rem, 1.2rem);--font-lg: clamp(1.2rem, 1.5vw + .5rem, 1.5rem);--font-xl: clamp(1.5rem, 2vw + .5rem, 2rem);--font-2xl: clamp(1.8rem, 2.5vw + .5rem, 2.5rem);--font-3xl: clamp(2rem, 3vw + .5rem, 3.5rem);--sidebar-width: 280px;--sidebar-collapsed-width: 0px;--banner-height: 80px;--banner-height-mobile: 60px;--touch-min: 44px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-dark);background-color:var(--bg-light)}#root{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}a{color:var(--primary-orange);text-decoration:none;transition:color .3s ease}a:hover{color:var(--accent-orange);text-decoration:underline}button{cursor:pointer;border:none;border-radius:.5rem;padding:.625rem 1.25rem;font-weight:600;transition:all .3s ease;font-family:inherit;font-size:.95rem}button.primary{background-color:var(--primary-orange);color:#fff}button.primary:hover{background-color:var(--accent-orange);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b354d}button.secondary{background-color:var(--primary-blue);color:#fff}button.secondary:hover{background-color:var(--accent-blue);transform:translateY(-2px);box-shadow:0 4px 12px #004e894d}button.danger{background-color:var(--danger);color:#fff}button.danger:hover{background-color:#dc2626;transform:translateY(-2px)}button:disabled{opacity:.6;cursor:not-allowed}input,textarea,select{padding:.75rem;border:2px solid var(--border-light);border-radius:.375rem;font-family:inherit;font-size:1rem;transition:border-color .3s ease,box-shadow .3s ease;background-color:var(--bg-card);color:var(--text-dark)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary-orange);box-shadow:0 0 0 3px #ff6b3533}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}.responsive-grid{display:grid;gap:var(--space-md);grid-template-columns:1fr}@media(min-width:480px){.responsive-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}@media(min-width:1200px){.responsive-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}}.card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:12px;padding:var(--space-md);overflow:hidden;word-wrap:break-word}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}@media(max-width:899px){button,.btn,.nav-link,a.interactive{min-height:var(--touch-min);min-width:var(--touch-min);padding:var(--space-sm) var(--space-md)}input,textarea,select{min-height:48px;font-size:16px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}*:focus-visible{outline:3px solid var(--primary-orange);outline-offset:2px}@media(prefers-contrast:high){button,input,textarea,select,.card{border-width:2px}}html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{body{background:#fff;color:#000}.sidebar,button,.hamburger-toggle{display:none}}.banner{background:linear-gradient(135deg,#050810,#0a0e1a);border-bottom:3px solid var(--primary-orange);padding:0 2rem;padding-top:max(0px,var(--safe-top));padding-left:max(2rem,var(--safe-left));padding-right:max(2rem,var(--safe-right));height:var(--banner-height);box-shadow:0 4px 15px #00000080;position:fixed;top:0;left:0;right:0;z-index:1001;display:flex;align-items:center}.banner-content{width:100%;max-width:1400px;margin:0 auto;display:flex;justify-content:center;align-items:center;position:relative}.banner-logo h1{font-size:2rem;margin:0;font-weight:800;text-align:center}.pyre{color:var(--primary-orange);text-shadow:0 0 20px rgba(255,107,53,.5)}.tagline{margin:.25rem 0 0;font-size:.9rem;color:var(--text-light);text-align:center}.tagline .orange{color:var(--primary-orange)}.tagline .blue{color:#1a5a8f;text-shadow:0 0 10px rgba(26,90,143,.5)}@media(max-width:639px){.banner{padding:0 var(--space-sm);padding-left:max(var(--space-sm),var(--safe-left));padding-right:max(var(--space-sm),var(--safe-right));height:var(--banner-height-mobile)}.banner-content{justify-content:center;gap:var(--space-sm);padding-left:52px}.banner-logo h1{font-size:var(--font-xl)}.tagline{display:none}}@media(min-width:640px)and (max-width:899px){.banner{padding:0 var(--space-md);padding-left:max(var(--space-md),var(--safe-left));padding-right:max(var(--space-md),var(--safe-right))}.banner-content{gap:var(--space-md);padding-left:52px}.banner-logo h1{font-size:var(--font-2xl)}.tagline{font-size:var(--font-sm)}}.hamburger-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;background:transparent;border:none;cursor:pointer;padding:8px;position:absolute;left:0;z-index:1002;transition:transform .3s ease}.hamburger-toggle:hover{transform:scale(1.05)}.hamburger-line{width:28px;height:3px;background-color:var(--text-dark);border-radius:2px;transition:all .3s ease;display:block}.hamburger-toggle.open .hamburger-line:nth-child(1){transform:rotate(45deg) translate(7px,7px)}.hamburger-toggle.open .hamburger-line:nth-child(2){opacity:0}.hamburger-toggle.open .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}@media(max-width:899px){.hamburger-toggle{display:flex}}@media(min-width:900px){.hamburger-toggle{display:none}}@media(prefers-reduced-motion:reduce){.hamburger-toggle,.hamburger-line{transition:none}}.sidebar-toggle{display:none!important}.sidebar{width:var(--sidebar-width);background:linear-gradient(180deg,#141829,#0a0e27);border-right:2px solid rgba(255,107,53,.2);padding:0;padding-left:max(0px,var(--safe-left));display:flex;flex-direction:column;position:fixed;left:0;top:var(--banner-height);bottom:0;height:calc(100vh - var(--banner-height));height:calc(100dvh - var(--banner-height));overflow:hidden;z-index:1000;transition:transform .3s ease}@media(max-width:899px){.sidebar{width:min(320px,85vw);top:0;height:100vh;height:100dvh;transform:translate(-100%);box-shadow:4px 0 12px #00000080;padding-top:max(var(--banner-height-mobile),var(--safe-top))}.sidebar.open{transform:translate(0)}}@media(min-width:900px){.sidebar{transform:translate(0)}}.sidebar-backdrop{position:fixed;inset:0;background:#00000080;z-index:999;opacity:0;pointer-events:none;transition:opacity .3s ease}.sidebar-backdrop.visible{opacity:1;pointer-events:auto}@media(min-width:900px){.sidebar-backdrop{display:none}}.sidebar-account{padding:1.5rem;background:#004e891a;border-top:2px solid rgba(255,107,53,.2);margin-top:auto}.account-section{margin-bottom:1rem}.section-label{font-size:.75rem;text-transform:uppercase;color:var(--text-light);letter-spacing:1px;margin:0 0 .5rem;font-weight:700}.user-name{font-size:1.1rem;color:var(--primary-orange);font-weight:700;margin:0}.logout-btn{width:100%;background:linear-gradient(135deg,var(--primary-orange) 0%,var(--accent-orange) 100%);color:#fff;border:none;padding:.75rem 1rem;border-radius:.5rem;cursor:pointer;font-weight:600;transition:all .3s ease}.logout-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ff6b3566}.sidebar-logout,.sidebar-signin{padding:1.5rem;background:#004e891a;border-top:2px solid rgba(255,107,53,.2);margin-top:auto}.sidebar-signin-wrapper{padding:0 1.5rem}.signin-btn{display:block;width:calc(100% - 2rem);background:linear-gradient(135deg,var(--primary-orange) 0%,var(--accent-orange) 100%);color:#fff;border:none;padding:.75rem 1rem;border-radius:.5rem;cursor:pointer;font-weight:600;transition:all .3s ease;text-align:center;text-decoration:none;font-size:.95rem}.signin-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ff6b3566}.sidebar-nav{display:flex;flex-direction:column;flex:1;min-height:0;padding:0 0 1.5rem;overflow-y:auto;overflow-x:hidden}.nav-label{padding:0 1.5rem;margin-bottom:.5rem}.nav-item{padding:.875rem 1.5rem;color:var(--text-dark);text-decoration:none;transition:all .3s ease;border-left:4px solid transparent;display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:.95rem}.nav-item-wrapper{border-left:4px solid transparent;transition:all .3s ease}.nav-item-wrapper .nav-item{padding:.875rem 1.5rem;border-left:none}.nav-item a{color:inherit;text-decoration:none;flex:1}.edit-icon{opacity:0;font-size:.85rem;padding:.25rem .5rem;transition:opacity .2s;background:none;border:none;color:inherit;cursor:pointer;font-family:inherit}.nav-item:hover .edit-icon{opacity:1}.nav-item:hover{background-color:#ff6b351a;color:var(--primary-orange)}.nav-item-wrapper:hover{background-color:#ff6b351a;border-left-color:var(--primary-orange)}.nav-item-wrapper:hover .nav-item{color:var(--primary-orange)}.nav-item.active{background-color:#ff6b3526;border-left-color:var(--primary-orange);color:var(--primary-orange)}.nav-item-wrapper.active{background-color:#ff6b3526;border-left-color:var(--primary-orange)}.nav-item-wrapper.active .nav-item{color:var(--primary-orange)}.nav-item.active a,.nav-item-wrapper.active .nav-item a:first-child{pointer-events:none;cursor:default}.nav-item-wrapper.active .edit-icon{pointer-events:auto;opacity:1}.nav-empty{padding:1rem 1.5rem;color:#888;font-size:.85rem;font-style:italic}.nav-empty p{margin:0}.admin-section{padding:1.5rem 0;border-top:2px solid rgba(255,107,53,.2);margin-top:auto}.admin-section .section-label{padding:0 1.5rem;margin-bottom:.5rem}.admin-section .nav-item{padding:.875rem 1.5rem}.admin-nav{display:flex;flex-direction:column;flex:0 0 auto;padding:1.5rem 0;border-top:2px solid rgba(255,107,53,.2);margin-top:auto;max-height:250px;overflow-y:auto;overflow-x:hidden}.admin-label{padding:0 1.5rem;margin-bottom:.5rem}.sidebar-user-section{padding:1rem 1.5rem;background:#004e891a;border-top:2px solid rgba(255,107,53,.2);margin-top:auto}.user-info{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.auth-level-badge{font-size:.65rem;padding:.2rem .5rem;border-radius:4px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.auth-level-badge.high{background:#28a74533;color:#28a745;border:1px solid rgba(40,167,69,.3)}.auth-level-badge.low{background:#ffc10733;color:#ffc107;border:1px solid rgba(255,193,7,.3)}.auth-level-badge.user{background:#2196f333;color:#2196f3;border:1px solid rgba(33,150,243,.3)}.admin-nav.locked{opacity:.8}.lock-indicator{color:#ffc107;margin-left:.25rem;font-weight:700}.admin-locked-notice{display:flex;flex-direction:column;gap:.5rem;padding:.75rem 1.5rem;background:#ffc1071a;border-left:3px solid #ffc107;margin-bottom:.5rem}.admin-locked-notice span{font-size:.75rem;color:#ffffffb3}.elevate-btn{background:linear-gradient(135deg,#ffc107,#ff8c00);color:#1a1a2e;border:none;padding:.5rem 1rem;border-radius:4px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s}.elevate-btn:hover{transform:translateY(-1px);box-shadow:0 2px 8px #ffc1074d}.nav-item-wrapper.disabled{opacity:.5}.nav-item-wrapper.disabled:hover{background-color:transparent;border-left-color:transparent}.nav-item-wrapper.disabled:hover .nav-item{color:inherit}.locked-link{cursor:not-allowed}@media(prefers-reduced-motion:reduce){.sidebar,.sidebar-backdrop{transition:none}}@media(max-width:899px)and (orientation:landscape){.sidebar.open{width:min(280px,40vw)}}.elevation-modal-backdrop{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1002;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:var(--space-md)}.elevation-modal{background:linear-gradient(180deg,#1a1f36,#0d1025);border:1px solid rgba(255,193,7,.3);border-radius:16px;padding:var(--space-lg);max-width:400px;width:100%;box-shadow:0 8px 32px #00000080;max-height:90vh;max-height:90dvh;overflow-y:auto}.elevation-modal-header{text-align:center;margin-bottom:var(--space-lg)}.elevation-modal-header h2{font-size:var(--font-lg);margin-bottom:var(--space-sm);color:#ffc107}.elevation-modal-header p{font-size:var(--font-sm);color:#fff9;margin:0}.elevation-error{background:#dc35451a;border:1px solid rgba(220,53,69,.3);border-radius:8px;padding:var(--space-sm);margin-bottom:var(--space-md);color:#ff6b6b;font-size:var(--font-sm);text-align:center}.elevation-form-group{margin-bottom:var(--space-lg)}.elevation-form-group label{display:block;margin-bottom:var(--space-sm);font-weight:600;color:#ffffffe6;font-size:var(--font-sm)}.elevation-form-group input{width:100%;padding:var(--space-md);min-height:var(--touch-min);background:#0000004d;border:2px solid rgba(255,193,7,.2);border-radius:10px;color:#fff;font-size:var(--font-lg);text-align:center;letter-spacing:.25rem;transition:all .2s}.elevation-form-group input:focus{outline:none;border-color:#ffc107;background:#0006}.elevation-form-group input::placeholder{letter-spacing:0;font-size:var(--font-sm)}.elevation-buttons{display:flex;gap:var(--space-md);flex-wrap:wrap}.elevation-btn{flex:1;min-width:120px;padding:var(--space-md) var(--space-lg);min-height:var(--touch-min);border:none;border-radius:8px;font-weight:600;font-size:var(--font-base);cursor:pointer;transition:all .2s}.elevation-btn:disabled{opacity:.5;cursor:not-allowed}.elevation-btn.cancel{background:#ffffff1a;color:#fffc;border:1px solid rgba(255,255,255,.2)}.elevation-btn.cancel:hover:not(:disabled){background:#ffffff26}.elevation-btn.confirm{background:linear-gradient(135deg,#ffc107,#ff8c00);color:#1a1a2e}.elevation-btn.confirm:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #ffc10766}.elevation-info{margin-top:var(--space-lg);text-align:center}.elevation-info small{color:#ffffff80;font-size:var(--font-xs)}@media(max-width:479px){.elevation-modal{padding:var(--space-md);max-width:100%}.elevation-buttons{flex-direction:column}.elevation-btn{width:100%}.elevation-form-group input{font-size:var(--font-md)}}@media(prefers-reduced-motion:reduce){.elevation-btn{transition:none}}.home-container{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;background-color:#0a0a0a}.home-content{display:flex;flex:1;overflow:hidden;margin-top:var(--banner-height-mobile)}@media(min-width:640px){.home-content{margin-top:var(--banner-height)}}.public-main{flex:1;overflow-y:auto;padding:var(--space-md);display:flex;align-items:center;justify-content:center;width:100%}.home-page{text-align:center;max-width:800px;padding:var(--space-lg);width:100%}.slogan h1{font-size:var(--font-3xl);font-weight:800;margin-bottom:var(--space-md)}.pyre{color:#ff6b35;text-shadow:0 0 20px rgba(255,107,53,.5)}.haven{color:#1a5a8f;text-shadow:0 0 20px rgba(26,90,143,.6)}.subtitle{font-size:var(--font-lg);margin-bottom:var(--space-xl)}.update-banner{background:linear-gradient(135deg,#ff6b35,#ff8c42,#0099d8);padding:var(--space-lg);border-radius:8px;margin-bottom:var(--space-xl);font-weight:600;color:#fff}.update-banner p{margin:0;font-size:var(--font-md)}.vc-link{color:#fff;text-decoration:underline;font-weight:700;transition:opacity .2s}.vc-link:hover{opacity:.8}.orange{color:#ff6b35}.blue{color:#1a5a8f}.emberclash-text{background:linear-gradient(135deg,#ff6b35,#ff8c42,#0099d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}.yellow{color:gold;font-weight:700}.black{color:#fff;font-weight:700}.coming-soon{margin:var(--space-xl) 0}.coming-soon h2{font-size:var(--font-2xl);color:#fff;font-weight:600}.call-to-action{margin-top:var(--space-xl)}.call-to-action p{margin-bottom:var(--space-lg);font-size:var(--font-md);color:#ccc}.call-to-action button.primary{background-color:#ff6b35;color:#fff;border:none;padding:var(--space-md) var(--space-lg);font-size:var(--font-md);border-radius:8px;cursor:pointer;transition:background-color .2s}.call-to-action button.primary:hover{background-color:#ff8555}.description{margin-top:var(--space-lg);text-align:left;line-height:1.6;color:#e0e0e0}.description p{margin-bottom:var(--space-lg);font-size:var(--font-base)}.links{margin-top:var(--space-lg);text-align:center;line-height:1.8;color:#e0e0e0;font-size:var(--font-md)}.links p{margin:var(--space-sm) 0}.inline-button{text-decoration:none;font-weight:800;padding:2px 6px;border-radius:4px;transition:background .2s}.links p:nth-child(1) .inline-button{color:gold}.links p:nth-child(2) .inline-button{background:linear-gradient(135deg,#ff6b35,#ff8c42,#0099d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.links p:nth-child(3) .inline-button{color:#fff;background:#000;padding:2px 6px}.links-layout{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);margin-top:var(--space-xl)}.link-text{font-size:var(--font-md);color:#d0d0d0;margin:0}.action-button{display:inline-block;padding:var(--space-md) var(--space-lg);border-radius:8px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:1px;transition:transform .2s,box-shadow .2s;width:100%;max-width:min(300px,90vw)}.action-button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #0000004d}@media(max-width:479px){.home-page{padding:var(--space-md)}.slogan h1{font-size:var(--font-2xl)}.subtitle{font-size:var(--font-md)}.coming-soon h2{font-size:var(--font-xl)}.action-button{width:100%;max-width:100%}}.rules-btn{background:linear-gradient(135deg,#ff4b1f,#ff9068);color:#fff}.ember-btn{background:linear-gradient(135deg,#ff6b35,#f83600);color:#fff}.connect-btn{background:linear-gradient(135deg,#1a5a8f,#00d2ff);color:#fff}.why-pyrehaven{margin-top:var(--space-xl);text-align:center}.why-pyrehaven h2{font-size:var(--font-2xl);color:#fff;font-weight:700;margin-bottom:var(--space-lg)}.why-questions{text-align:left;max-width:600px;margin:0 auto var(--space-lg)}.why-questions p{font-size:var(--font-base);color:silver;padding:var(--space-md) var(--space-lg);margin-bottom:var(--space-sm);border-left:3px solid #ff6b35;background:#ff6b350d;border-radius:0 6px 6px 0;line-height:1.5}.why-answer{font-size:var(--font-lg);color:#e0e0e0;font-weight:600}.emberclash-main{align-items:flex-start}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:var(--space-md);background:linear-gradient(135deg,#050810,#0a0e27,#141829)}.login-card{background:linear-gradient(135deg,#141829,#0a0e27);border-radius:var(--space-md);box-shadow:0 20px 50px #0009;border:2px solid rgba(255,107,53,.2);padding:var(--space-xl);width:100%;max-width:450px}.login-card h1{font-size:var(--font-xl);font-weight:700;margin-bottom:var(--space-sm);background:linear-gradient(135deg,var(--primary-orange) 0%,var(--accent-orange) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{color:var(--text-light);margin-bottom:var(--space-lg);font-size:var(--font-sm)}.tabs{display:flex;gap:var(--space-sm);margin-bottom:var(--space-lg);border-bottom:2px solid var(--border-light)}.tabs button{flex:1;padding:var(--space-md);background:transparent;color:var(--text-light);border:none;border-bottom:3px solid transparent;cursor:pointer;transition:all .3s ease;font-weight:600;margin-bottom:0;min-height:auto}.tabs button:hover{color:var(--primary-orange);background:#ff6b350d;transform:none;box-shadow:none}.tabs button.active{color:var(--primary-orange);border-bottom-color:var(--primary-orange);background:#ff6b351a}.code-section,.passkey-section{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.large-input{text-align:center;font-size:var(--font-lg);font-weight:600;letter-spacing:.2em;text-transform:uppercase}.large-btn{font-size:var(--font-md);padding:var(--space-lg)}.alert{padding:var(--space-md);border-radius:var(--space-sm);margin-bottom:var(--space-lg);font-size:var(--font-sm);border:1px solid}.alert-error{background-color:#ff44441a;color:#f99;border-color:#ff44444d}.alert-success{background-color:#10b9811a;color:#6ee7b7;border-color:#10b9814d}.form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;margin-bottom:var(--space-sm);font-weight:600;color:var(--text-dark);font-size:var(--font-sm)}.form-group input{width:100%;padding:var(--space-md);font-size:var(--font-base);border:2px solid var(--border-light);border-radius:var(--space-sm);transition:all .3s ease;background-color:var(--bg-card);color:var(--text-dark);min-height:var(--touch-min)}.form-group input:focus{outline:none;border-color:var(--primary-orange);box-shadow:0 0 0 3px #ff6b3533;background-color:#141829cc}.form-group input::placeholder{color:var(--text-light)}.form-group input:disabled{background-color:#14182980;cursor:not-allowed;opacity:.6}.form-group small{display:block;margin-top:var(--space-xs);color:var(--text-light);font-size:var(--font-xs)}.login-card button{width:100%;padding:var(--space-md);font-size:var(--font-base);font-weight:600;margin-bottom:var(--space-lg);background:linear-gradient(135deg,var(--primary-orange) 0%,var(--accent-orange) 100%);color:#fff;border:none;border-radius:var(--space-sm);cursor:pointer;transition:all .3s ease;min-height:var(--touch-min)}.login-card button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #ff6b3566}.login-card button:disabled{opacity:.5;cursor:not-allowed;transform:none}.help-section{background:#004e891a;border:1px solid rgba(0,78,137,.3);border-radius:var(--space-sm);padding:var(--space-md);margin-top:var(--space-lg)}.help-section h3{font-size:var(--font-sm);font-weight:700;margin-bottom:var(--space-sm);color:var(--primary-blue);text-transform:uppercase;letter-spacing:.5px}.help-section ul{list-style:none;padding:0;margin:0}.help-section li{font-size:var(--font-xs);color:var(--text-light);margin-bottom:var(--space-sm);line-height:1.5}.help-section code{background-color:#ff6b351a;padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);font-family:Courier New,monospace;color:var(--primary-orange);font-size:var(--font-xs)}@media(max-width:480px){.login-container{padding:var(--space-sm)}.login-card{padding:var(--space-lg)}.login-card h1{font-size:var(--font-lg)}}@media(max-width:374px){.login-card{padding:var(--space-md)}.tabs{flex-direction:column;gap:0}.tabs button{border-bottom:1px solid var(--border-light);border-left:3px solid transparent}.tabs button.active{border-left-color:var(--primary-orange);border-bottom-color:var(--border-light)}}@media(max-height:600px)and (orientation:landscape){.login-container{padding:var(--space-sm);align-items:flex-start}.login-card{margin:var(--space-md) auto;padding:var(--space-md)}.login-card h1{font-size:var(--font-md);margin-bottom:var(--space-xs)}.subtitle,.form-group{margin-bottom:var(--space-sm)}}@media(prefers-reduced-motion:reduce){.code-section,.passkey-section{animation:none}.tabs button,.login-card button{transition:none}}.console-container{display:flex;flex-direction:column;height:calc(100vh - var(--banner-height));background:linear-gradient(135deg,#050810,#0a0e27,#141829);margin-top:var(--banner-height)}.console-content{display:flex;flex:1;overflow:hidden}@media(min-width:900px){.console-content .main-content{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}}.console-section{width:100%}.console-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg);padding-bottom:var(--space-lg);border-bottom:2px solid rgba(255,107,53,.2)}.console-header h1{color:var(--text-dark);font-size:var(--font-2xl);margin:0}.connection-status{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--space-sm);background:#14182999;border:1px solid rgba(255,107,53,.3);font-weight:600;font-size:var(--font-sm);text-transform:uppercase;letter-spacing:.5px}.connection-status.connected{color:#10b981;border-color:#10b98180}.connection-status.disconnected{color:#ef4444;border-color:#ef444480}.connection-status .status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;animation:pulse 2s infinite}.connection-status.connected .status-dot{background:#10b981;box-shadow:0 0 8px #10b98199}.connection-status.disconnected .status-dot{background:#ef4444;animation:none}.cards-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,320px));gap:var(--space-lg);justify-content:center;max-width:1200px;margin:0 auto;padding:var(--space-md) 0}.cards-container>div{cursor:pointer;transition:transform .2s ease}.cards-container>div:hover{transform:translateY(-4px)}@media(min-width:640px)and (max-width:899px){.console-container{height:calc(100vh - var(--banner-height));margin-top:var(--banner-height)}.main-content{padding:var(--space-md)}.console-header h1{font-size:var(--font-xl)}.cards-container{grid-template-columns:repeat(2,1fr);gap:var(--space-md)}}@media(max-width:640px){.console-container{height:calc(100vh - var(--banner-height-mobile));margin-top:var(--banner-height-mobile)}.main-content{padding:var(--space-md)}.console-header{flex-direction:column;align-items:flex-start;gap:var(--space-md);margin-bottom:var(--space-md);padding-bottom:var(--space-md)}.console-header h1{font-size:var(--font-xl)}.cards-container{grid-template-columns:1fr;gap:var(--space-md);padding:0}.connection-status{width:100%;justify-content:center}}@media(max-width:480px){.main-content{padding:var(--space-sm)}.console-header h1{font-size:var(--font-lg)}}.card{border-radius:var(--space-md);padding:var(--space-md);display:flex;flex-direction:column;min-height:220px;border:1px solid rgba(255,255,255,.03);background:linear-gradient(135deg,#0a0e1e99,#141c2d66);box-shadow:0 8px 20px #0206178c}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.card-header h3{margin:0;font-size:var(--font-md);color:#9fbde8}.card-body{flex:1;margin-bottom:var(--space-sm)}.service-key{color:#fff3;font-size:var(--font-sm);margin:0;font-family:Courier New,monospace}.btn-start,.btn-stop{flex:1;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--space-sm);font-weight:600;font-size:var(--font-sm);cursor:pointer;transition:all .3s ease;text-transform:uppercase;min-height:var(--touch-min)}.card-blue{border-color:#004e8980}.card-green{border-color:#10b98180}.card-fire{border-color:#ff6b3580}@media(max-width:640px){.card{min-height:auto;height:auto}.card-footer{flex-direction:column}.btn-start,.btn-stop{width:100%}}@media(prefers-reduced-motion:reduce){.cards-container>div,.btn-start,.btn-stop{transition:none}.cards-container>div:hover{transform:none}@keyframes pulse{0%,to{opacity:1}}}.btn-start:focus,.btn-stop:focus{outline:3px solid var(--primary-orange);outline-offset:2px}@media(prefers-contrast:high){.card{border:2px solid currentColor}.connection-status{border-width:2px}}.expanded-card.proxy-card{background:linear-gradient(135deg,#00321ef2,#0a503ce6);border:2px solid rgba(16,185,129,.7);border-radius:16px;padding:32px;width:90%;max-width:800px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #10b98133,0 0 40px #10b9811a;position:relative;color:#fff}.card-header h2,.server-name{margin:0;font-size:28px;font-weight:700}.expanded-card.lobby-card{background:linear-gradient(135deg,#001e3cf2,#0a3c78e6);border:2px solid rgba(0,153,216,.7);border-radius:16px;padding:32px;width:90%;max-width:800px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0099d833,0 0 40px #0099d81a;position:relative;color:#fff}.expanded-card-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.expanded-card.emberclash-card{background:linear-gradient(135deg,#3c140af2,#64280ae6);border:2px solid rgba(255,107,53,.7);border-radius:16px;padding:32px;width:90%;max-width:800px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #ff6b3533,0 0 40px #ff6b351a;position:relative;color:#fff}.close-button{position:absolute;top:16px;left:16px;background:#fff3;border:none;color:#fff;font-size:28px;width:40px;height:40px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.close-button:hover{background:#ffffff4d}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;margin-top:16px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:16px}.card-header h2{margin:0;font-size:28px;font-weight:700}.header-info{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.player-count-display{font-size:16px;font-weight:600;color:#4ade80}.server-name{margin:0;font-size:28px;font-weight:700}.server-name.proxy-name{background:linear-gradient(135deg,#10b981,#059669);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.server-name.lobby-name{background:linear-gradient(135deg,#0099d8,#004e89);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.server-name.emberclash-name{background:linear-gradient(135deg,#ff6b35,#ff8c42,#0099d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card-status{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-dot{display:inline-block;width:10px;height:10px;border-radius:50%;animation:pulse 2s infinite}.status-badge{padding:8px 16px;border-radius:20px;font-size:14px;font-weight:700;background:#fff3}.status-badge.online{background:#4caf504d}.status-badge.offline{background:#f443364d}.status-badge.starting,.status-badge.stopping{background:#ff98004d}.action-button{width:100%;padding:14px;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:24px}.action-button.start{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.action-button.start:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #10b98166}.action-button.stop{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.action-button.stop:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #ef444466}.action-button:disabled{opacity:.6;cursor:not-allowed}.logs-container{flex:1;display:flex;flex-direction:column;background:#0000004d;border-radius:8px;overflow:hidden}.logs-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid rgba(255,255,255,.1)}.logs-header h3{margin:0;font-size:18px}.copy-button{padding:8px 16px;background:#fff3;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;transition:background .2s}.copy-button:hover{background:#ffffff4d}.logs-content{flex:1;overflow-y:auto;padding:16px;font-family:Courier New,monospace;font-size:13px;line-height:1.5}.log-line{margin-bottom:4px;word-wrap:break-word}.logs-content::-webkit-scrollbar{width:8px}.logs-content::-webkit-scrollbar-track{background:#0003;border-radius:4px}.logs-content::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.logs-content::-webkit-scrollbar-thumb:hover{background:#ffffff80}.players-container{display:flex;flex-direction:column;height:100vh;background:linear-gradient(135deg,#050810,#0a0e27,#141829);margin-top:var(--banner-height)}.players-content{display:flex;flex:1;overflow:hidden;padding:var(--space-lg)}.players-page{width:100%;height:100%;display:flex;flex-direction:column}.players-header{padding-bottom:var(--space-lg);border-bottom:2px solid rgba(255,107,53,.2);margin-bottom:var(--space-lg)}.players-header h1{color:var(--text-dark);font-size:var(--font-2xl);margin:0}.players-layout{display:grid;grid-template-columns:350px 1fr;gap:var(--space-lg);flex:1;overflow:hidden}.player-list{background:#14182966;border:1px solid rgba(255,107,53,.2);border-radius:var(--space-md);padding:var(--space-md);overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-sm)}.player-list .search-bar{width:100%;max-width:none;margin-bottom:var(--space-sm)}.search-bar input{width:100%;padding:var(--space-sm) var(--space-md);background:#14182999;border:1px solid rgba(255,107,53,.3);border-radius:var(--space-sm);color:var(--text-dark);font-size:var(--font-base);transition:all .3s ease;min-height:var(--touch-min)}.search-bar input:focus{outline:none;border-color:#ff6b3599;box-shadow:0 0 0 3px #ff6b351a}.search-bar input::placeholder{color:#fff6}.player-item{padding:var(--space-md);border-radius:var(--space-sm);border:2px solid;cursor:pointer;transition:all .2s ease;display:flex;justify-content:space-between;align-items:center;min-height:var(--touch-min)}.player-item:hover{transform:translate(4px);box-shadow:0 4px 12px #0000004d}.player-item.selected{background:#ff6b3526!important;box-shadow:0 4px 12px #ff6b3533}.player-item.online{border-color:#10b981}.player-item.offline{border-color:#666}.player-name{font-weight:600;color:var(--text-dark);font-size:var(--font-base)}.player-status-badge{font-size:var(--font-sm);font-weight:600;display:flex;align-items:center;gap:var(--space-xs)}.player-details{background:#14182966;border:1px solid rgba(255,107,53,.2);border-radius:var(--space-md);padding:var(--space-lg);overflow-y:auto}.player-details h2{color:var(--text-dark);font-size:var(--font-xl);margin:0 0 var(--space-lg) 0;padding-bottom:var(--space-md);border-bottom:2px solid rgba(255,107,53,.2)}.details-content{display:flex;flex-direction:column;gap:var(--space-lg)}.detail-item{display:flex;flex-direction:column;gap:var(--space-sm)}.detail-label{color:#fff9;font-size:var(--font-sm);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.detail-value{color:var(--text-dark);font-size:var(--font-md);font-weight:500;word-break:break-all}.online-status{color:#10b981;display:flex;align-items:center;gap:var(--space-sm)}.offline-status{color:#666;display:flex;align-items:center;gap:var(--space-sm)}.no-selection{display:flex;align-items:center;justify-content:center;height:100%;color:#ffffff80;font-size:var(--font-md)}.loading,.no-players{display:flex;align-items:center;justify-content:center;height:100%;color:#ffffff80;font-size:var(--font-base)}.player-list::-webkit-scrollbar,.player-details::-webkit-scrollbar{width:8px}.player-list::-webkit-scrollbar-track,.player-details::-webkit-scrollbar-track{background:#14182966;border-radius:4px}.player-list::-webkit-scrollbar-thumb,.player-details::-webkit-scrollbar-thumb{background:#ff6b354d;border-radius:4px}.player-list::-webkit-scrollbar-thumb:hover,.player-details::-webkit-scrollbar-thumb:hover{background:#ff6b3580}@media(min-width:900px){.players-content .main-content{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}}@media(min-width:640px)and (max-width:899px){.players-layout{grid-template-columns:300px 1fr;gap:var(--space-md)}.players-content{padding:var(--space-md)}.players-header h1{font-size:var(--font-xl)}.player-item{padding:var(--space-sm)}}@media(max-width:640px){.players-container{margin-top:var(--banner-height-mobile)}.players-content{padding:var(--space-sm)}.players-header{padding-bottom:var(--space-md);margin-bottom:var(--space-md)}.players-header h1{font-size:var(--font-xl)}.players-layout{grid-template-rows:300px 1fr;gap:var(--space-sm)}.player-details{padding:var(--space-md)}.player-details h2{font-size:var(--font-lg)}.player-item{padding:var(--space-sm)}}@media(max-width:480px){.players-layout{grid-template-rows:250px 1fr}.detail-value{font-size:var(--font-base)}}.passkey-list{margin-top:1.5rem}.passkey-list table{width:100%;border-collapse:collapse}.passkey-list th{text-align:left;padding:.75rem;background:#ffffff0d;color:#b0b0b0;font-weight:600;border-bottom:1px solid rgba(255,255,255,.1)}.passkey-list td{padding:.75rem;border-bottom:1px solid rgba(255,255,255,.05);color:#e0e0e0}.passkey-list tr:last-child td{border-bottom:none}.btn-delete{padding:.5rem 1rem;background:#e74c3c33;color:#e74c3c;border:1px solid #e74c3c;border-radius:4px;cursor:pointer;font-size:.875rem;transition:all .2s}.btn-delete:hover{background:#e74c3c4d}.pin-input{width:100%;padding:.75rem;font-size:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e0e0e0;margin-bottom:1rem}.pin-input:focus{outline:none;border-color:#3498db}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1e1e1e;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:2rem;min-width:400px;max-width:500px}.modal h2{margin-top:0;margin-bottom:1.5rem;color:#e0e0e0}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;color:#b0b0b0;font-weight:500}.input{width:100%;padding:.75rem;font-size:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e0e0e0}.input:focus{outline:none;border-color:#3498db}.error-message{color:#e74c3c;margin-bottom:1rem;font-size:.875rem}.modal-actions{display:flex;gap:1rem;justify-content:flex-end}.btn{padding:.75rem 1.5rem;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:all .2s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary:hover:not(:disabled){background:#2980b9}.btn-secondary:hover:not(:disabled){background:#ffffff26}.authenticating{text-align:center;padding:2rem 0}.authenticating p{color:#e0e0e0;margin-bottom:1.5rem}.spinner{width:40px;height:40px;margin:0 auto;border:4px solid rgba(255,255,255,.1);border-top-color:#3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.account-container{display:flex;flex-direction:column;min-height:100vh;background:linear-gradient(135deg,#050810,#0a0e27,#141829);margin-top:var(--banner-height)}.account-content{display:flex;flex:1}.main-content{flex:1;padding:var(--space-lg);overflow-y:auto}.account-inner{max-width:800px;margin:0 auto}.account-inner h1{margin-bottom:var(--space-lg);color:#e0e0e0;font-size:var(--font-2xl)}.account-page{padding:var(--space-lg);max-width:800px;margin:0 auto}.account-page h1{margin-bottom:var(--space-lg);color:#e0e0e0;font-size:var(--font-2xl)}.account-section{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-sm);padding:var(--space-lg);margin-bottom:var(--space-lg)}.account-section h2{margin-top:0;margin-bottom:var(--space-md);color:#e0e0e0;font-size:var(--font-lg)}.account-details .detail-row,.signin-methods .method-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-sm) 0;border-bottom:1px solid rgba(255,255,255,.05)}.account-details .detail-row:last-child,.signin-methods .method-row:last-child{border-bottom:none}.signin-methods .method-row{flex-wrap:wrap;gap:var(--space-sm)}.signin-methods .method-row>div{display:flex;align-items:center;gap:var(--space-sm);flex:1}.detail-row .label,.method-row .method-name{font-weight:500;color:#b0b0b0;font-size:var(--font-base)}.detail-row .value{color:#e0e0e0;font-family:monospace;font-size:var(--font-base)}.status{padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);font-weight:600;font-size:var(--font-sm)}.status-enabled{background:#2ecc7133;color:#2ecc71}.status-disabled{background:#e74c3c33;color:#e74c3c}.btn-manage,.btn-enable{padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--space-xs);font-size:var(--font-sm);cursor:pointer;transition:all .2s;color:#fff;min-height:var(--touch-min)}.btn-manage{background:#3498db}.btn-manage:hover{background:#2980b9}.btn-enable{background:#2ecc71}.btn-enable:hover{background:#27ae60}.passkey-actions{display:flex;gap:var(--space-md);margin-top:var(--space-md);margin-bottom:0;flex-wrap:wrap}.btn{padding:var(--space-sm) var(--space-lg);border:none;border-radius:var(--space-sm);font-size:var(--font-base);cursor:pointer;transition:all .2s;min-height:var(--touch-min)}.btn-primary{background:#3498db;color:#fff}.btn-primary:hover{background:#2980b9}.btn-secondary{background:#ffffff1a;color:#e0e0e0;border:1px solid rgba(255,255,255,.2)}.btn-secondary:hover{background:#ffffff26}@media(max-width:640px){.account-container{margin-top:var(--banner-height-mobile)}.main-content,.account-page{padding:var(--space-md)}.account-page h1,.account-inner h1{font-size:var(--font-xl)}.account-section{padding:var(--space-md)}.account-details .detail-row,.signin-methods .method-row{flex-direction:column;align-items:flex-start;gap:var(--space-xs);padding:var(--space-md) 0}.passkey-actions{flex-direction:column}.passkey-actions .btn{width:100%}}@media(max-width:480px){.main-content,.account-page,.account-section{padding:var(--space-sm)}.account-page h1,.account-inner h1{font-size:var(--font-lg)}}.usage-container{height:100vh;background-color:#1a1b26;color:#a9b1d6;font-family:JetBrains Mono,Fira Code,monospace;display:flex;flex-direction:column}.usage-content{display:flex;flex:1;overflow:hidden;margin-top:var(--banner-height)}.main-content{flex:1;padding:var(--space-lg);overflow-y:auto;overflow-x:hidden}@media(min-width:900px){.usage-content .main-content{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}}.usage-section{width:100%}.usage-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md);border-bottom:1px solid #414868;padding-bottom:var(--space-sm)}.usage-header h1{margin:0;color:#7aa2f7;font-size:var(--font-xl)}.connection-status{color:#e0af68;font-size:var(--font-sm)}.error-banner{background-color:#f7768e33;border:1px solid #f7768e;color:#f7768e;padding:var(--space-md);border-radius:var(--space-sm);margin-bottom:var(--space-lg)}.usage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-sm)}.usage-card{background-color:#24283b;border:1px solid #414868;border-radius:var(--space-sm);padding:var(--space-sm);display:flex;flex-direction:column}.usage-card .card-header{margin-bottom:var(--space-sm)}.usage-card h2{margin:0;color:#bb9af7;font-size:var(--font-xs);text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:var(--font-xl);font-weight:700;margin-bottom:var(--space-sm)}.progress-bar{background-color:#414868;height:8px;border-radius:var(--space-xs);overflow:hidden;margin-bottom:var(--space-xs)}.progress-fill{height:100%;transition:width .5s ease-in-out,background-color .3s ease}.usage-details{font-size:var(--font-xs);color:#565f89;text-align:right}.uptime-value{color:#7dcfff;font-size:var(--font-lg)}.loading-message{text-align:center;padding:var(--space-lg);color:#565f89;font-size:var(--font-base)}.network-stats{display:flex;flex-direction:column;gap:var(--space-md)}.net-stat{display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) 0;border-bottom:1px solid #414868;font-size:var(--font-xs)}.net-stat:last-child{border-bottom:none}.net-stat .label{color:#7aa2f7;font-weight:700}.net-stat .value{color:#7dcfff;font-family:monospace;font-size:var(--font-sm)}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;animation:pulse 2s infinite}.status-running .status-dot{background:#10b981;box-shadow:0 0 8px #10b98199}.status-stopped .status-dot{background:#ef4444}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.card-body{flex:1;margin-bottom:var(--space-lg)}.service-key{color:var(--text-light);font-size:var(--font-sm);margin:0;font-family:Courier New,monospace;word-break:break-all}.player-count{color:#4ade80;font-size:var(--font-base);font-weight:600;margin:var(--space-sm) 0 0 0}.card-footer{display:flex;gap:var(--space-sm)}.btn-start,.btn-stop{flex:1;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--space-sm);font-weight:600;font-size:var(--font-sm);cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;min-height:var(--touch-min)}.btn-start{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.btn-start:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #10b98166}.btn-stop{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.btn-stop:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #ef444466}.btn-start:disabled,.btn-stop:disabled{opacity:.6;cursor:not-allowed;transform:none}.card-blue{border-color:#004e8980;background:linear-gradient(135deg,#001e3c99,#00326466)}.card-blue .card-header h3{background:linear-gradient(135deg,#0099d8,#004e89);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card-blue:hover{border-color:#0099d8b3;box-shadow:0 12px 32px #004e894d}.card-green{border-color:#10b98180;background:linear-gradient(135deg,#00321e99,#00503266)}.card-green .card-header h3{background:linear-gradient(135deg,#10b981,#059669);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card-green:hover{border-color:#10b981b3;box-shadow:0 12px 32px #10b9814d}.card-fire{border-color:#ff6b3580;background:linear-gradient(135deg,#3c140a99,#501e0066)}.card-fire .card-header h3{background:linear-gradient(135deg,#ff6b35,#ff8c42,#0099d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card-fire:hover{border-color:#ff6b35b3;box-shadow:0 12px 32px #ff6b354d}.cpu-cores-card{grid-column:1 / -1}.cores-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-sm);margin-top:var(--space-sm)}.core-item{display:flex;flex-direction:column;gap:var(--space-xs);background:#41486833;padding:var(--space-sm);border-radius:var(--space-xs)}.core-label{font-size:var(--font-xs);color:#565f89;font-weight:700}.core-bar-container{height:12px;background:#1a1b26;border-radius:var(--space-xs);position:relative;overflow:hidden;display:flex;align-items:center}.core-bar-fill{height:100%;transition:width .3s ease}.core-value{position:absolute;right:4px;font-size:var(--font-xs);color:#fff;text-shadow:0 0 2px #000;font-weight:700}@media(min-width:640px)and (max-width:899px){.usage-content{margin-top:var(--banner-height)}.main-content{padding:var(--space-md)}.usage-header h1{font-size:var(--font-lg)}.usage-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-md)}.cores-grid{grid-template-columns:repeat(2,1fr)}.metric-value{font-size:var(--font-lg)}}@media(max-width:640px){.usage-content{margin-top:var(--banner-height-mobile)}.main-content{padding:var(--space-md)}.usage-header{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}.usage-header h1{font-size:var(--font-lg)}.usage-grid{grid-template-columns:1fr;gap:var(--space-md)}.cores-grid{grid-template-columns:1fr}.card-header h3{font-size:var(--font-md)}}@media(max-width:480px){.main-content{padding:var(--space-sm)}.usage-header h1{font-size:var(--font-md)}.btn-start,.btn-stop{padding:var(--space-xs) var(--space-sm);font-size:var(--font-xs)}}.analytics-page{position:relative;min-height:100vh;background-color:#1a1a1a;color:#e0e0e0;padding:var(--space-lg) var(--space-lg) 80px var(--space-lg);transition:margin-left .3s ease;margin-top:var(--banner-height)}.analytics-header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg);padding-bottom:var(--space-md);border-bottom:2px solid rgba(255,107,53,.2)}.analytics-header-bar h1{color:#fff;font-size:var(--font-2xl);margin:0}.rebuild-button{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;border:none;border-radius:var(--space-sm);padding:var(--space-sm) var(--space-lg);font-size:var(--font-sm);font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;min-height:var(--touch-min)}.rebuild-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #4caf5066}.rebuild-button:disabled{opacity:.6;cursor:not-allowed}.rebuild-message{padding:var(--space-md);border-radius:var(--space-sm);margin-bottom:var(--space-lg);font-weight:500}.rebuild-message.success{background-color:#4caf5033;border:1px solid #4CAF50;color:#4caf50}.rebuild-message.error{background-color:#f4433633;border:1px solid #f44336;color:#f44336}@media(min-width:900px){.analytics-page{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width));padding-left:var(--space-xl);padding-right:var(--space-xl)}}.analytics-content{max-width:1400px;margin:0;padding-left:var(--space-lg)}.bottom-tab-bar{position:fixed;bottom:0;left:0;right:0;height:60px;background-color:#2d2d2d;border-top:1px solid #444;display:flex;justify-content:center;align-items:center;gap:0;z-index:100;transition:left .3s ease}@media(min-width:900px){.bottom-tab-bar{left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}}.tab-button{flex:1;max-width:200px;height:100%;background:transparent;border:none;color:#999;font-size:var(--font-base);font-weight:500;cursor:pointer;transition:all .3s ease;position:relative;min-height:var(--touch-min)}.tab-button:hover{background-color:#333;color:#ccc}.tab-button.active{color:#4caf50;background-color:#252525}.tab-button.active:after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background-color:#4caf50}.analytics-tab{padding:var(--space-lg) 0}.tab-header{margin-bottom:var(--space-xl)}.tab-header h2{font-size:var(--font-2xl);font-weight:600;color:#fff;margin:0}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-lg);margin-bottom:var(--space-xl)}.stat-card{background-color:#2d2d2d;border-radius:var(--space-sm);padding:var(--space-lg);box-shadow:0 2px 8px #0000004d}.stat-card-title{font-size:var(--font-sm);color:#999;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-sm)}.stat-card-value{font-size:var(--font-2xl);font-weight:700;color:#4caf50;margin-bottom:var(--space-xs)}.stat-card-subtitle{font-size:var(--font-sm);color:#777}.top-players-card{background-color:#2d2d2d;border-radius:var(--space-sm);padding:var(--space-lg);box-shadow:0 2px 8px #0000004d;margin-top:var(--space-lg)}.top-players-title{font-size:var(--font-lg);font-weight:600;color:#fff;margin-bottom:var(--space-lg);text-transform:uppercase;letter-spacing:.5px}.top-players-list{display:flex;flex-direction:column;gap:var(--space-md)}.top-player-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background-color:#252525;border-radius:var(--space-sm);border-left:4px solid #444;transition:all .2s ease}.top-player-item:hover{background-color:#2a2a2a;transform:translate(5px)}.top-player-item.rank-1{border-left-color:gold}.top-player-item.rank-2{border-left-color:silver}.top-player-item.rank-3{border-left-color:#cd7f32}.player-rank{font-size:var(--font-xl);font-weight:700;color:#666;min-width:30px;text-align:center}.rank-1 .player-rank{color:gold}.rank-2 .player-rank{color:silver}.rank-3 .player-rank{color:#cd7f32}.player-info{flex:1;display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm)}.player-name{font-size:var(--font-base);font-weight:500;color:#fff}.player-playtime{font-size:var(--font-sm);color:#4caf50;font-weight:600}.top-players-empty{text-align:center;color:#666;padding:var(--space-lg)}.graph-controls{display:flex;gap:var(--space-lg);margin-bottom:var(--space-xl);flex-wrap:wrap}.control-group{display:flex;flex-direction:column;gap:var(--space-sm);min-width:200px}.control-group label{font-size:var(--font-sm);color:#999;text-transform:uppercase;letter-spacing:.5px}.control-group select{background-color:#2d2d2d;color:#e0e0e0;border:1px solid #444;border-radius:var(--space-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-sm);cursor:pointer;transition:all .2s ease;min-height:var(--touch-min)}.control-group select:hover{border-color:#4caf50}.control-group select:focus{outline:none;border-color:#4caf50;box-shadow:0 0 0 2px #4caf5033}.graph-container{background-color:#2d2d2d;border-radius:var(--space-sm);padding:var(--space-lg);box-shadow:0 2px 8px #0000004d}.graph-loading,.graph-error,.graph-empty{text-align:center;padding:var(--space-2xl);color:#666;font-size:var(--font-base)}.graph-error{color:#f44336}.tab-loading,.tab-error{display:flex;justify-content:center;align-items:center;min-height:400px;font-size:var(--font-lg);color:#666}.tab-error{color:#f44336}@media(min-width:640px)and (max-width:899px){.analytics-page{padding:var(--space-md) var(--space-lg) 80px var(--space-lg);margin-top:var(--banner-height)}.analytics-content{padding-left:var(--space-md);max-width:100%}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-md)}.tab-header h2{font-size:var(--font-xl)}.stat-card{padding:var(--space-md)}.stat-card-value{font-size:var(--font-xl)}.graph-controls{gap:var(--space-md)}.control-group{min-width:180px}.tab-button{font-size:var(--font-sm)}.top-players-card{padding:var(--space-md)}}@media(max-width:640px){.analytics-page{padding:var(--space-sm);padding-bottom:80px;margin-top:var(--banner-height-mobile)}.analytics-content{padding-left:var(--space-sm)}.bottom-tab-bar{left:0!important}.stats-grid{grid-template-columns:1fr;gap:var(--space-md)}.tab-header{margin-bottom:var(--space-lg)}.tab-header h2{font-size:var(--font-xl)}.stat-card{padding:var(--space-md)}.stat-card-value{font-size:var(--font-xl)}.graph-controls{flex-direction:column;gap:var(--space-md)}.control-group{width:100%;min-width:0}.tab-button{font-size:var(--font-sm)}.top-players-card{padding:var(--space-md)}.top-player-item{padding:var(--space-sm);gap:var(--space-sm)}.player-rank{font-size:var(--font-lg);min-width:25px}.player-info{flex-direction:column;align-items:flex-start}}@media(max-width:480px){.analytics-page{padding:var(--space-xs);padding-bottom:70px}.analytics-content{padding-left:var(--space-xs)}.tab-header h2,.stat-card-value{font-size:var(--font-lg)}.graph-container{padding:var(--space-md)}}.admin-unlock-overlay{position:fixed;inset:0;background-color:#000000bf;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.admin-unlock-modal{background:var(--card-bg, #1a1a1a);border:1px solid var(--border-color, #333);border-radius:12px;padding:2rem;max-width:400px;width:90%;box-shadow:0 8px 32px #0006}.admin-unlock-modal h2{margin:0 0 .5rem;font-size:1.5rem;color:var(--text-primary, #fff)}.admin-unlock-modal p{margin:0 0 1.5rem;color:var(--text-secondary, #aaa);font-size:.95rem}.admin-unlock-modal .pin-input{width:100%;padding:.75rem;font-size:1.1rem;text-align:center;letter-spacing:.2em;border:2px solid var(--border-color, #333);border-radius:8px;background:var(--input-bg, #252525);color:var(--text-primary, #fff);transition:border-color .2s}.admin-unlock-modal .pin-input:focus{outline:none;border-color:var(--primary-color, #3b82f6)}.admin-unlock-modal .button-group{display:flex;gap:.75rem;margin-top:1.5rem}.admin-unlock-modal .button-group button{flex:1;padding:.75rem;font-size:1rem;border-radius:8px;cursor:pointer;transition:all .2s}.admin-unlock-modal .button-group button.primary{background:var(--primary-color, #3b82f6);color:#fff;border:none}.admin-unlock-modal .button-group button.primary:hover:not(:disabled){background:var(--primary-hover, #2563eb)}.admin-unlock-modal .button-group button.secondary{background:transparent;color:var(--text-secondary, #aaa);border:1px solid var(--border-color, #333)}.admin-unlock-modal .button-group button.secondary:hover:not(:disabled){background:var(--hover-bg, #252525);border-color:var(--text-secondary, #aaa)}.admin-unlock-modal .button-group button:disabled{opacity:.5;cursor:not-allowed}.admin-unlock-modal .alert{padding:.75rem;border-radius:6px;margin-bottom:1rem;font-size:.9rem}.admin-unlock-modal .alert-error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#fca5a5}.vc-page{max-width:800px;margin:0 auto;padding:var(--space-lg)}.vc-page h1{font-size:var(--font-3xl);font-weight:800;margin-bottom:var(--space-lg);text-align:center;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.vc-controls{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-md);padding:var(--space-lg);margin-bottom:var(--space-lg)}.vc-input-group{margin-bottom:var(--space-md)}.vc-input-group label{display:block;margin-bottom:var(--space-sm);font-weight:600;color:#ffffffe6;font-size:var(--font-base)}.vc-input-group input{width:100%;padding:var(--space-sm);background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:var(--space-sm);color:#fff;font-size:var(--font-base);transition:border-color .2s;min-height:var(--touch-min)}.vc-input-group input:focus{outline:none;border-color:#667eea}.vc-input-group input:disabled{opacity:.5;cursor:not-allowed}.vc-buttons{display:flex;gap:var(--space-sm);flex-wrap:wrap}.vc-button{flex:1;min-width:120px;padding:var(--space-sm) var(--space-lg);border:none;border-radius:var(--space-sm);font-weight:600;font-size:var(--font-base);cursor:pointer;transition:all .2s;min-height:var(--touch-min)}.vc-button:disabled{opacity:.5;cursor:not-allowed}.vc-button.connect{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.vc-button.connect:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.vc-button.disconnect{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.vc-button.disconnect:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #f5576c66}.vc-button.mute{background:linear-gradient(135deg,#4facfe,#00f2fe);color:#fff}.vc-button.unmute{background:linear-gradient(135deg,#fa709a,#fee140);color:#333}.vc-button.mute:hover:not(:disabled),.vc-button.unmute:hover:not(:disabled){transform:translateY(-2px)}.vc-status{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-md);padding:var(--space-md);margin-bottom:var(--space-lg)}.status-indicator{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--font-base)}.status-dot{width:12px;height:12px;border-radius:50%;animation:pulse 2s infinite}.status-indicator.disconnected .status-dot{background:#6c757d;animation:none}.status-indicator.connecting .status-dot{background:#ffc107}.status-indicator.connected .status-dot{background:#28a745}.status-indicator.error .status-dot{background:#dc3545;animation:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.vc-error{margin-top:var(--space-md);padding:var(--space-md);background:#dc35451a;border:1px solid rgba(220,53,69,.3);border-radius:var(--space-sm);color:#ff6b6b;font-size:var(--font-sm)}.vc-participants{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-md);padding:var(--space-lg);margin-bottom:var(--space-lg)}.vc-participants h3{margin-top:0;margin-bottom:var(--space-md);color:#ffffffe6;font-size:var(--font-lg)}.vc-participants ul{list-style:none;padding:0;margin:0}.vc-participants li{padding:var(--space-sm);margin-bottom:var(--space-sm);background:#0003;border-radius:var(--space-sm);border-left:3px solid transparent;min-height:var(--touch-min);display:flex;align-items:center}.participant-self{border-left-color:#667eea!important;font-weight:600}.participant-remote{border-left-color:#4facfe!important}.vc-info{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:var(--space-md);padding:var(--space-lg)}.vc-info h3{margin-top:0;margin-bottom:var(--space-md);color:#ffffffe6;font-size:var(--font-lg)}.vc-info p{margin-bottom:var(--space-md);color:#ffffffb3;line-height:1.6;font-size:var(--font-base)}.vc-info ul{margin:0;padding-left:var(--space-lg);color:#fff9;line-height:1.8}.vc-info li{margin-bottom:var(--space-sm);font-size:var(--font-base)}.vc-steps{list-style:none;padding:0;margin:0 0 var(--space-lg) 0;counter-reset:step}.vc-steps li{counter-increment:step;display:flex;gap:var(--space-md);margin-bottom:var(--space-sm);color:#fffc;padding:var(--space-sm) var(--space-md);background:#667eea14;border-left:3px solid #667eea;border-radius:var(--space-sm);font-size:var(--font-base)}.vc-steps li:before{content:counter(step);display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:#667eea;color:#fff;border-radius:50%;font-weight:700;font-size:var(--font-sm);flex-shrink:0}.vc-steps li strong{font-weight:600;color:#fffffff2}.vc-steps li code{background:#667eea33;padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);color:#667eea;font-weight:600;font-size:var(--font-sm)}.vc-range-header{font-weight:600;color:#fffffff2;font-size:var(--font-md);margin:var(--space-md) 0 var(--space-sm) 0!important;padding:var(--space-sm) var(--space-md);background:#667eea1f;border-left:3px solid #667eea;border-radius:var(--space-sm)}.vc-range-list{margin:0;padding-left:var(--space-lg);color:#ffffffb3;line-height:1.8}.vc-range-list li{margin-bottom:var(--space-sm);font-size:var(--font-base)}.vc-signin-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-md);padding:var(--space-xl);max-width:600px;margin:0 auto}.vc-signin-header{text-align:center;margin-bottom:var(--space-lg)}.vc-signin-header h2{font-size:var(--font-xl);margin-bottom:var(--space-sm);color:#fffffff2}.vc-signin-header p{color:#ffffffb3;font-size:var(--font-base);line-height:1.5}.vc-how-to-join{margin-bottom:var(--space-lg);padding:var(--space-lg);background:#0003;border-radius:var(--space-md);border:1px solid rgba(102,126,234,.2)}.vc-how-to-join h3{margin:0 0 var(--space-md) 0;color:#667eea;font-size:var(--font-md);font-weight:700}.join-steps{list-style:none;padding:0;margin:0;counter-reset:step-counter}.join-steps li{display:flex;align-items:flex-start;gap:var(--space-md);margin-bottom:var(--space-md);padding-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.05)}.join-steps li:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.step-number{flex-shrink:0;width:32px;height:32px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:var(--font-sm)}.step-content{flex:1}.step-content strong{display:block;color:#fffffff2;font-size:var(--font-base);margin-bottom:var(--space-xs)}.step-content p{margin:0;color:#fff9;font-size:var(--font-sm);line-height:1.4}.step-content code{background:#667eea33;padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);color:#667eea;font-weight:600;font-size:var(--font-xs)}.vc-stats{display:flex;justify-content:center;gap:var(--space-lg);margin-bottom:var(--space-lg);padding:var(--space-md);background:#0003;border-radius:var(--space-md)}.stat-item{text-align:center}.stat-label{display:block;font-size:var(--font-xs);color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.stat-value{display:block;font-size:var(--font-xl);font-weight:700;color:#667eea;margin-top:var(--space-xs)}.vc-signin-form{margin-bottom:var(--space-lg)}.vc-signin-form .form-group{margin-bottom:var(--space-md)}.vc-signin-form label{display:block;margin-bottom:var(--space-sm);font-weight:600;color:#ffffffe6;font-size:var(--font-base)}.vc-signin-form input{width:100%;padding:var(--space-md);background:#0000004d;border:2px solid rgba(255,255,255,.1);border-radius:var(--space-sm);color:#fff;font-size:var(--font-md);font-family:monospace;text-align:center;letter-spacing:.25rem;transition:all .2s;min-height:var(--touch-min)}.vc-signin-form input:focus{outline:none;border-color:#667eea;background:#0006}.vc-signin-form input::placeholder{letter-spacing:0;font-family:inherit;font-size:var(--font-sm)}.vc-signin-form small{display:block;margin-top:var(--space-sm);color:#ffffff80;text-align:center;font-size:var(--font-sm)}.vc-signin-form code{background:#667eea33;padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);color:#667eea;font-weight:600;font-size:var(--font-xs)}.vc-status-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-md);padding:var(--space-lg);margin-bottom:var(--space-lg)}.status-row{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.status-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.status-dot.disconnected{background:#6c757d}.status-dot.connecting{background:#ffc107;animation:pulse 1s infinite}.status-dot.connected{background:#28a745;animation:pulse 2s infinite}.status-dot.error{background:#dc3545}.status-text{color:#fffc;text-transform:capitalize}.vc-participant-count{text-align:center;padding:var(--space-md);margin-bottom:var(--space-md);background:#667eea1a;border-radius:var(--space-md)}.count-number{display:block;font-size:var(--font-3xl);font-weight:800;color:#667eea;line-height:1}.count-label{display:block;font-size:var(--font-xs);color:#fff9;text-transform:uppercase;letter-spacing:1px;margin-top:var(--space-xs)}.muted-icon{display:inline-block;background:#f5576c33;color:#f5576c;font-size:var(--font-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--space-xs);margin-left:var(--space-sm)}.admin-note{display:block;margin-top:var(--space-sm);color:#ffc864b3;font-style:italic;font-size:var(--font-sm)}.vc-background-notice{background:linear-gradient(135deg,#667eea26,#764ba226);border:2px solid rgba(102,126,234,.3);border-radius:var(--space-md);padding:var(--space-md) var(--space-lg);margin-bottom:var(--space-lg);text-align:center;color:#ffffffe6;animation:subtlePulse 3s ease-in-out infinite;font-size:var(--font-base)}.vc-background-notice strong{color:#667eea;font-weight:700}.background-badge{display:inline-block;margin-left:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:#28a74533;border:1px solid rgba(40,167,69,.4);border-radius:var(--space-md);color:#28a745;font-size:var(--font-xs);font-weight:600;animation:pulse 2s infinite}@keyframes subtlePulse{0%,to{border-color:#667eea4d;background:linear-gradient(135deg,#667eea26,#764ba226)}50%{border-color:#667eea80;background:linear-gradient(135deg,#667eea33,#764ba233)}}.vc-info small{display:block;color:#ffffff80}.vc-dev-ui{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:var(--space-md);padding:var(--space-md);margin-bottom:var(--space-lg)}.dev-toggle{width:100%;padding:var(--space-sm);background:#667eea26;border:1px solid rgba(102,126,234,.3);border-radius:var(--space-sm);color:#667eea;font-weight:600;cursor:pointer;transition:all .2s;font-size:var(--font-base);min-height:var(--touch-min)}.dev-toggle:hover{background:#667eea40;border-color:#667eea80}.dev-panel{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid rgba(255,255,255,.1)}.dev-panel h4{margin:0 0 var(--space-md) 0;color:#fffc;font-size:var(--font-sm);text-transform:uppercase;letter-spacing:.5px}.dev-item{margin-bottom:var(--space-md)}.dev-item label{display:block;margin-bottom:var(--space-sm);color:#ffffffb3;font-size:var(--font-xs);font-weight:600}.level-bar-container{width:100%;height:24px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-sm);overflow:hidden;margin-bottom:var(--space-sm)}.level-bar{height:100%;transition:width .1s ease-out;border-radius:var(--space-xs)}.level-value{display:inline-block;font-size:var(--font-xs);color:#fff9;margin-left:var(--space-sm)}.hearing-list{display:flex;flex-direction:column;gap:var(--space-sm)}.hearing-status{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--font-xs);color:#ffffffb3}.status-indicator{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-indicator.hearing{background:#28a745;box-shadow:0 0 6px #28a74599}.status-indicator.not-hearing{background:#6c757d}.dev-item small{display:block;color:#ffffff80;line-height:1.6;font-family:monospace;font-size:var(--font-xs)}.dev-item small div{margin-bottom:var(--space-xs)}.hearing-indicator{display:inline-block;margin-left:var(--space-sm);font-size:var(--font-sm);opacity:.8}.participant-remote{display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.participant-remote.in-range{border-left-color:#28a745!important;background:#28a7451a}.participant-remote.out-of-range{border-left-color:#6c757d!important;opacity:.6}.participant-name{flex:1;font-weight:500;font-size:var(--font-base);display:flex;align-items:center;gap:var(--space-sm)}.bell-button{background:#ffc10726;border:2px solid rgba(255,193,7,.3);border-radius:var(--space-sm);padding:var(--space-xs) var(--space-sm);font-size:var(--font-base);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;margin-left:auto}.bell-button:hover{background:#ffc10740;border-color:#ffc10780;transform:scale(1.1)}.bell-button:active{transform:scale(.95);background:#ffc10759}.proximity-info{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--font-xs)}.distance{display:inline-flex;align-items:center;padding:var(--space-xs) var(--space-sm);background:#667eea33;border:1px solid rgba(102,126,234,.3);border-radius:var(--space-sm);color:#667eea;font-weight:600;font-family:monospace;font-size:var(--font-xs)}.volume-indicator{display:inline-flex;align-items:center;font-size:var(--font-sm);filter:grayscale(.2)}.out-of-range-text{color:#fff6;font-style:italic;font-size:var(--font-xs)}.vc-audio-controls{margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:1px solid rgba(255,255,255,.1)}.audio-control-group{margin-bottom:var(--space-md)}.audio-control-group:last-child{margin-bottom:0}.audio-control-label{font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#fff9;margin-bottom:var(--space-sm)}.audio-control-row{display:flex;align-items:center;gap:var(--space-sm)}.audio-icon-button{flex-shrink:0;width:48px;height:48px;min-height:var(--touch-min);background:#667eea26;border:2px solid rgba(102,126,234,.3);border-radius:var(--space-md);font-size:var(--font-xl);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;filter:grayscale(0)}.audio-icon-button:hover{background:#667eea40;border-color:#667eea80;transform:scale(1.05)}.audio-icon-button.muted{background:#f5576c26;border-color:#f5576c66;filter:grayscale(.3);opacity:.7}.audio-icon-button.muted:hover{background:#f5576c40;border-color:#f5576c99;opacity:1}.test-beep-button{flex-shrink:0;width:48px;height:48px;min-height:var(--touch-min);background:#ffc10726;border:2px solid rgba(255,193,7,.3);border-radius:var(--space-md);font-size:var(--font-xl);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.test-beep-button:hover{background:#ffc10740;border-color:#ffc10780;transform:scale(1.05)}.test-beep-button:active{transform:scale(.95)}.audio-level-bar{flex:1;height:32px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:var(--space-sm);overflow:hidden;position:relative}.audio-level-fill{height:100%;transition:width .1s ease-out;border-radius:var(--space-sm);box-shadow:0 0 10px #4488ff4d}.audio-level-fill.output{transition:width .3s ease-out}.status-hint{padding:var(--space-sm) var(--space-md);background:#667eea1a;border-left:3px solid #667eea;border-radius:var(--space-sm);margin-top:var(--space-md);font-size:var(--font-sm)}.background-hint{padding:var(--space-sm) var(--space-md);background:#28a7451a;border-left:3px solid #28a745;border-radius:var(--space-sm);margin-top:var(--space-sm);font-size:var(--font-xs);color:#28a745}@media(max-width:640px){.vc-page{padding:var(--space-md)}.vc-page h1{font-size:var(--font-2xl)}.vc-controls,.vc-status,.vc-participants,.vc-info,.vc-signin-card,.vc-status-card,.vc-dev-ui{padding:var(--space-md)}.vc-buttons{flex-direction:column}.vc-button{width:100%;min-width:0}.vc-stats{flex-direction:column;gap:var(--space-md)}.vc-signin-card{padding:var(--space-md)}.vc-signin-header h2{font-size:var(--font-lg)}.join-steps li{gap:var(--space-sm)}.step-number{width:28px;height:28px}.dev-panel{font-size:var(--font-xs)}.audio-control-row{gap:var(--space-xs)}.audio-icon-button{width:40px;height:40px;font-size:var(--font-lg)}.audio-level-bar{height:28px}.proximity-info{flex-direction:column;align-items:flex-start;gap:var(--space-xs)}}@media(max-width:480px){.vc-page{padding:var(--space-sm)}.vc-page h1{font-size:var(--font-xl)}.vc-controls,.vc-status,.vc-participants,.vc-info,.vc-signin-card,.vc-status-card,.vc-dev-ui{padding:var(--space-sm)}.vc-signin-header h2{font-size:var(--font-md)}.stat-value{font-size:var(--font-lg)}.count-number{font-size:var(--font-2xl)}}.vc-disclaimer-overlay{position:fixed;inset:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;padding:var(--space-md);animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.vc-disclaimer-modal{background:linear-gradient(135deg,#141428f2,#28283cf2);border:2px solid rgba(102,126,234,.4);border-radius:var(--space-lg);padding:var(--space-xl);max-width:600px;width:100%;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.disclaimer-header{text-align:center;margin-bottom:var(--space-lg);padding-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.1)}.disclaimer-header h2{margin:0 0 var(--space-sm) 0;font-size:var(--font-xl);background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.disclaimer-subtitle{margin:0;color:#ffffffb3;font-size:var(--font-base)}.disclaimer-content{margin-bottom:var(--space-lg);line-height:1.8}.disclaimer-content p{margin:0 0 var(--space-md) 0;color:#ffffffd9;font-size:var(--font-sm)}.disclaimer-content p:last-child{margin-bottom:0}.disclaimer-content strong{color:#fffffff2;font-weight:700}.disclaimer-actions{display:flex;gap:var(--space-md)}.disclaimer-button{flex:1;padding:var(--space-md) var(--space-lg);border:none;border-radius:var(--space-sm);font-weight:600;font-size:var(--font-base);cursor:pointer;transition:all .2s;min-height:var(--touch-min)}.disclaimer-button.cancel{background:#ffffff1a;color:#ffffffb3;border:2px solid rgba(255,255,255,.2)}.disclaimer-button.cancel:hover{background:#ffffff26;color:#ffffffe6;border-color:#ffffff4d}.disclaimer-button.accept{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:2px solid transparent}.disclaimer-button.accept:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea80}@media(max-width:640px){.vc-disclaimer-overlay{padding:var(--space-sm)}.vc-disclaimer-modal{padding:var(--space-lg)}.disclaimer-header h2{font-size:var(--font-lg)}.disclaimer-actions{flex-direction:column}.disclaimer-button{width:100%}}@media(max-width:480px){.vc-disclaimer-modal{padding:var(--space-md)}.disclaimer-header h2{font-size:var(--font-md)}}.contact-methods{display:flex;gap:1.5rem;margin-top:2rem;justify-content:center}.contact-card{background:var(--bg-card, rgba(255, 255, 255, .05));border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem;flex:1;max-width:320px;text-align:center}.contact-card h2{color:#fff;margin-bottom:.5rem;font-size:1.3rem}.contact-card p{color:#b0b0b0;margin-bottom:.75rem;font-size:.95rem}.contact-card a{color:#ff6b35;text-decoration:none;font-weight:600;font-size:1rem;transition:color .2s ease}.contact-card a:hover{color:#ff8f5e;text-decoration:underline}@media(max-width:640px){.contact-methods{flex-direction:column;align-items:center}.contact-card{max-width:100%;width:100%}}