.q-profile {
  --q-bg: #050816;
  --q-surface: #0c1428;
  --q-glass: rgba(17, 28, 54, .72);
  --q-line: #263653;
  --q-cyan: #00e5ff;
  --q-violet: #9166ff;
  --q-text: #f5f8ff;
  --q-muted: #aab9d3;
  color: var(--q-text);
  background: var(--q-bg);
  padding-bottom: clamp(1rem, 3vw, 2.5rem);
}
.q-profile :where(p, dd, td) { color: var(--q-muted); }
.q-profile :where(h1, h2, h3, dt, strong) { color: var(--q-text); }
.q-profile :where(a, button, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--q-cyan);
  outline-offset: 4px;
}
.q-profile :where([id]) { scroll-margin-top: 6rem; }
.q-profile [hidden] { display: none !important; }
.q-hero {
  padding: 2rem clamp(1rem, 4vw, 4rem) 2.7rem;
  background: radial-gradient(ellipse at 80% 22%, #191942, transparent 65%);
  border-bottom: 1px solid var(--q-line);
}
.q-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: start;
  gap: clamp(1.6rem, 4vw, 4rem);
  max-width: 80rem;
  margin: 1.65rem auto 0;
}
.q-hero h1 {
  font-size: clamp(2.75rem, 5vw, 5.1rem);
  letter-spacing: -.065em;
  line-height: 1.02;
  margin: 1rem 0 .4rem;
  overflow-wrap: anywhere;
}
.q-identity, .q-inline-actions, .q-highlights, .q-filters, .q-submission {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}
.q-identity > div p { margin: .2rem 0 0; font-size: .88rem; }
.q-logo {
  display: block;
  width: 2.65rem;
  height: 2.65rem;
  padding: .55rem;
  border: 1px solid var(--q-line);
  border-radius: .8rem;
  background: var(--q-surface);
}
.q-hero .q-tagline { font-size: clamp(1.2rem, 2.4vw, 1.85rem); color: var(--q-text); margin: 0; }
.q-hero .q-lede { max-width: 58ch; font-size: 1rem; line-height: 1.65; margin: 1rem 0; }
.q-primary-problem { margin: 1.35rem 0 .7rem; }
.q-primary-problem strong { display: block; margin-bottom: .2rem; color: var(--q-cyan); }
.q-highlights { margin: 0 0 1.5rem; padding: 0; list-style: none; }
.q-highlights a, .q-filters button {
  display: inline-block;
  padding: .52rem .74rem;
  border: 1px solid var(--q-line);
  border-radius: 2rem;
  background: var(--q-glass);
  color: var(--q-text);
  font: inherit;
  font-size: .84rem;
}
.q-filters button { min-height: 2.75rem; cursor: pointer; }
.q-highlights a:hover, .q-filters button[aria-pressed="true"] {
  border-color: var(--q-cyan);
  color: var(--q-cyan);
}
.q-actions { flex-wrap: wrap; }
.q-orbit-card {
  min-width: 0;
  padding: clamp(.95rem, 2.6vw, 1.6rem);
  border: 1px solid #46416b;
  border-radius: 1.3rem;
  background: linear-gradient(155deg, #1a2145, var(--q-glass) 56%, #10152d);
}
.q-orbit {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 13rem;
  isolation: isolate;
}
.q-ring, .q-spark {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.q-ring {
  border: 1px solid #54c7e68c;
  box-shadow: inset 0 0 1.3rem #00e5ff22, 0 0 1.4rem #00e5ff22;
}
.q-ring::before, .q-ring::after {
  content: "";
  position: absolute;
  inset: -.6rem;
  border-radius: 50%;
  border: 1px solid #9166ff77;
  transform: rotate(-29deg) scaleY(.62);
}
.q-ring::after { transform: rotate(29deg) scaleY(.62); }
.q-spark {
  animation: q-orbit 24s linear infinite;
  background: radial-gradient(circle at 50% 2%, #9af3ff 0 .16rem, transparent .32rem),
              radial-gradient(circle at 18% 85%, #b99aff 0 .12rem, transparent .27rem),
              radial-gradient(circle at 95% 58%, #00e5ff 0 .1rem, transparent .23rem);
}
.q-orbit-logo { z-index: 1; animation: q-float 8s ease-in-out infinite; }
.q-orbit-logo .q-logo {
  width: 4.65rem;
  height: 4.65rem;
  padding: .95rem;
  border: 1px solid #5a4e80;
  background: #0c1428e6;
  box-shadow: 0 0 2.2rem #9166ff42;
}
@keyframes q-orbit { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes q-float { 50% { transform: translateY(-.38rem); } }
@media (prefers-reduced-motion: reduce) {
  .q-spark, .q-orbit-logo { animation: none; }
}
.q-orbit-notes { display: grid; gap: .36rem; }
.q-orbit-notes details { background: var(--q-surface); border: 1px solid var(--q-line); border-radius: .55rem; }
.q-orbit-notes summary, .q-disclosures summary {
  position: relative;
  padding: .83rem 2.2rem .83rem .85rem;
  min-height: 2.75rem;
  color: var(--q-text);
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.q-profile summary::-webkit-details-marker { display: none; }
.q-orbit-notes summary::after, .q-disclosures summary::after {
  content: "+";
  position: absolute;
  right: .85rem;
  top: .75rem;
  color: var(--q-cyan);
}
.q-profile details[open] > summary::after { content: "−"; }
.q-orbit-notes details p { margin: 0 .85rem .8rem; font-size: .9rem; line-height: 1.45; }
.q-orbit-notes details:not([open]):hover { border-color: #6985ae; }
.q-profile .q-section { padding-inline: clamp(1rem, 4vw, 4rem); }
.q-section h2 { margin: .5rem 0 1.2rem; }
.q-disclosures { display: grid; gap: .65rem; }
.q-disclosures details, .q-alternative {
  min-width: 0;
  border: 1px solid var(--q-line);
  border-radius: .85rem;
  background: var(--q-glass);
}
.q-disclosures details[open] { border-color: #446586; }
.q-num { color: var(--q-cyan); margin-right: .65rem; font-size: .82em; }
.q-detail { padding: 0 1rem 1rem; }
.q-detail > p { margin-top: .15rem; }
.q-answer { display: grid; gap: .62rem; margin: 0 0 1rem; }
.q-answer dt { font-weight: 650; }
.q-answer dd { margin: .15rem 0 0; line-height: 1.55; }
.q-inline-actions { gap: .8rem 1.3rem; }
.q-inline-actions .external-note { margin: 0; }
.q-matrix-scroll { overflow-x: auto; border: 1px solid var(--q-line); border-radius: .85rem; }
.q-matrix { width: 100%; min-width: 34rem; border-collapse: collapse; text-align: left; background: var(--q-surface); }
.q-matrix :is(th, td) { padding: .8rem 1rem; border-bottom: 1px solid var(--q-line); vertical-align: top; }
.q-matrix thead { background: var(--q-glass); }
.q-matrix tbody th { font-weight: 650; }
.q-matrix tbody a { color: var(--q-cyan); }
.q-matrix tr:last-child :is(th, td) { border-bottom: 0; }
.q-filters { margin-bottom: 1rem; }
.q-feature-grid, .q-alternative-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: .85rem;
}
.q-tooltip {
  display: none;
  position: absolute;
  z-index: 2;
  top: calc(100% - .1rem);
  left: .55rem;
  right: .55rem;
  padding: .65rem .75rem;
  background: #1a2341;
  border: 1px solid #61779d;
  border-radius: .55rem;
  color: var(--q-text);
  font-size: .85rem;
  font-weight: 400;
}
@media (hover: hover) {
  .q-feature-grid details:not([open]) > summary:hover .q-tooltip,
  .q-orbit-notes details:not([open]) > summary:hover .q-tooltip { display: block; }
}
.q-intent-kind { display: block; color: var(--q-cyan); font-size: .75rem; margin-bottom: .25rem; }
.q-editorial { display: grid; gap: 1.8rem; }
.q-editorial > section { max-width: 70ch; }
.q-editorial ul { padding-left: 1.2rem; }
.q-editorial li { margin-bottom: .38rem; }
.q-editorial .mini-tool { margin: 0; }
.q-alternative { display: flex; align-items: flex-start; gap: .9rem; padding: 1rem; }
.q-alternative :is(.q-logo, .brand-mark) { flex-shrink: 0; }
.q-alternative h3 { margin: .35rem 0; }
.q-alternative p { margin: .3rem 0; }
.q-alternative a, .q-alternative-grid + a { margin-top: .75rem; }
.q-service { background: linear-gradient(100deg, #151a37, #10162d); border-block: 1px solid var(--q-line); }
.q-service p { max-width: 66ch; }
.q-profile .q-submission { padding-block: 1rem; }
.q-submission p { margin: 0; }

@media (max-width: 1050px) {
  .q-hero-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .q-feature-grid, .q-alternative-grid { grid-template-columns: 1fr; }
  .q-orbit { min-height: 11rem; }
  .q-ring, .q-spark { width: 8rem; height: 8rem; }
}
