:root{--color-bg-dark: 240 20% 10%;--color-bg-card: 240 15% 15%;--color-primary: 280 80% 60%;--color-primary-glow: 280 80% 60% / .5;--color-accent: 170 80% 50%;--color-text-main: 0 0% 100%;--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);--color-text-dim: 240 10% 70%;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:hsl(var(--color-text-main));background-color:hsl(var(--color-bg-dark));-webkit-tap-highlight-color:transparent}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:#0a0a0a;overflow:hidden}h1,h2,h3{font-weight:700;letter-spacing:-.02em}button{background:hsl(var(--color-primary));color:#fff;border:none;padding:.8em 1.5em;font-weight:600;border-radius:8px;cursor:pointer;box-shadow:0 0 15px hsl(var(--color-primary-glow));transition:all .2s ease}button:hover{transform:translateY(-2px);box-shadow:0 0 25px hsl(var(--color-primary-glow));filter:brightness(1.2)}button.no-glow{box-shadow:none!important}button.no-glow:hover{box-shadow:none!important;transform:scale(1.02);filter:brightness(1.1)}.card{background:hsl(var(--color-bg-card));padding:2rem;border-radius:16px;border:1px solid hsl(240 15% 25%);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 10px 40px -10px #00000080;text-align:center;will-change:transform}@media(max-width:768px){.card{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.status-badge{display:inline-block;padding:.25rem .75rem;border-radius:999px;font-size:.875rem;font-weight:500;background:#ffffff1a}.status-badge.connected{background:#145229;color:#75f09e;border:1px solid hsl(140 60% 30%)}@keyframes flash-list{0%{opacity:.5;transform:scale(.99);filter:brightness(1.2)}50%{opacity:1;transform:scale(1.01);filter:brightness(1.1)}to{opacity:1;transform:scale(1);filter:brightness(1)}}.touch-target-expanded{position:relative}.touch-target-expanded:after{content:"";position:absolute;inset:-8px;border-radius:50%;cursor:pointer}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}50%{transform:translate(4px)}75%{transform:translate(-4px)}}@keyframes shimmer{0%,to{box-shadow:0 0 15px var(--glow-color-3, rgba(255, 255, 255, .08)),0 0 35px var(--glow-color-4, rgba(255, 255, 255, .04)),0 0 60px var(--glow-color-4, rgba(255, 255, 255, .02)),0 10px 40px #0006}50%{box-shadow:0 0 25px var(--glow-color-3, rgba(255, 255, 255, .12)),0 0 60px var(--glow-color-4, rgba(255, 255, 255, .06)),0 0 100px var(--glow-color-4, rgba(255, 255, 255, .03)),0 12px 45px #00000073}}@keyframes shimmer-border{0%,to{border-color:var(--border-color-base)}50%{border-color:var(--border-color-bright, var(--border-color-base))}}.glass-card{background:var(--glass-bg, rgba(255, 255, 255, .08));backdrop-filter:blur(var(--glass-blur, 20px)) saturate(1.8);-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(1.8);border:1px solid rgba(255,255,255,.1);border-radius:20px;color:#fff;transition:background .4s ease,border-color .4s ease,box-shadow .4s ease;position:relative;overflow:hidden;box-shadow:0 10px 40px #0006;transform:translateZ(0);contain:content;isolation:isolate;z-index:10}.android-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#14141efa!important;border:2px solid var(--border-color-base, rgba(255, 255, 255, .1))!important;box-shadow:0 0 12px var(--glow-color-4, rgba(0, 0, 0, .2))!important;transition:transform .2s ease!important;animation:none!important}.android-card:before,.android-card:after{content:none!important;display:none!important}.dimmed{opacity:.3!important;filter:grayscale(.8)!important;pointer-events:none!important}.glass-card.with-glow{animation:shimmer 5s ease-in-out infinite,shimmer-border 5s ease-in-out infinite}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.hide-scrollbar::-webkit-scrollbar{display:none}.bottom-nav-safe{padding-bottom:env(safe-area-inset-bottom,20px)}.glass-card:after{content:"";position:absolute;inset:0;border-radius:20px;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.1),transparent 85%);pointer-events:none}.glass-card:before{content:"";position:absolute;inset:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.4),transparent,rgba(255,255,255,.15));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:opacity .3s ease}.glass-card.with-glow:before{opacity:0}.glass-card.hoverable:hover{transform:translateY(-8px) scale(1.01);background:var(--glass-bg-hover, rgba(255, 255, 255, .12));border-color:#ffffff40;box-shadow:0 20px 50px #0009}.glass-card.clickable{cursor:pointer}.glass-card.clickable:active{transform:scale(.97) translateY(-2px)}
