/* 6 Troop SBS Handbook — site layout. Loaded after each chapter's own styles. */
:root{--bg:#0E0E0F;--panel:#141415;--panel2:#19191B;--line:#252527;--line2:#333336;--text:#D2D2D4;--hi:#ECECEE;--muted:#8A8A8F;--dim:#5D5D62;--blue:#4A9FD8;--side:300px}
html{scroll-behavior:smooth}
body{width:auto!important;min-width:0;padding:0!important;margin:0;background:var(--bg)}
a{color:inherit}

/* marking bar */
.mark{position:sticky;top:0;z-index:40;height:28px}

/* shell */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:calc(100vh - 28px)}
.side{position:sticky;top:28px;height:calc(100vh - 28px);overflow-y:auto;border-right:1px solid var(--line);background:#111112;display:flex;flex-direction:column}
.side .brand{display:flex;align-items:center;gap:14px;padding:22px 22px 20px;border-bottom:1px solid var(--line);text-decoration:none}
.side .brand img{width:44px;height:auto;display:block}
.side .brand b{display:block;font-weight:500;font-size:17px;color:var(--hi)}
.side .brand span{display:block;font-size:10.5px;letter-spacing:.14em;color:var(--muted);margin-top:3px}
.nav{padding:14px 0 20px;flex:1}
.nav .grp{padding:14px 22px 6px;font-size:10.5px;letter-spacing:.14em;color:var(--dim)}
.nav a.chap{display:flex;gap:12px;align-items:baseline;padding:9px 22px;text-decoration:none;font-size:14.5px;color:var(--text);border-left:2px solid transparent}
.nav a.chap .n{font-size:11.5px;color:var(--blue);letter-spacing:.08em;width:20px;flex:none}
.nav a.chap:hover{background:#161618;color:var(--hi)}
.nav a.chap.on{color:var(--hi);font-weight:500;border-left-color:var(--blue);background:#161618}
.nav .sub{padding:4px 0 10px;border-bottom:1px solid var(--line);margin-bottom:6px}
.nav .sub .sg{padding:10px 22px 4px 54px;font-size:10px;letter-spacing:.14em;color:var(--dim)}
.nav .sub a{display:block;padding:5px 22px 5px 54px;font-size:13.5px;color:var(--muted);text-decoration:none;line-height:1.35}
.nav .sub a:hover{color:var(--hi)}
.nav .sub a.on{color:var(--hi);box-shadow:inset 2px 0 0 var(--blue)}
.side .sfoot{padding:14px 22px 18px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.1em;color:var(--dim)}
.side .sfoot a{color:var(--blue);text-decoration:none}

.main{min-width:0;padding-bottom:40px}
.main > *{max-width:1680px}
.main .head{height:auto!important;min-height:0;padding:40px 48px 32px!important}
.main .head .title{width:auto!important;max-width:900px}
.main .head .badge{display:none}
[id]{scroll-margin-top:48px}

/* rules of engagement header and matrix */
.main .head .in{padding:0!important;height:auto!important;flex-wrap:wrap;gap:32px!important}
.main .head .in .title{flex:1 1 520px}
.main .head .key{flex:0 1 470px}
.mx.roe .row{grid-template-columns:200px repeat(3,minmax(0,1fr))!important}
.mx.roe .cn .top{flex-wrap:wrap;gap:8px}

/* chapter pager */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:28px 48px 0}
.pager a{display:block;padding:16px 18px;border:1px solid var(--line);background:var(--panel);text-decoration:none}
.pager a:hover{border-color:var(--line2)}
.pager small{display:block;font-size:10.5px;letter-spacing:.14em;color:var(--muted)}
.pager b{display:block;margin-top:6px;font-weight:500;font-size:16px;color:var(--hi)}
.pager .nx{text-align:right;grid-column:2}

/* home */
.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin:32px 48px 0}
.home-grid a{display:flex;flex-direction:column;padding:20px;border:1px solid var(--line);background:var(--panel);text-decoration:none;min-height:170px}
.home-grid a:hover{border-color:var(--line2);background:#161618}
.home-grid .n{font-size:12px;color:var(--blue);letter-spacing:.08em}
.home-grid b{margin-top:10px;font-weight:500;font-size:20px;color:var(--hi)}
.home-grid p{margin-top:8px;font-size:14px;color:var(--muted)}
.home-grid .ref{margin-top:auto;padding-top:14px;font-size:10.5px;letter-spacing:.12em;color:var(--dim)}

/* mobile menu */
.menu-btn{display:none}

/* ---------- responsive overrides for the chapter layouts ---------- */
@media (max-width:1500px){
  .grid{grid-template-columns:repeat(2,1fr)!important}
  .prin{grid-template-columns:1fr 1fr!important}
  .pa{grid-template-columns:repeat(9,1fr)!important}
  .pl:nth-child(13n){border-right:1px solid var(--line)!important}
  .pgrid,.pgrid6{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important}
  .pgrid div,.pgrid6 div{border-bottom:1px solid var(--line)}
  .abgrid{grid-template-columns:repeat(3,1fr)!important}
  .ab{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}
}
@media (max-width:1300px){
  .two,.net,.mk,.cols,.cols2,.fund,.prin2,.three{grid-template-columns:1fr!important}
  .evac,.dg2,.tgrid,.fs{grid-template-columns:1fr!important}
  .evac > div + div,.dg2 > div + div,.tgrid > div + div,.fs > div + div{border-left:0!important;border-top:1px solid var(--line)}
  .flow{grid-auto-flow:row!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
  .flow .st{border-bottom:1px solid var(--line)}
  .flow .st::after{display:none}
  .dis{grid-template-columns:repeat(2,1fr)!important}
  .seq .vs{grid-template-columns:1fr!important;grid-auto-flow:row!important;grid-template-rows:none!important}
}
@media (max-width:900px){
  :root{--side:0px}
  .shell{grid-template-columns:1fr}
  .side{position:fixed;top:28px;left:0;width:300px;z-index:50;transform:translateX(-100%);transition:transform .2s ease}
  body.menu-open .side{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.55)}
  .menu-btn{display:flex;align-items:center;gap:10px;position:sticky;top:28px;z-index:30;width:100%;padding:12px 20px;background:#111112;border:0;border-bottom:1px solid var(--line);color:var(--hi);font:500 12px Roboto,Arial,sans-serif;letter-spacing:.14em;cursor:pointer}
  .menu-btn i{display:block;width:16px;height:2px;background:var(--hi);box-shadow:0 5px 0 var(--hi),0 -5px 0 var(--hi)}
  .main .head{padding:28px 20px 22px!important}
  .mark{font-size:9px!important;letter-spacing:.1em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 10px;display:block!important;line-height:28px;text-align:center}
  .brief td.k{width:110px!important}
  .mx.roe .row{grid-template-columns:120px repeat(3,minmax(200px,1fr))!important}
  .main .head h1{font-size:32px!important}
  .full,.two,.grid,.net,.mk,.cols,.cols2,.fund,.prin,.prin2,.three,.pp,.legend,.rh,.abbr,.foot,.pager,.home-grid,.mx,section.panel{margin-left:16px!important;margin-right:16px!important}
  .grid,.prin{grid-template-columns:1fr!important}
  .pa{grid-template-columns:repeat(4,1fr)!important}
  .abgrid{grid-template-columns:1fr!important}
  .legend{flex-wrap:wrap;gap:14px}
  .legend .note{margin-left:0}
  .rt td.fld{width:auto!important}
  .rt td.gd{display:block}
  .kv2 td.k{width:120px!important}
  .terms td.c{width:150px!important}
  .rag{display:block;overflow-x:auto}
  .mx .row{grid-template-columns:120px repeat(3,minmax(200px,1fr))!important;min-width:760px}
  .mx.roe{overflow-x:auto}
  .pager{grid-template-columns:1fr}
  .pager .nx{grid-column:1;text-align:left}
}