/* PROMISE LAYOUT v1.0 — command-center scaffold: header · rail · main · context.
   No floating random sections. Grid-aligned. */
.p-app{ min-height:100vh; display:grid; background:var(--p-bg);
  grid-template-columns:auto 1fr; grid-template-rows:auto 1fr;
  grid-template-areas:"header header" "rail main"; }

/* top command header */
.p-header{ grid-area:header; position:sticky; top:0; z-index:40; height:54px;
  display:flex; align-items:center; gap:24px; padding:0 24px;
  background:var(--p-bg); border-bottom:1px solid var(--p-border); }
.p-header .brand{ font-weight:700; letter-spacing:.22em; color:var(--p-gold); font-size:13px; }
.p-header .spacer{ margin-left:auto; }

/* left navigation / tab rail */
.p-rail{ grid-area:rail; width:212px; border-right:1px solid var(--p-border);
  padding:20px 12px; display:flex; flex-direction:column; gap:2px; }
.p-rail .grp{ font-size:8.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--p-muted); margin:16px 12px 6px; }
.p-rail a{ font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--p-muted); padding:9px 12px; border-radius:8px; border-left:2px solid transparent; text-decoration:none; }
.p-rail a:hover{ color:var(--p-text-2); }
.p-rail a.on{ color:var(--p-text); background:var(--p-surface); border-left-color:var(--p-gold); }

/* main content + optional right context panel */
.p-main{ grid-area:main; padding:24px clamp(20px,3vw,40px) 80px; width:100%; max-width:1600px; }
.p-main.with-context{ display:grid; grid-template-columns:1fr 340px; gap:24px; align-items:start; }
.p-context{ position:sticky; top:78px; }

/* grids + section rhythm (8px system) */
.p-grid{ display:grid; gap:16px; }
.p-grid.c2{ grid-template-columns:1fr 1fr; }
.p-grid.c3{ grid-template-columns:repeat(3,1fr); }
.p-grid.c4{ grid-template-columns:repeat(4,1fr); }
.p-section{ margin-top:var(--p-section); }
.p-block{ margin-top:var(--p-block); }
.p-full{ width:100%; }

@media(max-width:960px){
  .p-app{ grid-template-columns:1fr; grid-template-areas:"header" "main"; }
  .p-rail{ display:none; }
  .p-main.with-context{ grid-template-columns:1fr; }
  .p-grid.c2,.p-grid.c3,.p-grid.c4{ grid-template-columns:1fr; }
}
