/* Browser-only edition: the season story on the Guided demo page (static-site/story.js). */
/* The page hides everything on this view except the step list; the story belongs beside it. */
html[data-cropguard-mode] body #page-operations>#season-story{display:block!important}
html[data-cropguard-mode] body #page-operations>#story-technical{display:flex!important}
#demo-workspace.story-collapsed{display:none!important}
/* The story carries its own notice, so the two general notices above it are not repeated here. */
html.story-ready main:has(> #page-operations:not(.hidden))>#hosted-access,
html.story-ready main:has(> #page-operations:not(.hidden))>#global-status{display:none!important}

#season-story{margin-bottom:22px}
.story-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:10px}
.story-head h2{font-size:25px;line-height:1.15;margin:5px 0 3px}
.story-sub{font-size:11.5px;color:var(--muted);margin:0;line-height:1.6}
.story-head-actions{display:flex;gap:8px;flex:none}

.story-rail{list-style:none;margin:0 0 10px;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.story-rail button{width:100%;min-height:34px;display:flex;gap:7px;align-items:baseline;text-align:left;background:none;border:0;border-top:3px solid var(--line);padding:6px 2px 3px;font-size:11px;line-height:1.35;color:#8a967f;cursor:pointer;transition:border-color .3s,color .3s}
.story-rail button b{font-size:10px;font-weight:600}
.story-rail button:hover{color:var(--ink)}
.story-rail .done button{border-top-color:var(--sage);color:#55654c}
.story-rail .current button{border-top-color:var(--forest);color:var(--ink);font-weight:600}

.story-body{display:grid;grid-template-columns:minmax(0,1fr) 224px;gap:14px;align-items:stretch}
.story-stage{position:relative;margin:0;padding:16px 22px 14px;min-height:400px;display:flex;flex-direction:column;animation:story-fade .35s ease-out}
.stage-head .eyebrow{margin-bottom:5px}
.stage-head h3{font-family:Georgia,serif;font-weight:400;font-size:23px;letter-spacing:-.6px;line-height:1.2;margin:0 0 3px}
.stage-head p{font-size:12px;line-height:1.55;color:var(--muted);margin:0 0 10px;max-width:760px}
.stage-foot{margin-top:auto;padding-top:10px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 18px}
.story-fine{font-size:10.5px;line-height:1.6;color:#8a967f;margin:10px 0 0}
.story-fine a{color:var(--forest)}

.story-ledger{background:#f2f4ed;border:1px solid var(--line);border-radius:var(--radius);padding:7px 9px;display:flex;flex-direction:column;gap:2px;min-width:0}
.ledger-clock{padding:5px 6px 7px;border-bottom:1px solid #dfe5d6}
.ledger-clock span,.ledger-row span{display:block;font-size:10px;color:var(--muted)}
.ledger-clock small{display:block;font-size:9px;line-height:1.4;color:#8a967f;margin-top:2px}
.ledger-clock strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:17px;margin-top:2px;font-variant-numeric:tabular-nums}
.ledger-row{padding:5px 6px;border-bottom:1px solid #dfe5d6;border-radius:4px;min-width:0}
.ledger-row:last-child{border-bottom:0}
.ledger-row strong{display:block;font-size:17px;font-weight:450;letter-spacing:-.3px;margin:1px 0 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ledger-row small{display:block;font-size:9px;line-height:1.4;color:#8a967f}
.ledger-row.flash{animation:story-flash 1.4s ease-out}
@keyframes story-flash{0%,30%{background:#dfe9cf}100%{background:transparent}}

.story-bottom{display:flex;align-items:center;gap:22px;margin-top:12px}
.story-caption{flex:1;font-family:Georgia,serif;font-size:16.5px;line-height:1.5;color:var(--ink);margin:0 2px;min-height:49px;display:flex;align-items:center}
.story-caption.error{color:var(--error)}
.story-controls{display:flex;align-items:center;gap:10px;flex:none}
.story-controls .button{gap:10px}
#story-next[hidden]{display:none!important}

.story-technical{width:100%;margin:26px 0 0;align-items:baseline;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:15px 20px;text-align:left;color:var(--ink);cursor:pointer}
.story-technical span{font-size:13px;font-weight:550}
.story-technical small{flex:1;font-size:11px;color:var(--muted)}
.story-technical b{font-size:18px;font-weight:400;color:var(--muted)}
.story-technical[aria-expanded=true]{border-radius:var(--radius) var(--radius) 0 0;margin-bottom:-1px}
#demo-workspace:not(.story-collapsed){margin-bottom:10px}

/* Charts */
.story-figure{margin:0;min-width:0}
.story-figure figcaption{font-size:10.5px;color:#8a967f;margin-top:4px;line-height:1.5}
.story-svg{display:block;width:100%;height:auto;max-height:250px;overflow:visible}
.story-svg text{font-family:system-ui,sans-serif;font-size:11px;fill:#849175}
.story-svg .grid{stroke:#e8ecdf;stroke-width:1}
.story-svg .bar{fill:#91a780}
.story-svg .bar.low{fill:#bd9b61}
.story-svg .trigger{stroke:#ac8144;stroke-width:1.6;stroke-dasharray:5 4}
.story-svg .mean{stroke:#6c7d63;stroke-width:1;stroke-dasharray:2 4}
.story-svg .mean-label{font-size:10.5px;fill:#6c7d63}
.story-svg .leader{stroke:#bd9b61;stroke-width:1}
.story-svg .callout{font-size:11.5px;font-weight:600;fill:#8a6a35}
.story-svg .gamma-curve{fill:none;stroke:#36583f;stroke-width:2.2;stroke-linejoin:round;stroke-dasharray:1400;stroke-dashoffset:0;animation:story-draw 1.4s .3s ease-out both}
.story-svg .rug{stroke:#36583f;stroke-width:1.4}
.story-svg .rug.low{stroke:#bd9b61;stroke-width:2.4}
.story-svg .axis{font-size:10px}
.grow{transform-box:fill-box;transform-origin:50% 100%;animation:story-grow .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes story-grow{from{transform:scaleY(0)}}
@keyframes story-draw{from{stroke-dashoffset:1400}}
@keyframes story-fade{from{opacity:0;transform:translateY(4px)}}

.stage-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:24px;align-items:start}
.story-facts{margin:0;display:grid;gap:12px}
.story-facts div{border-bottom:1px solid var(--line);padding-bottom:10px}
.story-facts dt{font-size:10px;color:var(--muted);margin-bottom:3px}
.story-facts dd{margin:0;font-size:14px;line-height:1.5}

/* Predefined policy */
.pricing-wait{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start;padding:18px 20px;background:#f4f6ef;border-radius:var(--radius)}
.pricing-wait strong{font-size:15px}
.pricing-wait p{font-size:12px;line-height:1.7;color:#5d6c54;margin:8px 0 0}
.pricing-status{font-weight:550}
.pricing-status.running::after{content:'';display:inline-block;width:10px;height:10px;margin-left:8px;border:2px solid var(--sage);border-top-color:var(--forest);border-radius:50%;animation:story-spin .8s linear infinite;vertical-align:-1px}
@keyframes story-spin{to{transform:rotate(360deg)}}
.pricing-terms{display:grid;gap:8px}
.pricing-terms div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #dfe5d6;padding-bottom:6px;font-size:12px}
.pricing-terms span{color:var(--muted)}
.price-steps{display:grid;gap:12px}
.price-step{border-left:2px solid var(--sage);padding:2px 0 4px 13px}
.price-step strong{display:block;font-size:15px;font-weight:550;margin:4px 0 2px;font-variant-numeric:tabular-nums}
.price-step p{font-size:12px;color:#5d6c54;margin:0;line-height:1.55}
.price-step .price-total{font-family:Georgia,serif;font-weight:400;font-size:32px;letter-spacing:-1px}
.price-total small{font-family:system-ui,sans-serif;font-size:10px;letter-spacing:0;color:#8b977d}
.reveal{animation:story-fade .5s var(--d,0s) ease-out both}
.premium-bar{display:flex;height:14px;border-radius:3px;overflow:hidden;margin:8px 0 8px;gap:1px;background:#fff}
.premium-bar i{display:block;min-width:2px}
.premium-bar .k0,.premium-legend .k0{background:#bd9b61}
.premium-bar .k1,.premium-legend .k1{background:#36583f}
.premium-bar .k2,.premium-legend .k2{background:#91a780}
.premium-bar .k3,.premium-legend .k3{background:#c9d3b9}
.premium-legend{list-style:none;padding:0;margin:0;display:grid;gap:3px;font-size:11.5px}
.premium-legend li{display:flex;align-items:center;gap:8px}
.premium-legend i{width:9px;height:9px;border-radius:2px;flex:none}
.premium-legend span{flex:1;color:#5d6c54}
.premium-legend b{font-weight:550;font-variant-numeric:tabular-nums}

/* Timeline */
.timeline{position:relative;padding-top:24px;margin:0 0 30px}
.timeline-track{display:flex;gap:3px}
.timeline-seg{flex:var(--w) 1 0;min-width:0;height:7px;background:#e5eadc;border-radius:2px;position:relative}
.timeline-seg i{display:block;height:100%;width:0;background:var(--sage);border-radius:2px;transition:width .9s cubic-bezier(.3,.7,.2,1)}
.timeline-seg span{position:absolute;top:11px;left:0;right:0;font-size:9.5px;color:#7d8a73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timeline-marker{position:absolute;top:0;left:0;transform:translateX(-50%);transition:left .9s cubic-bezier(.3,.7,.2,1);z-index:1}
.timeline-marker.edge-left{transform:translateX(-6%)}
.timeline-marker.edge-right{transform:translateX(-94%)}
.timeline-marker b{display:block;font-size:10px;font-weight:600;background:var(--forest);color:#fff;padding:2px 7px;border-radius:3px;white-space:nowrap}
.timeline-marker::after{content:'';display:block;width:2px;height:10px;background:var(--forest);margin:0 auto}
.timeline-marker.edge-left::after{margin-left:6%}
.timeline-marker.edge-right::after{margin-right:6%}

/* Providers, pool and farmer */
.actors{max-height:214px;margin:2px auto 0}
.actors .route{fill:none;stroke:#dde3d6;stroke-width:2;stroke-dasharray:4 5;transition:stroke .3s}
.actors .route.active{stroke:#a3b594}
.actors .node rect{fill:#fff;stroke:#d5ddcc;stroke-width:1.2;transition:fill .5s,stroke .5s}
.actors .node.on rect{fill:#eef3e6;stroke:#a3b594}
.actors .pool rect{fill:#f6f8f1}
.actors .pool.on rect{fill:#e6eedb;stroke:#8fa77d}
.actors .name{font-size:9.5px;letter-spacing:1.2px;font-weight:600;fill:#6f7d66}
.actors .value{font-size:15px;fill:#263a30;font-variant-numeric:tabular-nums}
.actors .value.lock.held{fill:#8a6a35;font-weight:600}
.actors .big{font-family:Georgia,serif;font-size:27px;fill:#263a30;font-variant-numeric:tabular-nums}
.actors .small{font-size:10.5px;fill:#7d8a73}
.actors .divider{stroke:#d5ddcc}
.flow-dot{fill:#bd9b61;stroke:#fff;stroke-width:1}
.flow-label{font-size:12.5px;font-weight:650;fill:#36583f;paint-order:stroke;stroke:#fff;stroke-width:4px;animation:story-float 2.3s ease-out both}
@keyframes story-float{0%{opacity:0;transform:translateY(6px)}12%,72%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-8px)}}

.story-steps{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:11.5px;color:#8a967f}
.story-steps li::before{content:'○';margin-right:6px}
.story-steps li.done{color:var(--forest)}
.story-steps li.done::before{content:'✓'}
.story-steps li.next{color:var(--ink);font-weight:600}
.story-steps li.next::before{content:'→'}
.terms-line{font-size:11.5px;color:#5d6c54;margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* Rainfall finalized */
.rain-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.05fr) minmax(0,1.05fr);gap:20px;align-items:start}
.index-card{margin:0;display:grid;gap:7px;background:#f4f6ef;border-radius:var(--radius);padding:12px 14px}
.index-card div{display:grid;gap:1px}
.index-card dt{font-size:9.5px;color:var(--muted)}
.index-card dd{margin:0;font-size:12px;line-height:1.45}
.gauge{max-height:236px}
.gauge .gauge-frame{fill:#fafbf7;stroke:#cfd8c4;stroke-dasharray:3 4}
.gauge .gauge-part{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);opacity:0;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .2s;transition-delay:var(--d,0s)}
.gauge.filled .gauge-part{transform:none;opacity:1}
.gauge-seg.s0{fill:#bd9b61}.gauge-seg.s1{fill:#c9a873}.gauge-seg.s2{fill:#d4b787}.gauge-seg.s3{fill:#dfc79d}
.gauge .gauge-label{font-size:10.5px;fill:#6f5a33}
.gauge .gauge-total{font-family:Georgia,serif;font-size:17px;fill:#263a30;opacity:0;transition:opacity .4s 1.4s}
.gauge.filled .gauge-total{opacity:1}
.gauge .gauge-wait{font-size:10.5px;fill:#a0ab95;transition:opacity .2s}
.gauge.filled .gauge-wait{opacity:0}
.gauge .baseline,.mini .baseline{stroke:#c7d0bc}
.oracle{min-width:0}
.pipeline{list-style:none;padding:0;margin:0 0 8px;position:relative}
.pipeline li{display:flex;gap:11px;padding:0 0 13px;position:relative;color:#8a967f}
.pipeline li:not(:last-child)::after{content:'';position:absolute;left:6px;top:15px;bottom:-1px;width:2px;background:#e1e7d8}
.pipeline li>span{flex:none;width:14px;height:14px;border-radius:50%;border:2px solid #cfd8c4;background:#fff;margin-top:2px;transition:background .4s,border-color .4s}
.pipeline strong{display:block;font-size:13px;font-weight:550}
.pipeline small{display:block;font-size:11px;line-height:1.45}
.pipeline li.done{color:var(--ink)}
.pipeline li.done>span{background:var(--forest);border-color:var(--forest)}
.pipeline li.done:not(:last-child)::after{background:var(--sage)}
.pipeline li.active{color:var(--ink)}
.pipeline li.active>span{border-color:#bd9b61;background:#f6efde;animation:story-pulse 1.6s ease-in-out infinite}
@keyframes story-pulse{50%{box-shadow:0 0 0 5px #bd9b6133}}
.branch{font-size:11px;line-height:1.55;color:#8a967f;border:1px dashed #cfd8c4;border-radius:6px;padding:8px 10px;margin:0}
.branch strong{color:#5d6c54;font-weight:550}

/* Payout or release */
.outcomes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:4px}
.outcome{border:1px solid var(--line);border-radius:var(--radius);padding:11px 14px;transition:opacity .4s,border-color .4s,background .4s}
.outcome .eyebrow{color:var(--muted);font-size:8.5px}
.outcome strong{display:block;font-size:14px;font-weight:550;margin:4px 0 3px}
.outcome p{font-size:11.5px;color:#5d6c54;margin:0;line-height:1.5}
.outcome.taken{border-color:var(--forest);background:#f1f5ea}
.outcome.paid strong{color:var(--forest)}
.outcome.not-taken{opacity:.5}
.payout-actors{max-height:200px}
.equation{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 12px;margin:6px 0 0;animation:story-fade .5s ease-out}
.equation div{text-align:center;min-width:72px}
.equation strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:20px;font-variant-numeric:tabular-nums}
.equation span{display:block;font-size:9.5px;color:var(--muted)}
.equation b{font-size:16px;font-weight:400;color:var(--muted)}
.equation .result strong{color:var(--forest)}

/* All in one */
.whole-controls{position:absolute;top:18px;right:22px;display:flex;align-items:center;gap:14px}
.whole-controls .button{gap:10px}
.whole{display:grid;grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);align-items:stretch;margin-top:4px}
.whole-card{border:1px solid var(--line);border-radius:var(--radius);padding:13px 12px 12px;background:#fff;opacity:.45;transition:opacity .45s,border-color .45s,background .45s,transform .45s;min-width:0}
.whole-card[data-state=done]{opacity:1}
.whole-card[data-state=active]{opacity:1;border-color:var(--forest);background:#f1f5ea;transform:translateY(-4px)}
.whole-num{font-size:9px;font-weight:600;letter-spacing:1px;color:var(--muted)}
.whole-card h4{font-size:12px;font-weight:600;margin:4px 0 10px;line-height:1.3}
.whole-viz{height:52px;margin-bottom:10px;position:relative;display:flex;align-items:flex-end}
.whole-card strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:18px;white-space:nowrap;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.whole-card small{display:block;font-size:10px;color:var(--muted);margin-top:3px;line-height:1.45}
.whole .mini{width:100%;height:52px;display:block;overflow:visible}
.whole .mini .bar{fill:#91a780}
.whole .mini .bar.low{fill:#bd9b61}
.whole .premium-bar.small{width:100%;height:16px;margin:0 0 4px}
.mini-pool{width:100%;height:16px;background:#e5eadc;border-radius:3px;overflow:hidden;margin-bottom:4px}
.mini-pool i{display:block;height:100%;width:0;background:var(--sage);transition:width .9s cubic-bezier(.3,.7,.2,1)}
.mini-lock{position:absolute;left:0;top:6px;font-size:10px;font-weight:600;color:#8a6a35}
.mini-gauge .gauge-frame{fill:#fafbf7;stroke:#cfd8c4;stroke-dasharray:3 3}
.mini-gauge .mini-fill{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.mini-gauge.filled .mini-fill{transform:none}
.mini-gauge .trigger{stroke:#ac8144;stroke-width:1.5;stroke-dasharray:4 3}
.pay-badge{font-size:12px;font-weight:600;color:#8a967f;border:1px dashed #cfd8c4;border-radius:20px;padding:5px 12px;margin-bottom:6px;min-height:28px;min-width:60px;text-align:center;transition:background .4s,color .4s}
.pay-badge:empty{visibility:hidden}
.pay-badge.on{background:var(--forest);color:#fff;border:1px solid var(--forest)}
.whole-link{position:relative;align-self:center;height:2px;margin:0 3px;background:var(--line);transition:background .4s}
.whole-link::after{content:'';position:absolute;right:-2px;top:-4px;border:5px solid transparent;border-left-color:inherit;border-left:6px solid #d5ddcc;border-right:0}
.whole-link.lit{background:var(--sage)}
.whole-link.lit::after{border-left-color:var(--sage)}
.whole-link i{position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:#bd9b61;opacity:0}
.whole-link.run i{animation:story-run .8s ease-in-out}
@keyframes story-run{0%{left:0;opacity:1}100%{left:calc(100% - 8px);opacity:1}}

/* Presentation mode: the story alone, for screen recordings. */
html.story-present .sidebar,html.story-present .topbar,html.story-present footer{display:none!important}
html.story-present[data-cropguard-mode] body #page-operations>:not(#season-story){display:none!important}
html.story-present .layout{grid-template-columns:minmax(0,1fr)}
html.story-present main{padding:12px 30px 16px;max-width:none}

@media (max-width:1180px){
  .story-body{grid-template-columns:minmax(0,1fr)}
  .story-ledger{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
  .ledger-row,.ledger-clock{border-bottom:0}
  .rain-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rain-grid .oracle{grid-column:1/-1}
}
@media (max-width:820px){
  .story-head{flex-direction:column;align-items:flex-start}
  .story-rail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stage-grid,.pricing-wait,.outcomes,.rain-grid{grid-template-columns:minmax(0,1fr)}
  .story-ledger{grid-template-columns:repeat(2,minmax(0,1fr))}
  .whole{grid-template-columns:minmax(0,1fr)}
  .whole-link{height:16px;width:2px;justify-self:center;margin:2px 0}
  .whole-link::after,.whole-link i{display:none}
  .story-stage{padding:16px 14px;min-height:0}
  .story-caption{font-size:15px}
  .timeline-seg span{display:none}
  .timeline{margin-bottom:14px}
  .story-bottom{flex-direction:column;align-items:stretch;gap:10px}
  .story-controls .button{flex:1 1 auto}
  .whole-controls{position:static;margin:0 0 12px;flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  #season-story *,#season-story *::before,#season-story *::after{animation:none!important;transition:none!important}
}