/* Squared Help · experience v9. The last visual layer on public pages. */
:root {
  --sq-v9-ink: #121712;
  --sq-v9-lime: #7be84e;
  --sq-v9-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}
html[data-theme="light"] {
  --bg: #f5f6f2;
  --panel-2: #f0f2ed;
  --line: #dee2da;
  --text: #162018;
  --muted: #59645d;
  --muted-2: #59645d;
}
html[data-theme="dark"] {
  --bg: #0d110e;
  --panel: #171d18;
  --panel-2: #202821;
  --line: #323c33;
  --text: #f2f6ef;
  --muted: #afbbb0;
  --muted-2: #bac7bb;
}
body {
  font-optical-sizing: auto;
}
body .shell {
  max-width: 1280px;
}
body .topbar {
  border-bottom-color: var(--line);
}
body .topbar .crumbs {
  font-size: 12px;
}
body .hc-brand-copy strong {
  font-size: 12px;
}
body .hc-brand-copy span {
  font-size: 9px;
}
body .hc-nav-title {
  font-size: 9px !important;
}
body .hc-nav-link {
  font-size: 12px !important;
  min-height: 36px;
}
body .hc-sub-link {
  font-size: 10.5px !important;
}
body .hc-nav-link.active,
body .hc-nav-link.active-parent {
  border-radius: 10px;
}
body :is(a, button, input, textarea, select):focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}
body .section-head h2 {
  font-size: clamp(25px, 2.5vw, 33px);
  line-height: 1.12;
  letter-spacing: -0.055em;
}
body .section-head p {
  font-size: 13px;
  line-height: 1.55;
  margin-top: 8px;
}
body .section-head > a:not(.btn) {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}
body .section-head > a:not(.btn):hover {
  color: var(--sq-accent-ink);
}
body .section {
  padding: 48px 0;
}
body .section-head {
  margin-bottom: 22px;
}
body .btn {
  font-size: 12px;
  min-height: 38px;
  border-radius: 11px;
}
body .btn.green {
  background: var(--sq-v9-lime);
  border-color: var(--sq-v9-lime);
  color: #10200c;
}
body .btn.green:hover {
  background: #9df279;
  border-color: #9df279;
  color: #10200c;
}
body .footer {
  font-size: 12px;
}

/* The home hero is a navigational landmark, with a visual treatment distinct
   from the quieter long-form documentation. */
