/* Policy Chain Builder (macroeconomics/assets/tools/policy-chain.js). OWNED BY THIS TOOL ONLY (builder T2).
   The chain is a column of numbered link cards (the newest one in the
   course accent, a link that has a graph tagged with its graph's name);
   the graph is ApMacroGraph's (mac.css, "Graphs"). Phone: the graph on
   top, the chain under it, scrolled to the newest link. */
.pc-card{display:grid;gap:14px;}
.pc-fig{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px;align-items:stretch;min-height:0;}
.ls-root .pc-fig{flex:1 1 auto;min-height:300px;}
.pc-fig.no-g{grid-template-columns:minmax(0,1fr);}
.pc-chainbox{display:flex;flex-direction:column;gap:8px;min-height:0;min-width:0;}
.pc-title{margin:0;font:800 15px/1.3 var(--font-ui);color:var(--ink);}
.pc-title span{font-weight:600;font-size:12.5px;color:var(--muted);margin-left:6px;}
.pc-chain{list-style:none;margin:0;padding:0 2px 2px 0;display:flex;flex-direction:column;gap:10px;overflow:auto;min-height:0;}
.pc-link{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-areas:"n t" ". g";gap:2px 10px;align-items:start;padding:9px 12px;border:1.5px solid var(--line);border-radius:14px;background:var(--white);
  animation:pc-in .28s ease both;}
.pc-link + .pc-link::before{content:"";position:absolute;left:25px;top:-11px;width:2px;height:10px;background:var(--line);}
.pc-n{grid-area:n;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:999px;background:var(--track,#eef0f2);color:var(--muted);font:900 13px var(--font-ui);}
.pc-t{grid-area:t;font:700 14.5px/1.4 var(--font-ui);color:var(--ink);padding-top:2px;}
.pc-gtag{grid-area:g;justify-self:start;font:800 11px var(--font-ui);color:var(--cink);background:color-mix(in srgb, var(--cink) 10%, transparent);border-radius:999px;padding:2px 8px;}
.pc-link.is-now{border-color:var(--cink);box-shadow:inset 0 0 0 1px var(--cink);}
.pc-link.is-now .pc-n{background:var(--cink);color:var(--white,#fff);}
.pc-link.is-miss{border-style:dashed;}
.pc-link.is-miss .pc-n{background:color-mix(in srgb, var(--bad,#B3261E) 16%, transparent);color:var(--bad,#B3261E);}
.pc-link.is-next{border-style:dashed;background:transparent;animation:none;}
.pc-link.is-next .pc-t{color:var(--muted);}
@keyframes pc-in{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){ .pc-link{animation:none;} }
.pc-graph{margin:0;min-width:0;min-height:0;display:flex;flex-direction:column;}
.pc-graph[hidden]{display:none;}
.pc-gcap{margin:0 0 4px;font:800 14px/1.3 var(--font-ui);color:var(--ink);}
.pc-gcap span{font-weight:600;font-size:12.5px;color:var(--muted);margin-left:6px;}
.pc-g{position:relative;flex:1 1 auto;min-height:180px;}
.pc-g .mac-graph-svg{position:absolute;inset:0;width:100%;height:100%;}

/* the dock */
.pc-ctl{display:flex;flex-direction:column;gap:10px;}
.pc-fams{display:flex;flex-wrap:wrap;gap:6px;}
.pc-fam{min-height:44px;padding:0 12px;font-size:14px;}
.pc-fam[aria-pressed="true"]{border-color:var(--cink);color:var(--cink);box-shadow:inset 0 0 0 1.5px var(--cink);}
.pc-vars,.pc-dirs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
.pc-vars[hidden]{display:none;}
.pc-vars > button,.pc-dirs > button{font-size:13.5px;padding:0 8px;}
.pc-go{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px;}
.ls-root .pc-go .ls-btn{min-height:48px;padding:4px 10px;white-space:normal;line-height:1.2;}
.pc-steps li{margin:.2em 0;}

/* write it out */
.pc-sentence{font:600 15px/2.2 var(--font-ui);color:var(--ink);}
.pc-blank{min-height:40px;max-width:100%;margin:2px 0;font:600 14px var(--font-ui);border-radius:10px;}
.pc-blank.is-right{outline:2px solid var(--good-text,#1F6E3E);}
.pc-blank.is-wrong{outline:2px solid var(--bad,#B3261E);}
.pc-text{width:100%;min-height:96px;margin-top:6px;font:500 15px/1.5 var(--font-ui);padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--white);color:var(--ink);box-sizing:border-box;}
.pc-hints{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;}
.pc-hints li{font:600 13.5px/1.45 var(--font-ui);padding-left:22px;position:relative;color:var(--ink);}
.pc-hints li.is-ok::before{content:"\2713";position:absolute;left:2px;color:var(--good-text,#1F6E3E);font-weight:900;}
.pc-hints li.is-no::before{content:"\2022";position:absolute;left:5px;color:var(--muted);font-weight:900;}

/* phones: the graph on top, the chain under it */
.ls-phone .pc-fig{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,2.6fr) minmax(84px,1fr);gap:6px;}
.ls-phone .pc-title{display:none;}
.ls-phone .pc-gcap{margin:0;}
.ls-phone .pc-fig.no-g{grid-template-rows:minmax(0,1fr);}
.ls-phone .pc-graph{order:-1;}
.ls-phone .pc-chain{gap:8px;padding-right:46px;}
.ls-phone .pc-link{padding:6px 10px;grid-template-columns:24px minmax(0,1fr);}
.ls-phone .pc-n{width:22px;height:22px;font-size:12px;}
.ls-phone .pc-link + .pc-link::before{left:21px;top:-9px;height:8px;}
.ls-phone .pc-t{font-size:13.5px;}
.ls-stage.is-big .pc-fig{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);grid-template-rows:none;}
.ls-stage.is-big .pc-graph{order:0;}

/* test yourself: the same stage */
.ls-drill-stage .pc-fig{flex:1 1 auto;min-height:300px;}
.ls-drill-stage{display:flex;flex-direction:column;}
.ls-drill-stage > .cd-extra{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;}
.ls-phone .pc-fig{display:flex;flex-direction:column;}
.ls-phone .pc-graph{flex:1.7 1 0;min-height:190px;}
.ls-phone .pc-chainbox{flex:1 1 0;min-height:84px;}
.ls-phone .pc-link.is-next{display:none;}
/* A phone shows the newest link only (the whole chain is under Why). */
.ls-phone .pc-link:not(.is-now){display:none;}
.ls-phone .pc-chainbox{flex:0 0 auto;min-height:0;}
.ls-phone .pc-chain{overflow:visible;padding-right:46px;}
.ls-phone .pc-graph{flex:1 1 auto;min-height:170px;}
.mac-graph-svg.is-forex .mac-gr-alabel{font-size:10.5px;}