/* Metacognition: a field guide for thinking alongside AI. Dark is the default theme. */
.metacognition{--mc-orchid:#c48ee0;--mc-teal:#5fc2b5;--mc-amber:#e6b65d;--mc-red:#e18177;--mc-panel:color-mix(in srgb,var(--bg) 70%,var(--surface));--mc-soft:color-mix(in srgb,var(--mc-orchid) 9%,var(--mc-panel))}
html[data-theme="light"] .metacognition{--mc-orchid:#6b278e;--mc-teal:#1d7a6f;--mc-amber:#8e610e;--mc-red:#a8422c;--mc-panel:#fff}
body:has(.metacognition) #pointcloud-bg,body:has(.metacognition) .shape-toggle-btn{display:none!important}
.metacognition .page-content{max-width:68rem!important}
.metacognition .page-content>*,.metacognition .page-content section{box-sizing:border-box}

.mc-progress{position:fixed;inset:0 0 auto;z-index:70;height:3px;pointer-events:none}
.mc-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--mc-teal),var(--mc-orchid),var(--mc-amber))}
.mc-rail{position:sticky;top:3.9rem;z-index:20;display:grid;grid-template-columns:repeat(8,1fr);margin:0 auto 1.2rem;padding:.28rem;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(16px)}
.mc-rail a{padding:.58rem .3rem;border-radius:999px;color:var(--muted);font:650 .72rem/1 "Space Grotesk",sans-serif;text-align:center;text-decoration:none}
.mc-rail a:hover{color:var(--text)}
.mc-rail a.is-current{background:var(--text);color:var(--bg)}

