@import"https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@300;400;500;600;700&display=swap";:root{--color-bg-primary: #050810;--color-bg-secondary: #0a0e1a;--color-bg-tertiary: #111627;--color-bg-card: rgba(17, 22, 39, .7);--color-bg-elevated: rgba(30, 38, 60, .5);--color-border: rgba(255, 255, 255, .06);--color-border-active: rgba(255, 255, 255, .12);--color-text-primary: #e2e8f0;--color-text-secondary: #94a3b8;--color-text-muted: #64748b;--color-spacetime: #06b6d4;--color-spacetime-glow: rgba(6, 182, 212, .15);--color-spacetime-dim: rgba(6, 182, 212, .08);--color-supabase: #f59e0b;--color-supabase-glow: rgba(245, 158, 11, .15);--color-supabase-dim: rgba(245, 158, 11, .08);--color-success: #10b981;--color-error: #f43f5e;--color-warning: #f59e0b;--font-display: "Sora", sans-serif;--font-mono: "JetBrains Mono", monospace;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--shadow-glow-spacetime: 0 0 30px rgba(6, 182, 212, .12), 0 0 60px rgba(6, 182, 212, .05);--shadow-glow-supabase: 0 0 30px rgba(245, 158, 11, .12), 0 0 60px rgba(245, 158, 11, .05);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-spring: .3s cubic-bezier(.34, 1.56, .64, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-display);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse 80% 50% at 20% 0%,var(--color-spacetime-dim) 0%,transparent 60%),radial-gradient(ellipse 80% 50% at 80% 100%,var(--color-supabase-dim) 0%,transparent 60%);pointer-events:none;z-index:0}#root{position:relative;z-index:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:focus-visible{outline:2px solid var(--color-spacetime);outline-offset:2px}.benchmark-layout{display:flex;flex-direction:column;min-height:100vh;width:100%;max-width:1440px;margin:0 auto;padding:0 16px}.benchmark-layout__header{padding:24px 0 16px;text-align:center}.benchmark-layout__brand{display:flex;flex-direction:column;align-items:center;gap:4px}.benchmark-layout__title{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2.5rem);font-weight:800;letter-spacing:-.02em;color:var(--color-text-primary);line-height:1.2}.benchmark-layout__title-accent{background:linear-gradient(135deg,var(--color-spacetime),#a78bfa,var(--color-supabase));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.benchmark-layout__subtitle{font-size:clamp(.75rem,2vw,1rem);color:var(--color-text-secondary);font-weight:400}.benchmark-layout__vs{display:inline-block;background:linear-gradient(135deg,var(--color-spacetime),var(--color-supabase));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;padding:0 4px}.benchmark-layout__main{flex:1;display:flex;flex-direction:column;gap:20px;padding-bottom:32px}.benchmark-layout__panels{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:stretch}@media(max-width:767px){.benchmark-layout__panels{grid-template-columns:1fr;gap:16px}}.benchmark-layout__divider{display:flex;align-items:center;justify-content:center;padding:0 8px}@media(max-width:767px){.benchmark-layout__divider{padding:0;justify-content:center}}.benchmark-layout__divider-label{font-family:var(--font-display);font-size:.875rem;font-weight:800;color:var(--color-text-muted);letter-spacing:.1em;text-transform:uppercase;writing-mode:vertical-lr;text-orientation:mixed;background:linear-gradient(180deg,var(--color-spacetime),var(--color-supabase));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@media(max-width:767px){.benchmark-layout__divider-label{writing-mode:horizontal-tb}}.benchmark-layout__footer{padding:24px 0;text-align:center;font-size:.75rem;color:var(--color-text-muted);border-top:1px solid var(--color-border)}.panel-container{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.panel-container--spacetime{border-color:#06b6d41f}.panel-container--spacetime:hover{border-color:#06b6d440;box-shadow:var(--shadow-glow-spacetime)}.panel-container--supabase{border-color:#f59e0b1f}.panel-container--supabase:hover{border-color:#f59e0b40;box-shadow:var(--shadow-glow-supabase)}.benchmark-controls{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:16px 20px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.benchmark-controls__config{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.benchmark-controls__field{display:flex;flex-direction:column;gap:2px}.benchmark-controls__label{font-size:.6875rem;font-weight:500;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.benchmark-controls__input{width:80px;padding:6px 10px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:var(--font-mono);font-size:.8125rem;transition:border-color var(--transition-base)}.benchmark-controls__input:focus{border-color:var(--color-spacetime);outline:none}.benchmark-controls__input:disabled{opacity:.5;cursor:not-allowed}.benchmark-controls__toggle-label{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none}.benchmark-controls__checkbox{accent-color:var(--color-spacetime);width:16px;height:16px}.benchmark-controls__toggle-text{font-size:.8125rem;color:var(--color-text-secondary)}.benchmark-controls__actions{display:flex;gap:8px;margin-left:auto}.benchmark-controls__btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid transparent;border-radius:var(--radius-md);font-family:var(--font-display);font-size:.8125rem;font-weight:600;cursor:pointer;transition:all var(--transition-spring);color:#fff}.benchmark-controls__btn:active{transform:scale(.96)}.benchmark-controls__btn--start{background:linear-gradient(135deg,#059669,#10b981);border-color:#10b9814d}.benchmark-controls__btn--start:hover{box-shadow:0 0 20px #10b98140}.benchmark-controls__btn--pause{background:linear-gradient(135deg,#d97706,#f59e0b);border-color:#f59e0b4d}.benchmark-controls__btn--pause:hover{box-shadow:0 0 20px #f59e0b40}.benchmark-controls__btn--resume{background:linear-gradient(135deg,#0891b2,#06b6d4);border-color:#06b6d44d}.benchmark-controls__btn--resume:hover{box-shadow:0 0 20px #06b6d440}.benchmark-controls__btn--stop{background:linear-gradient(135deg,#e11d48,#f43f5e);border-color:#f43f5e4d}.benchmark-controls__btn--stop:hover{box-shadow:0 0 20px #f43f5e40}.benchmark-controls__btn--reset{background:var(--color-bg-elevated);border-color:var(--color-border-active);color:var(--color-text-secondary)}.benchmark-controls__btn--reset:hover{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.benchmark-controls__status{display:flex;align-items:center;gap:12px}.benchmark-controls__status-text{display:flex;flex-direction:column}.benchmark-controls__iteration{font-family:var(--font-mono);font-size:.875rem;font-weight:600;color:var(--color-text-primary)}.benchmark-controls__elapsed{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted)}@media(max-width:767px){.benchmark-controls{flex-direction:column;align-items:stretch}.benchmark-controls__actions{margin-left:0;justify-content:center}.benchmark-controls__status{justify-content:center}}.avatar-card{padding:20px}.avatar-card__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.avatar-card__title-group{display:flex;flex-direction:column;gap:2px}.avatar-card__title{font-family:var(--font-display);font-size:1.125rem;font-weight:700;color:var(--color-text-primary)}.avatar-card--spacetime .avatar-card__title{color:var(--color-spacetime)}.avatar-card--supabase .avatar-card__title{color:var(--color-supabase)}.avatar-card__subtitle{font-size:.6875rem;color:var(--color-text-muted);font-family:var(--font-mono)}.avatar-card__indicator{width:12px;height:12px;border-radius:50%;position:relative}.accent--spacetime .avatar-card__indicator,.avatar-card__indicator.accent--spacetime{background:var(--color-spacetime)}.accent--supabase .avatar-card__indicator,.avatar-card__indicator.accent--supabase{background:var(--color-supabase)}.avatar-card__pulse{position:absolute;inset:-4px;border-radius:50%;animation:pulse-ring 1.5s ease-out infinite}.avatar-card--spacetime .avatar-card__pulse{border:2px solid var(--color-spacetime)}.avatar-card--supabase .avatar-card__pulse{border:2px solid var(--color-supabase)}@keyframes pulse-ring{0%{transform:scale(.8);opacity:1}to{transform:scale(2);opacity:0}}.avatar-card__preview{display:flex;justify-content:center;padding:16px 0}.avatar-card__avatar{width:96px;height:96px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.avatar-card--spacetime .avatar-card__avatar{background:linear-gradient(135deg,#06b6d41a,#06b6d408);border:1px solid rgba(6,182,212,.2)}.avatar-card--supabase .avatar-card__avatar{background:linear-gradient(135deg,#f59e0b1a,#f59e0b08);border:1px solid rgba(245,158,11,.2)}.avatar-card__avatar-body{display:flex;align-items:center;justify-content:center}.avatar-card__avatar-emoji{font-size:2.5rem}.avatar-card__gear-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px;margin-bottom:16px}.avatar-card__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:12px;border-top:1px solid var(--color-border)}@media(max-width:480px){.avatar-card__stats{grid-template-columns:repeat(2,1fr)}}.avatar-card__stat{display:flex;flex-direction:column;align-items:center;gap:2px}.avatar-card__stat-label{font-size:.625rem;font-weight:500;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.avatar-card__stat-value{font-family:var(--font-mono);font-size:.875rem;font-weight:700}.avatar-card__stat-value.accent--spacetime{color:var(--color-spacetime)}.avatar-card__stat-value.accent--supabase{color:var(--color-supabase)}.avatar-card--active{animation:card-breathe 3s ease-in-out infinite}@keyframes card-breathe{0%,to{border-color:#ffffff0f}50%{border-color:#ffffff1f}}.gear-slot{display:flex;align-items:center;gap:6px;padding:6px 10px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);transition:all var(--transition-base)}.gear-slot--equipped{border-color:var(--color-border-active)}.gear-slot--equipped.accent--spacetime{border-color:#06b6d440;background:#06b6d40d}.gear-slot--equipped.accent--supabase{border-color:#f59e0b40;background:#f59e0b0d}.gear-slot__icon{font-size:1rem;flex-shrink:0}.gear-slot__label{font-size:.6875rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;min-width:40px}.gear-slot__value{font-family:var(--font-mono);font-size:.6875rem;color:var(--color-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:right}.gear-slot--equipped .gear-slot__value{color:var(--color-text-primary)}.status-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:100px;font-size:.6875rem;font-weight:600}.status-badge__dot{width:6px;height:6px;border-radius:50%}.status-badge--connected .status-badge__dot{background:var(--color-success);box-shadow:0 0 6px var(--color-success)}.status-badge--disconnected .status-badge__dot{background:var(--color-error)}.status-badge--spacetime{background:var(--color-spacetime-dim);color:var(--color-spacetime)}.status-badge--supabase{background:var(--color-supabase-dim);color:var(--color-supabase)}.progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}.progress-ring__svg{transform:rotate(-90deg)}.progress-ring__track{stroke:var(--color-bg-tertiary)}.progress-ring__fill{stroke:var(--color-spacetime);transition:stroke-dashoffset .3s ease}.progress-ring__label{position:absolute;font-family:var(--font-mono);font-size:.625rem;font-weight:700;color:var(--color-text-secondary)}.metrics-dashboard{display:flex;flex-direction:column;gap:20px}.metrics-dashboard__title{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--color-text-primary);padding-bottom:4px;border-bottom:1px solid var(--color-border)}.metrics-dashboard__stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}.metrics-dashboard__charts{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media(max-width:767px){.metrics-dashboard__charts{grid-template-columns:1fr}}.metrics-dashboard__log{margin-top:4px}.stat-card{display:flex;flex-direction:column;gap:8px;padding:14px 16px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.stat-card__label{font-size:.6875rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.stat-card__values{display:flex;flex-direction:column;gap:4px}.stat-card__value{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.875rem;font-weight:600;color:var(--color-text-secondary);transition:color var(--transition-base)}.stat-card__value--winner{color:var(--color-success)}.stat-card__value--spacetime .stat-card__value--winner{color:var(--color-spacetime)}.stat-card__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.stat-card__dot--spacetime{background:var(--color-spacetime)}.stat-card__dot--supabase{background:var(--color-supabase)}.stat-card__unit{font-size:.625rem;color:var(--color-text-muted)}.chart-container{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.chart-container__title{font-family:var(--font-display);font-size:.8125rem;font-weight:600;color:var(--color-text-secondary);margin-bottom:12px;text-transform:uppercase;letter-spacing:.06em}.operation-log{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.operation-log__title{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-size:.8125rem;font-weight:600;color:var(--color-text-secondary);margin-bottom:12px;text-transform:uppercase;letter-spacing:.06em}.operation-log__count{font-family:var(--font-mono);font-size:.6875rem;padding:2px 8px;background:var(--color-bg-elevated);border-radius:100px;color:var(--color-text-muted)}.operation-log__scroll{max-height:260px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--color-bg-elevated) transparent}.operation-log__scroll::-webkit-scrollbar{width:4px}.operation-log__scroll::-webkit-scrollbar-track{background:transparent}.operation-log__scroll::-webkit-scrollbar-thumb{background:var(--color-bg-elevated);border-radius:4px}.operation-log__empty{font-size:.8125rem;color:var(--color-text-muted);text-align:center;padding:24px 0}.operation-log__entry{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.6875rem;transition:background var(--transition-base);animation:log-entry-in .2s ease-out}@keyframes log-entry-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.operation-log__entry:hover{background:var(--color-bg-elevated)}.operation-log__entry--spacetime .operation-log__backend{color:var(--color-spacetime)}.operation-log__entry--supabase .operation-log__backend{color:var(--color-supabase)}.operation-log__entry--error{background:#f43f5e0d}.operation-log__backend{font-weight:700;min-width:20px;text-align:center}.operation-log__type{color:var(--color-text-secondary);min-width:52px}.operation-log__slot{color:var(--color-text-muted);min-width:48px}.operation-log__rtt{margin-left:auto;font-weight:600;color:var(--color-text-primary)}.operation-log__error{color:var(--color-error)}@media(max-width:767px){.benchmark-layout{padding:0 12px}.benchmark-layout__header{padding:16px 0 12px}.avatar-card{padding:14px}.avatar-card__gear-grid,.metrics-dashboard__stats{grid-template-columns:repeat(2,1fr)}.stat-card{padding:10px 12px}}@media(max-width:480px){.avatar-card__gear-grid,.metrics-dashboard__stats{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