body.sq-home-v9 .main > .shell {
  max-width: 1320px;
  padding-top: 34px;
}
body.sq-home-v9 .main .help-hero {
  position: relative;
  isolation: isolate;
  max-width: none;
  margin: 0;
  padding: 52px clamp(22px, 5.5vw, 76px) 34px;
  overflow: hidden;
  border: 1px solid #283128;
  border-radius: 30px;
  background:
    radial-gradient(ellipse at 84% 17%, #28412a 0, transparent 37%),
    radial-gradient(ellipse at 12% 95%, #1f3822 0, transparent 38%), #121b14;
  color: #f6fbf2;
  text-align: center;
  box-shadow: 0 28px 80px rgba(19, 34, 18, 0.13);
}
body.sq-home-v9 .main .help-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.32;
  pointer-events: none;
  background-image:
    linear-gradient(#ffffff12 1px, transparent 1px),
    linear-gradient(90deg, #ffffff12 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(
    90deg,
    transparent 8%,
    #000 55%,
    transparent 100%
  );
}
body.sq-home-v9 .main .help-hero:after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  left: 50%;
  top: -250px;
  width: min(80vw, 760px);
  height: 500px;
  transform: translateX(-50%);
  border: 1px solid #b8ffa71f;
  border-radius: 50%;
  box-shadow:
    0 0 0 64px #b8ffa709,
    0 0 0 130px #b8ffa705;
  pointer-events: none;
}
.sq-hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 30px;
  padding: 4px 12px;
  border: 1px solid #d6ffd040;
  border-radius: 999px;
  background: #d6ffd012;
  color: #dfffd4;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.025em;
}
.sq-kicker-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sq-v9-lime);
  box-shadow: 0 0 0 4px #7be84e2a;
}
body.sq-home-v9 .help-hero-logo {
  width: 50px;
  height: 50px;
  margin: 24px auto 12px;
  border: 1px solid #ffffff38;
  border-radius: 14px;
  box-shadow: 0 14px 40px #0006;
  transform: rotate(-5deg);
}
body.sq-home-v9 .home-logo-lockup span {
  color: #bbcdba;
  font-size: 10px;
  letter-spacing: 0.16em;
}
body.sq-home-v9 .help-hero h1 {
  max-width: 900px;
  margin: 16px auto 18px;
  color: #f7fbf5;
  font-size: clamp(52px, 6.2vw, 90px);
  line-height: 0.96;
  letter-spacing: -0.076em;
  text-wrap: balance;
}
body.sq-home-v9 .help-hero h1 span {
  color: var(--sq-v9-lime);
}
body.sq-home-v9 .help-hero > p {
  max-width: 620px;
  color: #c4d0c2;
  font-size: clamp(14px, 1.35vw, 17px);
  line-height: 1.55;
}
body.sq-home-v9 button.help-search {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  width: min(100%, 680px);
  max-width: none;
  height: 68px;
  margin: 28px auto 0;
  padding: 8px 12px 8px 20px;
  border: 1px solid #dbe7d8;
  border-radius: 16px;
  background: #fff;
  color: #1d2a1d;
  box-shadow: 0 18px 42px #0004;
  text-align: left;
  transition:
    transform 0.25s var(--sq-v9-ease),
    box-shadow 0.25s var(--sq-v9-ease),
    border-color 0.25s;
}
body.sq-home-v9 button.help-search:hover {
  transform: translateY(-3px);
  border-color: var(--sq-v9-lime);
  box-shadow: 0 24px 54px #0005;
}
body.sq-home-v9 .help-search-label {
  font-size: 15px;
  color: #59645d;
}
body.sq-home-v9 .help-search .search-icon {
  color: #324635;
}
body.sq-home-v9 .help-search kbd {
  font-size: 11px;
  border-radius: 7px;
  background: #f1f4ee;
  color: #506052;
}
.sq-search-suggestions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 15px auto 0;
  color: #b7c8b4;
  font-size: 11px;
}
.sq-search-suggestions a {
  padding: 5px 9px;
  border: 1px solid #ffffff25;
  border-radius: 999px;
  color: #e5f4e1;
  text-decoration: none;
  transition:
    background 0.2s,
    border-color 0.2s,
    transform 0.2s;
}
.sq-search-suggestions a:hover {
  background: #7be84e25;
  border-color: #7be84e8a;
  transform: translateY(-1px);
}
body.sq-home-v9 .support-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(100%, 850px);
  max-width: none;
  margin: 35px auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
body.sq-home-v9 .support-path {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 78px;
  padding: 13px;
  text-align: left;
  border: 1px solid #ffffff2e !important;
  border-radius: 14px;
  background: #ffffff10;
  color: #f5fbf2;
  backdrop-filter: blur(10px);
  transition:
    transform 0.25s var(--sq-v9-ease),
    background 0.25s,
    border-color 0.25s;
}
body.sq-home-v9 .support-path + .support-path {
  border-left: 1px solid #ffffff2e;
}
body.sq-home-v9 .support-path:hover {
  transform: translateY(-3px);
  background: #ffffff1f;
  border-color: #7be84e9c !important;
}
body.sq-home-v9 .support-path .big-ico {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #7be84e27;
  color: var(--sq-v9-lime);
}
body.sq-home-v9 .support-path h3 {
  margin: 0 0 3px;
  color: #f8fff5;
  font-size: 13px;
}
body.sq-home-v9 .support-path p {
  margin: 0;
  color: #b8c9b7;
  font-size: 10px;
  line-height: 1.4;
}
.sq-path-arrow {
  align-self: flex-start;
  margin-left: auto;
  color: #b8d4b3;
  font-size: 14px;
}

.sq-section-index {
  display: block;
  margin-bottom: 10px;
  color: var(--sq-accent-ink);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
body.sq-home-v9 .sq-quick-section {
  padding-top: 54px;
}
.sq-quick-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
}
.sq-quick-grid > a {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 16px;
  align-items: start;
  gap: 10px;
  min-height: 118px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
  box-shadow: 0 4px 20px #00000006;
  transition:
    transform 0.25s var(--sq-v9-ease),
    box-shadow 0.25s,
    border-color 0.25s;
}
.sq-quick-grid > a:hover {
  transform: translateY(-4px);
  border-color: #9dca90;
  box-shadow: 0 18px 36px #15281318;
}
.sq-quick-grid > a > span:last-child {
  color: var(--muted);
  font-size: 15px;
}
.sq-quick-icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--green-soft);
  color: var(--sq-accent-ink);
}
.sq-quick-grid strong {
  display: block;
  margin-top: 2px;
  font-size: 13px;
  line-height: 1.35;
}
.sq-quick-grid small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

