/* indice.html — "Índice Canasta" (indice.js). Uses the chrome.css tokens. */
div.hero .ix-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end}
.ix-share{font:800 14.5px/1 var(--sans);color:var(--c-navy);background:#FFD84D;border:2px solid var(--c-ink);border-radius:999px;
  padding:13px 20px;box-shadow:0 3px 0 var(--c-ink);cursor:pointer;white-space:nowrap}
.ix-share:active{transform:translateY(2px);box-shadow:0 1px 0 var(--c-ink)}

.ix-tiles{padding:28px 0 0;border:0}
.ix-tiles .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ix-tile{display:flex;flex-direction:column;gap:6px;padding:18px 20px;background:#fff;border:2px solid var(--c-ink);border-radius:20px;box-shadow:0 4px 0 var(--c-ink)}
.ix-tile.best{background:#EAF7F0}
.ix-k{font-size:13.5px;font-weight:700;color:var(--c-text-3)}
.ix-v{font:600 clamp(28px,3.4vw,36px)/1.05 var(--mono);letter-spacing:-.02em;color:var(--c-ink);font-variant-numeric:tabular-nums}
.ix-tile.best .ix-v{color:#0B7F57}
.ix-sub{font-size:14px;color:var(--c-text-2)}
.ix-ch{font-family:var(--mono);font-weight:600;font-size:13.5px;white-space:nowrap}
.ix-ch.up{color:#B4232C}
.ix-ch.down{color:#0B7F57}
.ix-ch.flat{color:var(--c-text-3)}

.ix-chart{background:#fff;border:2px solid var(--c-ink);border-radius:20px;box-shadow:0 4px 0 var(--c-ink);padding:18px 18px 12px}
.ix-plot{position:relative;padding-left:66px}
.ix-plot svg{display:block;width:100%;height:260px;overflow:visible}
.ix-y{position:absolute;left:0;width:58px;text-align:right;transform:translateY(-50%);font:500 12px/1 var(--mono);color:var(--c-text-3)}
.ix-x{position:relative;height:16px;margin:6px 0 0 66px;font-size:12px;font-weight:600;color:var(--c-text-3)}
.ix-x span{position:absolute;top:0;white-space:nowrap}
.ix-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:13px;color:var(--c-text-2)}
.ix-legend i{display:inline-block;width:14px;height:4px;border-radius:2px;margin-right:6px;vertical-align:middle}
.ix-legend .avg{font-weight:800;color:var(--c-navy)}
.ix-legend .avg i{background:#0B2A63;height:6px;width:18px}

.ix-table,.ix-months-t{border:2px solid var(--c-ink);border-radius:20px;background:#fff;box-shadow:0 4px 0 var(--c-ink);overflow:hidden}
.ix-row{display:grid;grid-template-columns:minmax(130px,1.4fr) 1fr 1fr 90px 1.2fr;gap:14px;align-items:center;padding:13px 18px;border-top:1px solid rgba(27,34,51,.1)}
.ix-mrow{display:grid;grid-template-columns:minmax(150px,1.5fr) 1fr 1fr 1fr;gap:14px;align-items:center;padding:13px 18px;border-top:1px solid rgba(27,34,51,.1)}
.ix-row:first-child,.ix-mrow:first-child{border-top:0}
.ix-head{font-size:13px;font-weight:700;color:var(--c-text-3);background:#F6F2E9}
.ix-sn,.ix-mn{display:flex;align-items:center;gap:9px;font-weight:800;color:var(--c-navy);min-width:0}
.ix-sn i{flex:none;width:10px;height:10px;border-radius:50%}
.ix-mn{flex-wrap:wrap;gap:0 8px}
.ix-mn em{font-style:normal;font-weight:500;font-size:12.5px;color:var(--c-text-3)}
.ix-row .tnum,.ix-mrow .tnum{font-family:var(--mono);font-weight:600;font-size:15px}
.ix-then{color:var(--c-text-3)}
.ix-spark{display:block;width:100%;height:30px}

.ix-items{display:flex;flex-wrap:wrap;gap:10px}
.ix-item{display:inline-flex;align-items:baseline;gap:8px;padding:10px 16px;background:#fff;border:1.5px solid var(--c-ink);border-radius:999px;box-shadow:0 2px 0 var(--c-ink);font-size:15px}
.ix-item b{color:var(--c-navy)}
.ix-item em{font-style:normal;font-family:var(--mono);font-size:13px;color:var(--c-text-3)}
.ix-cta{margin-top:18px}
.ix-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;font-weight:800;font-size:14.5px;color:#fff;background:#1F5FC8;
  border:2px solid var(--c-ink);box-shadow:0 3px 0 var(--c-ink)}

@media (max-width:760px){
  div.hero .ix-hero{grid-template-columns:1fr;gap:16px}
  .ix-share{justify-self:start}
  .ix-tiles .wrap{grid-template-columns:1fr;gap:10px}
  .ix-tile{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:14px 16px}
  .ix-k{flex-basis:100%}
  .ix-v{font-size:28px}
  .ix-plot{padding-left:56px}
  .ix-plot svg{height:200px}
  .ix-y{width:50px;font-size:11.5px}
  .ix-x{margin-left:56px}
  .ix-chart{padding:14px 12px 10px}
  .ix-row{grid-template-columns:minmax(0,1.3fr) 1fr 70px;gap:4px 10px;padding:12px 14px}
  .ix-row>span:nth-child(3){display:none}
  .ix-row>span:nth-child(5){grid-column:1/-1}
  .ix-head>span:nth-child(5){display:none}
  .ix-mrow{grid-template-columns:minmax(0,1.4fr) 1fr 1fr;gap:4px 10px;padding:12px 14px}
  .ix-mrow>span:nth-child(3){display:none}
}

/* ¿qué día conviene? */
.ix-dows{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.ix-dow{display:flex;flex-direction:column;gap:4px;padding:18px 20px;background:#FFF6D6;border:2px solid var(--c-ink);border-radius:20px;box-shadow:0 4px 0 var(--c-ink)}
.ix-dow-s{font-family:'Lilita One',var(--sans);font-weight:400;font-size:22px;color:var(--c-navy)}
.ix-dow-d{font-weight:800;font-size:18px;color:var(--c-ink)}
.ix-dow-p{font-size:14.5px;color:var(--c-text-2)}