/* Shared Australia / Italy / Europe map layout, with Chile's annual and daily products. */
:root{color-scheme:only light;--plane:#edf5f7;--surface:#f7f9fa;--surface-2:#fff;
  --ink:#172630;--ink-2:#596b76;--muted:#596b76;--grid:#d8e2e7;--axis:#b8cbd6;--border:#d8e2e7;
  --accent:#2f783f;--accent-ink:#fff;--hover:#eaf3e8;--chart:#9bcb81;
  --t1:#ffedb3;--t2:#ffcf6b;--t3:#fd9b45;--t4:#ee602f;--t5:#cd302b;--map-bg:#dceef3}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--plane);color:var(--ink);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  display:grid;grid-template-columns:390px minmax(0,1fr);overflow:hidden}
aside{background:var(--surface);border-right:1px solid var(--border);overflow-y:auto;padding:18px 18px 40px}
.site-head{position:relative}
.brand-link{display:inline-flex;align-items:center;margin:-2px 0 14px;padding:3px;border-radius:7px;text-decoration:none}
.brand-logo{display:block;width:150px;height:auto;transition:opacity .15s}
.brand-link:hover .brand-logo{opacity:.88}
h1{font-size:18px;margin:0 0 2px;letter-spacing:-.2px}
.sub{font-size:12px;color:var(--ink-2);margin-bottom:16px}
h2{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-2);margin:22px 0 8px;font-weight:600}
.control-label{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 5px}
.seg{display:flex;gap:4px}
.seg button{flex:1;background:var(--surface-2);color:var(--ink-2);border:1px solid var(--border);border-radius:5px;padding:6px 10px;font-size:12px;line-height:1.45;font-weight:600;cursor:pointer}
button,select,input{font-family:inherit}
.seg button:hover{color:var(--ink);border-color:#83a68d;background:var(--hover)}
.seg button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,.tier:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.product{margin-bottom:8px}
#lang{position:absolute;right:0;top:0;gap:3px}
#lang button{padding:3px 6px;font-size:10.5px;font-weight:500}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tile{background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:9px 10px;min-width:0}
.tile .v{font-size:17px;font-weight:600;letter-spacing:-.3px;font-variant-numeric:tabular-nums}
.tile .k{font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.tile .u{font-size:11px;color:var(--ink-2);margin-top:2px}
.tier{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:8px;align-items:center;padding:3px 0;cursor:pointer}
.tier:hover{background:var(--hover)}
.tier.off{opacity:.34}
.sw{width:16px;height:12px;border-radius:2px}
.tier .lab{font-size:12px}
.tier .lab small{display:block;font-size:10.5px;color:var(--muted)}
.tier .n{font-size:11.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{text-align:left;font-size:11px;color:var(--muted);font-weight:500;padding:4px 0;border-bottom:1px solid var(--border)}
td{padding:4px 0;border-bottom:1px solid var(--border)}
th.r,td.r{text-align:right;font-variant-numeric:tabular-nums}
tbody tr{cursor:pointer}tbody tr:hover td{background:var(--hover)}
.bar{height:3px;border-radius:2px;background:var(--chart);margin-top:3px}
.note{font-size:11.5px;color:var(--muted);line-height:1.5}
.note b{font-weight:600;color:var(--ink-2)}
.foot{margin-top:26px;padding-top:12px;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px 16px}
.report-link{display:inline-flex;align-items:center;gap:5px;color:var(--accent);font-size:11.5px;text-decoration:none}
.report-link:hover{text-decoration:underline}
main{position:relative;background:var(--map-bg);min-height:320px;min-width:0}
#map{position:absolute;inset:0}
#topbar{position:absolute;top:10px;right:10px;z-index:2;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
#topbar .seg{gap:6px}
#topbar button{padding:6px 10px;font-size:12px;font-weight:400;flex:none}
.map-control,.overlay{background:rgba(248,250,251,.96);border:1px solid var(--border);border-radius:5px}
.opacity-control{padding:7px 10px 6px;width:186px}
.control-head{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:4px}
.opacity-control input{width:100%;margin:0;display:block}
input[type=range]{accent-color:var(--accent);cursor:pointer}
.basemap-control{display:flex;align-items:center;gap:12px;padding:5px 8px;font-size:11px;color:var(--muted)}
.basemap-control select{font-size:11px;color:var(--ink);background:var(--surface-2);border:1px solid var(--border);border-radius:3px;padding:2px 4px}
#timebar{position:absolute;z-index:2;left:10px;right:52px;bottom:32px;padding:9px 10px;display:none;gap:8px;align-items:center;flex-wrap:wrap}
#timebar.on{display:flex}
#windows button{white-space:nowrap;padding:5px 8px;font-size:11px}
#timebar .d{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
#timebar input{flex:1;min-width:110px}
#timebar .m{font-size:11px;color:var(--muted);text-align:right;margin-left:auto}
#tip{position:absolute;z-index:3;pointer-events:none;display:none;max-width:270px;background:rgba(248,250,251,.97);border:1px solid var(--border);border-radius:5px;padding:8px 10px;font-size:12px}
#tip .t{font-weight:600;margin-bottom:5px;display:flex;align-items:center;gap:7px}
#tip dl{margin:0;display:grid;grid-template-columns:auto auto;gap:2px 12px}
#tip dt{color:var(--muted)}#tip dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
#loading{position:absolute;inset:0;display:grid;place-items:center;z-index:4;background:var(--map-bg);color:var(--ink-2);font-size:13px}
.maplibregl-ctrl-group{background:var(--surface-2);border:1px solid var(--border)}
svg .gl{stroke:var(--grid);stroke-width:1}svg .ax{stroke:var(--axis);stroke-width:1}
svg text{fill:var(--muted);font-size:9.5px}svg .lbl{fill:var(--ink-2)}
@media(max-width:820px){body{display:block;overflow:auto}aside{border-right:0;border-bottom:1px solid var(--border);overflow:visible}main{height:70vh;min-height:360px}#timebar .m{width:100%;text-align:left;margin-left:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