body.sq-home-v9 .sq-task-grid {
  gap: 12px;
}
body.sq-home-v9 .sq-task-card {
  min-height: 205px;
  padding: 24px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    var(--panel),
    color-mix(in srgb, var(--panel-2) 40%, var(--panel))
  );
  box-shadow: 0 8px 28px #00000007;
  transition:
    transform 0.25s var(--sq-v9-ease),
    box-shadow 0.25s,
    border-color 0.25s;
}
body.sq-home-v9 .sq-task-card:hover {
  transform: translateY(-4px);
  border-color: #9dca90;
  box-shadow: 0 22px 45px #15281317;
}
body.sq-home-v9 .sq-task-icon {
  background: var(--green-soft);
  color: var(--sq-accent-ink);
}
body.sq-home-v9 .sq-task-card strong {
  font-size: 20px;
  letter-spacing: -0.04em;
}
body.sq-home-v9 .sq-task-card p {
  font-size: 13px;
  line-height: 1.5;
}
body.sq-home-v9 .sq-task-card small {
  font-size: 12px;
}
body.sq-home-v9 .category-grid {
  gap: 12px;
  border: 0;
}
body.sq-home-v9 .main .category-card {
  position: relative;
  min-height: 208px !important;
  padding: 22px !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  background: var(--panel) !important;
  transition:
    transform 0.25s var(--sq-v9-ease),
    box-shadow 0.25s,
    border-color 0.25s;
}
body.sq-home-v9 .main .category-card:hover {
  transform: translateY(-4px) !important;
  border-color: #9dca90 !important;
  box-shadow: 0 18px 40px #15281318 !important;
}
body.sq-home-v9 .category-card .cat-count {
  font-size: 10px;
}
body.sq-home-v9 .main .category-card h3 {
  font-size: 18px !important;
  letter-spacing: -0.04em;
}
body.sq-home-v9 .main .category-card p {
  font-size: 12px !important;
}
body.sq-home-v9 .main .category-card .cat-link {
  font-size: 11px !important;
  text-decoration: none;
}
body.sq-home-v9 .popular-grid {
  gap: 0 24px;
  border-top: 1px solid var(--line);
}
body.sq-home-v9 .main .popular-article {
  grid-template-columns: 34px minmax(0, 1fr) auto;
  min-height: 92px;
  padding: 16px 5px !important;
  border-bottom: 1px solid var(--line) !important;
  transition:
    padding 0.2s,
    background 0.2s;
}
body.sq-home-v9 .main .popular-article:hover {
  padding-left: 11px !important;
  background: var(--panel-2) !important;
}
body.sq-home-v9 .popular-article .pnum {
  font-size: 12px;
  color: var(--sq-accent-ink);
}
body.sq-home-v9 .popular-article strong {
  font-size: 13px;
}
body.sq-home-v9 .popular-article span span {
  font-size: 11px;
}
body.sq-home-v9 .popular-article em {
  font-size: 10px;
  white-space: nowrap;
}
body.sq-home-v9 .home-live-grid {
  gap: 14px;
}
body.sq-home-v9 .home-discussions,
body.sq-home-v9 .home-status-card {
  border-radius: 18px;
  box-shadow: 0 10px 32px #00000009;
}
body.sq-home-v9 .banner {
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 85% 0, #7be84e40, transparent 38%), var(--panel);
}
body.sq-home-v9 .banner h3 {
  font-size: clamp(21px, 2.4vw, 30px);
  letter-spacing: -0.05em;
}

/* Reading comfort and consistent interaction on the rest of the site. */
body .article-head {
  border-radius: 22px;
  background:
    radial-gradient(circle at 90% 0, var(--green-soft), transparent 39%),
    var(--panel);
  box-shadow: 0 12px 34px #00000008;
}
body .article-head h1 {
  font-size: clamp(38px, 4.7vw, 64px);
  line-height: 1.04;
  letter-spacing: -0.065em;
}
body .article-head p {
  font-size: 15px;
  line-height: 1.65;
}
body .doc-block h2 {
  font-size: clamp(23px, 2.3vw, 30px);
  line-height: 1.2;
  letter-spacing: -0.04em;
}
body .doc-block p,
body .doc-block li {
  font-size: 15px;
  line-height: 1.78;
}
body .doc-block a {
  font-weight: 650;
}
body .aside-toc {
  border-radius: 14px;
  box-shadow: 0 8px 24px #00000008;
}
body .aside-toc a {
  font-size: 11px;
  line-height: 1.45;
}
body .sq-related-card,
body .sq-context-item,
body .sq-article-nav-v8 a {
  border-radius: 15px;
}
body .sq-related-card:hover,
body .sq-article-nav-v8 a:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px #00000010;
}
body .faq-item {
  border-radius: 14px;
}
body .faq-item summary {
  font-size: 14px;
  line-height: 1.45;
  min-height: 56px;
}
body .faq-answer {
  font-size: 14px;
  line-height: 1.75;
}
body .faq-answer a {
  font-weight: 650;
  text-underline-offset: 3px;
}

