/* Rolling-origin evaluation sheet (js/rolling.js). Tokens from fw.css; cell colours from paper Figure 2. */
.rg{--rg-base:#D3D9DC;--rg-train:#C7E1D9;--rg-unused:#EFF2F3;--rg-hatch:#F1F3F4;--rg-avail:#DCEBE1;
  --rg-lw:98px;--rg-nw:50px;--rg-ch:35px;--rg-crop:#E3A33B;--rg-crop-ink:#8F6212;--rg-crop-tint:#F8E8CE}
.rg-still *,.rg-still *::before,.rg-still *::after{transition:none!important}
.rg-panes{display:grid;grid-template-columns:minmax(0,38fr) minmax(0,62fr);gap:40px;align-items:start}
@media(max-width:979.98px){.rg-panes{grid-template-columns:minmax(0,1fr);gap:44px}}
.rg-h{margin:0;font:700 18px/1.2 var(--display);letter-spacing:-.012em;color:var(--ink)}
.rg .foot{margin-top:22px}

/* ---- fields ---- */
.rg-left{min-width:0}
.rg-meta{margin:8px 0 20px;font:400 12.5px/1.4 var(--num);color:var(--label)}
.rg-meta b{font-weight:500;color:var(--ink)}
.rg-meta>span{white-space:nowrap}
@media(max-width:420px){.rg-meta{font-size:11.5px}}
.rg-mapbox{position:relative}
.rg-ftl{position:relative;height:19px}
.rg-ftl span{position:absolute;top:0;text-align:center;font:700 12.5px/1 var(--display);letter-spacing:-.005em;color:var(--ink)}
.rg-map{width:100%;height:auto;overflow:visible;shape-rendering:geometricPrecision}
.rg-map text{text-rendering:geometricPrecision}   /* lay text out in user units, so a moving camera cannot leave it stale */
.rg-frb{fill:none;stroke:rgba(26,34,48,.11);stroke-width:.24}
.rg-cl{fill:#56606B;font-family:var(--sans);font-weight:500;letter-spacing:.16em;pointer-events:none}
.rg-sl{fill:var(--body);font-family:var(--num);pointer-events:none}
.rg-sb{fill:none;stroke:var(--ink);stroke-width:.26;stroke-linecap:round;opacity:.78}
.rg-dot{stroke:#fff;stroke-width:.3;opacity:.9;cursor:default;transform-box:fill-box;transform-origin:center;transform:scale(0);
  transition:transform .65s var(--spring),opacity .35s var(--ease);transition-delay:var(--d),0s}
.rg-map.in .rg-dot{transform:none}
.rg-map.settled .rg-dot{transition-delay:0s}
.rg-map[data-focus=corn] .rg-dot:not([data-crop=corn]),
.rg-map[data-focus=soybean] .rg-dot:not([data-crop=soybean]),
.rg-map[data-focus=wheat] .rg-dot:not([data-crop=wheat]){opacity:.12}
.rg-hot{pointer-events:none;stroke:#fff;stroke-width:.42;opacity:0;transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 .5px 1.1px rgba(26,34,48,.38))}
.rg-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.rg-chips .chip{gap:7px;padding:0 12px 0 11px}
.rg-key{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:14px;font:400 12px/1 var(--num);color:var(--label)}
.rg-key>span:first-child{margin-right:2px;font:400 12.5px/1.2 var(--sans)}
.rg-key .ks{display:inline-flex;align-items:center;gap:14px}
.rg-key .k{display:inline-flex;align-items:center;gap:6px}
.rg-key i{display:inline-block;flex:none;width:calc(var(--r)*var(--k,3.7)*2px);height:calc(var(--r)*var(--k,3.7)*2px);border-radius:50%;background:#B9C0C4}

/* ---- scored forward in time ---- */
.rg-right{min-width:0;container:rgpane/inline-size}
.rg-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 18px}
.rg-lg{font-size:12.5px;gap:6px 16px}
.rg-lg .rg-sw{display:inline-block;width:18px;height:11px;border-radius:3px}
.rg-lg .rg-sw.hatch{background:repeating-linear-gradient(135deg,rgba(145,156,163,.42) 0 1.2px,transparent 1.2px 4px),var(--rg-hatch)}
.rg-lg .rg-sw.unused{background:var(--rg-unused);box-shadow:inset 0 0 0 1px rgba(26,34,48,.06)}
.rg-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:18px 0 28px}
.rg-yrs{display:flex;align-items:center;gap:12px}
.rg-sd{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;vertical-align:1px}
.rg-pills{position:relative;display:inline-flex;padding:4px;border-radius:999px;background:rgba(26,34,48,.065);isolation:isolate}
.rg-pth{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:0;border-radius:999px;background:var(--ink);box-shadow:0 6px 14px -8px rgba(26,34,48,.6);transition:transform .5s var(--ease),width .5s var(--ease)}
.rg-pth .pg{position:absolute;left:12px;right:12px;bottom:-10px;height:2px;border-radius:2px;background:var(--ink);opacity:0;transform:scaleX(var(--p,0));transform-origin:left;transition:opacity .3s}
.rg-auto .rg-pth .pg{opacity:.45}
.rg-pill{position:relative;z-index:1;border:0;background:none;padding:9px 12px;border-radius:999px;font:500 13.5px/14px var(--num);color:var(--mut);cursor:pointer;transition:color .3s var(--ease)}
.rg-pill:hover{color:var(--ink)}
.rg-pill[aria-pressed="true"]{color:#fff;transition-delay:.12s}
.rg-play{display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:border-color .25s,transform .25s var(--ease),box-shadow .25s}
.rg-play:hover{border-color:var(--line-2);transform:translateY(-1px);box-shadow:var(--sh-1)}
.rg-play svg{display:block}

.rg-stage{position:relative}
.rg-grid{position:relative;isolation:isolate;display:grid;grid-template-columns:var(--rg-lw) repeat(8,minmax(0,1fr)) var(--rg-nw);grid-template-rows:26px repeat(4,var(--rg-ch));gap:6px;align-items:center}
.rg-g{grid-column:var(--wc);grid-row:var(--wr)}
.rg-yr{position:relative;z-index:2;text-align:center;font:400 12px/26px var(--num);color:var(--label);transition:color .35s var(--ease)}
.rg-yr.on{color:#fff;font-weight:500;transition-delay:.14s}
.rg-tp{position:absolute;z-index:1;left:0;top:0;height:24px;border-radius:999px;background:var(--ink);box-shadow:0 6px 14px -8px rgba(26,34,48,.55);transition:transform .55s var(--ease)}
.rg-band{position:absolute;z-index:0;left:0;top:0;border-radius:13px;background:rgba(26,34,48,.034);transition:transform .55s var(--ease)}
.rg-lab{font:500 14px/1.25 var(--sans);color:var(--body);white-space:nowrap;transition:color .2s}
.rg-lab.hl{color:var(--ink)}
.rg-yr.hl:not(.on){color:var(--ink)}
.rg-cell{position:relative;z-index:1;height:var(--rg-ch);display:grid;place-items:center;border-radius:7px;background-color:transparent;box-shadow:inset 0 0 0 1px transparent;
  transition:background-color .5s var(--ease),box-shadow .5s var(--ease);transition-delay:var(--d,0ms)}
.rg-cell::after{content:"";position:absolute;inset:-2px;border-radius:9px;box-shadow:0 0 0 1.5px rgba(26,34,48,.22);opacity:0;transition:opacity .18s;pointer-events:none}
.rg-cell:not([data-role=blank]):hover::after{opacity:1}
.rg-cell .hx{position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(135deg,rgba(145,156,163,.36) 0 1.3px,transparent 1.3px 5.5px);opacity:0;transition:opacity .45s var(--ease);transition-delay:var(--d,0ms)}
.rg-cell .lb{position:relative;font:600 12px/1 var(--display);letter-spacing:.01em;color:var(--teal-d);white-space:nowrap;transition:color .5s var(--ease);transition-delay:var(--d,0ms)}
.rg-cell .lk{position:absolute;width:15px;height:15px;color:#8C959C;opacity:0;transform:scale(.4);transition:opacity .3s var(--ease),transform .55s var(--spring);transition-delay:var(--d,0ms)}
.rg-cell[data-role=base]{background-color:var(--rg-base);box-shadow:inset 0 0 0 1px rgba(26,34,48,.03)}
.rg-cell[data-role=lock]{background-color:#fff;box-shadow:inset 0 0 0 1.5px var(--rg-base)}
.rg-cell[data-role=lock] .lk{opacity:1;transform:none}
.rg-cell[data-role=donor]{background-color:var(--rg-tint);box-shadow:inset 0 0 0 1px rgba(26,34,48,.03)}
.rg-cell[data-role=fit],.rg-cell[data-role=refit]{background-color:var(--rg-train);box-shadow:inset 0 0 0 1px rgba(26,34,48,.03)}
.rg-cell[data-role=validate]{background-color:#fff;box-shadow:inset 0 0 0 1.5px var(--teal)}
.rg-cell[data-role=score]{background-color:var(--teal);box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.rg-cell[data-role=score] .lb{color:#fff}
.rg-cell[data-role=unused]{background-color:var(--rg-unused)}
.rg-cell[data-role=hatch]{background-color:var(--rg-hatch)}
.rg-cell[data-role=hatch] .hx{opacity:1}
.rg-note{justify-self:start;display:flex;flex-direction:column;gap:2px;font:400 11px/1.2 var(--num);color:var(--label);white-space:nowrap}
.rg-note b{font:500 12.5px/1.2 var(--num);color:var(--ink)}

.rg-bars{--rg-bh:62px;position:relative;display:grid;grid-template-columns:var(--rg-lw) repeat(8,minmax(0,1fr)) var(--rg-nw);column-gap:6px;align-items:end;margin-top:26px}
.rg-bl{grid-column:var(--wc);grid-row:var(--wr);align-self:end;padding-bottom:1px}
.rg-bl span{display:block;font:500 14px/1.25 var(--sans);color:var(--ink)}
.rg-bl b{display:block;margin-top:6px;font:500 28px/1 var(--num);letter-spacing:-.035em;color:var(--rg-crop-ink);transition:color .4s var(--ease)}
.rg-bline{grid-column:2/10;grid-row:1;align-self:end;height:1px;background:var(--hair-2)}
.rg-bar{position:relative;z-index:1;grid-column:var(--wc);grid-row:var(--wr);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:calc(var(--rg-bh) + 22px);cursor:pointer}
.rg-bar .n{margin-bottom:5px;font:400 12px/16px var(--num);color:var(--label);transition:color .3s}
.rg-bar .b{display:block;width:min(30px,64%);height:calc(var(--h,0)*var(--rg-bh));min-height:2px;border-radius:6px 6px 1.5px 1.5px;background:var(--rg-crop-tint);transition:height .8s var(--ease),background-color .45s var(--ease),filter .2s}
.rg-bar:hover .b{filter:brightness(.95)}
.rg-bar.on .b{background:var(--rg-crop)}
.rg-bar.on .n{color:var(--ink);font-weight:500}
.rg-bar .yr{display:none}

@container rgpane (max-width:299.98px){
  .rg-seg.seg button{padding:9px 11px}
  .rg-pill{padding:9px 9px}
  .rg-play{width:38px;height:38px}
  .rg-yrs,.rg-ctrl{gap:10px}
}
/* narrower pane: row labels above their cells */
@container rgpane (min-width:420px) and (max-width:599.98px){
  .rg-grid{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:26px repeat(4,auto var(--rg-ch));row-gap:5px}
  .rg-g{grid-column:var(--mc);grid-row:var(--mr)}
  .rg-lab{margin-top:9px;font-size:13px}
  .rg-note{justify-self:end;flex-direction:row;align-items:baseline;gap:5px;margin-top:9px;padding:0}
  .rg-bars{grid-template-columns:repeat(8,minmax(0,1fr))}
  .rg-bl{grid-column:var(--mc);grid-row:var(--mr);display:flex;align-items:baseline;gap:10px;padding-bottom:9px}
  .rg-bl b{margin:0;font-size:22px}
  .rg-bline{grid-column:1/-1}
  .rg-bar{grid-column:var(--mc);grid-row:var(--mr)}
}
/* phone: years run down, components across */
@container rgpane (max-width:419.98px){
  .rg-grid{grid-template-columns:40px repeat(4,minmax(0,1fr));grid-template-rows:auto repeat(8,30px) auto;gap:5px}
  .rg-g{grid-column:var(--tc);grid-row:var(--tr)}
  .rg-lab{align-self:end;padding-bottom:4px;font-size:12px;line-height:1.2;white-space:normal;text-align:center}
  .rg-cell{height:30px}
  .rg-note{justify-self:center;flex-direction:row;align-items:baseline;gap:4px;padding:2px 0 0}
  .rg-bars{--rg-bh:48px;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:10px;margin-top:22px}
  .rg-bl{grid-column:var(--tc);grid-row:var(--tr);display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
  .rg-bl b{margin:0;font-size:22px}
  .rg-bline{display:none}
  .rg-bar{grid-column:var(--tc);grid-row:var(--tr);height:auto}
  .rg-bar .yr{display:block;width:100%;margin-top:0;padding-top:6px;border-top:1px solid var(--hair-2);text-align:center;font:400 11.5px/14px var(--num);color:var(--label)}
  .rg-bar.on .yr{color:var(--ink);font-weight:500}
}

/* ---- information cutoff ---- */
.rg-cut{margin-top:36px;padding-top:30px;border-top:1px solid var(--hair)}
.rg-strip{--ty:43px;position:relative;height:102px;margin-top:14px;border-radius:16px;background:#F1F3F4;overflow:hidden;cursor:pointer;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.rg-av{position:absolute;inset:0;background:var(--rg-avail);clip-path:inset(0 100% 0 0);transition:clip-path .55s var(--ease)}
.rg-trk{position:absolute;top:calc(var(--ty) - 3px);height:6px;border-radius:3px;background:linear-gradient(90deg,#E6E1CE,#D9CCAA)}
.rg-trk i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(90deg,#B3D69A,#4E9A55);clip-path:inset(0 100% 0 0 round 3px);transition:clip-path .55s var(--ease)}
.rg-arw{position:absolute;top:calc(var(--ty) - 6px);width:0;height:0;border-left:10px solid #D9CCAA;border-top:6px solid transparent;border-bottom:6px solid transparent}
.rg-pt{position:absolute;top:var(--ty);border-radius:50%;transform:translate(-50%,-50%)}
.rg-pt.sow{width:11px;height:11px;background:#5E9E4F;box-shadow:0 0 0 2px #fff}
.rg-pt.hv{width:14px;height:14px;background:#EFE3BF;box-shadow:0 0 0 2px #fff,inset 0 0 0 1px rgba(160,128,60,.22)}
.rg-gly{position:absolute;transform:translateX(-50%);pointer-events:none}
.rg-gly svg{display:block;width:100%;height:100%}
.rg-gly.sprout{top:calc(var(--ty) - 34px);width:23px;height:25px}
.rg-gly.grain{top:calc(var(--ty) - 39px);width:18px;height:27px}
.rg-tau{position:absolute;top:var(--ty);width:11px;height:11px;border-radius:2px;background:#E2DBC2;box-shadow:0 0 0 1.5px #fff;transform:translate(-50%,-50%) rotate(45deg);transition:background-color .3s var(--ease)}
.rg-tau.on{background:#5E9E4F}
.rg-tl{position:absolute;top:calc(var(--ty) + 17px);transform:translateX(-50%);font:600 12.5px/1 var(--display);color:#98A1A7;transition:color .3s var(--ease)}
.rg-tl.on{color:var(--teal-d)}
.rg-tl.at{color:var(--ink)}
.rg-cg{position:absolute;left:0;top:0;bottom:0;width:0;transition:transform .55s var(--ease)}
.rg-cg .up,.rg-cg .dn{position:absolute;left:-.75px;width:1.5px;background:repeating-linear-gradient(180deg,var(--ink) 0 3px,transparent 3px 6px);opacity:.8}
.rg-cg .up{top:10px;height:calc(var(--ty) - 25px)}
.rg-cg .dn{top:calc(var(--ty) + 35px);bottom:10px}
.rg-knob{position:absolute;left:-12px;top:calc(var(--ty) - 12px);width:24px;height:24px;border-radius:50%;border:2px solid var(--ink);background:rgba(255,255,255,.3);box-shadow:0 0 0 3px rgba(255,255,255,.8),0 5px 12px -5px rgba(26,34,48,.55);cursor:grab;transition:transform .35s var(--spring)}
.rg-strip:hover .rg-knob{transform:scale(1.08)}
.rg-strip.drag .rg-knob{transform:scale(1.14);cursor:grabbing}
.rg-knob:focus-visible{outline:2px solid var(--teal);outline-offset:4px;border-radius:50%}
.rg-rl{position:absolute;left:0;bottom:11px;font:500 13px/1 var(--sans);white-space:nowrap;transition:transform .55s var(--ease)}
.rg-rl.av{font-weight:700;color:#256B41}
.rg-rl.ny{color:var(--mut)}
.rg-strip.narrow .rg-rl{font-size:12.5px}

@media(prefers-reduced-motion:reduce){.rg *,.rg *::before,.rg *::after{transition-delay:0s!important}}

/* deck: spotlight one part of the evaluation plan */
.rg .rg-cell,.rg .rg-lab{transition:opacity .5s var(--ease),filter .5s var(--ease)}
.rg[data-focus="base"] .rg-cell:not([data-row="base"]),.rg[data-focus="base"] .rg-lab:not([data-row="base"]),
.rg[data-focus="donor"] .rg-cell:not([data-row="donor"]),.rg[data-focus="donor"] .rg-lab:not([data-row="donor"]),
.rg[data-focus="router"] .rg-cell[data-row="base"],.rg[data-focus="router"] .rg-cell[data-row="donor"],
.rg[data-focus="router"] .rg-lab[data-row="base"],.rg[data-focus="router"] .rg-lab[data-row="donor"]{opacity:.4;filter:saturate(.45)}

/* full season: the last stop sits on harvest and fills the whole track */
.rg-tau.full{display:none}
.rg-tl.full{font-weight:700}
.rg-pt.hv{transition:background-color .4s var(--ease),box-shadow .4s var(--ease)}
.rg[data-cut="5"] .rg-pt.hv{background:#4E9A55;box-shadow:0 0 0 2px #fff,0 0 0 7px rgba(78,154,85,.22)}
.rg-rl.ny{transition:transform .55s var(--ease),opacity .3s var(--ease)}
.rg[data-cut="5"] .rg-rl.ny{opacity:0}
.rg-arw{transition:border-left-color .4s var(--ease)}
.rg[data-cut="5"] .rg-arw{border-left-color:#4E9A55}

/* deck spotlight: the focused row takes its full colour, so switching rows reads at a glance */
.rg[data-focus="base"] .rg-cell[data-row="base"][data-role="base"]{background-color:#A7B1B8}
.rg[data-focus="base"] .rg-cell[data-row="base"][data-role="lock"]{box-shadow:inset 0 0 0 2px #7F8B93}
.rg[data-focus="base"] .rg-cell[data-row="base"] .lk{color:#56626B}
.rg[data-focus="donor"] .rg-cell[data-row="donor"][data-role="donor"]{background-color:color-mix(in srgb,var(--rg-crop) 60%,#fff)}
.rg[data-focus="router"] .rg-cell:is([data-role="fit"],[data-role="refit"]){background-color:#9CCFBF}
.rg[data-focus="base"] .rg-lab[data-row="base"],.rg[data-focus="donor"] .rg-lab[data-row="donor"],
.rg[data-focus="router"] .rg-lab:is([data-row="tune"],[data-row="final"]){color:var(--ink);font-weight:600}
.rg[data-focus="router"] .rg-cell:is([data-role="fit"],[data-role="refit"]) .lb{color:#0F4A46}
.rg:is([data-focus="base"],[data-focus="router"]) .rg-note{opacity:.4;filter:saturate(.45);transition:opacity .5s var(--ease)}

/* ripening: the available area and the track go from green to gold as the season matures */
.rg-av{background:linear-gradient(90deg,var(--rg-avail) var(--x0,64px),#E8EFD2 calc(var(--x0,64px) + (var(--x1,600px) - var(--x0,64px)) * .55),#F6EEC2 var(--x1,600px),#F3E4A8 100%)}
.rg-trk i{background:linear-gradient(90deg,#8CC26B 0%,#5FA653 30%,#A9B83F 62%,#E0B92E 100%)}
.rg-tau.on{background:var(--c,#5E9E4F)}
.rg[data-cut="5"] .rg-pt.hv{background:#E0B92E;box-shadow:0 0 0 2px #fff,0 0 0 7px rgba(224,185,46,.3)}
.rg[data-cut="5"] .rg-arw{border-left-color:#E0B92E}
.rg-tl.full.on{color:#7A5C0B}
/* full season: the track runs on to harvest, still ripening from green to gold, and the ripe area sweeps on over the rest of the strip */
/* at harvest nothing is held back any more: the dashed cutoff line steps back, the knob stays on Full */
.rg-cg :is(.up,.dn){transition:opacity .4s var(--ease)}
.rg[data-cut="5"] .rg-cg :is(.up,.dn){opacity:0}