.mc-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;min-height:min(680px,78vh);margin:0 0 3rem;padding:clamp(1.5rem,4vw,3rem);border:1px solid var(--line);border-radius:2rem;background:radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--mc-orchid) 14%,transparent),transparent 45%),var(--surface)}
.mc-hero h1{margin:0;color:var(--text);font:700 clamp(2.4rem,5.6vw,4.6rem)/.98 "Space Grotesk",sans-serif;letter-spacing:-.06em}
.mc-hero h1 i{display:block;margin-top:.15em;color:var(--mc-orchid);font-family:Georgia,serif;font-weight:400}
.mc-hero-copy p{max-width:36rem;margin:1.2rem 0 0;color:var(--muted);font-size:clamp(1rem,1.6vw,1.15rem);line-height:1.65}
.mc-hero-copy .mc-hero-tie{color:var(--text)}
.mc-scroll{grid-column:1/-1;justify-self:start;color:var(--muted);font:650 .78rem "Space Grotesk",sans-serif;text-decoration:none}
.mc-scroll:hover{color:var(--text)}
.mc-loop{margin:0}
.mc-loop svg{display:block;width:100%;height:auto}
.mc-loop figcaption{margin-top:.6rem;color:var(--muted);font-size:.82rem;text-align:center}
.mc-band{fill:var(--mc-panel);stroke:var(--line);stroke-width:1.2}
.mc-band-meta{stroke:color-mix(in srgb,var(--mc-orchid) 55%,var(--line))}
.mc-band-label{fill:var(--muted);font:650 11px "Space Grotesk",sans-serif;letter-spacing:.1em}
.mc-node{fill:var(--mc-panel);stroke:var(--mc-teal);stroke-width:2}
.mc-node-text{fill:var(--text);font:600 13px "Manrope",sans-serif;text-anchor:middle}
.mc-flow{fill:none;stroke:var(--mc-teal);stroke-width:2;stroke-dasharray:6 6}
.mc-pulse{fill:var(--mc-teal)}
.mc-ai{fill:color-mix(in srgb,var(--mc-amber) 14%,var(--mc-panel));stroke:var(--mc-amber);stroke-width:1.6}
.mc-ai-feed{fill:none;stroke:var(--mc-amber);stroke-width:2;stroke-dasharray:3 7;animation:mcFeed .9s linear infinite}
.mc-gauge{fill:none;stroke:var(--line);stroke-width:10;stroke-linecap:round}
.mc-gauge-fill{fill:none;stroke:var(--mc-orchid);stroke-width:10;stroke-linecap:round;stroke-dasharray:164;stroke-dashoffset:150;animation:mcGauge 6s ease-in-out infinite}
.mc-chip rect{fill:var(--mc-panel);stroke:var(--line);stroke-width:1.2;animation:mcChip 6s infinite}
.mc-chip-check rect{animation-delay:2s}
.mc-chip-ask rect{animation-delay:4s}
.mc-chip text{fill:var(--text);font:650 12px "Space Grotesk",sans-serif;text-anchor:middle}
.mc-arrow{fill:none;stroke:var(--mc-orchid);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mc-arrow-label{fill:var(--mc-orchid);font:650 11px "Space Grotesk",sans-serif;letter-spacing:.06em}
@keyframes mcFeed{to{stroke-dashoffset:-10}}
@keyframes mcGauge{0%,100%{stroke-dashoffset:150}40%{stroke-dashoffset:40}70%{stroke-dashoffset:95}}
@keyframes mcChip{0%,28%{stroke:var(--mc-orchid);fill:color-mix(in srgb,var(--mc-orchid) 18%,var(--mc-panel))}34%,100%{stroke:var(--line);fill:var(--mc-panel)}}

.mc-part{scroll-margin-top:7rem;margin:0 0 5rem;padding:4rem clamp(0rem,3vw,2rem) 0;border-top:1px solid var(--line)}
.mc-head{max-width:46rem;margin-bottom:2rem}
.mc-head h2{margin:0;color:var(--text);font:650 clamp(2rem,4vw,3.4rem)/1.02 "Space Grotesk",sans-serif;letter-spacing:-.05em}
.mc-head p{max-width:62ch;margin:.9rem 0 0;color:var(--muted);font-size:1.08rem;line-height:1.7}
.mc-part h3{margin:0 0 .5rem;color:var(--text);font:650 1.1rem/1.3 "Space Grotesk",sans-serif}
.mc-part .mc-subhead{margin:2.5rem 0 .8rem;font-size:1.3rem}
.mc-part a{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.18em}
.mc-prose{max-width:62ch;margin:1.6rem 0 0;color:var(--muted);line-height:1.75}
.mc-cite{margin:.9rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.55}
.mc-note,.mc-legend{margin:.6rem 0 0;color:var(--muted);font-size:.8rem}
.mc-read{min-height:1.5em;margin:1rem 0 0;color:var(--text);line-height:1.65}
.mc-panel,.mc-figure{margin:0;padding:clamp(1rem,2.5vw,1.6rem);border:1px solid var(--line);border-radius:1.2rem;background:var(--mc-panel)}
.mc-button{padding:.78rem 1.15rem;border:0;border-radius:999px;background:var(--text);color:var(--bg);font:700 .78rem "Space Grotesk",sans-serif;cursor:pointer}
.mc-button:disabled{opacity:.45;cursor:default}
.mc-range{display:grid;grid-template-columns:1fr auto;gap:.4rem;align-items:center;margin:0 0 1rem;color:var(--muted);font-size:.86rem;font-weight:600}
.mc-range output{color:var(--text);font-variant-numeric:tabular-nums}
.mc-range input{grid-column:1/-1;width:100%;margin:0;accent-color:var(--mc-orchid)}

.mc-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.mc-card{padding:1.3rem;border:1px solid var(--line);border-radius:1.1rem;background:var(--mc-panel)}
.mc-card p{margin:0;color:var(--muted);line-height:1.6}
.mc-card small{display:block;margin-top:.8rem;color:var(--mc-orchid);font-size:.9rem;font-style:italic}
.mc-phases,.mc-toggle{display:inline-grid;grid-auto-flow:column;gap:.3rem;padding:.3rem;border:1px solid var(--border-ui);border-radius:999px}
.mc-phases{margin:2rem 0 .8rem}
.mc-phases button,.mc-toggle button{padding:.55rem 1rem;border:0;border-radius:999px;background:transparent;color:var(--muted);font:650 .8rem "Space Grotesk",sans-serif;cursor:pointer}
.mc-phases button[aria-pressed="true"],.mc-toggle button[aria-pressed="true"]{background:var(--text);color:var(--bg)}
.mc-phase-track{position:relative;max-width:30rem;height:4px;border-radius:4px;background:var(--line)}
.mc-phase-track i{position:absolute;inset:0 auto 0 0;width:33.34%;border-radius:4px;background:var(--mc-orchid);transform:translateX(calc(var(--at,0) * 100%));transition:transform .35s ease}
.mc-phase-read{margin-top:1rem}
.mc-phase-read ul{display:grid;gap:.5rem;margin:0;padding:0;list-style:none}
.mc-phase-read li{padding:.75rem 1rem;border:1px solid var(--line);border-radius:.8rem;background:var(--mc-panel);color:var(--text)}
.mc-stakes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}
.mc-stakes article{padding:1.1rem;border-top:3px solid var(--mc-amber);border-radius:.9rem;background:var(--mc-soft)}
.mc-stakes p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}

