/* /insights/reactive-to-proactive-analytics/ only: the week planner that re-plans (hero) and the
   filterable question index (article). Prefix rtp-. Each job block sits at a day (--d, 1-7) and a
   row (--r); the switch's data-state picks the reactive or the proactive place, and the block
   slides there. No JavaScript of its own: sk.js drives the switch and the filter. */

.rtp-card{border-radius:10px;background:var(--sk-deep);border:1px solid var(--sk-line-2);overflow:hidden}
.rtp-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;padding:.6rem .8rem;border-bottom:1px solid var(--sk-line);font:500 .66rem var(--sk-mono);color:var(--sk-text-3)}
.rtp-bar .ctl-row{margin:0;gap:.5rem}
.rtp-wk{position:relative;padding:.8rem .8rem 1rem}
.rtp-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.3rem;margin:0 0 .4rem;padding:0;list-style:none}
.rtp-days li{padding:.25rem 0;border-bottom:1px solid var(--sk-line);font:600 .6rem var(--sk-mono);letter-spacing:.06em;text-transform:uppercase;text-align:center;color:var(--sk-text-4)}
.rtp-days li:nth-child(n+4){color:#c9a35a}
.rtp-wk[data-state="proactive"] .rtp-days li:nth-child(n+4){color:var(--sk-text-4)}
.rtp-wk[data-state="proactive"] .rtp-days li:first-child{color:#8fe3b4}
.rtp-plan{position:relative;height:14.8rem;margin:0;padding:0;list-style:none;
  background:repeating-linear-gradient(90deg,transparent 0 calc(100%/7 - 1px),var(--sk-line) calc(100%/7 - 1px) calc(100%/7))}
.rtp-b{--d:var(--rd);--r:var(--rr);--h:var(--rh);position:absolute;left:calc((var(--d) - 1) * 100% / 7 + 2px);top:calc(var(--r) * 4.9rem);width:calc(100% / 7 - 6px);height:calc(var(--h) * 4.9rem - 6px);
  box-sizing:border-box;padding:.35rem .4rem;border-radius:6px;border:1px solid #6b3a26;background:linear-gradient(180deg,#3a1d12,#24140e);overflow:hidden;
  transition:left .7s cubic-bezier(.6,.05,.25,1),top .7s cubic-bezier(.6,.05,.25,1),height .7s,background .5s,border-color .5s}
.rtp-wk[data-state="proactive"] .rtp-b{--d:var(--pd);--r:var(--pr);--h:var(--ph);border-color:#1f6b4d;background:linear-gradient(180deg,#123126,#0e211b)}
.rtp-b2{transition-delay:.06s}.rtp-b3{transition-delay:.12s}.rtp-b4{transition-delay:.18s}.rtp-b5{transition-delay:.24s}.rtp-b6{transition-delay:.3s}
.rtp-b b{display:block;font:700 .64rem/1.15 var(--sk-sans);color:#fff}
.rtp-b span{display:block;margin-top:.2rem;font:500 .6rem/1.25 var(--sk-sans);color:#f3b597}
.rtp-wk[data-state="proactive"] .rtp-b span{color:#9fe6c3}
.rtp-pro{display:none!important}
.rtp-wk[data-state="proactive"] .rtp-pro{display:block!important}
.rtp-wk[data-state="proactive"] .rtp-re{display:none!important}
.rtp-sum{margin:.7rem 0 0;font:600 .7rem var(--sk-mono);color:#f3b597}
.rtp-wk[data-state="proactive"] .rtp-sum{color:#8fe3b4}
.rtp-sum .rtp-pro,.rtp-sum .rtp-re{display:inline}
@media (max-width:560px){
  .rtp-plan{height:14.8rem}
  .rtp-b{padding:.25rem .2rem;width:calc(100% / 7 - 3px);left:calc((var(--d) - 1) * 100% / 7 + 1px)}
  .rtp-b b{font-size:.5rem;line-height:1.15;word-break:break-word}.rtp-b span{display:none!important}
  .rtp-bar .flip{transform:scale(.85);transform-origin:left center}
}
@media (prefers-reduced-motion:reduce){.rtp-b{transition:none}}

/* the question index */
.prose .rtp-seg{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}
.rtp-qi table{font-size:.9rem}
.rtp-qi td:last-child{white-space:nowrap}
.rtp-qi code{font-size:.78rem}
.rtp-qi tr[data-k]{transition:opacity .3s}
.rtp-qi[data-state="working"] tr[data-k]:not([data-k="working"]),
.rtp-qi[data-state="fix"] tr[data-k]:not([data-k="fix"]),
.rtp-qi[data-state="ai"] tr[data-k]:not([data-k="ai"]),
.rtp-qi[data-state="trust"] tr[data-k]:not([data-k="trust"]){display:none}
.rtp-qi{overflow-x:auto}
.prose .rtp-note{font-size:.92rem;color:var(--sk-text-3)}
@media (max-width:720px){.rtp-qi td:last-child{white-space:normal;word-break:break-all}.rtp-qi th:first-child,.rtp-qi td:first-child{display:none}}
