/* Genexts 3D, Codebase, Research Lab and Scientists Lab */
/* Hidden until the plan is known, and for the Basic plan. */
html[data-theme] body:not(.labs-on) .sidebar.rail .rail-pop > .sidebar-item.labs-only,
body:not(.labs-on) .sidebar .sidebar-item.labs-only { display: none !important; }
:root { --lab-glass: rgba(255,255,255,0.05); --lab-glass-strong: rgba(255,255,255,0.08); --lab-edge: rgba(255,255,255,0.14); --lab-glow-a: rgba(45,212,167,0.16); --lab-glow-b: rgba(99,102,241,0.14); }
html[data-theme="light"] { --lab-glass: rgba(255,255,255,0.55); --lab-glass-strong: rgba(255,255,255,0.72); --lab-edge: rgba(15,23,42,0.12); --lab-glow-a: rgba(45,212,167,0.22); --lab-glow-b: rgba(99,102,241,0.18); }
.lab-root { height: 100%; overflow-y: auto; background: radial-gradient(520px 320px at 18% 8%, var(--lab-glow-a), transparent 70%), radial-gradient(560px 360px at 85% 30%, var(--lab-glow-b), transparent 70%); background-attachment: local; }
.lab { max-width: 680px; margin: 0 auto; padding: 56px 16px 72px; color: var(--text-primary); }
.lab-head { margin-bottom: 24px; }
.lab-head h1 { margin: 0 0 6px; font-size: 1.75rem; font-weight: 650; letter-spacing: -0.01em; }
.lab-head p { margin: 0; color: var(--text-secondary); line-height: 1.5; }
.lab-form, .lab-details, .lab-report { background: var(--lab-glass); border: 1px solid var(--lab-edge); -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%); }
.lab-form { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 16px; }
.lab-label { margin-top: 6px; font-size: 0.8125rem; font-weight: 600; color: var(--text-secondary); }
.lab-label:first-child { margin-top: 0; }
.lab-form textarea, .lab-form select, .lab-form input[type=file] { width: 100%; box-sizing: border-box; padding: 10px 12px; font: inherit; font-size: 1rem; color: var(--text-primary); background: var(--lab-glass); border: 1px solid var(--lab-edge); border-radius: 10px; }
.lab-form textarea { resize: vertical; min-height: 84px; }
.lab-form textarea:focus, .lab-form select:focus { outline: 2px solid var(--accent-primary, #2dd4a7); outline-offset: 1px; border-color: transparent; }
.lab-form select option, .lab-form select optgroup { color: #111; }
.lab-go { align-self: flex-end; min-height: 44px; margin-top: 8px; padding: 0 18px; border: 0; border-radius: 10px; font: inherit; font-weight: 600; color: #062420; background: var(--accent-primary, #2dd4a7); cursor: pointer; }
.lab-go:disabled { opacity: 0.5; cursor: default; }
.lab-second { background: var(--lab-glass-strong); color: var(--text-primary); border: 1px solid var(--lab-edge); }
.lab-link { display: inline-flex; align-items: center; margin: 4px 0 8px; text-decoration: none; }
.lab-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.lab-hint { margin: 0; font-size: 0.8125rem; color: var(--text-secondary); }
.lab-hint:empty { display: none; }
.lab-steps:not(:empty) { margin-top: 16px; }
.lab-step { display: flex; align-items: center; gap: 10px; color: var(--text-secondary); overflow-wrap: anywhere; }
.lab-error { color: var(--color-danger, #ef4444); overflow-wrap: anywhere; }
.lab-out:not(:empty) { margin-top: 24px; }
.lab-out h2 { margin: 20px 0 8px; font-size: 0.9375rem; font-weight: 600; overflow-wrap: anywhere; }
.lab-report { padding: 16px; border-radius: 14px; white-space: pre-wrap; line-height: 1.65; overflow-wrap: anywhere; }
.lab-h { display: block; margin-top: 12px; }
.lab-figure { margin: 0 0 12px; }
.lab-figure img { display: block; width: 100%; max-width: 420px; height: auto; border-radius: 12px; border: 1px solid var(--lab-edge); }
.lab-table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 0.9375rem; }
.lab-table th, .lab-table td { padding: 8px 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--lab-edge); overflow-wrap: anywhere; }
.lab-table th { width: 40%; font-weight: 500; color: var(--text-secondary); }
.lab-details { margin-top: 12px; padding: 10px 14px; border-radius: 12px; }
.lab-details summary { min-height: 28px; font-size: 0.875rem; font-weight: 600; cursor: pointer; }
.lab-details pre, .lab-diff { max-height: 320px; margin: 8px 0 0; overflow: auto; padding: 12px; font-size: 0.8125rem; line-height: 1.45; background: var(--lab-glass); border: 1px solid var(--lab-edge); border-radius: 8px; white-space: pre; }

/* ---------- Colourful glass ---------- */
:root { --lab-a: #2dd4bf; --lab-b: #818cf8; --lab-c: #f472b6; --lab-d: #fbbf24; --lab-shadow: 0 18px 50px rgba(0,0,0,0.35); --lab-shine: rgba(255,255,255,0.14); --lab-glass: rgba(255,255,255,0.06); --lab-glass-strong: rgba(255,255,255,0.1); --lab-edge: rgba(255,255,255,0.18); }
html[data-theme="light"] { --lab-a: #0d9488; --lab-b: #6366f1; --lab-c: #db2777; --lab-d: #d97706; --lab-shadow: 0 18px 44px rgba(79,70,229,0.14); --lab-shine: rgba(255,255,255,0.75); --lab-glass: rgba(255,255,255,0.5); --lab-glass-strong: rgba(255,255,255,0.68); --lab-edge: rgba(255,255,255,0.8); }
.lab-root { position: relative; isolation: isolate; background: none; overflow-x: hidden; flex: 1; min-width: 0; }
.lab-root::before { content: ""; position: sticky; top: 0; display: block; height: 100vh; margin-bottom: -100vh; z-index: -1; pointer-events: none; opacity: 0.5; filter: blur(44px) saturate(135%); background: radial-gradient(38% 42% at 16% 14%, var(--lab-a), transparent 72%), radial-gradient(36% 44% at 84% 16%, var(--lab-b), transparent 72%), radial-gradient(34% 40% at 76% 84%, var(--lab-c), transparent 72%), radial-gradient(30% 36% at 20% 86%, var(--lab-d), transparent 72%); animation: lab-drift 26s ease-in-out infinite alternate; }
html[data-theme="light"] .lab-root::before { opacity: 0.34; }
@keyframes lab-drift { from { transform: translate3d(-2%, -1%, 0) scale(1); } to { transform: translate3d(2%, 2%, 0) scale(1.07); } }
@media (prefers-reduced-motion: reduce) { .lab-root::before { animation: none; } }
.lab-head h1 { background: linear-gradient(95deg, var(--text-primary) 15%, var(--lab-a) 55%, var(--lab-b) 90%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lab-form, .lab-details, .lab-report { position: relative; background: linear-gradient(135deg, var(--lab-glass-strong), var(--lab-glass)); border: 1px solid var(--lab-edge); box-shadow: var(--lab-shadow), inset 0 1px 0 var(--lab-shine); -webkit-backdrop-filter: blur(26px) saturate(170%); backdrop-filter: blur(26px) saturate(170%); }
.lab-form { padding: 20px; border-radius: 20px; }
.lab-form::before { content: ""; position: absolute; inset: 0; padding: 1px; border-radius: inherit; pointer-events: none; background: linear-gradient(120deg, var(--lab-a), var(--lab-b) 40%, var(--lab-c) 75%, var(--lab-d)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; opacity: 0.75; }
.lab-form textarea, .lab-form select, .lab-form input[type=file] { background: var(--lab-glass); box-shadow: inset 0 1px 3px rgba(0,0,0,0.12); transition: border-color 0.15s, box-shadow 0.15s; }
.lab-form textarea:focus, .lab-form select:focus { outline: none; border-color: var(--lab-a); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lab-a) 30%, transparent); }
.lab-go { color: #fff; background: linear-gradient(115deg, #0d9488, #4f46e5 62%, #c026d3); box-shadow: 0 8px 22px rgba(79,70,229,0.35), inset 0 1px 0 rgba(255,255,255,0.28); transition: transform 0.15s, box-shadow 0.15s, filter 0.15s; }
.lab-go:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.08); box-shadow: 0 12px 28px rgba(79,70,229,0.45), inset 0 1px 0 rgba(255,255,255,0.28); }
.lab-go:focus-visible, .lab-details summary:focus-visible { outline: 2px solid var(--lab-a); outline-offset: 2px; }
.lab-second { color: var(--text-primary); background: var(--lab-glass-strong); border: 1px solid var(--lab-edge); box-shadow: inset 0 1px 0 var(--lab-shine); }
.lab-details { border-radius: 14px; }
.lab-report { border-radius: 18px; padding: 18px; }
.lab-figure img { box-shadow: var(--lab-shadow); }

.lab-downloads { justify-content: flex-start; margin-bottom: 10px; }
.lab-downloads .lab-link { margin: 0; }
.lab-warning { margin: 0 0 12px; padding: 10px 12px; color: var(--text-primary); background: rgba(251,191,36,0.14); border: 1px solid rgba(251,191,36,0.45); border-radius: 10px; overflow-wrap: anywhere; }

.proof-receipt { margin-top: 12px; padding: 16px; font-size: 0.875rem; color: var(--text-primary); background: linear-gradient(135deg, var(--lab-glass-strong), var(--lab-glass)); border: 1px solid var(--lab-edge); border-radius: 16px; box-shadow: var(--lab-shadow), inset 0 1px 0 var(--lab-shine); -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); }
.proof-receipt header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; font-size: 1rem; }
.proof-risk { padding: 2px 10px; font-size: 0.75rem; font-weight: 600; border-radius: 999px; }
.proof-risk.low { color: #34d399; background: rgba(52,211,153,0.15); }
.proof-risk.medium { color: #fbbf24; background: rgba(251,191,36,0.15); }
.proof-risk.high { color: #f87171; background: rgba(248,113,113,0.15); }
html[data-theme="light"] .proof-risk.low { color: #047857; }
html[data-theme="light"] .proof-risk.medium { color: #92400e; }
html[data-theme="light"] .proof-risk.high { color: #b91c1c; }
.proof-receipt table { width: 100%; border-collapse: collapse; }
.proof-receipt th, .proof-receipt td { padding: 7px 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--lab-edge); overflow-wrap: anywhere; }
.proof-receipt th { width: 34%; padding-right: 10px; font-weight: 500; color: var(--text-secondary); }
.proof-receipt ul { margin: 2px 0 0; padding-left: 16px; }
.proof-unchecked { margin-top: 10px; color: var(--text-secondary); }
@media (max-width: 767px) { .proof-receipt th, .proof-receipt td { display: block; width: auto; border: 0; padding: 2px 0; } .proof-receipt tr { display: block; padding: 7px 0; border-bottom: 1px solid var(--lab-edge); } }

/* ---------- Phones ---------- */
@media (max-width: 767px) {
  .lab-root { height: 100dvh; -webkit-overflow-scrolling: touch; }
  .lab-root::before { height: 100dvh; margin-bottom: -100dvh; opacity: 0.42; filter: blur(34px) saturate(130%); }
  html[data-theme="light"] .lab-root::before { opacity: 0.3; }
  .lab { padding: calc(76px + env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .lab-head { margin-bottom: 18px; }
  .lab-head h1 { font-size: 1.5rem; }
  .lab-head p { font-size: 0.9375rem; }
  .lab-form { padding: 14px; border-radius: 16px; -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%); }
  .lab-form textarea, .lab-form select, .lab-form input[type=file] { min-height: 44px; }
  .lab-form textarea { min-height: 96px; }
  .lab-go, .lab-actions .lab-go { align-self: stretch; width: 100%; min-height: 48px; }
  .lab-actions { flex-direction: column; }
  .lab-link { justify-content: center; box-sizing: border-box; }
  .lab-figure img { max-width: 100%; }
  .lab-report { padding: 14px; font-size: 0.9375rem; }
  .lab-details { padding: 8px 12px; }
  .lab-details summary { display: list-item; padding: 10px 0; }
  .lab-table th, .lab-table td { display: block; width: auto; padding: 2px 0; border: 0; }
  .lab-table tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--lab-edge); }
  .lab-table th { font-size: 0.8125rem; }
  .lab-details pre, .lab-diff { max-height: 260px; font-size: 0.75rem; }
}
