/* Photo-backed connection guide. Original tabs, controls and instructions are preserved. */
#top #deploy.connect-next-section { scroll-margin-top:100px; }
#top #deploy.connect-next-section > .section-label {
  margin:0 0 24px; color:#f3f5f7; font:700 28px/1.25 Inter,sans-serif;
  letter-spacing:0; text-transform:none;
}
#deploy #term.connect-next-ready {
  --connect-accent:#ff9baa; --connect-button:#bf2945; --connect-hover:#d83352; --connect-ink:#fff;
  --connect-photo:url('/assets/cs-art-20260911/zombie-survival.webp'); --connect-position:65% center; --connect-size:cover;
  background:#07111b; border:1px solid #adc3df40; border-radius:8px;
  box-shadow:0 16px 40px #00000026; isolation:isolate;
}
#deploy #term.connect-next-ready.term--samp {
  --connect-accent:#99ceff; --connect-button:#2462dc; --connect-hover:#2c6beb;
  --connect-photo:url('/assets/home-studio-20260909/server-worlds.webp'); --connect-position:right center; --connect-size:auto calc(300% + 9px);
}
#deploy #term.connect-next-ready.term--grpls {
  --connect-accent:#8becba; --connect-button:#087855; --connect-hover:#09815c;
  --connect-photo:url('/assets/home-studio-20260909/server-worlds.webp'); --connect-position:right bottom; --connect-size:auto calc(300% + 9px);
}
#deploy #term.connect-next-ready.term--mu {
  --connect-accent:#ffdb8e; --connect-button:#edbc59; --connect-hover:#f7cd7b; --connect-ink:#261902;
  --connect-photo:url('/assets/mu-art-20260911/dark-lord.png'); --connect-position:right center; --connect-size:cover;
}
#deploy #term.connect-next-ready .term__tabs {
  background:#07111b; border-bottom:1px solid #adc3df40;
  grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible;
}
#deploy #term.connect-next-ready .term__tab {
  --tab-accent:#ff9baa; --action-surface:transparent; --action-hover:transparent;
  --tab-photo:url('/assets/cs-art-20260911/zombie-survival.webp'); --tab-position:center; --tab-size:cover; --tab-shade:#030a14d9;
  --action-text:#ecf3fb; --action-border:transparent;
  min-height:92px; padding:22px 28px; gap:16px; border:0;
  border-radius:0!important; position:relative; transition:background-color .16s ease;
  background-image:linear-gradient(var(--tab-shade),var(--tab-shade)),var(--tab-photo)!important;
  background-size:cover,var(--tab-size)!important;background-position:center,var(--tab-position)!important;background-repeat:no-repeat!important;
}
#deploy #term.connect-next-ready .term__tab[data-term=samp] { --tab-accent:#99ceff; --tab-photo:url('/assets/home-studio-20260909/server-worlds.webp'); --tab-position:right center; --tab-size:auto calc(300% + 9px); }
#deploy #term.connect-next-ready .term__tab[data-term=grpls] { --tab-accent:#8becba; --tab-photo:url('/assets/home-studio-20260909/server-worlds.webp'); --tab-position:right bottom; --tab-size:auto calc(300% + 9px); }
#deploy #term.connect-next-ready .term__tab[data-term=mu] { --tab-accent:#ffdb8e; --tab-photo:url('/assets/mu-art-20260911/dark-lord.png'); --tab-position:right center; }
#deploy #term.connect-next-ready .term__tab[aria-selected=true] {
  --action-text:#fff; --tab-shade:#030a14a3;
  box-shadow:inset 0 -3px var(--tab-accent)!important;
}
#deploy #term.connect-next-ready .term__tab:not([aria-selected=true]):hover { --tab-shade:#030a14b3; }
#deploy #term.connect-next-ready .term__tab > .vector-icon {
  width:26px; height:26px; flex:0 0 26px; color:var(--tab-accent); opacity:1;
}
#deploy #term.connect-next-ready .connect-tab-label { gap:5px; }
#deploy #term.connect-next-ready .connect-tab-label strong { font:650 16px/1.3 Inter,sans-serif; }
#deploy #term.connect-next-ready .connect-tab-label small { color:#d2e0eb; font:400 12px/1.4 Inter,sans-serif; }
#deploy #term.connect-next-ready :is(.term__tab,.copybtn):focus-visible {
  outline:2px solid #f2f5f9!important; outline-offset:-5px!important;
}
#deploy #term.connect-next-ready .term__body { padding:0; background:none; }
#deploy #term.connect-next-ready .term__panel {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);
  padding:0; gap:0; min-height:460px; align-items:stretch;
  background-color:#07111b;background-image:var(--connect-photo);
  background-position:var(--connect-position);background-size:var(--connect-size);background-repeat:no-repeat;
}
#deploy #term.connect-next-ready .term__panel[hidden] { display:none!important; }
#deploy #term.connect-next-ready .term__panel:focus-visible { outline:2px solid var(--connect-accent); outline-offset:-3px; }
#deploy #term.connect-next-ready .term__side {
  display:flex; flex-direction:column; align-items:stretch; gap:0;
  grid-column:auto; grid-row:auto; align-self:stretch; padding:34px;
  background:linear-gradient(180deg,#040b1599 0%,#040b15bf 58%,#040b15eb 100%);
  border:0; border-right:1px solid #d1e5ff2b;
}
#deploy #term.connect-next-ready .connect-next-identity {
  display:flex; align-items:center; gap:20px; min-width:0; margin-bottom:32px;
}
#deploy #term.connect-next-ready .term__art {
  width:88px; height:88px; flex:0 0 88px; max-width:none; overflow:visible;
  border:0; background:none; padding:0; margin:0;
}
#deploy #term.connect-next-ready .term__art img { display:block; width:100%; height:100%; object-fit:contain; filter:none; opacity:1; mix-blend-mode:screen; }
#deploy #term.connect-next-ready .connect-next-name { min-width:0; }
#deploy #term.connect-next-ready .connect-next-name h3 {
  margin:0 0 7px; font:700 28px/1.2 Inter,sans-serif; color:#f5f7fa;
  letter-spacing:0; text-transform:none; overflow-wrap:anywhere;
}
#deploy #term.connect-next-ready .connect-next-name p {
  margin:0; font:400 14px/1.5 Inter,sans-serif; color:var(--connect-accent); letter-spacing:0;
}
#deploy #term.connect-next-ready .ipline { margin:0 0 20px; gap:9px; }
#deploy #term.connect-next-ready .ipline__label {
  font:500 12px/1.5 Inter,sans-serif; color:#d2e0eb; letter-spacing:0; text-transform:none;
}
#deploy #term.connect-next-ready .ipline__value {
  font:600 16px/1.6 'JetBrains Mono',monospace; color:#f2f4f7;
  user-select:all; overflow-wrap:anywhere; letter-spacing:0;
}
#deploy #term.connect-next-ready .term__btns {
  display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:10px; margin:0 0 28px;
}
#deploy #term.connect-next-ready .term__btns .copybtn {
  --action-surface:#041120b8; --action-hover:#122c44; --action-border:#a8c7df66;
  --action-hover-border:#cee5f8; --action-text:#edf6ff;
  flex:1 1 auto; min-width:0; min-height:48px; padding:12px 14px;
  font:600 13px/1.4 Inter,sans-serif; letter-spacing:0;
  border-radius:6px!important; text-transform:none; text-decoration:none;
  gap:9px; white-space:normal; overflow-wrap:anywhere;
}
#deploy #term.connect-next-ready .term__btns .copybtn:not(.copybtn--ghost) {
  --action-surface:var(--connect-button); --action-hover:var(--connect-hover);
  --action-border:var(--connect-button); --action-hover-border:var(--connect-hover);
  --action-text:var(--connect-ink); flex-grow:1.6;
}
#deploy #term.connect-next-ready.term--mu .term__btns .copybtn:not(.copybtn--ghost) {color:var(--connect-ink)!important;}
#deploy #term.connect-next-ready.term--mu .term__btns .copybtn:not(.copybtn--ghost) .connect-next-icon {filter:brightness(0);}
#deploy #term.connect-next-ready .term__btns .copybtn.is-copied {
  --action-surface:#123e35; --action-hover:#194e43; --action-border:#8ae8c4; --action-text:#e9fff5;
}
#deploy #term.connect-next-ready .term__btns :is(.vector-icon,.connect-next-icon) {
  display:block; width:18px; height:18px; flex:0 0 18px; max-width:18px; margin:0;
}
#deploy #term.connect-next-ready .connect-next-icon { filter:brightness(0) invert(1); }
#deploy #term.connect-next-ready .connect-next-requirements {
  margin-top:auto; padding-top:22px; border-top:1px solid #d1e5ff2b;
}
#deploy #term.connect-next-ready .connect-next-requirements h4 {
  margin:0 0 8px; font:600 13px/1.5 Inter,sans-serif; letter-spacing:0;
  text-transform:none; color:#dce2e9;
}
#deploy #term.connect-next-ready .term__note { color:#d2e0eb; font:400 13px/1.7 Inter,sans-serif; letter-spacing:0; }
#deploy #term.connect-next-ready .connect-next-instructions { min-width:0; padding:34px 38px; background:#030b16bf; }
#deploy #term.connect-next-ready .connect-next-step-heading {
  display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px 16px; margin-bottom:28px;
}
#deploy #term.connect-next-ready .connect-next-step-heading h3 {
  margin:0; font:600 17px/1.5 Inter,sans-serif; letter-spacing:0; text-transform:none; color:#f2f5f8;
}
#deploy #term.connect-next-ready .connect-next-step-heading > span { font:400 12px/1.5 Inter,sans-serif; letter-spacing:0; color:#c3d5e5; }
#deploy #term.connect-next-ready .steps {
  display:flex; flex-direction:column; grid-column:auto; grid-row:auto;
  gap:0; padding:0; border:0; margin:0;
}
#deploy #term.connect-next-ready .steps__line {
  display:grid; grid-template-columns:36px minmax(0,1fr); grid-template-rows:auto auto;
  column-gap:18px; row-gap:4px; padding:0 0 25px; min-height:84px;
  position:relative; isolation:isolate;
}
#deploy #term.connect-next-ready .steps__line:last-child { padding-bottom:0; min-height:0; }
#deploy #term.connect-next-ready .steps__line:not(:last-child)::after {
  content:''; display:block; position:absolute; left:17px; top:42px; bottom:6px;
  width:1px; height:auto; background:color-mix(in srgb,var(--connect-accent) 40%,transparent); z-index:-1; transform:none;
}
#deploy #term.connect-next-ready .steps__num {
  display:flex; align-items:center; justify-content:center; width:36px; height:36px;
  grid-column:1; grid-row:1/3; padding:0; border:1px solid color-mix(in srgb,var(--connect-accent) 50%,transparent);
  border-radius:50%; background:#040f1cbd; color:var(--connect-accent); opacity:1;
  font:600 12px/1 Inter,sans-serif; letter-spacing:0;
}
#deploy #term.connect-next-ready .steps__verb {
  display:block; grid-column:2; grid-row:1; padding:0;
  color:#e9edf2; font:600 15px/1.5 Inter,sans-serif; letter-spacing:0; text-transform:lowercase;
}
#deploy #term.connect-next-ready .steps__verb::first-letter { text-transform:uppercase; }
#deploy #term.connect-next-ready .steps__text {
  grid-column:2; grid-row:2; color:#d5e2ed; font:400 14px/1.7 Inter,sans-serif; letter-spacing:0;
}
#deploy #term.connect-next-ready .steps__cmd {
  margin:3px 0 0; padding:10px 12px; background:#03101ecf; border:0; border-left:2px solid var(--connect-accent);
  border-radius:0 4px 4px 0; color:#f0f3f7; font:500 14px/1.65 'JetBrains Mono',monospace;
  user-select:all; overflow-wrap:anywhere; letter-spacing:0;
}
@media(max-width:1100px) {
  #deploy #term.connect-next-ready .term__side { padding:28px; }
  #deploy #term.connect-next-ready .connect-next-instructions { padding:28px; }
  #deploy #term.connect-next-ready .term__tab { padding:20px; gap:12px; }
  #deploy #term.connect-next-ready .term__art { width:68px; height:68px; flex-basis:68px; }
  #deploy #term.connect-next-ready .connect-next-name h3 { font-size:25px; }
  #deploy #term.connect-next-ready .connect-next-identity { gap:14px; }
  #deploy #term.connect-next-ready .ipline__value { font-size:14px; }
  #deploy #term.connect-next-ready .term__btns { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:800px) {
  #deploy #term.connect-next-ready .term__panel { grid-template-columns:minmax(0,1fr); min-height:0; }
  #deploy #term.connect-next-ready .term__panel {background:none;}
  #deploy #term.connect-next-ready :is(.term__side,.connect-next-instructions) {
    background-image:linear-gradient(#030b16b8,#030b16d9),var(--connect-photo);
    background-position:center,var(--connect-position);background-size:cover,var(--connect-size);background-repeat:no-repeat;
  }
  #deploy #term.connect-next-ready .term__side { border-right:0; border-bottom:1px solid #adc3df40; }
  #deploy #term.connect-next-ready .connect-next-identity { margin-bottom:24px; }
  #deploy #term.connect-next-ready .term__art { width:76px; height:76px; flex-basis:76px; }
  #deploy #term.connect-next-ready .term__btns .copybtn { flex-grow:1; }
  #deploy #term.connect-next-ready .term__tab { padding:16px 14px; min-height:86px; gap:10px; }
  #deploy #term.connect-next-ready .term__tab > .vector-icon { width:22px; height:22px; flex-basis:22px; }
  #deploy #term.connect-next-ready .connect-tab-label strong { font-size:14px; }
  #deploy #term.connect-next-ready .connect-tab-label small { font-size:11px; }
}
@media(max-width:600px) {
  #top #deploy.connect-next-section > .section-label { font-size:24px; margin-bottom:20px; }
  #deploy #term.connect-next-ready .term__tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #deploy #term.connect-next-ready .term__tab { padding:16px; min-height:78px; border-bottom:1px solid #303740; }
  #deploy #term.connect-next-ready .term__tab:nth-child(n+3) { border-bottom:0; }
  #deploy #term.connect-next-ready .term__side { padding:24px; }
  #deploy #term.connect-next-ready .connect-next-instructions { padding:26px 24px; }
  #deploy #term.connect-next-ready .connect-next-step-heading { margin-bottom:24px; }
  #deploy #term.connect-next-ready .connect-next-step-heading h3 { font-size:16px; }
  #deploy #term.connect-next-ready .steps__line { column-gap:14px; }
  #deploy #term.connect-next-ready .steps__cmd { font-size:12px; padding:10px; }
}
@media(max-width:380px) {
  #deploy #term.connect-next-ready .term__side { padding:22px 18px; }
  #deploy #term.connect-next-ready .connect-next-instructions { padding:24px 18px; }
  #deploy #term.connect-next-ready .term__tab { padding:14px 12px; gap:8px; }
  #deploy #term.connect-next-ready .term__art { width:60px; height:60px; flex-basis:60px; }
  #deploy #term.connect-next-ready .connect-next-name h3 { font-size:24px; }
  #deploy #term.connect-next-ready .term__btns .copybtn { font-size:12px; padding:12px 10px; }
}
@media(prefers-reduced-motion:reduce) {
  #deploy #term.connect-next-ready .term__tab { transition:none; }
}