@media (max-width: 1100px) {
  .sq-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  body.sq-home-v9 .main > .shell {
    padding-top: 20px;
  }
  body.sq-home-v9 .main .help-hero {
    width: 100%;
    max-width: 680px;
    margin-inline: auto;
    padding: 38px 21px 25px;
    border-radius: 23px;
  }
  body.sq-home-v9 .help-hero h1 {
    font-size: clamp(42px, 8vw, 64px);
    line-height: 1.01;
  }
  body.sq-home-v9 button.help-search {
    width: calc(100% + 42px);
    max-width: none;
    margin-left: -21px;
  }
  body.sq-home-v9 .support-paths {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 26px;
  }
  body.sq-home-v9 .support-path + .support-path {
    border: 1px solid #ffffff2e;
  }
  body.sq-home-v9 .support-path {
    min-height: 67px;
  }
  body.sq-home-v9 .sq-task-card {
    min-height: 0;
  }
  body.sq-home-v9 .category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 600px) {
  body.sq-home-v9 .main .help-hero {
    padding: 32px 16px 19px;
    border-radius: 20px;
  }
  body.sq-home-v9 .help-hero-logo {
    width: 44px;
    height: 44px;
    margin-top: 18px;
  }
  body.sq-home-v9 .help-hero h1 {
    font-size: clamp(38px, 10vw, 50px);
    letter-spacing: -0.067em;
  }
  body.sq-home-v9 .help-hero > p {
    font-size: 14px;
  }
  body.sq-home-v9 button.help-search {
    width: calc(100% + 32px);
    margin-left: -16px;
    height: 58px;
    grid-template-columns: 30px minmax(0, 1fr);
    padding: 8px 12px;
  }
  body.sq-home-v9 .help-search-label {
    font-size: 13px;
  }
  body.sq-home-v9 .help-search kbd {
    display: none;
  }
  .sq-search-suggestions {
    gap: 6px;
    font-size: 10px;
  }
  .sq-search-suggestions a {
    padding: 4px 7px;
  }
  .sq-quick-grid,
  body.sq-home-v9 .category-grid {
    grid-template-columns: 1fr !important;
  }
  .sq-quick-grid > a {
    min-height: 82px;
  }
  body.sq-home-v9 .main .category-card {
    min-height: 168px !important;
  }
  body.sq-home-v9 .main .popular-article {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 8px;
  }
  body.sq-home-v9 .popular-article em {
    grid-column: 2;
  }
  body.sq-home-v9 .banner {
    padding: 22px;
  }
  body .article-head p,
  body .doc-block p,
  body .doc-block li {
    font-size: 15px;
  }
}
@media (prefers-reduced-motion: no-preference) {
  body.sq-home-v9 .help-hero-logo {
    animation: sqV9Float 7s ease-in-out infinite;
  }
  body.sq-home-v9 .main .help-hero:after {
    animation: sqV9Glow 9s ease-in-out infinite;
  }
  @keyframes sqV9Float {
    0%,
    100% {
      transform: translateY(0) rotate(-5deg);
    }
    50% {
      transform: translateY(-5px) rotate(-3deg);
    }
  }
  @keyframes sqV9Glow {
    0%,
    100% {
      opacity: 0.7;
    }
    50% {
      opacity: 1;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  body.sq-home-v9 .help-hero-logo,
  body.sq-home-v9 .main .help-hero:after {
    animation: none !important;
  }
  body.sq-home-v9
    :is(
      .support-path,
      .sq-task-card,
      .category-card,
      .popular-article,
      .sq-quick-grid > a
    ),
  body :is(.sq-related-card, .sq-article-nav-v8 a) {
    transition: none !important;
    transform: none !important;
  }
}