@font-face{font-family:Anton;src:url('assets/anton.ttf')}@font-face{font-family:Barlow;src:url('assets/barlow.ttf')}
:root{--ink:#202019;--plastic:#e8dec7;--orange:#f35b19;--lcd:#acb38c;--muted:#665e50;--head:Anton,Impact,'Arial Narrow',sans-serif;--body:Barlow,'Arial Narrow',sans-serif;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}body{margin:0;background:#242522;color:var(--ink);font-family:var(--body);font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #d74d0c;outline-offset:4px}button{touch-action:manipulation}a{color:#783511;text-underline-offset:3px}.stage{min-height:100svh;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:35px 16px 24px;background:radial-gradient(ellipse at 50% 32%,#47483f 0,#282925 45%,#1b1c1a 100%)}
.phone{position:relative;width:414px;max-width:100%;padding:8px;background:linear-gradient(110deg,#5b5b55,#131411 9%,#171815 90%,#666660);border:1px solid #686960;border-radius:47px;box-shadow:0 32px 55px #0009,0 3px 0 #070806,inset 0 0 0 2px #131411}.phone:before,.phone:after{content:'';position:absolute;width:3px;background:#6c6c64;left:-3px;border-radius:3px;height:49px;top:151px}.phone:after{left:auto;right:-3px;height:75px;top:173px}.phone-top{height:38px;color:#e6e3d7;display:flex;align-items:center;justify-content:space-between;padding:0 23px;font:600 12px Arial,sans-serif;position:relative}.island{position:absolute;left:50%;transform:translateX(-50%);width:103px;height:23px;top:2px;background:#080907;border-radius:30px;box-shadow:inset -1px -1px 2px #333}.island:after{content:'';position:absolute;right:12px;top:7px;width:8px;height:8px;border-radius:50%;background:#17212a;box-shadow:inset 0 0 3px #050505}.home-indicator{height:20px;position:relative}.home-indicator:after{content:'';position:absolute;height:4px;width:112px;background:#b3b3a7;border-radius:4px;left:50%;top:9px;transform:translateX(-50%)}
.calculator{isolation:isolate;position:relative;overflow:hidden;border-radius:16px 16px 29px 29px;padding:25px 18px 25px;background:radial-gradient(ellipse at 2% 20%,#9c774937,transparent 22%),radial-gradient(ellipse at 99% 80%,#9c774933,transparent 25%),linear-gradient(105deg,#d0bda0 0,#eee5d1 5%,#e9dfca 85%,#c4ac89 100%);border:1px solid #9b896e;box-shadow:inset 2px 2px 3px #fff9,inset -2px -4px 4px #765a4580,0 2px 3px #000}.calculator:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/wear.svg');opacity:.43;mix-blend-mode:multiply}.calculator:after{content:'';position:absolute;inset:5px;border:1px solid #88745b44;border-radius:12px 12px 23px 23px;box-shadow:inset 1px 1px 1px #fff9;pointer-events:none}.brand{display:flex;align-items:center;gap:9px;margin:0 0 21px}.brand h1{font:29px/1 var(--head);margin:0;letter-spacing:-.6px}.brand>span{font:10px/1.15 var(--body);border-left:1px solid #675f4e;padding-left:8px;letter-spacing:.1px}.lcd-bezel{background:linear-gradient(145deg,#b4a98f,#f5edda 50%,#a39072);padding:6px;border:1px solid #a49374;border-radius:11px;box-shadow:0 2px 0 #fff9,inset 0 2px 2px #66574299}.lcd{position:relative;overflow:hidden;border-radius:6px;background:linear-gradient(170deg,#929b77,#bac29b 70%,#a3ad86);box-shadow:inset 0 5px 10px #30391c70,inset 0 0 3px 2px #4a5037;height:104px;display:flex;align-items:center;justify-content:center}.lcd:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,#34402209 2px 3px);pointer-events:none}.lcd h2{font:53px/1 var(--head);letter-spacing:.2px;margin:0;color:#202717;text-shadow:1px 2px 1px #65704755}.section-label{display:flex;align-items:center;gap:10px;margin:18px 0 14px}.section-label span{flex:1;height:1px;background:#837965}.section-label p{margin:0;font-size:15px;letter-spacing:.65px;white-space:nowrap}
.projects{display:flex;flex-direction:column;gap:10px}.project{border-radius:8px;border:1px solid #918471;background:#e9dfcc;box-shadow:0 2px 3px #78644850,inset 0 1px 0 #fff;overflow:hidden;transition:border-color .25s,box-shadow .25s}.project.open{border:2px solid var(--orange);box-shadow:0 0 0 2px #f5813640,0 3px 5px #715a4330}.project-toggle{border:0;padding:0;display:grid;grid-template-columns:48% 1fr 28px;align-items:center;text-align:left;width:100%;background:linear-gradient(120deg,#f0e7d7,#dfd1b8);position:relative;min-height:128px;transition:min-height .4s var(--ease),grid-template-columns .4s var(--ease)}.photo{height:128px;overflow:hidden;position:relative;transition:height .4s var(--ease)}.photo img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.75) contrast(1.03);transition:transform .5s var(--ease)}.project-toggle:hover img{transform:scale(1.04)}.photo:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 7px #0004}.title{padding:12px 10px}.title small{display:block;font:11px/1 var(--body);letter-spacing:1.8px;color:#756957;margin-bottom:7px}.title strong{font:23px/1.1 var(--head);display:block;font-weight:400}.indicator{width:16px;height:16px;border:1.5px solid #7e705a;border-radius:50%;position:relative}.indicator:after{content:'+';position:absolute;inset:0;text-align:center;font:15px/12px Arial}.open .indicator{border-color:var(--orange);background:var(--orange);color:white}.open .indicator:after{content:'−'}.projects.has-selection .project:not(.open) .project-toggle{min-height:56px;grid-template-columns:68px 1fr 28px}.projects.has-selection .project:not(.open) .photo{height:56px}.projects.has-selection .project:not(.open) .title{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:7px 10px}.projects.has-selection .project:not(.open) .title small{order:2;margin:0;font-size:9px;letter-spacing:1px}.projects.has-selection .project:not(.open) .title strong{font-size:19px}.open .project-toggle{min-height:115px;grid-template-columns:43% 1fr 28px}.open .photo{height:115px}.details{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}.open .details{grid-template-rows:1fr}.details-inner{min-height:0;overflow:hidden;visibility:hidden;transition:visibility .4s}.open .details-inner{visibility:visible}.facts{padding:13px 15px 14px;border-top:1px solid #aa95794d}dl{margin:0;display:grid;grid-template-columns:48px 1fr;gap:7px 8px;font-size:15px;line-height:1.22}dt{text-transform:uppercase;font-size:11px;letter-spacing:1px;padding-top:3px;color:#776956}dd{margin:0}.value{margin-top:11px;padding-top:10px;border-top:1px solid #b3a28a;display:flex;flex-direction:column;gap:4px}.eyebrow{font-size:11px;letter-spacing:1.5px}.value strong{font:29px/1 var(--head);letter-spacing:.5px}.value p{font-size:12px;line-height:1.25;color:#655a49;margin:0;max-width:290px}.verdict{margin-top:12px;background:#d5c5a7;padding:9px 10px;border-radius:3px;box-shadow:inset 0 1px 2px #8c745733}.meter-label{display:flex;align-items:center;justify-content:space-between}.meter-label small{font-size:10px;color:#6d4d37}.meter{display:flex;gap:3px;margin-top:6px}.meter i{height:5px;flex:1;background:#b3a68d;border-radius:1px}.meter i.lit{background:#bf5525}.verdict p{font-size:17px;line-height:1.15;margin:7px 0 0}.source-button{background:none;border:0;border-bottom:1px solid #9a8063;font-size:12px;padding:7px 0 2px;color:#70563d;margin-top:3px}.controls{padding-top:16px}.key{border:1px solid #81360f;border-radius:9px;box-shadow:0 5px 0 #9e3b0e,0 7px 5px #47302170,inset 1px 2px 2px #ffcf9f,inset -2px -3px 2px #bb350f;transition:transform .12s,box-shadow .12s;position:relative;overflow:hidden}.key:after{content:'';position:absolute;inset:0;background:url('assets/wear.svg');opacity:.15;pointer-events:none}.key:active{transform:translateY(4px);box-shadow:0 1px 0 #9e3b0e,inset 0 2px 4px #9e3b0e55}.key-orange{background:linear-gradient(140deg,#ff7930,#f35b19 55%,#e94c11);width:100%;height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:29px var(--head)}.key-caption{font:15px var(--body);letter-spacing:1.5px}.footnote{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.1px;margin-top:17px;color:#71634f}.screw{position:absolute;bottom:9px;width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#a3947a,#e9dfc9);box-shadow:inset 0 0 2px #493b28}.screw:after{content:'';position:absolute;left:1px;top:3px;width:4px;height:1px;background:#7a6b53;transform:rotate(-32deg)}.screw-left{left:12px}.screw-right{right:12px}.desktop-note{font:10px var(--body);letter-spacing:3px;color:#96978b;margin:25px 0 0}
dialog{max-width:390px;width:calc(100% - 30px);max-height:85svh;border:1px solid #c8b89a;border-radius:13px;background:#eee4cf;color:var(--ink);padding:0;box-shadow:0 20px 60px #0009}dialog::backdrop{background:#111b;backdrop-filter:blur(5px)}.dialog-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;background:#e2d5bb;padding:12px 18px;border-bottom:1px solid #c1ae8b;letter-spacing:1px;font-size:13px}.dialog-head button{width:35px;height:35px;background:#2f302a;color:#e8dec7;border:0;border-radius:5px;font-size:27px}#evidence-body{padding:20px}#evidence-body h3{font:29px var(--head);margin:0 0 15px}#evidence-body p{font-size:17px;line-height:1.4}#evidence-body ul{padding-left:20px}#evidence-body li{margin:12px 0}#evidence-body .credit{font-size:13px;color:#6b5d48;border-top:1px solid #b9a68b;padding-top:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:480px){.stage{padding:0;display:block;background:#e8dec7}.phone{width:100%;max-width:none;padding:0;border:0;border-radius:0;box-shadow:none;background:var(--plastic)}.phone:before,.phone:after,.phone-top,.home-indicator,.desktop-note{display:none}.calculator{border:0;border-radius:0;min-height:100svh;padding:calc(25px + env(safe-area-inset-top)) 20px calc(25px + env(safe-area-inset-bottom));box-shadow:inset 3px 0 9px #8b72574d,inset -3px 0 9px #8b72574d}.calculator:after{border-radius:10px}.brand{margin-bottom:24px}.brand h1{font-size:clamp(26px,7.4vw,33px)}.brand>span{font-size:10px}.lcd{height:112px}.lcd h2{font-size:clamp(45px,13.5vw,61px)}.project-toggle,.photo{min-height:0;height:clamp(120px,18svh,155px)}.project-toggle{height:auto}.projects.has-selection .project:not(.open) .project-toggle{height:56px}.open .project-toggle,.open .photo{height:108px;min-height:108px}.controls{padding-top:20px}.key-orange{height:64px}.section-label{margin-top:16px;margin-bottom:15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Accordion v2: fixed document order; JS measures actual panel content. */
.brand h1{font-size:27px}.brand>span{font-size:9px;white-space:nowrap;padding-left:7px}.brand{gap:7px}
.project{border-width:2px;overflow-anchor:none}
.details{display:block;height:0;overflow:hidden;transition:height 420ms var(--ease)}
.details-inner,.open .details-inner{visibility:visible;overflow:visible;transition:none}
.project-toggle,.photo{transition:height 420ms var(--ease),min-height 420ms var(--ease),grid-template-columns 420ms var(--ease)}
#calculate{font:31px var(--head);letter-spacing:.8px}
@media(max-width:480px){.brand h1{font-size:clamp(23px,6.7vw,29px)}.brand>span{font-size:clamp(8px,2.15vw,10px)}}
@media(prefers-reduced-motion:reduce){.details,.project-toggle,.photo{transition:none!important}}

/* Compact cards and a large, centred calculator key. */
.project-toggle{grid-template-columns:48% 1fr;min-height:108px;height:108px}
.photo{height:108px}
.open .project-toggle{grid-template-columns:43% 1fr;min-height:98px;height:98px}
.open .photo{height:98px;min-height:0}
.projects.has-selection .project:not(.open) .project-toggle{grid-template-columns:60px 1fr;min-height:50px;height:50px}
.projects.has-selection .project:not(.open) .photo{height:50px;min-height:0}
#calculate{height:88px;justify-content:center;gap:18px;text-align:center;font-size:38px;padding:0 14px}

@media(max-width:480px){
 .project-toggle{height:clamp(105px,15svh,125px);min-height:0}
 .photo{height:clamp(105px,15svh,125px)}
 .open .project-toggle,.open .photo{height:98px;min-height:0}
 #calculate{height:92px;font-size:clamp(32px,9vw,40px)}
}

/* Tagline aligned to the brand divider. */
.brand>span{font-size:11px;line-height:1.2;padding-left:8px}
@media(max-width:480px){.brand>span{font-size:clamp(9.5px,2.7vw,12px);line-height:1.2}}

/* Keep the longer tagline within the brand row. */
.brand>span{font-size:10px;line-height:1.3}
@media(max-width:480px){.brand>span{font-size:clamp(8px,2.35vw,10px)}}
.section-label p{font-size:14px;letter-spacing:.55px}

/* Second screen — a framed image, LCD total and compact geographic accordion. */
[hidden]{display:none!important}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}
.selection-message{font-size:15px;color:#657344;margin:12px 0 -8px;text-align: center;}
.screen-nav{display:flex;align-items:center;justify-content:space-between;margin:-8px 0 12px;font-size:10px;letter-spacing:1px;color:var(--muted)}
.screen-nav button{border:0;background:none;padding:8px 0;font-size:12px;letter-spacing:1px;color:var(--ink)}
.project-display{border:2px solid #7b705c;border-radius:9px;padding:5px;background:linear-gradient(135deg,#b7a88a,#f4ead5 55%,#a39273);box-shadow:0 2px 0 #fff8,inset 0 2px 3px #71634b66;overflow:hidden}
.hero-project{position:relative;display:block;width:100%;height:178px;border:0;border-radius:4px 4px 0 0;padding:0;overflow:hidden;text-align:left;background:#555c4a}
.hero-project:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,#10160fbd)}
.hero-project img{height:100%;width:100%;object-fit:cover;filter:saturate(.75);display:block}
.hero-name{position:absolute;z-index:1;left:14px;bottom:12px;right:10px;color:#fff6df;font:27px/1.08 var(--head);text-shadow:0 2px 4px #0008}
.image-note{position:absolute;z-index:1;top:9px;left:9px;font-size:9px;letter-spacing:1px;padding:4px 6px;background:#e8dec7e6;color:#363a2c}
.budget-bezel{padding-top:5px}.budget-lcd{padding:13px 14px 12px;border-radius:0 0 4px 4px;background:linear-gradient(155deg,#929b77,#bac29b 70%,#a3ad86);box-shadow:inset 0 3px 7px #30391c70,inset 0 0 2px #4a5037;color:#242b1c;display:flex;flex-direction:column;gap:5px}
.budget-lcd strong{font:34px/1.1 var(--head);letter-spacing:.4px}.budget-lcd .cost-type{font-size:12px;line-height:1.25;max-width:310px}

.alternatives-list{display:flex;flex-direction:column;gap:8px}.need-card{border:2px solid #a1937a;border-radius:7px;background:#e9dfcc;box-shadow:0 2px 3px #78644835,inset 0 1px 0 #fff;overflow:hidden;overflow-anchor:none;transition:border-color .25s}.need-card.open{border-color:var(--orange)}
.need-toggle{display:flex;align-items:center;gap:11px;width:100%;height:70px;padding:9px 12px;border:0;background:linear-gradient(120deg,#f0e7d7,#dfd1b8);text-align:left;transition:height 420ms var(--ease)}
.alternatives-list.has-selection .need-card:not(.open) .need-toggle{height:57px}
.need-icon{width:33px;height:35px;display:grid;place-items:center;flex-shrink:0}.need-icon svg{width:27px;height:27px}.food{color:#a27627}.shelter{color:#986142}.water{color:#527c79}
.need-title{flex:1;min-width:0}.need-title small{display:block;font-size:9px;letter-spacing:1.3px;color:#756957;margin-bottom:5px}.need-title strong{display:block;font:21px/1.1 var(--head);font-weight:400}.need-number{align-self:center;font:15px/1 var(--head);color:#8c7d64}
.need-facts{padding:0 14px 14px;border-top:1px solid #aa95794d}.need-facts p{font-size:16px;line-height:1.25;margin:9px 0}.need-facts .need-place{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:#76634c}.need-facts dl{display:block}.need-facts dt{font-size:9px;letter-spacing:1px;margin-top:10px}.need-facts dd{font-size:15px;line-height:1.25;margin-top:4px}
#unshittify{height:88px;justify-content:center;gap:18px;text-align:center;font:38px var(--head);letter-spacing:.8px;padding:0 14px}
@media(max-width:480px){#unshittify{height:92px;font-size:clamp(32px,9vw,40px)}.hero-project{height:clamp(155px,22svh,190px)}.need-title strong{font-size:clamp(18px,5.4vw,23px)}}

/* Text-only keys and a vertically centred back control. */
#calculate,#unshittify{gap:0}
#back-projects{display:inline-flex;align-items:center;gap:7px;line-height:1}
#back-projects svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.health{color:#986142}.education{color:#527c79}

/* Shared calculator display materials on both screens. */
:root{--display-frame:linear-gradient(145deg,#b4a98f,#f5edda 50%,#a39072);--display-frame-shadow:0 2px 0 #fff9,inset 0 2px 2px #66574299;--display-glass:linear-gradient(170deg,#929b77,#bac29b 70%,#a3ad86);--display-inset:inset 0 5px 10px #30391c70,inset 0 0 3px 2px #4a5037}
.lcd-bezel,.project-display{background:var(--display-frame);border:1px solid #a49374;border-radius:11px;padding:6px;box-shadow:var(--display-frame-shadow)}
.lcd,.budget-lcd{background:var(--display-glass);box-shadow:var(--display-inset);border-radius:6px}
.budget-lcd{position:relative;overflow:hidden}
.budget-lcd:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,#34402209 2px 3px);pointer-events:none}
.hero-project{border-radius:6px}
.hero-project:after{box-shadow:var(--display-inset)}
/* Embossed icon tiles: colour identifies the need; typography leads. */
.need-icon{width:44px;height:44px;border-radius:7px;border:1px solid #b5a185;background:linear-gradient(145deg,#eee3ce,#d4c2a4);box-shadow:inset 1px 1px 1px #fff9,inset -1px -2px 2px #9d866366,0 2px 1px #b3a08466;transition:width 420ms var(--ease),height 420ms var(--ease)}
.need-icon svg{width:24px;height:24px;filter:drop-shadow(0 1px 0 #fff7);transition:width 420ms var(--ease),height 420ms var(--ease)}
.need-icon.food{color:#a27627}.need-icon.shelter{color:#a45d3d}.need-icon.water{color:#31788d}.need-icon.health{color:#9a4654}.need-icon.education{color:#4b7351}
.alternatives-list.has-selection .need-card:not(.open) .need-toggle{height:48px;padding-top:5px;padding-bottom:5px}
.alternatives-list.has-selection .need-card:not(.open) .need-icon{width:32px;height:32px}
.alternatives-list.has-selection .need-card:not(.open) .need-icon svg{width:19px;height:19px}
.alternatives-list.has-selection .need-card:not(.open) .need-title small{display:none}
.alternatives-list.has-selection .need-card:not(.open) .need-title strong{font-size:18px}

/* One shared embossed divider keeps both screen headers aligned. */
.brand{position:relative;padding-bottom:16px;margin-bottom:16px}
.brand:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:#88745b44;box-shadow:0 1px 0 #fff9;pointer-events:none}
#close-evidence{display:grid;place-items:center;padding:0;line-height:1}
#close-evidence svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}

/* Redistribution: three visible results, all funded by one calculation. */
.back-control{display:inline-flex;align-items:center;gap:7px;line-height:1}
.back-control svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.result-display h2{white-space:nowrap;letter-spacing:-.9px}
.redistribution-summary{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;letter-spacing:.5px}
.redistribution-summary button{padding:3px 0;border:0;border-bottom:1px solid #ad997a;background:none;text-align:left;font-size:12px}
.redistribution-summary>span{white-space:nowrap;color:#655c49}
.results-basis{font-size:11px;color:#71634f;margin:9px 0 12px;letter-spacing:.4px}
.results-list{display:flex;flex-direction:column;gap:11px}
.result-card{border:1px solid #a1937a;border-radius:8px;background:linear-gradient(120deg,#f0e7d7,#dfd1b8);box-shadow:0 2px 3px #78644835,inset 0 1px 0 #fff9;padding:12px 13px}
.result-card-head{display:flex;align-items:center;gap:10px}.result-card-head>div{flex:1;min-width:0}.result-card-head small{display:block;font-size:10px;line-height:1.2;color:#756957;margin-bottom:3px}.result-card-head h3{font:20px/1.12 var(--head);margin:0}.result-card-head .need-icon{width:37px;height:37px}.allocation-share{font:18px/1 var(--head);color:#71634f}
.result-amount{margin:12px 0 4px;display:flex;flex-direction:column;gap:3px}.result-amount strong{font:38px/1 var(--head);letter-spacing:.3px;color:#35492b}.result-amount>span{font:16px/1.2 var(--body);text-transform:uppercase;letter-spacing:.7px}.result-purpose{font-size:14px;line-height:1.2;margin:6px 0 10px;color:#625642}
.result-equation{border-top:1px solid #b8a68b;padding-top:8px;font-size:12px;line-height:1.3;color:#6b5e4b;font-variant-numeric:tabular-nums}
.result-support{display:flex;flex-direction:column;align-items:flex-start;gap:5px;margin-top:9px}.result-support>span{font-size:11px;color:#766750}.result-support a{font-size:12px;letter-spacing:.7px;color:#784017;text-decoration:none;border-bottom:1px solid #b28c62;padding:3px 0}
.results-footer{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.results-footer>span{font-size:10px;letter-spacing:1px;color:#5d6a48}.results-note{font-size:11px;color:#71634f;margin:9px 0 0}
@media(max-width:360px){.result-display h2{letter-spacing:-1.2px}.result-card{padding:11px}.result-card-head h3{font-size:18px}.redistribution-summary{gap:5px;font-size:10px}}

/* Equal 16px spacing around navigation, displays and section dividers. */
#screen-alternatives .screen-nav,#screen-results .screen-nav{margin:0 0 16px}
#screen-alternatives .screen-nav button,#screen-results .screen-nav button{padding:0;position:relative}
.screen-nav button:before{content:'';position:absolute;inset:-8px 0}
#screen-alternatives>.section-label,#screen-results>.section-label{margin:16px 0}
.redistribution-summary button{padding:0}
.dream-scenario{border-top:1px solid #b8a68b;padding-top:10px;margin-top:10px}
.dream-scenario .eyebrow{color:#536444;font-size:10px}
.dream-scenario p{font-size:16px;line-height:1.3;margin:5px 0 10px}

/* Consistent vertical centres for the alternatives navigation and card headers. */
#screen-alternatives .screen-nav{align-items:center;min-height:17px}
#screen-alternatives .screen-nav>span{line-height:1}
#screen-alternatives .need-toggle{display:grid;grid-template-columns:44px minmax(0,1fr) 22px;align-items:center}
#screen-alternatives .need-icon{align-self:center;justify-self:center;display:grid;place-items:center}
#screen-alternatives .need-icon svg{display:block}
#screen-alternatives .need-title{align-self:center}
#screen-alternatives .need-number{align-self:center;justify-self:end;line-height:1}
#screen-alternatives .alternatives-list.has-selection .need-card:not(.open) .need-toggle{grid-template-columns:32px minmax(0,1fr) 22px}
.real-numbers{border-top:1px solid #b8a68b;margin-top:11px;padding-top:11px}
.real-numbers>.eyebrow{display:block;font-size:10px;color:#536444}
.real-numbers>strong{display:block;font:27px/1.2 var(--head);margin:6px 0 3px;color:#35492b}
.benchmark-label{display:block;font-size:15px;line-height:1.2}
.real-numbers p{font-size:14px;line-height:1.35;color:#625642;margin:8px 0}
.real-numbers a{font-size:11px;line-height:1.3;display:inline-block}

/* Results reuse the measured-height accordion and stay in document order. */
.result-card{padding:0;overflow:hidden;overflow-anchor:none;border-width:2px;transition:border-color .25s}
.result-card.open{border-color:var(--orange)}
.result-toggle{display:grid;grid-template-columns:52px minmax(0,1fr) 31px;align-items:center;gap:11px;width:100%;min-height:96px;padding:14px 12px;border:0;background:linear-gradient(120deg,#f0e7d7,#dfd1b8);text-align:left;transition:min-height 420ms var(--ease),padding 420ms var(--ease),grid-template-columns 420ms var(--ease)}
.result-toggle .need-icon{width:52px;height:52px;display:grid;place-items:center}
.result-toggle .need-icon svg{display:block;width:29px;height:29px}
.result-heading{display:flex;flex-direction:column;gap:5px;min-width:0}
.result-heading>strong{font:20px/1.15 var(--head);font-weight:400}
.result-organisation{font:13px/1.2 var(--body);color:#6b5d48}
.result-toggle .allocation-share{justify-self:end;align-self:center;font-size:16px}
.results-list.has-selection .result-card:not(.open) .result-toggle{min-height:76px;padding-top:9px;padding-bottom:9px;grid-template-columns:44px minmax(0,1fr) 31px}
.results-list.has-selection .result-card:not(.open) .need-icon{width:44px;height:44px}
.results-list.has-selection .result-card:not(.open) .need-icon svg{width:25px;height:25px}
.result-body{padding:0 13px 14px;border-top:1px solid #b8a68b}
.result-location{font-size:12px;letter-spacing:.4px;color:#756957;margin:10px 0}
.result-support a{line-height:1.4}
@media(max-width:360px){.result-toggle{gap:8px;padding-left:10px;padding-right:10px}.result-heading>strong{font-size:18px}.result-organisation{font-size:12px}}

.result-geography{font:11px/1.25 var(--body);font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:#756957}.impact-quantity{display:block;font:24px/1.2 var(--head);margin-top:14px}.impact-unit{display:block;font-weight:600;margin:4px 0 10px}.impact-basis,.impact-limit{font-size:12px;line-height:1.5}.impact-limit{color:#756957}.result-body .result-amount{margin-top:14px}

/* One location style across all accordion headers, including compact cards. */
.project .title,.projects.has-selection .project:not(.open) .title,.need-title,.result-heading{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px}
.project .title .location-label,.projects.has-selection .project:not(.open) .title .location-label,.need-title .location-label,.alternatives-list.has-selection .need-card:not(.open) .need-title .location-label,.result-heading .location-label{display:block;order:0;margin:0;font:600 11px/1.25 var(--body);text-transform:uppercase;letter-spacing:.7px;color:#756957}
.inline-math{padding:0;background:none;border:0;border-bottom:1px solid currentColor;color:inherit;font:inherit;cursor:pointer}

/* Compact project imagery with a separate status beneath the name. */
.project .project-toggle,.project.open .project-toggle{grid-template-columns:43% minmax(0,1fr);height:108px;min-height:108px}
.project .photo,.project.open .photo{height:108px;min-height:0}
.projects.has-selection .project:not(.open) .project-toggle{grid-template-columns:70px minmax(0,1fr);height:78px;min-height:78px}
.projects.has-selection .project:not(.open) .photo{height:78px;min-height:0}
.project-status{display:block;font:600 10px/1.25 var(--body);letter-spacing:.8px;color:#756957}
.result-toggle .allocation-share{color:#657344}

#about-app{position:absolute;right:-4px;top:-23px;width:32px;height:32px;display:grid;place-items:center;padding:6px;border:0;background:none;color:#756957;cursor:pointer}
#about-app svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}#about-app .info-dot{fill:currentColor;stroke:none}
#about-app:focus-visible{outline:2px solid var(--orange);border-radius:50%}
#close-about{display:grid;place-items:center;width:34px;height:34px;padding:7px;background:#e2d5bb;border:1px solid #9d8b6d;border-radius:5px;color:var(--ink)}
#close-about svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.about-body{padding:18px;font:15px/1.5 var(--body)}.about-body h3{font:21px/1.2 var(--head);font-weight:400;margin:24px 0 10px}.about-body blockquote{margin:0;padding:14px 16px;background:#acb38c55;border-left:3px solid #657344}.about-body blockquote p{margin:0 0 4px;font-size:19px;line-height:1.35}.about-body blockquote p:not(:first-child){margin-top:16px}.about-body cite,.quote-source{font-size:12px}.about-body a{color:#655238}.about-signoff{font-family:var(--head);color:#657344;margin-top:24px}

/* Mathematical i shares the header's vertical centre, with no enclosing shape. */
#about-app{position:static;order:3;flex:0 0 24px;align-self:center;margin-left:auto;width:24px;height:36px;padding:0;color:var(--ink);border:0;border-radius:0;background:none}
.math-info{display:block;font:italic 30px/1 Georgia,'Times New Roman',serif;font-weight:400}
@media(max-width:360px){.brand{gap:5px}.brand h1{font-size:21px}.brand>span{font-size:8px;padding-left:6px}#about-app{flex-basis:22px;width:22px}}

#screen-results .real-numbers>.eyebrow,#screen-results .dream-scenario .eyebrow{color:#783511}
#about-app{color:#756957}.math-info{font-size:22px}

#about-app,.project-status{color:#8c7d64}
.about-body .about-signoff{margin:24px 0 0;padding:16px 18px;border:1px solid #929b77;border-radius:10px;background:#acb38c55;color:#35492b;font:500 19px/1.35 var(--body);text-align:center;letter-spacing:.2px}

/* Preserve the original result palette; purpose copy matches the approximation. */
#screen-results .result-purpose{color:#756957}
#screen-results .real-numbers>.eyebrow,#screen-results .dream-scenario .eyebrow{color:#76634c}
@media(max-width:360px){#screen-projects>.section-label{gap:7px}#screen-projects>.section-label p{font-size:12px;letter-spacing:.4px}}

.about-body .about-signoff{padding:15px 10px;font-size:clamp(9px,2.8vw,12px);line-height:1.35;letter-spacing:0;white-space:nowrap}

.about-body .about-signoff{font-weight:300;font-size:clamp(8px,2.4vw,15px)}

/* Separate arithmetic comparisons from evidenced delivery, preserving the palette. */
.equivalent-caveat,.delivery-scenario p,.delivery-balance p{font-size:13px;line-height:1.4;color:#756957}
.dream-scenario .equivalent-caveat{font-size:13px;line-height:1.4}
.delivery-scenario{border-top:1px solid #b8a68b;margin-top:12px;padding-top:10px}
.delivery-scenario .eyebrow,.delivery-balance .eyebrow{font-size:10px;color:#76634c}
.delivery-balance{margin-top:14px;padding:12px;border:1px solid #b8a68b;border-radius:8px;background:#acb38c22}
.delivery-balance>strong{display:block;font:26px/1.2 var(--head);color:#35492b;margin-top:6px}
.delivery-balance p{margin:7px 0 0}.results-basis>span{display:inline-block;margin-top:5px;color:#756957}

/* Make the hypothetical service equivalent the memorable result. */
.impact-highlight{margin:12px 0;padding:14px 15px;border:1px solid #929b77;border-radius:9px;background:linear-gradient(135deg,#e0e6cd,#cbd5af);box-shadow:inset 0 1px 2px #fff9,0 1px 2px #62564218}
.impact-highlight .impact-quantity{margin:0;color:#35492b;font-size:27px;line-height:1.2;overflow-wrap:anywhere}
.impact-highlight .impact-unit{margin:6px 0 0;color:#35492b;font-size:16px;line-height:1.3}

/* Keep scrolling inside the rounded popup, below its stationary header. */
dialog{overflow:hidden}
dialog[open]{display:flex;flex-direction:column}
dialog .dialog-head{flex:0 0 auto;position:relative}
dialog .about-body,dialog #evidence-body{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;margin:6px 6px 6px 0;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#b4a182 #e5d8bf}
dialog .about-body::-webkit-scrollbar,dialog #evidence-body::-webkit-scrollbar{width:9px}
dialog .about-body::-webkit-scrollbar-track,dialog #evidence-body::-webkit-scrollbar-track{background:#e5d8bf;border-radius:20px}
dialog .about-body::-webkit-scrollbar-thumb,dialog #evidence-body::-webkit-scrollbar-thumb{background:#b4a182;border:2px solid #e5d8bf;border-radius:20px}
dialog .about-body::-webkit-scrollbar-thumb:hover,dialog #evidence-body::-webkit-scrollbar-thumb:hover{background:#968267}
.about-body .about-signoff{white-space:normal;text-wrap:balance}

/* Consistent outlined close controls for both popups. */
#close-about,#close-evidence{display:grid;place-items:center;width:34px;height:34px;padding:7px;line-height:1;background:transparent;border:1px solid #000;border-radius:5px;color:#000}
#close-about svg,#close-evidence svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* PWA: desktop retains its phone; mobile uses the real device viewport. */
@media(max-width:600px),(max-width:950px) and (pointer:coarse) and (orientation:landscape){
 body{background:var(--plastic)}
 .stage{padding:0;display:block;min-height:100vh;min-height:100dvh;background:var(--plastic)}
 .phone{width:100%;max-width:none;padding:0;border:0;border-radius:0;box-shadow:none;background:var(--plastic)}
 .phone:before,.phone:after,.phone-top,.home-indicator,.desktop-note{display:none}
 .calculator{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;border:0;border-radius:0;padding:calc(22px + env(safe-area-inset-top,0px)) calc(18px + env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) calc(18px + env(safe-area-inset-left,0px));box-shadow:inset 3px 0 9px #8b72574d,inset -3px 0 9px #8b72574d}
 .calculator:after{border-radius:10px}
 .app-screen:not([hidden]){display:flex;flex-direction:column;flex:1}
 .app-screen>.controls{margin-top:auto}
 .brand{gap:7px}.brand h1{font-size:clamp(21px,6vw,29px)}.brand>span{font-size:clamp(8px,2.4vw,11.1px)}
 .brand #about-app{flex:0 0 30px;width:30px;height:44px}
 .section-label p{font-size:clamp(11px,3.2vw,15px)}
 .title strong{font-size:clamp(18px,5.5vw,23px)}
 .redistribution-summary{flex-wrap:wrap;row-gap:7px}
 dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px)}
 #close-about,#close-evidence{width:44px;height:44px;flex-shrink:0}
 .back-control{min-height:44px}
 /* Underlines follow the text baseline, independently of the touch target. */
 .source-button,.inline-math{min-height:44px;border-bottom:0;text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px}
 .source-button{text-decoration-color:#9a8063}
 .about-body .about-signoff{font-size:15px}
}
.pwa-install{margin-top:20px;padding-top:16px;border-top:1px solid #b8a68b}
.pwa-install button,.pwa-status button{min-height:44px;padding:8px 14px;border:1px solid #76634c;border-radius:6px;background:#acb38c55;color:#35492b;font-weight:600}
.pwa-install p{font-size:13px;line-height:1.4}.pwa-install p:empty{display:none}
.pwa-status{position:fixed;z-index:50;bottom:calc(12px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);padding:10px 14px;border:1px solid #929b77;border-radius:9px;background:#eee5d1;box-shadow:0 3px 15px #0003;font-size:13px;color:#35492b}
.pwa-status:not([hidden]){display:flex;align-items:center;gap:12px}

/* Shared rhythm for alternatives and results, on desktop and mobile. */
:root{--screen-gap:16px;--card-gap:8px}
#screen-alternatives .screen-nav,#screen-results .screen-nav{min-height:17px;margin:0 0 var(--screen-gap);line-height:1}
#screen-alternatives>.section-label,#screen-results>.section-label{margin:var(--screen-gap) 0}
.alternatives-list,.results-list{gap:var(--card-gap)}
.result-toggle{min-height:70px;padding:9px 12px;grid-template-columns:44px minmax(0,1fr) 31px}
.result-toggle .need-icon{width:44px;height:44px}
.result-toggle .need-icon svg{width:24px;height:24px}
.result-heading>strong{font:21px/1.1 var(--head)}
.results-list.has-selection .result-card:not(.open) .result-toggle{min-height:48px;padding:5px 12px;grid-template-columns:32px minmax(0,1fr) 31px}
.results-list.has-selection .result-card:not(.open) .need-icon{width:32px;height:32px}
.results-list.has-selection .result-card:not(.open) .need-icon svg{width:19px;height:19px}
.results-list.has-selection .result-card:not(.open) .result-heading>strong{font-size:18px}
.results-basis{margin:8px 0 16px}
.results-footer{margin-top:var(--screen-gap)}
@media(max-width:480px){.result-heading>strong{font-size:clamp(18px,5.4vw,23px)}}
/* Restore page 2's original 17px navigation row on both pages.
   The existing pseudo-element provides a larger tap area without adding space. */
#screen-alternatives .screen-nav button,#screen-results .screen-nav button{min-height:17px;height:17px}
