/* The setup page uses the public theme tokens; historical guide CSS stays available. */
#ts-start {
  max-width: 64rem;
  margin-inline: auto;
  padding: clamp(1.5rem, 3vw, 2rem) clamp(1rem, 4vw, 2rem) 3rem;
  color: var(--ts-text-primary, var(--ts-ink));
  font-size: 1rem;
  line-height: 1.6;
}
#ts-start [hidden] { display: none !important; }
#ts-start [id] { scroll-margin-top: calc(var(--ts-hdr-h, 4rem) + 1.25rem); }
#ts-start h1, #ts-start h2, #ts-start h3, #ts-start p { margin: 0; }
#ts-start a { text-underline-offset: .2em; }
#ts-start :is(a, summary):focus-visible { outline: 3px solid var(--ts-link); outline-offset: 4px; border-radius: .25rem; }
#ts-start .setup-eyebrow { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ts-muted); }
#ts-start .setup-eyebrow a { color: var(--ts-link); font-weight: 650; }
#ts-start h1 { margin-block: .5rem; font-size: clamp(1.9rem, 4vw, 2.75rem); line-height: 1.15; letter-spacing: -.025em; }
#ts-start .setup-header > p:last-child { color: var(--ts-text-secondary, var(--ts-ink-soft)); }
#ts-start .setup-power { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: center; margin-block: 1rem; padding-block: .75rem; border-block: 1px solid var(--ts-rule); }
#ts-start .setup-power > details[open] { grid-column: 1 / -1; }
#ts-start .setup-anchor { position: absolute; inset: 0 auto auto 0; }
#ts-start .setup-power h2 { font-size: 1rem; font-weight: 700; }
#ts-start .setup-power p { margin-top: .25rem; max-width: 52rem; }
#ts-start .setup-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .625rem; }
#ts-start .setup-methods a { display: flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3.25rem; padding: .6rem .8rem; border: 1px solid var(--ts-rule); border-radius: .6rem; color: var(--ts-text-primary, var(--ts-ink)); font-weight: 650; text-decoration: none; background: var(--ts-surface); }
#ts-start .setup-methods a:hover { border-color: var(--ts-link); }
#ts-start .setup-methods a[aria-current="true"] { border-color: var(--ts-link); background: var(--ts-accent-soft); box-shadow: inset 0 -2px var(--ts-link); }
#ts-start .setup-methods .ti { font-size: 1.2rem; color: var(--ts-link); }
#ts-start .setup-requirements { margin-top: .9rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); font-size: .9375rem; }
#ts-start .setup-path { margin-top: 1.4rem; }
#ts-start .setup-path-header { margin-bottom: .8rem; }
#ts-start .setup-path-header h2 { font-size: 1.5rem; line-height: 1.3; letter-spacing: -.015em; }
#ts-start .setup-path-header > p { margin-top: .35rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); }
#ts-start .setup-note { margin-top: .6rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); font-size: .9375rem; }
#ts-start .setup-downloads { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; align-items: center; }
#ts-start .setup-downloads a { display: inline-flex; min-height: 3rem; align-items: center; }
#ts-start .setup-downloads img, #ts-start .setup-downloads svg { width: auto; height: 2.75rem; max-width: 10rem; }
#ts-start .setup-steps { list-style: none; padding: 0; margin: 0; }
#ts-start .setup-steps > li { display: grid; grid-template-columns: 1.8rem minmax(0, 1fr); gap: .8rem; padding-block: 1.15rem; border-bottom: 1px solid var(--ts-rule); }
#ts-start .setup-steps > li:last-child { border-bottom: 0; }
#ts-start .setup-number { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; margin-top: .1rem; border: 1px solid var(--ts-rule); border-radius: 50%; font-size: .875rem; font-weight: 700; }
#ts-start .setup-steps h3, #ts-start .setup-finish h3 { font-size: 1.0625rem; line-height: 1.5; font-weight: 700; }
#ts-start .setup-instruction { margin-top: .35rem; max-width: 49rem; }
#ts-start .setup-instruction p + p { margin-top: .6rem; }
#ts-start .setup-action { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; font-weight: 650; color: var(--ts-link); }
#ts-start :is(.setup-screen, .setup-trouble) { margin-top: .35rem; }
#ts-start :is(.setup-screen, .setup-trouble) > summary { width: fit-content; min-height: 2.75rem; padding-block: .6rem; color: var(--ts-link); cursor: pointer; font-weight: 550; font-size: .9375rem; }
#ts-start .setup-screen figure { display: flex; align-items: flex-start; gap: 1.25rem; margin: .5rem 0 1rem; padding: 1rem; background: var(--ts-surface-raised, var(--ts-surface)); border: 1px solid var(--ts-rule); border-radius: .5rem; }
#ts-start .setup-screen figure > a { display: block; flex: 0 1 17rem; min-width: 0; }
#ts-start .setup-screen img { display: block; width: auto; height: auto; max-width: 100%; max-height: 25rem; object-fit: contain; }
#ts-start .setup-screen figcaption { flex: 1 1 12rem; max-width: 21rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); font-size: .875rem; }
#ts-start .setup-trouble p { max-width: 47rem; margin-bottom: .5rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); }
#ts-start .setup-finish { margin: .6rem 0 0 2.6rem; padding: 1rem 1.25rem; border-left: 3px solid var(--ts-link); background: var(--ts-surface-raised, var(--ts-surface)); border-radius: 0 .5rem .5rem 0; }
#ts-start .setup-finish > p { margin-top: .35rem; }
#ts-start .setup-clock { margin: 1.5rem 0 0 2.6rem; border-block: 1px solid var(--ts-rule); }
#ts-start .setup-clock > summary { display: flex; justify-content: space-between; gap: .75rem; padding-block: 1rem; min-height: 3.25rem; color: var(--ts-link); font-weight: 650; list-style: none; cursor: pointer; }
#ts-start .setup-clock > summary::-webkit-details-marker { display: none; }
#ts-start .setup-clock[open] > summary > span:last-child { transform: rotate(45deg); }
#ts-start .setup-clock .setup-path { margin-top: .5rem; padding-bottom: 1.25rem; }
#ts-start .setup-clock .setup-path-header h2 { font-size: 1.25rem; }
#ts-start .setup-after { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--ts-rule); }
#ts-start .setup-after h2 { font-size: 1.125rem; }
#ts-start .setup-after p { margin-top: .35rem; color: var(--ts-text-secondary, var(--ts-ink-soft)); }
#ts-start .setup-after > a { display: inline-flex; min-height: 2.75rem; align-items: center; font-weight: 550; font-size: .9375rem; }
#ts-start .setup-next { display: flex; flex-wrap: wrap; column-gap: 2rem; margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--ts-rule); }
#ts-start .setup-next > a { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; font-size: .9375rem; font-weight: 600; }
#ts-start .setup-next small { margin-left: .3rem; color: var(--ts-muted); font-weight: 400; }
#ts-start .setup-legacy a { display: none; }
#ts-start .setup-legacy a:target { display: block; padding-block: 1rem; }
@media (max-width: 600px) {
  #ts-start { padding-top: 1.5rem; }
  #ts-start .setup-power { grid-template-columns: 1fr; gap: 0; }
  #ts-start .setup-methods { gap: .375rem; }
  #ts-start .setup-methods a { flex-direction: column; gap: .25rem; padding: .65rem .25rem; font-size: .875rem; }
  #ts-start .setup-steps > li { gap: .65rem; grid-template-columns: 1.6rem minmax(0, 1fr); }
  #ts-start .setup-number { height: 1.6rem; width: 1.6rem; }
  #ts-start .setup-finish, #ts-start .setup-clock { margin-left: 0; }
  #ts-start .setup-screen figure { flex-direction: column; gap: .75rem; }
  #ts-start .setup-screen figure > a, #ts-start .setup-screen figcaption { flex: initial; }
  #ts-start .setup-screen img { max-height: 22rem; }
  #ts-start .setup-next { display: grid; gap: 0; }
}
@media print {
  #ts-start { max-width: none; padding: 0; }
  #ts-start .setup-methods, #ts-start .setup-downloads, #ts-start .setup-next, #ts-start .setup-legacy { display: none; }
  #ts-start .setup-steps > li, #ts-start .setup-finish { break-inside: avoid; }
}