/* propose scene: absolute layout inside the 1170 x 884 right column */
.sc-pp { position: relative; width: 1170px; height: 884px; }
.sc-pp-svg { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; z-index: 3; }
.sc-pp-arrow { fill: none; stroke: var(--fg2); stroke-width: 2.5; opacity: .7; }
.sc-pp-arrhead { fill: var(--fg2); }
.sc-pp-arrhead.bad { fill: var(--red); }
.sc-pp-retry { fill: none; stroke: var(--red); stroke-width: 2.5; stroke-dasharray: 9 7; }
.sc-pp-retrylbl { position: absolute; left: 40px; width: 780px; top: 58px; display: flex; justify-content: center; gap: 12px;
  font-family: var(--mono); font-size: 17px; color: #ffb3ad; white-space: nowrap; }
.sc-pp-retrylbl b { color: var(--red); }

/* gates */
.sc-pp-gate { position: absolute; border-radius: 18px; padding: 20px 22px; display: flex; align-items: center; z-index: 2; }
.sc-pp-gate.m { background: linear-gradient(140deg, #3a8cf0, #17467f); color: #fff; box-shadow: 0 10px 40px rgba(47,127,224,.25); }
.sc-pp-gate.c { border: 2px solid rgba(217,217,217,.75); background: rgba(0,0,0,.25); }
.sc-pp-labs { display: grid; width: 100%; }
.sc-pp-lab { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 6px; }
.sc-pp-lab b { font-size: 28px; line-height: 1.1; }
.sc-pp-gate.c .sc-pp-lab b { font-family: var(--mono); font-size: 25px; }
.sc-pp-lab small { font-family: var(--mono); font-size: 17px; color: var(--fg2); }
.sc-pp-gate.m .sc-pp-lab small { color: #d6e6ff; }
.sc-pp-ring, .sc-pp-halo { position: absolute; inset: -2px; border-radius: 18px; pointer-events: none; }
.sc-pp-ring.ok { border: 2.5px solid var(--green); box-shadow: 0 0 0 4px rgba(63,212,155,.16); }
.sc-pp-ring.bad { border: 2.5px solid var(--red); box-shadow: 0 0 0 5px rgba(255,91,79,.3); }
.sc-pp-ring.pol { border: 2.5px solid var(--amber); box-shadow: 0 0 0 5px rgba(243,184,78,.25); }
.sc-pp-halo { inset: -8px; border-radius: 24px; box-shadow: 0 0 0 4px rgba(156,200,255,.55), 0 0 44px rgba(106,168,255,.65); }
.sc-pp-badge { position: absolute; right: 14px; top: 12px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  font-size: 20px; font-weight: 700; line-height: 1; }
.sc-pp-badge.ok { background: var(--green); color: #111; }
.sc-pp-badge.bad { background: var(--red); color: #fff; }
.sc-pp-badge.pol { background: var(--amber); display: flex; gap: 4px; justify-content: center; align-items: center; }
.sc-pp-badge.pol i { width: 4px; height: 13px; border-radius: 1px; background: #1b1b1b; display: block; }

/* the policy pause */
.sc-pp-chip { position: absolute; top: 92px; width: 236px; height: 40px; display: grid; z-index: 2; }
.sc-pp-chip span { grid-area: 1 / 1; display: flex; align-items: center; justify-content: center; border-radius: 999px;
  font-family: var(--mono); font-size: 17px; white-space: nowrap; }
.sc-pp-chip .a { color: #1b1b1b; background: var(--amber); }
.sc-pp-chip .b { color: #111; background: var(--green); }

/* proposal card */
.sc-pp-card { position: absolute; border-radius: 18px; background: var(--code-bg); border: 1px solid rgba(255,255,255,.08); padding: 20px 24px; overflow: hidden; }
.sc-pp-ch { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 14px; font-size: 17px; color: #8d8d8d; }
.sc-pp-ch .att { color: var(--blue-hi); font-weight: 700; font-family: var(--mono); }
.sc-pp-ch .scen { white-space: nowrap; }
.sc-pp-cbody { position: relative; }
.sc-pp-cbody > * { position: absolute; left: 0; top: 0; }
.sc-pp-wait { font-family: var(--mono); font-size: 20px; color: #6f7781; }
.sc-pp-plan { font-family: var(--mono); font-size: 21px; line-height: 1.55; color: #e8e8e8; }
.sc-pp-pl { white-space: pre; }
.sc-pp-pl.in { padding-left: 2ch; }
.sc-pp-tok { display: inline-block; white-space: pre; border-radius: 5px; }

/* decision log */
.sc-pp-logs { position: absolute; width: 586px; height: 470px; }
.sc-pp-log { position: absolute; left: 0; top: 0; right: 0; display: flex; flex-direction: column; gap: 7px; }
.sc-pp-ll { font-family: var(--mono); font-size: 17px; line-height: 1.4; padding: 7px 13px; border-radius: 10px; background: rgba(255,255,255,.045); }
.sc-pp-ll.m { color: #9cc8ff; }
.sc-pp-ll.ok { color: #8fe6c4; }
.sc-pp-ll.bad { color: #ffb3ad; background: rgba(255,91,79,.1); }
.sc-pp-ll.pol { color: #ffd894; background: rgba(243,184,78,.1); }

/* tabs */
.sc-pp-tabs { position: absolute; left: 0; top: 724px; display: flex; gap: 10px; }
.sc-pp-tab { position: relative; z-index: 1; background: transparent; }
.sc-pp-tab.on { background: transparent; border-color: transparent; color: var(--fg); }
.sc-pp-tabcur { position: absolute; left: 0; top: 0; height: 100%; border-radius: 999px; border: 1.5px solid var(--amber); background: rgba(243,184,78,.12); }