.sj-page {
  --sj-wire:#aac69a;
  --sj-rule:rgb(188 210 179 / 34%);
  --sj-light:#e8f0e2;
}
.sj-page .in-head { padding-bottom:clamp(20px,2.4vw,34px); border-bottom:0; }
.sj-page .in-crumb { margin-bottom:18px; }
.sj-page .in-head .in-lead { max-width:68ch; }
.sj-page :is(.sj-overview,.sj-guide,.sj-policy) .eyebrow { color:var(--wood-gold); }
.sj-page .sj-overview { padding-top:clamp(14px,2.5vw,32px); }
.sj-map-head { display:flex; align-items:end; justify-content:space-between; gap:18px; }
.sj-map-head .eyebrow,.sj-guide .eyebrow,.sj-policy .eyebrow { margin-bottom:7px; }
.sj-map-head h2,.sj-guide h2,.sj-policy h2 { font-size:clamp(1.7rem,3vw,2.7rem); }
.sj-map-head>p { max-width:38ch; color:var(--sj-light); font-size:.97rem; }
.sj-map {
  --twig:clamp(11px,1.4vw,22px);
  position:relative; isolation:isolate; display:grid;
  grid-template-columns:38% 24% 38%; grid-template-rows:repeat(2,minmax(132px,1fr));
  align-items:center; min-height:clamp(284px,26vw,358px); margin:14px 0 2px;
  background:radial-gradient(ellipse at 50% 50%,rgb(14 40 28 / 82%),rgb(19 44 30 / 40%) 56%,transparent 77%);
}
.sj-connectors { position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }
.sj-connectors path { stroke:var(--sj-wire); stroke-width:1.6; vector-effect:non-scaling-stroke; }
.sj-hub {
  grid-area:1/2/3/3; justify-self:center; display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:6px; width:80%; max-width:198px; min-height:126px;
  padding:12px 10px; text-align:center; border:1px solid #b7cda0; border-radius:48% 52% 51% 49% / 54% 44% 56% 46%;
  background:radial-gradient(ellipse at 35% 8%,#3e5b42,#213f30 66%); box-shadow:0 0 0 6px rgb(129 173 121 / 12%);
}
.sj-hub strong { font:600 clamp(1.05rem,1.6vw,1.5rem)/1.16 var(--serif); text-wrap:balance; }
.sj-hub small { font-size:.79rem; color:var(--sj-light); }
.sj-hub-mark { display:flex; color:var(--wood-gold); }
.sj-hub-mark .ico { width:27px; height:27px; }
.sj-branch {
  min-width:0; display:grid; align-items:center; column-gap:calc(var(--twig)*2);
  grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); grid-template-areas:"leaves phase";
}
.sj-branch-1 { grid-area:1/1; }
.sj-branch-2 { grid-area:1/3; }
.sj-branch-3 { grid-area:2/1; }
.sj-branch-4 { grid-area:2/3; }
:is(.sj-branch-2,.sj-branch-4) { grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); grid-template-areas:"phase leaves"; }
.sj-phase {
  grid-area:phase; position:relative; min-width:0; padding:10px 9px; text-align:center;
  border-block:1px solid var(--sj-rule); border-radius:28% 4px 25% 3px / 8px 4px 7px 3px;
  background:linear-gradient(90deg,rgb(28 55 38 / 25%),rgb(28 55 38 / 88%) 45%,rgb(28 55 38 / 25%));
}
.sj-phase small { display:block; color:var(--wood-gold); font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.sj-phase h3 { margin-top:5px; font:600 clamp(1.09rem,1.6vw,1.46rem)/1.22 var(--serif); text-wrap:balance; }
.sj-phase::after { content:""; position:absolute; top:50%; right:-3px; width:6px; height:6px; margin-top:-3px; border-radius:50%; background:var(--sj-wire); }
:is(.sj-branch-2,.sj-branch-4) .sj-phase::after { right:auto; left:-3px; }
.sj-leaves { position:relative; grid-area:leaves; display:grid; grid-auto-rows:1fr; gap:8px; list-style:none; padding:0; margin:0; }
.sj-leaves li { position:relative; display:grid; min-width:0; }
.sj-leaves li::before,.sj-leaves li::after,.sj-leaves::after { content:""; position:absolute; pointer-events:none; }
.sj-leaves li::before,.sj-leaves::after { width:var(--twig); top:50%; border-top:1px solid var(--sj-wire); }
.sj-leaves li::before { left:100%; }
.sj-leaves::after { left:calc(100% + var(--twig)); }
.sj-leaves li::after { left:calc(100% + var(--twig)); height:calc(50% + 4px); border-left:1px solid var(--sj-wire); }
.sj-leaves li:first-child::after { top:50%; }
.sj-leaves li:last-child::after { bottom:50%; }
:is(.sj-branch-2,.sj-branch-4) .sj-leaves li::before { left:auto; right:100%; }
:is(.sj-branch-2,.sj-branch-4) .sj-leaves::after,
:is(.sj-branch-2,.sj-branch-4) .sj-leaves li::after { left:auto; right:calc(100% + var(--twig)); }
.sj-leaves a {
  display:flex; align-items:center; gap:clamp(7px,1vw,13px); padding:9px clamp(8px,1.1vw,15px);
  min-height:44px; min-width:0; border:1px solid #728b73; border-radius:3px 16px 4px 12px;
  background:rgb(19 44 32 / 95%); font-size:clamp(.9rem,1.14vw,1.04rem); line-height:1.3; font-weight:620;
}
.sj-leaves a:is(:hover,:focus-visible,[aria-current="step"]) { border-color:var(--wood-gold); background:#2b4834; }
.sj-num { font-family:var(--serif); font-weight:600; font-style:italic; color:var(--wood-gold); font-variant-numeric:tabular-nums; }
.sj-timing-link,.sj-detail-links a { display:inline-flex; align-items:center; gap:8px; min-height:44px; color:var(--wood-gold); font-weight:650; }
.sj-timing-link:hover,.sj-detail-links a:hover { text-decoration:underline; text-underline-offset:3px; }
.sj-guide,.sj-policy { padding-block:clamp(36px,4.5vw,64px); }
.sj-steps { margin-top:20px; border-top:1px solid var(--sj-rule); }
.sj-detail { border-bottom:1px solid var(--sj-rule); background:rgb(10 31 23 / 82%); scroll-margin-top:10px; }
.sj-detail summary {
  display:grid; grid-template-columns:2.2em minmax(8em,.65fr) minmax(0,1fr) 1.3em; gap:14px;
  align-items:center; min-height:65px; padding:13px clamp(12px,1.5vw,22px); cursor:pointer; list-style:none;
}
.sj-detail summary::-webkit-details-marker { display:none; }
.sj-detail summary:hover { background:rgb(48 74 53 / 50%); }
.sj-detail[open] { background:#182f24; }
.sj-detail summary .sj-num { font-size:1.22em; }
.sj-detail-name { font-weight:660; font-size:clamp(1.04rem,1.4vw,1.25rem); }
.sj-hint { line-height:1.45; font-size:.95rem; color:var(--sj-light); }
.sj-chevron { font-size:1.4rem; color:var(--wood-gold); text-align:center; line-height:1; }
.sj-detail[open] .sj-chevron { transform:rotate(180deg); }
.sj-detail-body { padding:5px clamp(14px,2vw,30px) 12px; }
.sj-detail-body dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(18px,3vw,45px); }
.sj-detail-body dl>div { padding-top:12px; border-top:1px solid var(--sj-rule); }
.sj-detail-body dt,.sj-rules dt { color:var(--wood-gold); font-weight:680; }
.sj-detail-body dd,.sj-rules dd { margin-top:5px; line-height:1.68; color:var(--sj-light); }
.sj-detail-links { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:10px; font-size:.91rem; }
.sj-detail-links .sj-return { color:var(--sj-light); font-weight:500; }
.sj-policy { border-top:1px solid var(--sj-rule); }
.sj-rules { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(16px,2.5vw,36px); margin:24px 0; }
.sj-rules>div { border-top:1px solid var(--sj-rule); padding-top:13px; }
.sj-policy .in-actions { margin-top:18px; }
.sj-shortcuts { display:flex; flex-wrap:wrap; column-gap:26px; }
.sj-resources { padding:clamp(24px,3vw,42px) 0; border-top:1px solid var(--sj-rule); }
.sj-resources .eyebrow { color:var(--wood-gold); }
.sj-resources-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(20px,4vw,56px); margin-top:20px; }
.sj-resources-grid h3 { font-size:1.12rem; margin:0 0 10px; }
.sj-resources-grid ul { list-style:none; margin:0; padding:0; }
.sj-resources-grid li { border-top:1px solid var(--sj-rule); }
.sj-resources-grid a { display:flex; justify-content:space-between; align-items:center; min-height:46px; padding:6px; gap:8px; color:var(--wood-gold); }
.sj-resources-grid a:hover { text-decoration:underline; text-underline-offset:4px; }
@media(max-width:620px) { .sj-resources-grid { grid-template-columns:1fr; } }
@media(max-width:859px) {
  .sj-map-head { display:block; }
  .sj-map-head>p { max-width:62ch; margin-top:9px; }
  .sj-map {
    display:block; min-height:0; margin-top:19px; padding-left:22px;
    background:linear-gradient(90deg,transparent,rgb(16 40 28 / 50%) 12%,transparent 98%);
  }
  .sj-map::before { content:""; position:absolute; left:8px; top:35px; bottom:12px; border-left:1px solid var(--sj-wire); }
  .sj-connectors { display:none; }
  .sj-hub {
    position:relative; display:grid; grid-template-columns:auto 1fr; align-items:center; justify-items:start; justify-self:start;
    gap:1px 12px; width:max-content; max-width:100%; min-height:68px; padding:10px 20px 10px 14px; text-align:start;
    border-radius:8px 29px 8px 17px; box-shadow:none;
  }
  .sj-hub::before,.sj-phase::before { content:""; position:absolute; left:-14px; top:50%; width:14px; border-top:1px solid var(--sj-wire); }
  .sj-hub-mark { grid-row:span 2; }
  .sj-branch { position:relative; display:block; margin-top:18px; }
  .sj-phase { width:fit-content; max-width:100%; padding:0 0 0 8px; text-align:start; border:0; background:none; }
  .sj-phase::after,:is(.sj-branch-2,.sj-branch-4) .sj-phase::after { left:-17px; right:auto; }
  .sj-phase h3 { margin:1px 0 6px; }
  .sj-leaves { margin-left:15px; padding-left:14px; }
  .sj-leaves a { width:fit-content; max-width:100%; padding:9px 14px; }
  .sj-leaves::after { display:none; }
  .sj-leaves li::before,:is(.sj-branch-2,.sj-branch-4) .sj-leaves li::before { right:auto; left:-14px; width:14px; }
  .sj-leaves li::after,:is(.sj-branch-2,.sj-branch-4) .sj-leaves li::after { right:auto; left:-14px; top:-8px; bottom:auto; height:calc(100% + 8px); }
  .sj-leaves li:last-child::after { height:calc(50% + 8px); }
  .sj-rules { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .sj-detail summary { grid-template-columns:1.65em minmax(0,1fr) 1em; gap:2px 7px; }
  .sj-detail summary .sj-num,.sj-detail summary .sj-chevron { grid-row:1 / 3; }
  .sj-detail summary .sj-chevron { grid-column:3; }
  .sj-hint { grid-column:2; grid-row:2; font-size:.89rem; }
  .sj-detail-body dl,.sj-rules { grid-template-columns:1fr; gap:12px; }
  .sj-detail-body dl>div { padding-top:9px; }
  .sj-detail-body dd { margin-top:2px; }
}
