@font-face{font-family:"Geist";src:url("../fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("../fonts/InstrumentSerif-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{--ink:#f3ecf7;--muted:#c3b8cf;--faint:#9a8fa7;--amber:#ffb877;--violet:#b99bff;--bg:#050409;--ease:cubic-bezier(.2,.8,.1,1);
  --serif:"Instrument Serif","Iowan Old Style",Palatino,Georgia,serif;--sans:"Geist",ui-sans-serif,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --glass:#0d0a1766;--edge:#ffffff1c;--hi:#ffffff26;--gutter:clamp(16px,3vw,40px);color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;scroll-behavior:auto}
body{margin:0;background:var(--bg);min-height:100vh;overflow-x:hidden}
a{color:inherit}button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}
.skip{position:fixed;left:16px;top:-60px;z-index:60;padding:10px 14px;background:#1a1522;border-radius:8px}.skip:focus{top:16px}
.glass{background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);border:1px solid var(--edge);box-shadow:inset 0 1px 0 var(--hi),0 18px 50px -24px #000a;border-radius:18px}
.fine{font-size:13px;line-height:1.5;color:var(--faint);margin:10px 0 0}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.02em;margin:0}
h1{font-size:clamp(44px,6.4vw,104px);line-height:.98;max-width:13ch}
h2{font-size:clamp(34px,4.4vw,68px);line-height:1}
.lede{font-size:clamp(17px,1.5vw,21px);line-height:1.5;color:var(--muted);max-width:56ch;margin:22px 0 0}
.btn{display:inline-block;padding:13px 20px;border-radius:999px;background:var(--amber);color:var(--bg);font:500 15px/1 var(--sans);text-decoration:none;transition:scale .3s var(--ease),filter .3s,background .3s}
.btn:hover{scale:1.04;filter:brightness(1.08)}.btn:active{scale:.97}
.btn--ghost{background:#ffffff14;color:var(--ink);border:1px solid var(--edge)}

.bar{position:fixed;z-index:40;left:var(--gutter);right:var(--gutter);top:12px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:10px 12px 10px 20px;border-radius:999px}
.back{font:500 14px/1 var(--sans);color:var(--muted);text-decoration:none}.back:hover{color:var(--ink)}
.mark{justify-self:center;font:400 26px/1 var(--serif);text-decoration:none;letter-spacing:-.01em}
.bar nav{display:flex;align-items:center;gap:6px}.bar nav a{padding:9px 13px;border-radius:999px;font:500 14px/1 var(--sans);text-decoration:none;color:var(--muted);transition:color .3s,background .3s}
.bar nav a:hover{color:var(--ink);background:#ffffff0f}.bar nav .cta{background:#ffffff14;color:var(--ink);margin-left:6px}

main{display:block}
.intro{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:clamp(24px,5vw,80px);align-items:end;padding:clamp(120px,18vh,180px) var(--gutter) clamp(48px,9vh,100px)}
.intro-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 0}
.glance{padding:22px 24px 18px;align-self:end}
.g-title{margin:0 0 12px;font:500 13px/1 var(--sans);color:var(--faint)}
.glance dl{margin:0;display:grid;gap:12px}.glance dl div{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.glance dt{font-size:15px;color:var(--muted)}.glance dd{margin:0;font:400 30px/1 var(--serif);font-variant-numeric:tabular-nums;white-space:nowrap}.glance dd small{font:400 14px/1 var(--sans);color:var(--faint)}
.ladder{display:flex;gap:3px;height:10px;margin-top:18px;border-radius:6px;overflow:hidden}
.rl{display:block;background:#ffffff2e}.rl--demo{background:#6f6580}.rl--scenario{background:#8e7ab8}.rl--estimated{background:#d9a56a}.rl--observed{background:var(--amber)}
.g-key{margin:9px 0 0;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--faint)}.g-key span{display:inline-flex;align-items:center;gap:6px}
.k{display:inline-block;width:9px;height:9px;border-radius:2px}.k--demo{background:#6f6580}.k--scenario{background:#8e7ab8}.k--estimated{background:#d9a56a}.k--observed{background:var(--amber)}

/* ---------- the map: a camera that climbs the scale ---------- */
.track{position:relative;height:calc(var(--n) * 100svh)}
.stage{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;grid-template-columns:clamp(120px,11vw,160px) minmax(0,1fr) clamp(300px,26vw,380px);gap:clamp(8px,1.4vw,22px);padding:78px var(--gutter) 22px;
  background:radial-gradient(90% 70% at 50% 40%,#1a1030 0,#0a0714 55%,#050409 100%)}
.viewport{position:relative;overflow:hidden;min-height:0;border-radius:22px}
.world{position:absolute;left:0;top:0;width:100%;will-change:transform}
.band{position:absolute;left:0;right:0;transform-origin:50% 50%;transition:opacity .25s linear}
.band-head{position:absolute;left:24px;top:7%;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;pointer-events:none}
.band-head h2{font-size:clamp(34px,3.6vw,56px);line-height:1}.band-head p{margin:0;font-size:16px;color:var(--muted)}.band-head b{font:400 28px/1 var(--serif);color:var(--ink);margin-right:4px;font-variant-numeric:tabular-nums}
.band-nodes{position:absolute;inset:0}
.wires{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.wires path{fill:none;stroke:var(--c,#cbbfdc);stroke-width:1.6;stroke-opacity:.26;transition:stroke-opacity .3s,stroke-width .3s}
.wires path.hot{stroke-opacity:.95;stroke-width:2.6}.wires path.faint{stroke-opacity:.07}

.node{position:absolute;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;padding:11px 13px;text-align:left;border-radius:14px;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--c) 42%,transparent);background:color-mix(in srgb,var(--c) 13%,#0c0916);box-shadow:inset 0 1px 0 #ffffff1a;
  font:500 13px/1.3 var(--sans);color:var(--ink);transition:opacity .35s,translate .45s var(--ease),background .3s,border-color .3s,box-shadow .3s;overflow:hidden}
.node:hover,.node:focus-visible{translate:0 -3px;background:color-mix(in srgb,var(--c) 22%,#0c0916);border-color:var(--c)}
.node:active{scale:.98}
.node.is-dim{opacity:.28}.node.is-nb{border-color:var(--c);background:color-mix(in srgb,var(--c) 24%,#0c0916)}
.node.is-sel{border-color:var(--amber);box-shadow:0 0 0 2px var(--amber),0 14px 40px -12px color-mix(in srgb,var(--c) 70%,transparent);background:color-mix(in srgb,var(--c) 28%,#0c0916)}
.n-count{font:400 34px/1 var(--serif);font-variant-numeric:tabular-nums}
.n-label{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;color:var(--ink)}
.n-sub{font:400 12.5px/1.3 var(--sans);color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.n-acc{position:absolute;right:11px;top:10px;font:500 12px/1 var(--sans);color:var(--c)}
.n-pips{display:flex;gap:3px;margin-top:2px}.n-pips i{width:14px;height:5px;border-radius:3px;background:#ffffff26}.n-pips i.on{background:var(--c)}
.node--articolo .n-label{-webkit-line-clamp:3;font-weight:400;font-size:12.5px}
.node--giorno{align-items:flex-start;justify-content:center}.node--ecosistema{border-radius:50%;align-items:center;justify-content:center;text-align:center;background:color-mix(in srgb,var(--amber) 14%,#0c0916);--c:#ffb877}
.node--ecosistema .n-label{font:400 28px/1.05 var(--serif);-webkit-line-clamp:3}

.ruler{align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:10px}
.ruler ol{list-style:none;margin:0;padding:0 14px 0 0;display:grid;gap:2px;position:relative}
.ruler ol::after{content:'';position:absolute;right:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:#ffffff1f}
.rung{position:relative;display:flex;justify-content:flex-end;align-items:baseline;gap:9px;width:100%;padding:10px 8px 10px 10px;border:0;background:none;border-radius:10px;cursor:pointer;color:var(--faint);font:500 14px/1 var(--sans);transition:color .3s,background .3s}
.rung i{position:absolute;right:-14px;top:50%;width:9px;height:9px;margin-top:-4.5px;margin-right:-3px;border-radius:50%;background:#6f6580;transition:scale .5s var(--ease),background .3s}
.rung:hover{color:var(--ink);background:#ffffff0d}.r-n{font-size:12.5px;font-variant-numeric:tabular-nums;opacity:.75}
.rung.past{color:#d9c3a6}.rung.past i{background:var(--amber);opacity:.55}.rung.on{color:var(--ink)}.rung.on i{background:var(--amber);scale:1.7;box-shadow:0 0 0 5px #ffb87730,0 0 18px 4px #ffb87766}
.r-axis{display:flex;justify-content:space-between;margin:6px 14px 0 0;font-size:12px;color:var(--faint)}

.panel{align-self:stretch;min-height:0;overflow:auto;padding:24px 24px 20px;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent;position:relative}
.panel h2{font-size:clamp(28px,2.6vw,40px);line-height:1.02;margin:6px 0 14px}
.panel p{margin:0 0 12px;font-size:15px;color:var(--muted)}.panel .p-step{font:500 13px/1.3 var(--sans);color:var(--amber);margin:0}
.p-big{color:var(--ink)!important;font-size:15px!important}.p-big b{font:400 36px/1 var(--serif);margin-right:6px;font-variant-numeric:tabular-nums}
.p-facts{color:var(--ink)!important}.p-tip{margin-top:20px!important;color:var(--ink)!important;font-size:16px!important}
.p-sub{margin:20px 0 8px!important;font:500 13px/1 var(--sans)!important;color:var(--faint)!important}
.p-close{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:50%;border:1px solid var(--edge);background:#ffffff10;cursor:pointer;font-size:20px;line-height:1}
.steps{margin:6px 0 14px}.steps>p{margin:0 0 6px!important;font:500 13px/1 var(--sans)!important;color:var(--faint)!important}
.steps ol{list-style:none;margin:0;padding:0;display:flex;gap:4px}.steps li{flex:1;padding:8px 6px;text-align:center;border-radius:8px;font:500 12.5px/1.15 var(--sans);background:#ffffff0f;color:var(--faint)}.steps li.on{background:color-mix(in srgb,var(--amber) 85%,#000);color:var(--bg)}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 !important}.acts .btn{padding:11px 16px;font-size:14px}
.rel .rel-h{margin:14px 0 6px!important;font:500 14px/1.2 var(--sans)!important;color:var(--ink)!important}
.rel ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}.rel li button{width:100%;display:flex;justify-content:space-between;gap:10px;align-items:baseline;text-align:left;padding:9px 11px;border-radius:10px;border:1px solid transparent;background:#ffffff0c;cursor:pointer;font-size:14px;line-height:1.3;transition:background .25s,border-color .25s}
.rel li button:hover,.rel li button:focus-visible{background:#ffffff18;border-color:var(--edge)}.rel li em{font-style:normal;font-size:12.5px;color:var(--faint);white-space:nowrap}.rel .more{padding:4px 11px;font-size:13px;color:var(--faint)}
.hint{position:absolute;left:50%;bottom:34px;translate:-50% 0;margin:0;padding:9px 16px;border-radius:999px;background:#0d0a17cc;border:1px solid var(--edge);font-size:13.5px;color:var(--muted);transition:opacity .5s;pointer-events:none;z-index:5}

/* ---------- journey / mcp / gaps ---------- */
.journey,.mcp,.missing{padding:clamp(80px,14vh,170px) var(--gutter) 0}
.big{font:400 clamp(44px,6vw,92px)/1 var(--serif);display:block;color:var(--amber);margin-bottom:8px;font-variant-numeric:tabular-nums}
.miles{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.miles li{padding:18px 18px 16px;border-radius:18px;background:#ffffff0b;display:grid;gap:6px;align-content:start;border:1px solid var(--edge)}
.miles b{font:400 26px/1 var(--serif);color:var(--amber)}.miles time{font-size:14px;color:var(--muted)}.miles span{font-size:16px;color:var(--ink);line-height:1.35}.miles small{font-size:12.5px;color:var(--faint)}
.mcp{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,80px);align-items:start}
.cmd{display:flex;align-items:center;gap:12px;margin:28px 0 0;padding:14px 14px 14px 20px;overflow:auto}
.cmd code{flex:1;font:500 15px/1.4 ui-monospace,"SF Mono",Menlo,monospace;white-space:nowrap}.cmd button{flex:none;padding:10px 16px;border-radius:999px;border:0;background:var(--amber);color:var(--bg);font:500 14px/1 var(--sans);cursor:pointer}
.tools{list-style:none;margin:0;padding:0;display:grid;gap:6px}.tools li{display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:14px;align-items:baseline;padding:11px 14px;border-radius:12px;background:#ffffff0b}
.tools b{font:500 14px/1.3 ui-monospace,"SF Mono",Menlo,monospace;color:var(--amber)}.tools span{font-size:15px;color:var(--muted)}
.gaps{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.gaps li{padding:20px;border-radius:18px;background:#ffffff0b;border:1px solid var(--edge);display:grid;gap:8px;align-content:start}.gaps b{font:400 28px/1.05 var(--serif)}.gaps span{color:var(--muted);font-size:15px}
.foot{padding:clamp(100px,16vh,200px) var(--gutter) 40px}.foot-name{font:400 clamp(60px,12vw,200px)/.9 var(--serif);margin:0 0 20px;letter-spacing:-.03em}.foot p{margin:6px 0}.foot a{color:var(--muted)}

/* ---------- list mode: phones and short screens ---------- */
.is-list .bar{grid-template-columns:auto 1fr auto;gap:10px;top:8px;padding:8px 8px 8px 16px}.is-list .bar nav a:not(.cta){display:none}.is-list .mark{justify-self:center}
.is-list .intro{grid-template-columns:1fr;min-height:auto;padding-top:104px}
.is-list .track{height:auto;padding:60px var(--gutter) 0}
.is-list .stage{position:static;display:block;height:auto;padding:0;background:none}
.is-list .viewport{overflow:visible}.is-list .world{position:static;transform:none!important}.is-list .ruler,.is-list .wires,.is-list .hint{display:none}
.is-list .band{position:static;opacity:1!important;scale:1!important;margin-bottom:46px;height:auto!important}
.is-list .band-head{position:static;margin-bottom:14px}.is-list .band-nodes{position:static;display:flex;flex-wrap:wrap;gap:8px}
.is-list .node{position:static;width:calc(50% - 4px);height:auto;min-height:96px}.is-list .node--giorno,.is-list .node--ecosistema,.is-list .node--nodo{width:100%}.is-list .node--ecosistema{border-radius:22px}
.is-list .node--articolo{width:calc(50% - 4px);min-height:80px}
.is-list .panel{display:none}
.is-list.has-sel .panel{display:block;position:fixed;z-index:45;left:10px;right:10px;bottom:10px;max-height:62svh;border-radius:22px;background:#0d0a17ee}
.is-list .miles{margin-top:30px}.is-list .mcp{grid-template-columns:1fr}.is-list .tools li{grid-template-columns:1fr;gap:4px}
@media (max-width:900px){.intro{grid-template-columns:1fr}.mcp{grid-template-columns:1fr}.tools li{grid-template-columns:1fr;gap:4px}.bar nav a:not(.cta){display:none}.bar{grid-template-columns:auto 1fr auto;gap:10px}.mark{justify-self:center}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.node:hover{translate:none}}

.mcp>*,.intro>*,.miles>*,.gaps>*{min-width:0}.cmd{max-width:100%}.cmd code{min-width:0}

@media (max-width:900px), (max-height:560px){
.bar{grid-template-columns:auto 1fr auto;gap:10px;top:8px;padding:8px 8px 8px 16px}.bar nav a:not(.cta){display:none}.mark{justify-self:center}
.intro{grid-template-columns:1fr;min-height:auto;padding-top:104px}
.track{height:auto;padding:60px var(--gutter) 0}
.stage{position:static;display:block;height:auto;padding:0;background:none}
.viewport{overflow:visible}.world{position:static;transform:none!important}.ruler,.wires,.hint{display:none}
.band{position:static;opacity:1!important;scale:1!important;margin-bottom:46px;height:auto!important}
.band-head{position:static;margin-bottom:14px}.band-nodes{position:static;display:flex;flex-wrap:wrap;gap:8px}
.node{position:static;width:calc(50% - 4px);height:auto;min-height:96px}.node--giorno,.node--ecosistema,.node--nodo{width:100%}.node--ecosistema{border-radius:22px}
.node--articolo{width:calc(50% - 4px);min-height:80px}
.panel{display:none}
.is-list.has-sel .panel{display:block;position:fixed;z-index:45;left:10px;right:10px;bottom:10px;max-height:62svh;border-radius:22px;background:#0d0a17ee}
.miles{margin-top:30px}.mcp{grid-template-columns:1fr}.tools li{grid-template-columns:1fr;gap:4px}
}

.glance:empty{min-height:320px}