/* Sample report metrics and the evidence ledger, drawn as visuals instead of text rows.
   Base styles are the finished, readable state. Motion only runs while the block has .in-view
   (set by sage-scan.js) and is switched off when paused or when reduced motion is on. */

/* ---------- report metrics: ring or icon, value, label ---------- */
.report-paper .report-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0;border:0;margin-top:24px}
.report-paper .report-metrics>.metric{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:16px 14px 15px;border:1px solid #88a8d51f;border-radius:10px;background:linear-gradient(160deg,#122036,#0b1422)}
.report-paper .report-metrics>.metric dd{order:-1;display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:0 0 8px}
.report-metrics .m-viz{width:42px;height:42px;fill:none;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.m-track{stroke:#9ac4ff1f}
.m-fill{stroke:var(--scan-ice);stroke-dasharray:100}
.m-icon{stroke:var(--scan-ice);stroke-width:2.4;stroke-dasharray:100}
.metric.warn .m-fill,.metric.warn .m-icon{stroke:var(--scan-amber)}
.metric.warn .m-track{stroke:#e0b36a26}
.metric.ok .m-icon{stroke:var(--scan-ok)}
.metric.ok .m-track{stroke:#8fd3b426}
.report-paper .report-metrics dd b{font-size:28px;font-weight:500;letter-spacing:-.04em;line-height:1;color:#dce9ff}
.report-paper .report-metrics dd b>span{font-size:14px;font-weight:450;letter-spacing:0;color:#8aa3c6;margin-left:2px}
.report-paper .report-metrics dt{font:12px/1.5 var(--mono);color:#a3bbdd}
.report-paper .report-metrics small{display:block;font-size:12px;line-height:1.5;color:#7f96b8;margin:0}
.report-paper .metric.warn small{color:#d4b796}
.report-paper .metric.ok small{color:var(--scan-ok)}
.report-paper .report-insight{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:14px;padding:14px 16px;border-radius:10px;border:1px solid #9ac4ff1c;background:#9ac4ff0a}
.report-paper .report-insight>div{display:contents}
.report-paper .report-insight h4{font:12px/1.6 var(--mono);color:var(--scan-ice);white-space:nowrap}
.report-paper .report-insight p{margin:0;font-size:14px;line-height:1.6;color:#b3c6e2}

/* sidebar checks read as status pills */
.evidence-sidebar .evidence-check{flex-direction:row;justify-content:space-between;align-items:center;gap:10px}
.evidence-sidebar .evidence-check>strong{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 8px;border-radius:99px;font-size:12px;font-weight:450;color:var(--scan-ok);background:#8fd3b412;border:1px solid #8fd3b433;white-space:nowrap}
.evidence-sidebar .evidence-check>strong::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.evidence-sidebar .evidence-check.warning>strong{color:var(--scan-amber);background:#e0b36a14;border-color:#e0b36a40}

@keyframes m-draw{from{stroke-dashoffset:100}}
@keyframes m-rise{from{opacity:0;transform:translateY(12px)}}
.report-paper.in-view .metric{animation:m-rise .55s var(--scan-ease) backwards;animation-delay:calc(var(--i,0)*90ms)}
.report-paper.in-view .m-fill,.report-paper.in-view .m-icon{animation:m-draw 1.2s var(--scan-ease) backwards;animation-delay:calc(.2s + var(--i,0)*90ms)}

/* ---------- evidence ledger: four visual tiles ---------- */
.evidence-ledger .ledger-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:24px 32px 26px}
.ledger-tile{display:flex;flex-direction:column;min-width:0;padding:14px 14px 10px;border:1px solid #9ac4ff1f;border-radius:12px;background:linear-gradient(170deg,#111d31,#0a121f);transition:border-color .25s,transform .4s var(--scan-ease)}
.ledger-tile:hover{border-color:#9ac4ff45;transform:translateY(-3px)}
.lt-viz{position:relative;display:grid;place-items:center;height:150px;margin-bottom:16px;border-radius:9px;border:1px solid #9ac4ff12;background:radial-gradient(circle at 50% 42%,#9ac4ff14,transparent 70%),#0a1220;overflow:hidden}
.lt-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ledger-tile h4{font-size:15px;font-weight:500;color:#cfe0fa}
.ledger-tile .lt-head strong{font-size:22px;font-weight:500;letter-spacing:-.035em;color:#e6efff;white-space:nowrap}
.ledger-tile .lt-head strong small{font-size:13px;letter-spacing:0;color:#8aa3c6}
.ledger-tile>small{font:12px/1.7 var(--mono);color:#88a3c6;margin-top:2px}
.ledger-tile>small.ledger-warning{color:#d4b796}
.ledger-tile p{font-size:14px;line-height:1.6;color:#9db1cf;margin:8px 0 6px}
.ledger-tile button{align-self:flex-start;margin-top:auto;min-height:40px;padding:0;font-size:14px;background:transparent;color:#bad5fc;border:0;border-bottom:1px solid #7ea9e860;border-radius:0}
.ledger-tile button:hover{color:#e2eeff;border-color:#bad5fc}

/* ownership: a donut with 31% drawn */
.lt-donut svg{grid-area:1/1;width:118px;height:118px;fill:none}
.lt-donut>span{grid-area:1/1;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#9bb3d6}
.lt-ticks{stroke:#9ac4ff33;stroke-width:3;stroke-dasharray:.6 4.4}
.lt-track{stroke:#9ac4ff17;stroke-width:12}
.lt-arc{stroke:var(--scan-ice);stroke-width:12;stroke-dasharray:31 100;filter:drop-shadow(0 0 6px #9ac4ff66)}

/* liquidity: a shallow pool under the healthy line, with an open lock */
.lt-pool{place-items:end center;padding:0 22px 16px}
.tank{position:relative;width:100%;height:104px;border:1.5px solid #9ac4ff40;border-top:0;border-radius:0 0 14px 14px;background:linear-gradient(#9ac4ff05,#9ac4ff0d);overflow:hidden}
.tank .healthy{position:absolute;inset:22% 0 auto;padding:4px 8px 0;border-top:1px dashed #9ac4ff5c;font:10.5px var(--mono);text-align:right;color:#8199bb}
.tank .water{position:absolute;inset:auto 0 0;height:24%;background:linear-gradient(#e0b36a5c,#e0b36a24)}
.tank .wave{position:absolute;left:0;bottom:calc(100% - 1px);width:200%;height:8px;fill:#e0b36a5c}
.lt-lock{position:absolute;top:8px;left:10px;width:16px;height:18px;fill:none;stroke:var(--scan-amber);stroke-width:1.8;stroke-linecap:round;overflow:visible}
.lt-lock rect{fill:#e0b36a22}
.lt-lock .shackle{transform-origin:15px 10px;transform:translateY(-3px) rotate(28deg)}

/* permissions: two switches flipped off */
.lt-switches{align-content:center;gap:14px}
.sw{display:grid;grid-template-columns:54px 50px 26px;align-items:center;gap:10px;font:12px var(--mono);color:#9bb3d6}
.sw i{position:relative;width:50px;height:26px;border-radius:99px;border:1px solid #9ac4ff2e;background:#9ac4ff12}
.sw i::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#7d93b5}
.sw em{font-style:normal;color:var(--scan-ok)}

/* fundamentals: ten segments, 7.1 lit */
.lt-meter{align-content:center;gap:8px;padding:0 18px}
.segs{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:62px;align-items:end;gap:4px;width:100%}
.segs i{height:calc(28% + var(--i)*8%);border-radius:3px;background:#9ac4ff17;transform-origin:bottom}
.segs i.on{background:linear-gradient(#b5d4ff,#5a96f5);box-shadow:0 0 10px #5a96f540}
.segs i.part{background:linear-gradient(to top,#5a96f5 0 12%,#9ac4ff17 12%)}
.lt-scale{display:flex;justify-content:space-between;width:100%;font:10.5px var(--mono);color:#6f86a8}

@keyframes lt-donut{from{stroke-dasharray:0 100}}
@keyframes lt-turn{from{rotate:-60deg}}
@keyframes lt-fill{from{height:0}}
@keyframes lt-wave{to{transform:translateX(-50%)}}
@keyframes lt-unlock{from{transform:none}}
@keyframes sw-knob{from{transform:translateX(24px);background:var(--scan-ice);box-shadow:0 0 12px #9ac4ff99}}
@keyframes sw-track{from{background:#9ac4ff40;border-color:#9ac4ff80}}
@keyframes sw-label{from{opacity:0}}
@keyframes seg-on{from{opacity:.2;transform:scaleY(.25)}}
.ledger-tiles.in-view .ledger-tile{animation:m-rise .6s var(--scan-ease) backwards;animation-delay:calc(var(--i)*110ms)}
.ledger-tiles.in-view .lt-donut svg{animation:lt-turn 1.6s var(--scan-ease) backwards .2s}
.ledger-tiles.in-view .lt-arc{animation:lt-donut 1.6s var(--scan-ease) backwards .3s}
.ledger-tiles.in-view .tank .water{animation:lt-fill 1.6s var(--scan-ease) backwards .4s}
.ledger-tiles.in-view .tank .wave{animation:lt-wave 3.2s linear infinite}
.ledger-tiles.in-view .lt-lock .shackle{animation:lt-unlock .7s var(--scan-ease) backwards 1.5s}
.ledger-tiles.in-view .sw i{animation:sw-track .7s ease backwards .7s}
.ledger-tiles.in-view .sw i::after{animation:sw-knob .7s var(--scan-ease) backwards .7s}
.ledger-tiles.in-view .sw em{animation:sw-label .4s ease backwards 1.1s}
.ledger-tiles.in-view .sw+.sw i,.ledger-tiles.in-view .sw+.sw i::after{animation-delay:1.2s}
.ledger-tiles.in-view .sw+.sw em{animation-delay:1.6s}
.ledger-tiles.in-view .segs i{animation:seg-on .5s var(--scan-ease) backwards;animation-delay:calc(.35s + var(--i)*80ms)}

/* tablet and phone: the tiles slide sideways instead of stacking */
@media(max-width:959px){
  .evidence-ledger .ledger-tiles{display:flex;gap:12px;padding:20px 22px 24px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:22px;scrollbar-width:none}
  .evidence-ledger .ledger-tiles::-webkit-scrollbar{display:none}
  .ledger-tile{flex:0 0 min(280px,76%);scroll-snap-align:start}
}
@media(max-width:699px){
  .report-paper .report-metrics{gap:8px;margin-top:20px}
  .report-paper .report-metrics>.metric{padding:12px 10px 11px}
  .report-paper .report-metrics>.metric dd{gap:11px;margin-bottom:6px}
  .report-metrics .m-viz{width:34px;height:34px}
  .report-paper .report-metrics dd b{font-size:22px}
  .report-paper .report-metrics dd b>span{font-size:12px}
  .report-paper .report-metrics dt{font-size:11px}
  .evidence-ledger .ledger-tiles{padding:18px 18px 22px;scroll-padding-inline:18px}
}
/* narrow phones: one row per metric, ring and value left, label right */
@media(max-width:479px){
  .report-paper .report-metrics{grid-template-columns:1fr}
  .report-paper .report-metrics>.metric{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:12px;padding:10px 14px}
  .report-paper .report-metrics>.metric dd{grid-column:1;grid-row:1/3;flex-direction:row;align-items:center;gap:12px;margin:0}
  .report-paper .report-metrics dt,.report-paper .report-metrics small{grid-column:2;text-align:right}
  .report-paper .report-metrics dt{grid-row:1;align-self:end}
  .report-paper .report-metrics small{grid-row:2;align-self:start}
}

.sage-paused .report-paper *,.sage-paused .ledger-tiles *,.sage-paused .ledger-tiles *::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .report-paper *,.ledger-tiles *,.ledger-tiles *::after{animation:none!important}
  .ledger-tile:hover{transform:none}
}

/* ---------- pricing: icon features, visual plan cards, the Saturday briefing ---------- */
.free-plan ul.free-feats{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:none;margin:22px 0 12px;font-size:14px;line-height:1.4;color:#c3d6f1}
.free-feats li{display:flex;flex-direction:column;gap:12px;padding:14px 12px;border:1px solid #9ac4ff1f;border-radius:10px;background:#9ac4ff08}
.free-feats svg{width:22px;height:22px;fill:none;stroke:var(--scan-ice);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100}
.access-grid .free-plan>p.free-limit{display:flex;align-items:center;gap:10px;margin:0 0 24px;font:12px/1.6 var(--mono);color:#9bb3d6}
.free-limit i{width:12px;height:12px;border:1.5px solid var(--scan-ice);border-right-color:transparent;border-radius:50%}

.plan-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:22px 0 8px}
.plan-card{display:flex;flex-direction:column;min-width:0;padding:12px 12px 16px;border:1px solid #9ac4ff1f;border-radius:12px;background:linear-gradient(170deg,#111d31,#0a121f);transition:border-color .25s,transform .4s var(--scan-ease)}
.plan-card:hover{border-color:#9ac4ff45;transform:translateY(-3px)}
.pc-viz{position:relative;display:grid;place-items:center;height:124px;margin-bottom:14px;border-radius:9px;border:1px solid #9ac4ff12;background:radial-gradient(circle at 50% 45%,#9ac4ff14,transparent 70%),#0a1220;overflow:hidden}
.pc-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-inline:4px}
.roadmap-plans .plan-card h3{font-size:22px;font-weight:500;letter-spacing:-.04em}
.pc-badge{padding:3px 8px;border:1px dashed #9ac4ff45;border-radius:99px;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#9bb3d6}
.roadmap-plans .pc-tag{margin:4px 4px 12px;font-size:14px;line-height:1.5;color:#9db1cf}
.pc-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0 4px;list-style:none}
.pc-chips li{padding:5px 9px;border-radius:99px;border:1px solid #9ac4ff24;background:#9ac4ff10;font-size:12px;line-height:1.4;color:#c3d6f1}

/* pro: report sheets fanned out, an alert dot */
.sheets{position:relative;width:78px;height:86px}
.sheet{position:absolute;inset:0;display:flex;flex-direction:column;gap:7px;padding:13px 10px;border-radius:6px;border:1px solid #9ac4ff45;background:#13223a;box-shadow:0 10px 22px #0008}
.sheet:nth-child(1){transform:translateX(-24px) rotate(-10deg)}
.sheet:nth-child(2){transform:translateX(24px) rotate(10deg)}
.sheet:nth-child(3){background:#182b48}
.sheet b{display:block;width:80%;height:4px;border-radius:2px;background:#9ac4ff40}
.sheet b:first-child{width:55%;background:var(--scan-ice)}
.sheet b:last-child{width:68%}
.plan-pro .bell{position:absolute;top:18px;right:24px;width:9px;height:9px;border-radius:50%;background:var(--scan-amber)}

/* alpha: a rising line with wallets buying in and a live ping */
.plan-alpha .pc-viz svg{position:absolute;inset:0;width:100%;height:100%}
.spark{fill:none;stroke:var(--scan-ice);stroke-width:1.8;stroke-linejoin:round;stroke-dasharray:100}
.spark-area{fill:#9ac4ff12}
.plan-alpha .ping,.plan-alpha .wallet{position:absolute;border-radius:50%;translate:-50% -50%}
.plan-alpha .ping{width:10px;height:10px;background:var(--scan-ok);box-shadow:0 0 12px var(--scan-ok)}
.plan-alpha .wallet{width:7px;height:7px;background:#dce9ff;box-shadow:0 0 8px #9ac4ff}

/* teams: one shared report wired to a community */
.plan-teams .pc-viz svg{width:112px;height:112px;overflow:visible}
.plan-teams .link{stroke:#9ac4ff4d;stroke-width:1;stroke-dasharray:100}
.plan-teams .member{fill:#13223a;stroke:var(--scan-ice);stroke-width:1.5;transform-box:fill-box;transform-origin:center}
.plan-teams .hub{fill:#182b48;stroke:var(--scan-ice);stroke-width:1.2}
.plan-teams .hub-lines{fill:none;stroke:#9ac4ff99;stroke-width:1.5;stroke-linecap:round}

.briefing-strip .week{display:flex;gap:4px;flex:none}
.week i{display:grid;place-items:center;width:24px;height:32px;border-radius:6px;border:1px solid #9ac4ff1c;background:#9ac4ff0b;font:11px var(--mono);font-style:normal;color:#7d93b5}
.week i.sat{border-color:var(--scan-ice);background:var(--scan-ice);color:#06101e;box-shadow:0 0 14px #9ac4ff70}

@keyframes pc-fan{from{transform:none}}
@keyframes pc-ping{0%{box-shadow:0 0 0 0 #e0b36a90}70%,100%{box-shadow:0 0 0 12px #e0b36a00}}
@keyframes pc-live{0%{box-shadow:0 0 0 0 #8fd3b490}70%,100%{box-shadow:0 0 0 14px #8fd3b400}}
@keyframes pc-pop{from{opacity:0;scale:.2}}
@keyframes pc-fade{from{opacity:0}}
@keyframes pc-spin{from{rotate:-360deg}}
@keyframes week-lit{from{background:#9ac4ff0b;color:#7d93b5;box-shadow:none;border-color:#9ac4ff1c}}
.free-plan.in-view .free-feats li{animation:m-rise .5s var(--scan-ease) backwards;animation-delay:calc(.15s + var(--i)*90ms)}
.free-plan.in-view .free-feats svg{animation:m-draw 1.1s var(--scan-ease) backwards;animation-delay:calc(.35s + var(--i)*90ms)}
.free-plan.in-view .free-limit i{animation:pc-spin 1.2s var(--scan-ease) backwards .7s}
.plan-row.in-view .plan-card{animation:m-rise .6s var(--scan-ease) backwards;animation-delay:calc(var(--i)*120ms)}
.plan-row.in-view .sheet:nth-child(-n+2){animation:pc-fan .9s var(--scan-ease) backwards .45s}
.plan-row.in-view .plan-pro .bell{animation:pc-pop .4s var(--scan-ease) backwards 1.1s,pc-ping 2.4s ease-out 1.5s infinite}
.plan-row.in-view .spark{animation:m-draw 1.6s var(--scan-ease) backwards .4s}
.plan-row.in-view .spark-area{animation:pc-fade 1s ease backwards 1s}
.plan-row.in-view .plan-alpha .wallet{animation:pc-pop .4s var(--scan-ease) backwards;animation-delay:calc(1.2s + var(--i)*.2s)}
.plan-row.in-view .plan-alpha .ping{animation:pc-pop .4s var(--scan-ease) backwards 1.7s,pc-live 2s ease-out 2.1s infinite}
.plan-row.in-view .plan-teams .link{animation:m-draw .7s ease backwards;animation-delay:calc(.5s + var(--i)*.1s)}
.plan-row.in-view .plan-teams .member{animation:pc-pop .4s var(--scan-ease) backwards;animation-delay:calc(.8s + var(--i)*.1s)}
.briefing-strip.in-view .week i{animation:m-rise .4s var(--scan-ease) backwards;animation-delay:calc(var(--i)*60ms)}
.briefing-strip.in-view .week i.sat{animation:m-rise .4s var(--scan-ease) backwards .3s,week-lit .5s ease backwards 1s}

@media(max-width:959px){
  .plan-row{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
  .plan-row::-webkit-scrollbar{display:none}
  .plan-card{flex:0 0 min(270px,76%);scroll-snap-align:start}
}
@media(max-width:699px){
  .briefing-strip{flex-wrap:wrap}
}

.sage-paused [data-inview] *,.sage-paused [data-inview] *::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
  [data-inview] *,[data-inview] *::after{animation:none!important}
  .plan-card:hover{transform:none}
}