@font-face{font-family:Hoyo Sans;src:url('assets/fonts/dm-sans.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Hoyo Sans;src:url('assets/fonts/dm-sans-bold.ttf') format('truetype');font-style:normal;font-weight:600 800;font-display:swap}
@font-face{font-family:Hoyo Serif;src:url('assets/fonts/instrument-serif-italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
:root{color-scheme:light;--paper:#f1efe6;--ink:#202c2b;--muted:#62675f;--fall:#b1492f;--return:#1c625a;--surface:#e7e3d7;--gutter:clamp(22px,5vw,76px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Hoyo Sans,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit}button{cursor:pointer}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--return);outline-offset:5px}::selection{background:var(--return);color:var(--paper)}.shell{width:min(100% - var(--gutter)*2,1260px);margin-inline:auto}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:23px 10px}.back-link{display:inline-flex;align-items:center;gap:11px;text-decoration:none;font-size:12px;min-height:44px}.back-link svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.back-link:hover svg{transform:translateX(-3px)}.art-name{font-size:12px;color:var(--muted)}

/* Four equal parts make the change of base visible before the experiment. */
.lesson{padding-block:25px 10px}.lesson>h1{font-size:clamp(39px,4.4vw,66px);font-weight:400;line-height:1.05;letter-spacing:-.055em;margin:0;max-width:1080px}.lesson>h1 em{display:block;font-family:Hoyo Serif,Georgia,serif;font-size:1.22em;font-weight:400;letter-spacing:-.035em;line-height:1.03}.money-unit{font-size:12px;color:var(--muted);margin:23px 0 0}.money-sequence{display:grid;grid-template-columns:1fr 110px 1fr 110px 1fr;gap:22px;align-items:center;margin-top:21px}.money-state{min-width:0}.money-state>p{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 14px}.money-state>p strong{display:block;font-size:36px;font-weight:400;letter-spacing:-1.2px;line-height:1.15;color:var(--ink)}.money-notes{display:grid;grid-template-columns:repeat(2,minmax(0,96px));gap:6px;align-content:start;min-height:118px}.money-note{display:block;position:relative;width:100%;max-width:96px;aspect-ratio:96/56;color:#504e41}.money-note>svg{display:block;width:100%;height:100%;fill:#ded9c9;stroke:none}.money-note>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:18px;letter-spacing:-.5px}.money-note.is-lost{opacity:.34}.money-note.is-lost::after{content:"×";position:absolute;right:8px;top:1px;font-size:22px;color:var(--fall)}.money-note.is-new{color:#214f42}.money-note.is-new>svg{fill:#c3d7b8}.money-change{align-self:center;display:flex;flex-direction:column;gap:11px;font-size:12px;color:var(--muted);padding-top:28px;white-space:nowrap}.money-change>svg{width:45px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.money-change.is-loss{color:var(--fall)}.money-change.is-recovery{color:var(--return)}.recovery-equation{font-size:clamp(28px,3vw,40px);line-height:1.2;letter-spacing:-1.3px;margin:30px 0 0}.recovery-equation strong{font-weight:400;color:var(--return)}.lesson-explanation{font-size:18px;line-height:1.7;max-width:870px;margin:13px 0 0;color:var(--muted)}.lesson-explanation strong{color:var(--ink);font-weight:600;white-space:nowrap}.fixed-comparison{display:grid;grid-template-columns:1fr auto;gap:45px;align-items:center;background:var(--surface);padding:26px 30px;border-radius:12px;margin-top:30px;max-width:1050px}.fixed-comparison h2{font-size:20px;line-height:1.25;letter-spacing:-.45px;font-weight:400;margin:0 0 11px}.fixed-comparison p{font-size:14px;line-height:1.6;color:var(--muted);margin:5px 0 0}.fixed-comparison .comparison-equation{font-size:27px;letter-spacing:-.9px;color:var(--ink);margin-top:8px}.comparison-equation strong{color:var(--return);font-weight:400}.comparison-notes{display:flex;gap:7px;width:302px}.comparison-notes .money-note{flex:1}

.exploration{padding-top:56px}.exploration>h2{font-size:30px;line-height:1.2;letter-spacing:-.9px;font-weight:400;margin:0}.explorer-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,105px);align-items:center;padding-top:25px}.case-reading{font-size:15px;line-height:1.7;color:var(--muted);margin:0;max-width:500px}.case-reading strong{font-weight:600;color:var(--ink);white-space:nowrap}.control-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:8px}.control-heading label{font-size:14px;letter-spacing:-.2px}.number-input{display:flex;align-items:baseline;gap:3px;font-size:16px;background:var(--surface);border-radius:7px;padding:3px 10px 3px 0}.number-input input{width:53px;appearance:textfield;-moz-appearance:textfield;text-align:right;border:0;background:transparent;color:var(--ink);font-size:18px;padding:4px 2px;min-height:30px}.number-input input::-webkit-outer-spin-button,.number-input input::-webkit-inner-spin-button{appearance:none;margin:0}.number-input>span{font-size:12px}.loss-control input[type=range]{appearance:none;display:block;width:100%;height:26px;background:transparent;cursor:ew-resize;margin:0;border-radius:6px}.loss-control input[type=range]::-webkit-slider-runnable-track{height:5px;background:linear-gradient(to right,var(--fall) 0 var(--fill),#d3cbbd var(--fill) 100%);border-radius:5px}.loss-control input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;margin-top:-8.5px;border:4px solid var(--paper);border-radius:50%;background:var(--fall);box-shadow:0 0 0 1px var(--fall)}.loss-control input[type=range]::-moz-range-track{height:5px;background:#d3cbbd;border-radius:5px}.loss-control input[type=range]::-moz-range-progress{height:5px;background:var(--fall);border-radius:5px}.loss-control input[type=range]::-moz-range-thumb{width:14px;height:14px;border:4px solid var(--paper);border-radius:50%;background:var(--fall);box-shadow:0 0 0 1px var(--fall)}.range-limits{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:2px}

/* The landscape compares percentages without assigning euro values to heights. */
.pit-section{padding-top:70px;padding-bottom:36px}.pit-scene{position:relative;overflow:visible}.pit-plot{position:relative;height:clamp(390px,36vw,480px)}.pit-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.pit-terrain{fill:#caa17f}.pit-rock{opacity:.9}.pit-route-outline{fill:none;stroke:#f9f3e5;stroke-width:10;stroke-linecap:round;vector-effect:non-scaling-stroke}.pit-descent,.pit-ascent{fill:none;stroke-width:4;stroke-linecap:round;vector-effect:non-scaling-stroke}.pit-descent{stroke:var(--fall)}.pit-ascent{stroke:var(--return)}.pit-bottom{fill:var(--paper);stroke:var(--ink);stroke-width:2.5;vector-effect:non-scaling-stroke}.traveler{position:absolute;z-index:3;width:110px;height:110px;transform:translate(-50%,-95%) rotate(7deg);transform-origin:50% 95%;background-image:url('assets/hiker-walk.webp');background-size:300% 200%;background-position:0 0;background-repeat:no-repeat;pointer-events:none;filter:drop-shadow(0 2px 1px #3824111a)}.traveler.is-climbing{background-image:url('assets/hiker-climb.webp');transform:translate(-50%,-95%) rotate(-3deg)}.traveler.is-stranded{background-image:url('assets/hiker-rest.webp');background-size:contain;background-position:center;transform:translate(-50%,-95%)}.traveler.is-flat{transform:translate(-50%,-95%)}.traveler.is-moving{animation:hiker-stride .78s steps(1,end) infinite}.traveler.is-falling{background-image:url('assets/hiker-fall.webp');background-size:contain;background-position:center;animation:none!important}@keyframes hiker-stride{0%{background-position:0 0}16.666%{background-position:50% 0}33.333%{background-position:100% 0}50%{background-position:0 100%}66.666%{background-position:50% 100%}83.333%{background-position:100% 100%}100%{background-position:0 0}}.pit-label{position:absolute;z-index:2;transform:translateX(-50%);padding:8px 12px 10px;background:#f1efe6f2;border-radius:8px;white-space:nowrap;line-height:1.3}.pit-label>span{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}.pit-label>strong{display:block;font-size:30px;letter-spacing:-1px;font-weight:400;font-variant-numeric:tabular-nums}.pit-loss-label{color:var(--fall)}.pit-return-label{color:var(--return)}.playback{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:17px;min-height:42px}.journey-button{display:inline-flex;align-items:center;gap:7px;background:var(--surface);color:var(--ink);padding:10px 13px;min-height:40px;font-size:11px;border:0;border-radius:30px;white-space:nowrap}.journey-button:hover{background:#d8d2c5}.journey-button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.journey-button .play-icon{fill:currentColor;stroke:none;display:none}.journey-button[data-state=paused] .pause-icon,.journey-button[data-state=finished] .pause-icon{display:none}.journey-button[data-state=paused] .play-icon,.journey-button[data-state=finished] .play-icon{display:block}
.skip-link{position:fixed;left:18px;top:16px;z-index:100;transform:translateY(-200%);padding:13px 18px;background:var(--return);color:var(--paper);text-decoration:none}.skip-link:focus{transform:translateY(0)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{font-size:14px;line-height:1.7;padding-block:10px 30px}

@media(max-width:1050px){.money-sequence{grid-template-columns:1fr 85px 1fr 85px 1fr;gap:15px}.money-change{font-size:11px}.money-note>span{font-size:16px}.comparison-notes{width:258px}.fixed-comparison{gap:30px}.money-notes{min-height:110px}}
@media(max-width:700px){.site-header{padding-block:15px 5px}.art-name{font-size:11px}.lesson{padding-top:25px}.lesson>h1{font-size:clamp(37px,8.3vw,53px);line-height:1.08;letter-spacing:-.05em}.lesson>h1 em{font-size:1.16em;line-height:1.09}.money-unit{font-size:11px;margin-top:20px}.money-sequence{grid-template-columns:1fr;gap:14px;margin-top:18px}.money-state{display:grid;grid-template-columns:105px 1fr;gap:22px;align-items:center}.money-state>p{font-size:12px;margin:0}.money-state>p strong{font-size:30px}.money-notes{grid-template-columns:repeat(2,minmax(0,83px));gap:5px;min-height:0}.money-note>span{font-size:16px}.money-change{padding:0 0 0 26px;flex-direction:row;align-items:center;gap:12px;min-height:29px;font-size:11px}.money-change>svg{width:24px;height:20px;transform:rotate(90deg)}.recovery-equation{font-size:29px;letter-spacing:-.9px;margin-top:26px}.lesson-explanation{font-size:15px;line-height:1.75;margin-top:12px}.fixed-comparison{display:block;padding:22px;margin-top:25px;border-radius:10px}.fixed-comparison h2{font-size:19px;line-height:1.35;margin-bottom:10px}.fixed-comparison p{font-size:13px}.fixed-comparison .comparison-equation{font-size:27px;margin-top:10px}.comparison-notes{width:min(100%,276px);margin-top:19px;gap:6px}.exploration{padding-top:40px}.exploration>h2{font-size:27px;letter-spacing:-.8px;max-width:280px}.explorer-grid{display:block;padding-top:21px}.case-reading{font-size:14px;margin-top:18px}.control-heading label{font-size:14px}.pit-section{padding-top:60px;padding-bottom:27px}.pit-plot{height:370px}.traveler{width:84px;height:84px}.pit-route-outline{stroke-width:8}.pit-descent,.pit-ascent{stroke-width:3}.pit-label{padding:6px 9px 8px}.pit-label>span{font-size:9px;margin-bottom:3px}.pit-label>strong{font-size:25px;letter-spacing:-.8px}.playback{margin-top:12px;gap:12px}.journey-button{font-size:10px;padding:9px 11px;min-height:40px}}
@media(max-width:360px){.lesson>h1{font-size:35px}.money-state{grid-template-columns:90px 1fr;gap:15px}.money-state>p strong{font-size:28px}.money-note>span{font-size:15px}.money-notes{gap:4px}.fixed-comparison{padding:19px}.exploration>h2{font-size:26px}.pit-plot{height:340px}.traveler{width:80px;height:80px}.pit-label>strong{font-size:23px}.pit-label{padding-inline:8px}.pit-label>span{font-size:8px}.recovery-equation{font-size:27px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Contacts follow each nearly vertical wall rather than floating over the edge. */
.traveler.is-climbing{transform:translate(-79%,var(--climb-anchor-y,-95%))}
.traveler.is-falling{transform:translate(-58%,-63%) rotate(7deg)}
.playback{align-items:center;gap:36px;margin-top:22px}
.progress-pair{display:grid;grid-template-columns:1fr 1fr;gap:56px;flex:1;max-width:900px}
.phase-heading{display:flex;align-items:baseline;justify-content:space-between;gap:15px}
.phase-heading>span{font-size:12px;color:var(--muted)}
.phase-heading>strong{font-size:27px;line-height:1.2;font-weight:400;letter-spacing:-.8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.phase-loss .phase-heading>strong{color:var(--fall)}
.phase-recovery .phase-heading>strong{color:var(--return)}
.phase-target{display:block;font-size:11px;line-height:1.5;color:var(--muted);margin-top:4px}
.phase-bar{height:5px;background:#d9d3c6;border-radius:5px;overflow:hidden;margin-top:10px}
.phase-bar>span{display:block;height:100%;width:0;background:var(--fall)}
.phase-recovery .phase-bar>span{background:var(--return)}
@media(max-width:700px){.playback{display:block;margin-top:18px}.progress-pair{gap:30px}.phase-heading{display:block}.phase-heading>span{display:block;font-size:11px;margin-bottom:4px}.phase-heading>strong{font-size:25px;letter-spacing:-.7px}.phase-target{font-size:10px}.journey-button{margin-top:17px}.phase-bar{margin-top:9px}}
@media(max-width:360px){.progress-pair{gap:24px}.phase-heading>strong{font-size:23px}}
