#root{text-align:center;max-width:1280px;margin:0 auto;padding:2rem}.logo{will-change:filter;height:6em;padding:1.5em;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:20s linear infinite logo-spin}}.card{padding:2em}.read-the-docs{color:#888}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e5e7eb;background-color:#020617;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*,:before,:after{box-sizing:border-box}body{background:radial-gradient(circle at top,#111827,#020617 55%);min-height:100vh;margin:0}.app{flex-direction:column;gap:1.5rem;max-width:1100px;min-height:100vh;margin:0 auto;padding:1.5rem 1.75rem 2rem;display:flex}.app-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172ae6;border:1px solid #94a3b84d;border-radius:1rem;align-items:center;gap:1rem;padding:1.25rem 1.5rem;display:flex;box-shadow:0 20px 45px #0009}.logo-circle{background:radial-gradient(circle,#38bdf8,#1d4ed8);border-radius:999px;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.25rem;font-weight:700;display:flex}.app-header h1{margin:0;font-size:1.4rem}.app-header p{color:#9ca3af;margin:.2rem 0 0;font-size:.9rem}.app-main{flex-direction:column;gap:1.25rem;display:flex}.card{background:#0f172af2;border:1px solid #4b556399;border-radius:1rem;padding:1.25rem 1.5rem}.highlight{border-color:#38bdf8;box-shadow:0 15px 40px #38bdf833}.card h2,.card h3{margin-top:0;margin-bottom:.4rem}.card p{margin:.25rem 0;font-size:.95rem;line-height:1.6}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.status-card{flex-direction:column;gap:.3rem;display:flex}.status-pill{border-radius:999px;padding:.15rem .6rem;font-size:.8rem;font-weight:600;display:inline-block}.status-ok{color:#4ade80;background:#16a34a33}.status-bad{color:#fca5a5;background:#dc262633}.status-message{color:#e5e7eb;font-size:.88rem}.status-note{color:#9ca3af;font-size:.8rem}code{background:#0f172acc;border-radius:.4rem;padding:.1rem .35rem;font-size:.85rem}.app-footer{text-align:center;color:#6b7280;margin-top:auto;padding-top:.5rem;font-size:.85rem}@media (max-width:800px){.app{padding:1.25rem}.grid{grid-template-columns:1fr}}.app-nav{background:#0f172ae6;border:1px solid #374151b3;border-radius:999px;gap:.5rem;margin-top:.3rem;padding:.3rem;display:inline-flex}.nav-link{color:#9ca3af;border-radius:999px;padding:.3rem .9rem;font-size:.9rem;text-decoration:none}.nav-link-active{color:#f9fafb;background:linear-gradient(90deg,#38bdf8,#6366f1)}.viewer-main{gap:1rem}.viewer-card{padding-bottom:1.5rem}.viewer-subtitle{color:#9ca3af;font-size:.9rem}.viewer-layout{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:1rem;margin-top:1rem;display:grid}.viewer-canvas-wrapper{background:radial-gradient(circle at top,#020617,#020617 60%);border:1px solid #374151cc;border-radius:1rem;min-height:320px;overflow:hidden}.viewer-canvas{width:100%;height:100%;min-height:320px}.viewer-side{background:#0f172af2}.viewer-list{margin-top:.6rem;margin-bottom:.6rem;padding-left:1.2rem;font-size:.92rem}.viewer-note{color:#9ca3af;font-size:.85rem}@media (max-width:900px){.viewer-layout{grid-template-columns:1fr}}