/* The Maple Economist */
.tape{overflow:hidden;padding:0;border-radius:14px;margin-bottom:16px;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tape-track{display:flex;width:max-content;animation:tape 160s linear infinite}
.tape:hover .tape-track{animation-play-state:paused}
@keyframes tape{to{transform:translateX(-50%)}}
.tk{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-right:1px solid rgba(255,255,255,.06);white-space:nowrap;font-size:.8rem;transition:background .6s var(--ease-ui)}
.tk i{width:22px;height:22px;background:center/contain no-repeat;image-rendering:pixelated}
.tk b{font-weight:600;color:var(--text)}
.tk em{font-style:normal;font-family:var(--num);color:var(--text-2)}
.tk u{text-decoration:none;font-family:var(--num);font-weight:700}
.tk.up u{color:#3ed598}.tk.dn u{color:#ff6b6b}
.tk.flash{animation:tkflash 1.4s var(--ease-ui)}
@keyframes tkflash{0%{background:rgba(255,200,87,.22)}100%{background:transparent}}

.eco-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.eco-grid>*{min-width:0}
.eco-card{padding:20px 22px;display:flex;flex-direction:column;gap:12px}
.eco-card.mood{grid-column:span 4}.eco-card.wage{grid-column:span 8}
.eco-card.forge{grid-column:span 7}.eco-card.tm{grid-column:span 5}
.eco-card.alm{grid-column:span 7}.eco-card.gini{grid-column:span 5}
.eco-card.cls{grid-column:span 8}.eco-card.tot{grid-column:span 4}
.eco-card header small{display:block;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.eco-card header h3{font-size:1.25rem;margin-top:3px}
.eco-card h4{margin:6px 0 0;font-size:.82rem;font-weight:600;color:var(--text-2)}
.eco-card h4 small{color:var(--text-3);font-weight:500}
.eco-note{margin:auto 0 0;font-size:.8rem;line-height:1.55;color:var(--text-2)}
.eco-note b{color:var(--text)}
.eco-big{margin:0;font-size:.95rem;color:var(--text-2);line-height:1.4}
.eco-big b{font-family:var(--num);font-size:1.9rem;font-weight:800;color:var(--gold);margin-right:4px}
.up{color:#3ed598}.dn{color:#ff6b6b}
.g-lbl{font-size:10px;fill:var(--text-2);font-family:var(--font)}

/* entrance */
.js-scene .eco-card,.eco-card{transition:opacity .7s var(--ease),transform .7s var(--ease)}
html.js-data .eco-card:not(.in){opacity:0;transform:translateY(18px)}

/* mood */
.gauge-wrap{position:relative;max-width:260px;margin:0 auto;width:100%}
.gauge{width:100%;display:block}
.needle{transition:transform 1.6s cubic-bezier(.3,1.4,.4,1)}
.gauge-read{display:flex;flex-direction:column;align-items:center;margin-top:-4px}
.gauge-read b{font-family:var(--num);font-size:2.4rem;font-weight:800;line-height:1;transition:color .6s}
.gauge-read span{font-size:.78rem;color:var(--text-2)}
.fg-parts{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.fg-parts div{display:grid;grid-template-columns:96px 1fr 28px;gap:8px;align-items:center;font-size:.76rem;color:var(--text-2)}
.fg-parts i{height:6px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.fg-parts i b{display:block;height:100%;border-radius:9px;transition:width 1s var(--ease)}
.fg-parts em{font-style:normal;font-family:var(--num);text-align:right;color:var(--text)}
.fg-strip{display:flex;gap:3px}
.fg-strip button{position:relative;flex:1;height:22px;border:0;border-radius:4px;background:var(--c);opacity:.55;cursor:pointer;padding:0;transition:opacity .2s,transform .2s}
.fg-strip button:hover{opacity:.85}
.fg-strip button.on{opacity:1;transform:scaleY(1.25);box-shadow:0 0 0 2px #fff}

/* wage */
.wage-top{display:flex;align-items:center;gap:16px}
.wage-mob{width:84px;height:84px;flex:none;display:grid;place-items:center;border-radius:18px;background:radial-gradient(circle at 50% 70%,rgba(255,255,255,.12),rgba(255,255,255,.02))}
.wage-mob img{max-width:76px;max-height:76px;image-rendering:pixelated}
.wage-pay small{font-size:.8rem;color:var(--text-2)}
.wage-pay small b{color:var(--gold)}
.wage-pay strong{display:flex;align-items:center;gap:8px;font-family:var(--num);font-weight:800;font-size:2.3rem;line-height:1.1}
.wage-pay strong em{font-style:normal;font-size:1rem;color:var(--text-3);font-weight:600}
.wage-usd{font-size:.86rem;color:var(--text-2)}.wage-usd b{color:var(--mint);font-family:var(--num)}
#wg-slider{width:100%;accent-color:var(--gold);cursor:pointer}
.wage-min small{font-size:.72rem;color:var(--text-2)}
.wm-bar{position:relative;height:10px;border-radius:9px;background:rgba(255,255,255,.08);margin-bottom:4px}
.wm-bar i{position:absolute;inset:0 auto 0 0;border-radius:9px;background:linear-gradient(90deg,var(--mint),#9be37c);transition:width .6s var(--ease)}
.wm-line{position:absolute;left:80%;top:-4px;bottom:-4px;width:2px;background:var(--gold);box-shadow:0 0 8px var(--gold)}
.grind{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.grind li{display:grid;grid-template-columns:26px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.04)}
.grind i{grid-row:1/3;width:24px;height:24px;background:center/contain no-repeat;image-rendering:pixelated}
.grind li.nx i{width:18px;height:18px;margin:3px}
.grind span{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grind b{font-family:var(--num);font-size:.95rem;text-align:right}
.grind small{grid-column:2/4;font-size:.68rem;color:var(--text-2)}
.grind small.up{color:#ff8a5b}.grind small.dn{color:#3ed598}

/* forge */
.forge-pick{display:flex;align-items:center;gap:10px}
.forge-ic{width:40px;height:40px;flex:none;border-radius:10px;background:rgba(255,255,255,.07) center/30px no-repeat;image-rendering:pixelated}
.forge-pick select{flex:1;min-width:0;font:inherit;font-size:.9rem;color:var(--text);background:rgba(255,255,255,.06);border:1px solid var(--glass-line);border-radius:10px;padding:9px 10px}
.forge-pick select option{background:#14213a}
.forge-rows{display:flex;flex-direction:column;gap:6px}
.fr-head{display:grid;grid-template-columns:44px 1fr 86px;gap:10px;font-size:.68rem;color:var(--text-2);text-transform:uppercase;letter-spacing:.06em}
.sw{display:inline-block;width:8px;height:8px;border-radius:2px;vertical-align:middle;margin:0 2px}
.sw.buy{background:var(--gold)}.sw.fg{background:#b98cff}
.fr{display:grid;grid-template-columns:44px 1fr 86px;gap:10px;align-items:center}
.fr .pl{font-family:var(--num);font-size:1.1rem;color:var(--text)}
.fr .bars{display:flex;flex-direction:column;gap:3px}
.fr .bars i{position:relative;height:17px;width:var(--w);min-width:46px;border-radius:5px;transition:width .7s var(--ease)}
.fr .bars i.buy{background:linear-gradient(90deg,rgba(255,200,87,.85),var(--gold-2))}
.fr .bars i.fg{background:linear-gradient(90deg,rgba(185,140,255,.8),#8a5cf0)}
.fr .bars em{position:absolute;left:6px;top:50%;transform:translateY(-50%);font-style:normal;font-family:var(--num);font-size:.68rem;font-weight:700;color:#1a1204;white-space:nowrap}
.fr .bars i.fg em{color:#fff}
.vd{display:flex;flex-direction:column;align-items:center;padding:4px 6px;border-radius:9px;font-weight:700;font-size:.82rem}
.vd.buy{background:rgba(255,200,87,.15);color:var(--gold)}.vd.fg{background:rgba(185,140,255,.16);color:#cdb2ff}
.vd small{font-weight:500;font-size:.64rem;color:var(--text-2)}
.fr-foot{font-size:.7rem;color:var(--text-2)}

/* time machine */
.tm .search{flex:none;max-width:none;height:40px;display:flex;align-items:center;gap:8px;padding:0 12px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid var(--glass-line)}
.tm .search svg{width:16px;height:16px;color:var(--text-3)}
.tm .search input{flex:1;min-width:0;border:0;background:none;color:var(--text);font:inherit;font-size:.9rem;outline:none}
.tm-res{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center}
.tm-ic{width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.07) center/32px no-repeat;image-rendering:pixelated}
.tm-res b{display:block;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-res small{font-size:.72rem;color:var(--text-2)}
.tm-res strong{font-family:var(--num);font-weight:800;font-size:2rem}
.tm-spark{width:100%;height:70px}
.tm-spark .l{fill:none;stroke-width:2.2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.2s var(--ease) forwards}
.tm-spark .l.up{stroke:#3ed598}.tm-spark .l.dn{stroke:#ff6b6b}
.tm-spark .a.up{fill:rgba(62,213,152,.12)}.tm-spark .a.dn{fill:rgba(255,107,107,.12)}
@keyframes draw{to{stroke-dashoffset:0}}
.tm-vs{font-size:.8rem;color:var(--text-2);line-height:1.5}.tm-vs b{color:var(--text)}
.tm-top{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tm-top ol{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}
.tm-top li{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:6px;align-items:center;font-size:.74rem;padding:4px 6px;border-radius:7px;cursor:pointer}
.tm-top li:hover{background:rgba(255,255,255,.06)}
.tm-top li i{width:18px;height:18px;background:center/contain no-repeat;image-rendering:pixelated}
.tm-top li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-top li b{font-family:var(--num)}

/* almanac */
.alm-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.alm-kpis div{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05)}
.alm-kpis b{display:block;font-family:var(--num);font-size:1.45rem;font-weight:800;color:var(--gold)}
.alm-kpis small{font-size:.72rem;color:var(--text-2)}
.alm-curve{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;align-items:end;height:130px}
.alm-curve div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.alm-curve i{width:70%;height:var(--h);min-height:6px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,rgba(255,138,91,.85),rgba(255,138,91,.35));transform-origin:bottom;transition:transform .8s var(--ease)}
.alm-curve .best i{background:linear-gradient(180deg,#5ee0b0,rgba(94,224,176,.35));box-shadow:0 0 18px rgba(94,224,176,.35)}
.alm-curve b{font-family:var(--num);font-size:.8rem;order:-1}
.alm-curve small{font-size:.66rem;color:var(--text-2);text-align:center}
.clock-wrap{display:flex;align-items:center;gap:18px}
.day-ring{width:170px;height:170px;flex:none}
.ring-read{display:flex;flex-direction:column;gap:2px}
.ring-read small{font-size:.74rem;color:var(--text-2)}
.ring-read b{font-family:var(--num);font-size:1.6rem;font-weight:800}
.ring-read em{font-style:normal;margin-top:6px;font-size:.82rem;color:var(--gold);font-weight:600}

/* gini */
.gini-top{display:flex;align-items:center;gap:14px}
.gini-top b{font-family:var(--num);font-size:2.6rem;font-weight:800;color:var(--gold);line-height:1}
.gini-top span{font-size:.86rem;color:var(--text-2)}.gini-top small{font-size:.7rem;color:var(--text-2)}
.lorenz{width:100%;max-height:200px}
.lorenz .eq{stroke:rgba(255,255,255,.35);stroke-dasharray:4 4;fill:none}
.lorenz .gap{fill:rgba(255,200,87,.16)}
.lorenz .lc{fill:none;stroke:var(--gold);stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:1}
.gini.in .lorenz .lc,html:not(.js-data) .lorenz .lc{animation:draw 1.6s var(--ease) .2s forwards}
.gini-scale{padding:30px 4px 40px}
.gs-bar{position:relative;height:8px;border-radius:9px;background:linear-gradient(90deg,#5ee0b0,#ffd166,#ff5a5a)}
.gs-bar .ref,.gs-bar .me{position:absolute;top:50%;transform:translateX(-50%)}
.gs-bar .ref i{display:block;width:2px;height:16px;margin:-8px auto 0;background:rgba(255,255,255,.6)}
.gs-bar .ref small{position:absolute;top:12px;left:50%;transform:translateX(-50%);font-size:.6rem;color:var(--text-2);white-space:nowrap}
.gs-bar .ref:nth-child(even) small{top:26px}
.gs-bar .me i{display:block;width:14px;height:14px;margin:-7px auto 0;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(255,200,87,.3),0 0 14px var(--gold)}
.gs-bar .me b{position:absolute;bottom:14px;font-size:.8rem!important;left:50%;transform:translateX(-50%);font-size:.7rem;color:var(--gold)}

/* classes */
.cls-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.cl{position:relative;display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06)}
.cl.cheap{border-color:rgba(94,224,176,.45);box-shadow:0 0 22px rgba(94,224,176,.12)}
.cl-ic svg{width:28px;height:28px;fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cl b{font-size:.92rem}
.cl strong{font-family:var(--num);font-size:1.5rem;font-weight:800;color:#ff8a5b}
.cl-sp{width:100%;height:34px}.cl-sp path{fill:none;stroke:rgba(255,200,87,.8);stroke-width:2;vector-effect:non-scaling-stroke}
.cl small{font-size:.66rem;color:var(--text-2);line-height:1.35}
.cl em{position:absolute;top:10px;right:10px;font-style:normal;font-size:.62rem;font-weight:700;color:#0d1726;background:var(--mint);padding:2px 7px;border-radius:999px}

/* terms of trade */
.scale-wrap{display:flex;justify-content:center}
.tot-scale{width:100%;max-width:260px}
.tot-scale .post{stroke:rgba(255,255,255,.55);stroke-width:4;stroke-linecap:round;fill:none}
.tot-scale .str{stroke:rgba(255,255,255,.35);stroke-width:1.4;fill:none}
.tot-scale .dish{fill:rgba(255,200,87,.25);stroke:var(--gold);stroke-width:1.5}
.tot-scale .pl{font-size:9px;font-weight:700;fill:var(--text-2);letter-spacing:.08em}
.tot-scale .beam{transform:rotate(0deg);transition:transform 1.6s cubic-bezier(.3,1.5,.4,1)}
.tot-scale.tilted .beam{transform:rotate(var(--t))}

@media (max-width:1100px){
  .eco-card.mood,.eco-card.wage,.eco-card.forge,.eco-card.tm,.eco-card.alm,.eco-card.gini,.eco-card.cls,.eco-card.tot{grid-column:span 6}
  .eco-card.wage,.eco-card.forge,.eco-card.alm,.eco-card.cls{grid-column:span 12}
  /* half-width cards sit side by side: mood+time machine, gini+terms of trade */
  .eco-card.mood{order:1}.eco-card.tm{order:2}.eco-card.wage{order:3}.eco-card.forge{order:4}
  .eco-card.alm{order:5}.eco-card.gini{order:6}.eco-card.tot{order:7}.eco-card.cls{order:8}
  .eco-card.tm,.eco-card.gini,.eco-card.tot{align-self:stretch}
}
@media (max-width:760px){
  .eco-grid{grid-template-columns:1fr}
  .eco-card.mood,.eco-card.wage,.eco-card.forge,.eco-card.tm,.eco-card.alm,.eco-card.gini,.eco-card.cls,.eco-card.tot{grid-column:1}
  .eco-card{padding:16px}
  .grind{grid-template-columns:1fr}
  .cls-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .clock-wrap{flex-direction:column;align-items:center}
  .ring-read{align-items:center;text-align:center}
  .fr,.fr-head{grid-template-columns:36px 1fr 74px}
  .alm-kpis b{font-size:1.15rem}
  .tk{padding:8px 12px}
}
@media (prefers-reduced-motion:reduce){
  .tape-track{animation:none}.tape{overflow-x:auto}
  .needle,.tot-scale .beam{transition:none}
  .lorenz .lc,.tm-spark .l{stroke-dasharray:none;animation:none}
}

.eco-grid{align-items:start}
.eco-card.mood,.eco-card.wage{align-self:stretch}

/* ---- mobile QA fixes, Nov 2026 ---- */
.fr .bars .fr-tier{display:none}
/* time machine: substring suggestions (same look as the sell advisor's .sl-sug) */
.tm-search{position:relative}
.tm-sug{position:absolute;left:0;right:0;top:46px;z-index:20;list-style:none;margin:0;padding:6px;border-radius:14px;background:rgba(14,24,42,.97);border:1px solid var(--glass-line);box-shadow:0 20px 50px rgba(0,0,0,.45);max-height:380px;overflow:auto}
.tm-sug li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:44px;padding:6px 10px;border-radius:10px;cursor:pointer;font-size:.92rem}
.tm-sug li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-sug li.on,.tm-sug li:hover{background:rgba(255,200,87,.12)}
.tm-sug li i{width:28px;height:28px;background:center/contain no-repeat;image-rendering:pixelated}
.tm-sug li small{color:var(--text-2);font-size:.75rem;font-family:var(--num)}
.tm-sug li small.up{color:#3ed598}.tm-sug li small.dn{color:#ff6b6b}
.tm-sug li.none{display:flex;color:var(--text-2);cursor:default}
.tm-top li{padding:9px 6px}
#al-ring .g-lbl{font-size:14.5px}
.m-more{display:none}
@media (max-width:760px){
  #fb-item,#tm-q{font-size:16px}
  .fg-strip{gap:2px}
  .fg-strip button{height:32px}
  .fg-strip button::before{content:"";position:absolute;inset:-8px -1px}
  .fg-strip button.on{transform:scaleY(1.15)}
  #wg-slider{height:40px}
  .tot-scale .pl{font-size:11.5px}
  .gs-bar .ref small{font-size:.75rem}
  .gs-bar .ref:nth-child(3) small{top:44px}
  .gini-scale{padding-bottom:66px}
  .vd small{font-size:.75rem}
  .cl em{position:static;align-self:flex-start;order:-1;font-size:.75rem}
  .g-lbl{font-size:12px}
  #wg-clock.m-clip li:nth-child(n+6){display:none}
  .m-more{display:block}
}
@media (max-width:430px){
  .fr,.fr-head{grid-template-columns:48px minmax(0,1fr) 74px;gap:8px}
  .fr-head span:first-child{white-space:nowrap}
  .fr .bars .fr-t{display:none}
  .fr .bars .fr-tier{display:block;font-size:.75rem;color:var(--text-2);font-family:var(--num);line-height:1.2;margin:-1px 0 2px}
}
@media (pointer:coarse){#fb-item,#tm-q{font-size:16px}}