.mc-figure figcaption{display:grid;gap:.25rem;margin-bottom:1.1rem}
.mc-figure figcaption b{color:var(--text);font:650 1.05rem "Space Grotesk",sans-serif}
.mc-figure figcaption span{color:var(--muted);font-size:.86rem}
.mc-people{display:grid;gap:.85rem}
.mc-people-row{display:grid;grid-template-columns:9.5rem minmax(0,1fr) 4.5rem;gap:.8rem;align-items:center}
.mc-people-row>span{color:var(--text);font-size:.88rem}
.mc-people-row>b{color:var(--text);font:650 .9rem "Space Grotesk",sans-serif;text-align:right}
.mc-dots{display:grid;grid-template-columns:repeat(18,minmax(0,1fr));gap:.3rem}
.mc-dots i{aspect-ratio:1;border:1.5px solid var(--mc-red);border-radius:50%;transition:background .4s ease calc(var(--i) * 60ms)}
.mc-people.is-shown .mc-dots i.is-miss{background:var(--mc-red)}
.mc-check{margin-top:2rem}
.mc-check-text{max-width:62ch;margin:.6rem 0 1.2rem;color:var(--text);font-size:1.02rem;line-height:1.75}
.mc-options{display:grid;gap:.5rem;margin-top:.8rem}
.mc-options button,.mc-cal-answer button{padding:.85rem 1rem;border:1px solid var(--border-ui);border-radius:.8rem;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.mc-options button[aria-pressed="true"],.mc-cal-answer button[aria-pressed="true"]{border-color:var(--mc-orchid);background:var(--mc-soft)}
.mc-options button:disabled,.mc-cal-answer button:disabled{cursor:default}

.mc-cal{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:1rem;align-items:stretch}
.mc-cal-count{margin:0;color:var(--muted);font-size:.82rem}
.mc-cal-claim{margin:.5rem 0 1rem;color:var(--text);font:600 clamp(1.1rem,2vw,1.35rem)/1.4 "Space Grotesk",sans-serif}
.mc-cal-answer{display:flex;gap:.5rem;margin-bottom:1rem}
.mc-cal-answer button{flex:1;text-align:center;font:650 .9rem "Space Grotesk",sans-serif}
.mc-cal-chart svg{display:block;width:100%;height:auto}
.mc-cal-chart figcaption{margin-top:.6rem;color:var(--text);font-size:.9rem;line-height:1.55}
.mc-axis{stroke:var(--line);stroke-width:1}
.mc-axis-text{fill:var(--muted);font:500 10px "Space Grotesk",sans-serif}
.mc-conf-line{stroke:var(--mc-orchid);stroke-width:2;stroke-dasharray:5 4}
.mc-hit-line{stroke:var(--mc-teal);stroke-width:2}
.mc-gap{fill:color-mix(in srgb,var(--mc-red) 18%,transparent)}
.mc-dot-right{fill:var(--mc-teal)}
.mc-dot-wrong{fill:var(--mc-panel);stroke:var(--mc-red);stroke-width:2}
.mc-line-text{font:650 10px "Space Grotesk",sans-serif;text-anchor:end}
.mc-line-text.is-conf{fill:var(--mc-orchid)}
.mc-line-text.is-hit{fill:var(--mc-teal)}

.mc-arb-controls{display:grid;grid-template-columns:auto minmax(14rem,1fr);gap:1rem 2rem;align-items:end;margin-bottom:1.2rem}
.mc-arb-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:.45rem}
.mc-cell{display:grid;place-items:center;min-height:2.6rem;border:1.5px dashed var(--border-ui);border-radius:.6rem;color:var(--muted);font:650 .72rem "Space Grotesk",sans-serif;font-variant-numeric:tabular-nums}
.mc-cell.is-accepted{border-style:solid;color:var(--text)}
.mc-cell.is-accepted.is-right{border-color:var(--mc-teal);background:color-mix(in srgb,var(--mc-teal) 18%,transparent)}
.mc-cell.is-accepted.is-wrong{border-color:var(--mc-red);background:color-mix(in srgb,var(--mc-red) 26%,transparent)}
.mc-arb-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin:1.2rem 0 0}
.mc-arb-stats div{padding:.9rem;border:1px solid var(--line);border-radius:.9rem}
.mc-arb-stats dt{color:var(--muted);font-size:.8rem}
.mc-arb-stats dd{margin:.3rem 0 0;color:var(--text);font:700 1.8rem "Space Grotesk",sans-serif;font-variant-numeric:tabular-nums}
.mc-bars{margin-top:2rem}
.mc-bar{display:grid;grid-template-columns:minmax(10rem,16rem) minmax(0,1fr) 4rem;gap:.8rem;align-items:center;margin-top:.7rem}
.mc-bar span{color:var(--text);font-size:.88rem}
.mc-bar i{display:block;height:1.2rem;border-radius:.4rem;background:linear-gradient(90deg,var(--mc-red) calc(var(--v) * 1%),var(--line) 0)}
.mc-bar b{color:var(--text);font:650 .95rem "Space Grotesk",sans-serif;text-align:right}

