@import url(https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Manrope:wght@400;600;700;800&display=swap);:root{--bg-ink:#05060a;--bg-panel:#0a0e1cbd;--bg-panel-strong:#0e1428d9;--line:#83a2ff47;--text-primary:#f4f7ff;--text-soft:#a8b3cf;--accent-cyan:#4ae6ff;--accent-lime:#cbff4d;--accent-rose:#ff6f8f;--ok:#89ff9f;--error:#ff8787;--shadow-neon:0 0 0 1px #4ae6ff38,0 24px 70px #000000a6}*{box-sizing:border-box}body{background:radial-gradient(circle at 15% 10%,#4ae6ff33,#4ae6ff00 40%),radial-gradient(circle at 84% 18%,#ff6f8f3d,#ff6f8f00 34%),linear-gradient(132deg,#05060a,#080b12 48%,#0a0f1e);color:#f4f7ff;color:var(--text-primary);font-family:Manrope,Segoe UI,sans-serif;margin:0}.App{min-height:100vh;overflow:hidden;position:relative}.demo-layout{margin:0 auto;padding:44px 0 60px;position:relative;width:min(1200px,92vw);z-index:3}.hero{animation:panel-enter .62s ease both;margin-bottom:28px}.hero-kicker{color:#4ae6ff;color:var(--accent-cyan);font-size:.72rem;letter-spacing:.22em;margin:0 0 10px;text-transform:uppercase}.hero-title{font-family:Bebas Neue,Impact,sans-serif;font-size:clamp(2rem,5.2vw,4.4rem);letter-spacing:.045em;line-height:.92;margin:0;max-width:18ch;text-shadow:0 0 26px #4ae6ff40;text-transform:uppercase}.hero-subtitle{color:#a8b3cf;color:var(--text-soft);font-size:.98rem;line-height:1.5;margin:14px 0 0;max-width:52ch}.sidebar{grid-gap:18px;display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));margin-bottom:18px}.panel-card{animation:panel-enter .7s ease both;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(145deg,#ffffff0f,#fff0),#0a0e1cbd;background:linear-gradient(145deg,#ffffff0f,#fff0),var(--bg-panel);border:1px solid #83a2ff47;border:1px solid var(--line);border-radius:18px;box-shadow:0 0 0 1px #4ae6ff38,0 24px 70px #000000a6;box-shadow:var(--shadow-neon);padding:18px 18px 16px;position:relative}.panel-card-delay-1{animation-delay:90ms}.panel-card-delay-2{animation-delay:.18s}.panel-card-delay-3{animation-delay:.27s}.circles-header h2,.data-loading-section h2,.filtered-colors-section h2{color:#a8b3cf;color:var(--text-soft);font-size:.88rem;letter-spacing:.12em;margin:0 0 14px;text-transform:uppercase}.status-row{align-items:center;display:flex;gap:10px;margin-bottom:8px}.status-label{color:#f4f7ff;color:var(--text-primary);font-size:.95rem}.error,.success{align-items:center;border-radius:999px;display:inline-flex;font-size:.72rem;font-weight:700;justify-content:center;letter-spacing:.06em;min-width:40px;padding:4px 8px}.success{background-color:#89ff9f;background-color:var(--ok);color:#04100a}.error{background-color:#ff8787;background-color:var(--error);color:#22080d}.filtered-header{align-items:baseline;display:flex;gap:8px;justify-content:space-between}button{background:#cbff4d1a;border:1px solid #cbff4d73;border-radius:999px;color:#cbff4d;color:var(--accent-lime);cursor:pointer;font-size:.78rem;letter-spacing:.05em;padding:7px 14px;text-transform:uppercase;transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease}button:hover{background:#cbff4d33;box-shadow:0 0 0 1px #cbff4d38;transform:translateY(-1px)}button:focus-visible{outline:2px solid #4ae6ff;outline:2px solid var(--accent-cyan);outline-offset:2px}.filtered-color{align-items:center;display:flex;gap:10px;margin-bottom:10px}.filtered-color-code{color:#a8b3cf;color:var(--text-soft);font-family:Courier New,monospace;font-size:.84rem}.circles-shell{min-height:320px}.circles-header{align-items:baseline;display:flex;justify-content:space-between;margin-bottom:16px}.circles-header p{color:#4ae6ff;color:var(--accent-cyan);font-size:.72rem;letter-spacing:.08em;margin:0;text-transform:uppercase}.circles-section{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}.circles-section .color-circle{background-clip:padding-box;border:2px solid #ffffffc7;border-radius:50%;box-shadow:0 0 0 1px #ffffff38,0 8px 24px #0000006b;height:44px;justify-self:center;margin:0;padding:0;position:relative;transition:transform .22s ease,box-shadow .22s ease;width:44px}.circles-section .color-circle:hover{box-shadow:0 0 0 1px #fff6,0 16px 34px #4ae6ff59;transform:translateY(-3px) scale(1.07)}.circles-section .color-circle:after{border:1px solid #4ae6ff33;border-radius:inherit;content:"";inset:-7px;opacity:0;position:absolute;transform:scale(.9);transition:transform .22s ease,opacity .22s ease}.circles-section .color-circle:hover:after{opacity:1;transform:scale(1)}.ambient-glow{border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;position:absolute;z-index:1}.ambient-glow-left{background:#4ae6ff52;height:400px;left:-90px;top:-120px;width:400px}.ambient-glow-right{background:#ff6f8f42;height:360px;right:-100px;top:60px;width:360px}.scanline-overlay{background-image:repeating-linear-gradient(180deg,#ffffff38 0,#ffffff38 1px,#0000 0,#0000 4px);opacity:.1}.grain-overlay,.scanline-overlay{inset:0;pointer-events:none;position:fixed;z-index:2}.grain-overlay{background-image:radial-gradient(circle at 20% 40%,#ffffffa8 0,#0000 2px),radial-gradient(circle at 60% 20%,#ffffffa8 0,#0000 1px),radial-gradient(circle at 80% 70%,#ffffffa8 0,#0000 2px);background-size:150px 150px;opacity:.06}@keyframes panel-enter{0%{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width:760px){.demo-layout{padding-top:26px;width:min(95vw,640px)}.hero-title{font-size:clamp(1.9rem,14vw,3.1rem);line-height:.95}.hero-subtitle{font-size:.92rem}.panel-card{padding:15px}.circles-section{gap:10px;grid-template-columns:repeat(auto-fill,minmax(40px,1fr))}.circles-section .color-circle{height:40px;width:40px}}
/*# sourceMappingURL=main.e7374524.css.map*/