@layer tokens {
:root{--bg:#f5f5f6;--panel:#fff;--panel-border:#e4e4e7;--text:#18181b;--muted:#71717a;--accent:#18181b;--radius:12px;--radius-sm:8px;--shadow-card:0 1px 2px #0000000a, 0 1px 8px #0000000a;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--cursor-pointer:pointer}
}

@layer reset {
*{box-sizing:border-box}:focus{outline:none}html,body{height:100%;margin:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:inherit}
}

@layer base {
body{background:var(--bg);color:var(--text);font-family:var(--font-sans);flex-direction:column;display:flex;overflow:hidden}a{color:var(--accent);cursor:var(--cursor-pointer);text-decoration:none}a:hover{text-decoration:underline}button:not(:disabled),summary,input[type=button]:not(:disabled),input[type=submit]:not(:disabled),input[type=reset]:not(:disabled),[role=button]:not([aria-disabled=true]){cursor:var(--cursor-pointer)}a *,button:not(:disabled) *,summary *,input[type=button]:not(:disabled) *,input[type=submit]:not(:disabled) *,input[type=reset]:not(:disabled) *,[role=button]:not([aria-disabled=true]) *{cursor:inherit}
}

@layer shell {
.demo-banner{background:var(--accent);color:var(--bg);text-align:center;padding:4px 0;font-size:12px;font-weight:600}.header-sticky{z-index:50;background:var(--panel);border-bottom:1px solid var(--panel-border);flex-shrink:0}.topbar{justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.topbar-brand{color:var(--muted);font-size:12px}.topbar-brand:hover{color:var(--text);text-decoration:none}.topbar-actions{align-items:center;gap:8px;display:flex}.brand-short{display:none}.container{flex-direction:column;gap:16px;width:100%;padding:16px;display:flex}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:20px}.title{letter-spacing:.2px;margin:0 0 6px;padding-inline-end:16px;font-size:20px;font-weight:650}.subtitle{color:var(--muted);margin:0 0 18px;font-size:14px}.nav{flex-wrap:wrap;align-items:center;gap:12px;padding:0 16px 12px;display:flex}.badge{border:1px solid var(--panel-border);background:var(--panel);color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:inline-flex}.breadcrumbs{color:var(--muted);align-items:center;gap:8px;margin:0 0 18px;font-size:14px;display:flex}.breadcrumbs-sep{color:var(--muted)}.chartWrap{aspect-ratio:16/8;width:100%;min-height:240px}.chartWrap svg{width:100%;height:100%;display:block}@media (max-width:768px){.demo-banner-detail,.brand-full{display:none}.brand-short{display:inline}.panel{padding:16px}}
}

@layer utilities {
.data-masked{-webkit-user-select:none;user-select:none;background-image:repeating-conic-gradient(var(--accent) 0% 25%, #d0d0d0 0% 50%);background-size:6px 6px;background-origin:content-box;background-clip:content-box;color:#0000!important}.copyable-cell{cursor:var(--cursor-pointer)}.copyable-cell:hover{text-underline-offset:2px;text-decoration:underline}.copy-toast{bottom:16px;background:var(--text);color:var(--bg);z-index:1000;padding:8px 14px;font-size:12px;position:fixed;inset-inline-end:16px}.loading-indicator{color:var(--muted);padding:12px 0;font-size:14px}.loading-dots:after{content:"";animation:1.5s steps(4,end) infinite dots}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.link-list{flex-direction:column;gap:6px;margin:12px 0 0;padding:0;list-style:none;display:flex}
}

@layer tokens,reset,base,shell,utilities;