.mc-pipe{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;align-items:center;margin:0 0 1rem;padding:0;list-style:none}
.mc-pipe>li{position:relative}
.mc-pipe>li:not(:last-child)::after{content:"";position:absolute;top:50%;right:-.5rem;width:.5rem;height:1.5px;background:var(--mc-amber)}
.mc-pipe-node{padding:1rem .8rem;border:1px solid var(--line);border-radius:.9rem;background:var(--mc-panel);color:var(--text);font:600 .9rem "Space Grotesk",sans-serif;text-align:center}
.mc-gate{display:grid;gap:.2rem;padding:.8rem;border:1.5px dashed var(--mc-amber);border-radius:999px;text-align:center}
.mc-gate b{color:var(--mc-amber);font:700 .78rem "Space Grotesk",sans-serif}
.mc-gate small{color:var(--muted);font-size:.78rem}
.mc-prompts{display:grid;gap:.6rem;margin-top:.8rem}
.mc-prompts button{display:grid;padding:1rem 1.1rem;border:1px solid var(--border-ui);border-radius:1rem;background:var(--mc-panel);color:var(--text);font:inherit;text-align:left;cursor:pointer}
.mc-prompts button>span{grid-area:1/1;transition:opacity .3s ease}
.mc-prompts button>span:last-child{opacity:0}
.mc-prompts button[aria-pressed="true"]>span:first-child{opacity:0}
.mc-prompts button[aria-pressed="true"]>span:last-child{opacity:1}
.mc-prompts small{display:block;margin-bottom:.3rem;color:var(--mc-amber);font:650 .72rem "Space Grotesk",sans-serif}
.mc-prompts span:last-child small{color:var(--mc-teal)}
.mc-order{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin:0;padding:0;list-style:none}
.mc-order li{padding:1rem;border:1px solid var(--line);border-radius:.9rem;background:var(--mc-soft)}
.mc-order b{display:block;color:var(--text);font:650 1rem "Space Grotesk",sans-serif}
.mc-order small{color:var(--muted);font-size:.85rem;line-height:1.5}

