/* BitBullers Design Language v1.0 */
:root{
  --bb-bg:#05070c;--bb-surface:#0b1018;--bb-surface-elevated:#111a27;--bb-ink:#f8fbff;--bb-muted:#aab6c9;--bb-line:rgba(255,255,255,.12);
  --bb-primary:#6ddcff;--bb-secondary:#77efb0;--bb-accent:#f5c866;--bb-success:#77efb0;--bb-warning:#f5c866;--bb-error:#ff7a8a;
  --bb-space-1:4px;--bb-space-2:8px;--bb-space-3:12px;--bb-space-4:16px;--bb-space-5:20px;--bb-space-6:24px;--bb-space-8:32px;--bb-space-10:40px;--bb-space-12:48px;--bb-space-16:64px;--bb-space-20:80px;--bb-space-24:96px;
  --bb-radius-sm:6px;--bb-radius-md:8px;--bb-radius-lg:10px;--bb-radius-pill:999px;
  --bb-shadow-card:0 24px 80px rgba(0,0,0,.25);--bb-shadow-lift:0 30px 90px rgba(0,0,0,.34);
  --bb-ease:cubic-bezier(.2,.8,.2,1);--bb-duration-fast:160ms;--bb-duration:260ms;--bb-duration-slow:520ms;
  --bb-container:1200px;color-scheme:dark light;
}
html[data-theme=light]{
  --bb-bg:#f7f9fc;--bb-surface:#ffffff;--bb-surface-elevated:#f1f5fa;--bb-ink:#0b1020;--bb-muted:#536176;--bb-line:rgba(10,16,32,.12);
  --bb-primary:#1238a8;--bb-secondary:#0f766e;--bb-accent:#c7922b;--bb-success:#15803d;--bb-warning:#b7791f;--bb-error:#b42318;--bb-shadow-card:0 18px 60px rgba(28,46,76,.12);--bb-shadow-lift:0 26px 80px rgba(28,46,76,.16);
}
.bb-container{width:min(100% - 40px,var(--bb-container));margin-inline:auto}.bb-section{padding-block:var(--bb-space-20)}.bb-stack{display:grid;gap:var(--bb-space-5)}.bb-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--bb-space-4)}.bb-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--bb-space-4)}
.bb-display{font-size:clamp(52px,8vw,112px);line-height:.92;font-weight:900;letter-spacing:0}.bb-h1{font-size:clamp(42px,6vw,84px);line-height:1;font-weight:880}.bb-h2{font-size:clamp(32px,4vw,58px);line-height:1.04;font-weight:850}.bb-h3{font-size:clamp(22px,2vw,30px);line-height:1.15;font-weight:820}.bb-body{font-size:16px;line-height:1.6}.bb-caption{font-size:13px;line-height:1.45;color:var(--bb-muted)}.bb-label{font-size:12px;line-height:1.3;letter-spacing:.14em;text-transform:uppercase;color:var(--bb-accent);font-weight:850}
.bb-button{border:1px solid var(--bb-line);border-radius:var(--bb-radius-lg);background:color-mix(in srgb,var(--bb-surface) 78%,transparent);color:var(--bb-ink);min-height:44px;padding:0 var(--bb-space-5);display:inline-flex;align-items:center;justify-content:center;gap:var(--bb-space-2);font-weight:850;text-decoration:none;transition:transform var(--bb-duration) var(--bb-ease),border-color var(--bb-duration) var(--bb-ease),background var(--bb-duration) var(--bb-ease)}
.bb-button:hover,.bb-button:focus-visible{transform:translateY(-2px);border-color:color-mix(in srgb,var(--bb-primary) 55%,var(--bb-line));outline:0}.bb-button-primary{border:0;background:linear-gradient(135deg,var(--bb-accent),#fff1b8);color:#10140a}.bb-button-ghost{background:transparent}
.bb-card{border:1px solid var(--bb-line);border-radius:var(--bb-radius-lg);background:linear-gradient(180deg,color-mix(in srgb,var(--bb-surface) 82%,transparent),color-mix(in srgb,var(--bb-surface) 46%,transparent));box-shadow:var(--bb-shadow-card);padding:var(--bb-space-6);transition:transform var(--bb-duration) var(--bb-ease),box-shadow var(--bb-duration) var(--bb-ease),border-color var(--bb-duration) var(--bb-ease)}
.bb-card:hover{transform:translateY(-3px);box-shadow:var(--bb-shadow-lift);border-color:color-mix(in srgb,var(--bb-accent) 45%,var(--bb-line))}.bb-card-flat:hover{transform:none}
.bb-input,.bb-select,.bb-textarea{width:100%;border:1px solid var(--bb-line);border-radius:var(--bb-radius-lg);background:color-mix(in srgb,var(--bb-surface) 86%,#000);color:var(--bb-ink);min-height:46px;padding:0 var(--bb-space-4);font:inherit}.bb-textarea{min-height:120px;padding-block:var(--bb-space-3)}.bb-input:focus,.bb-select:focus,.bb-textarea:focus{outline:2px solid color-mix(in srgb,var(--bb-primary) 60%,transparent);outline-offset:2px}
.bb-badge{display:inline-flex;align-items:center;gap:var(--bb-space-2);border:1px solid var(--bb-line);border-radius:var(--bb-radius-pill);padding:var(--bb-space-1) var(--bb-space-3);font-size:12px;color:var(--bb-primary);font-weight:780}.bb-alert{border:1px solid var(--bb-line);border-radius:var(--bb-radius-lg);padding:var(--bb-space-4);background:color-mix(in srgb,var(--bb-surface-elevated) 84%,transparent)}.bb-alert-success{border-color:color-mix(in srgb,var(--bb-success) 45%,var(--bb-line))}.bb-alert-error{border-color:color-mix(in srgb,var(--bb-error) 45%,var(--bb-line))}
.bb-progress{height:10px;border-radius:var(--bb-radius-pill);background:color-mix(in srgb,var(--bb-surface-elevated) 70%,#000);overflow:hidden}.bb-progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--bb-accent),var(--bb-secondary));border-radius:inherit}.bb-table{width:100%;border-collapse:collapse}.bb-table th,.bb-table td{padding:var(--bb-space-3);border-bottom:1px solid var(--bb-line);text-align:left}.bb-empty{border:1px dashed var(--bb-line);border-radius:var(--bb-radius-lg);padding:var(--bb-space-8);text-align:center;color:var(--bb-muted)}.bb-skeleton{border-radius:var(--bb-radius-md);background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.14),rgba(255,255,255,.06));background-size:200% 100%;animation:bb-shimmer 1.4s infinite}
@keyframes bb-shimmer{to{background-position:-200% 0}}@media(max-width:920px){.bb-section{padding-block:var(--bb-space-12)}.bb-grid,.bb-grid-3{grid-template-columns:1fr}.bb-container{width:min(100% - 28px,var(--bb-container))}}@media(prefers-reduced-motion:reduce){*,.bb-card,.bb-button{animation:none!important;transition:none!important}.bb-card:hover,.bb-button:hover,.bb-button:focus-visible{transform:none}}