.mc-sort{display:grid;gap:.6rem;margin-top:.8rem}
.mc-task{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem 1rem;align-items:center;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:1rem;background:var(--mc-panel)}
.mc-task>p{margin:0;color:var(--text);font-weight:600}
.mc-choice{display:inline-flex;flex-wrap:wrap;gap:.3rem}
.mc-choice button{padding:.45rem .75rem;border:1px solid var(--border-ui);border-radius:999px;background:transparent;color:var(--muted);font:650 .75rem "Space Grotesk",sans-serif;cursor:pointer}
.mc-choice button[aria-pressed="true"]{border-color:var(--mc-orchid);background:var(--mc-orchid);color:var(--bg)}
.mc-task output{grid-column:1/-1;color:var(--muted);font-size:.88rem;line-height:1.55}
.mc-task output:empty{display:none}
.mc-decay{max-width:30rem;margin-top:2rem}
.mc-decay-bars{display:flex;gap:2rem;align-items:flex-end;height:13rem;padding:0 1rem;border-bottom:1px solid var(--line)}
.mc-decay-bars>div{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:.35rem;width:6rem;height:100%}
.mc-decay-bars i{display:block;width:100%;height:calc(var(--v) * 2.4%);border-radius:.5rem .5rem 0 0;background:var(--mc-teal)}
.mc-decay-after i{background:var(--mc-red)}
.mc-decay-bars b{color:var(--text);font:650 .95rem "Space Grotesk",sans-serif}
.mc-decay-bars span{color:var(--muted);font-size:.8rem;text-align:center}

.mc-rhythm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.mc-rhythm article{padding:1.2rem;border:1px solid var(--line);border-radius:1rem;background:var(--mc-panel)}
.mc-rhythm span{color:var(--mc-orchid);font:650 .78rem "Space Grotesk",sans-serif}
.mc-rhythm p{margin:0;color:var(--muted);line-height:1.6}
.mc-lead{margin-top:2rem;padding:1.4rem;border-radius:1.2rem;background:var(--mc-soft)}
.mc-lead ul{display:grid;gap:.7rem;margin:.6rem 0 0;padding-left:1.1rem;color:var(--muted);line-height:1.6}
.mc-lead b{color:var(--text)}
.mc-rule{max-width:44rem;margin:2.5rem 0 0;color:var(--text);font:600 clamp(1.15rem,2.3vw,1.5rem)/1.45 "Space Grotesk",sans-serif}
.mc-sources ol{display:grid;gap:.6rem;margin:0 0 2rem;padding-left:1.2rem;color:var(--muted);font-size:.9rem;line-height:1.6}

@media(max-width:900px){.mc-pipe>li:not(:last-child)::after{top:auto;right:auto;bottom:-.5rem;left:50%;width:1.5px;height:.5rem}.mc-hero,.mc-cal,.mc-arb-controls{grid-template-columns:1fr}.mc-hero{min-height:0}.mc-stakes{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-pipe{grid-template-columns:1fr}.mc-order{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.mc-rail{position:relative;top:auto;grid-template-columns:repeat(4,1fr);border-radius:1rem}}
@media(max-width:560px){.mc-split,.mc-stakes,.mc-rhythm,.mc-order,.mc-arb-stats{grid-template-columns:1fr}.mc-people-row{grid-template-columns:1fr auto}.mc-people-row .mc-dots{grid-column:1/-1;grid-row:2}.mc-arb-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.mc-task{grid-template-columns:1fr}.mc-bar{grid-template-columns:1fr auto}.mc-bar i{grid-column:1/-1;grid-row:2}.mc-phases,.mc-toggle{display:grid;grid-auto-flow:row;border-radius:1rem}}
@media(prefers-reduced-motion:reduce){.mc-ai-feed,.mc-gauge-fill,.mc-chip rect{animation:none}.mc-gauge-fill{stroke-dashoffset:70}.mc-dots i,.mc-phase-track i,.mc-prompts button>span{transition:none}}
