.play-page{padding-top:1.7rem;padding-bottom:4rem}.play-heading{margin-bottom:1.8rem}.play-heading .breadcrumb{margin-bottom:.7rem}.play-heading h1{font-size:clamp(2rem,3.5vw,3.8rem);max-width:1000px}.play-heading>p{margin-top:.8rem;color:var(--body)}.play-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,1fr);gap:2rem;align-items:start}.play-theatre{position:sticky;top:1rem}.play-scene{background:#eaf3f7;border-radius:20px;overflow:hidden;position:relative;isolation:isolate;border:1px solid #cbdde4}.forecast-line{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;font-size:.875rem;font-weight:600;letter-spacing:.035em}.forecast-line button{border:1px solid #9baeb7;border-radius:30px;padding:.35rem .75rem;background:#ffffffcc;color:var(--ink);font-size:.875rem;cursor:pointer;letter-spacing:0}.play-cast{display:grid;grid-template-columns:1fr 1fr;position:relative;z-index:2;gap:.6rem;padding:0 1rem}.play-cast figure{min-width:0;text-align:center}.play-cast figcaption{font-size:.875rem;font-weight:700;letter-spacing:.06em;margin-top:.5rem}.speech{position:relative;z-index:2;font-size:1rem;line-height:1.4;min-height:5.4rem;display:flex;align-items:center;justify-content:center;padding:.6rem .35rem;color:#244854}.play-person{width:100%;aspect-ratio:1;background-image:url('/assets/concrete-characters.webp');background-repeat:no-repeat;background-size:200% 300%;background-position:0 0}.contractor{background-position:100% 0}[data-client=happy] .homeowner{background-position:0 50%}[data-client=sad] .homeowner{background-position:0 100%}[data-contractor=happy] .contractor{background-position:100% 50%}[data-contractor=sad] .contractor{background-position:100% 100%}.forecast-ground{position:relative;z-index:3;background:var(--ink);color:#fff;padding:1.2rem 1.5rem;min-height:7.6rem}.forecast-ground strong{display:block;font-size:1.55rem;line-height:1.25;letter-spacing:-.02em}.forecast-ground span{display:block;font-size:1rem;color:#d5e4de;margin-top:.4rem;line-height:1.5}#money-rain{position:absolute;inset:3.5rem 0 0;overflow:hidden;z-index:1;pointer-events:none}.money-drop{position:absolute;top:-3rem;left:var(--x);display:block;font-weight:700;font-size:1rem;color:#28694a;border:1px solid #89b699;border-radius:4px;padding:.05rem .6rem;background:#d9edcf;animation:money-fall 3.2s linear infinite;animation-delay:var(--delay);box-shadow:0 2px 4px #18332d12}.rain-paused .money-drop{animation-play-state:paused}@keyframes money-fall{0%{transform:translateY(0) rotate(-12deg)}100%{transform:translateY(var(--fall,580px)) rotate(24deg)}}.play-recap{padding:1.25rem 0 .5rem}.play-recap>div{display:flex;gap:1rem;justify-content:space-between;align-items:center}.play-small{font-size:.75rem;font-weight:600;max-width:13rem;letter-spacing:.05em;line-height:1.5}.play-recap strong{font-size:1.15rem;text-align:right;line-height:1.3}.play-recap meter{display:block;width:100%;height:1rem;margin:.8rem 0;accent-color:#d7773d}.play-recap meter::-webkit-meter-bar{background:#e3e9e5;border:0}.play-recap meter::-webkit-meter-optimum-value{background:#d7773d}.play-recap p{font-size:1rem;color:var(--body);line-height:1.5;min-height:3rem}.play-disclaimer{font-size:.875rem;line-height:1.55;color:#65716a;border-top:1px solid var(--line);padding-top:.8rem}.play-controls{margin:0}.control-heading{display:flex;gap:1rem;justify-content:space-between;align-items:start;margin-bottom:1.25rem}.control-heading h2{font-size:1.55rem;line-height:1.25;letter-spacing:-.025em;max-width:16rem}.play-reset{background:transparent;border:0;border-bottom:1px solid var(--line);font-size:.875rem;white-space:nowrap;color:var(--ink);padding:.3rem 0;cursor:pointer}.play-controls fieldset{border:0;margin:0 0 1.3rem;padding:0;min-width:0}.play-controls legend,.size-choice>span{font-size:.875rem;font-weight:600;margin-bottom:.6rem;display:block}.access-options{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.access-options label,.plot-option{display:flex;gap:.6rem;align-items:start;border:1px solid var(--line);border-radius:9px;padding:.85rem;cursor:pointer;background:#fff;line-height:1.4}.access-options label:has(:checked),.plot-option:has(:checked){border-color:#ba6034;background:#fff1e7;box-shadow:inset 0 0 0 1px #ba6034}.play-controls input{accent-color:#ab4e24;width:1.1rem;height:1.1rem;margin:.15rem 0 0;flex-shrink:0}.play-controls strong{font-size:1rem;font-weight:600;display:block}.play-controls small{font-size:.875rem;color:var(--body);display:block;margin-top:.3rem}.size-choice{display:block;margin-bottom:1.3rem}.size-choice select{display:block;width:100%;border:1px solid #aebdb2;border-radius:8px;padding:.85rem;background:#fff;color:var(--ink);font:inherit}.plot-option{margin-bottom:.5rem}.play-controls :focus-visible{outline:3px solid #bf542e;outline-offset:3px}.play-contact{border-top:1px solid var(--line);padding-top:1.3rem}.play-contact p{color:var(--body);line-height:1.5;margin:.4rem 0 1rem}.play-contact>.text-link{margin-left:1rem}.play-material-link{display:block;text-decoration:underline;font-size:.875rem;margin-top:1rem}.play-teaser{display:flex;align-items:center;justify-content:space-between;gap:2rem;background:#eaf3f7;padding-top:2.5rem;padding-bottom:2.5rem}.play-teaser h2{font-size:clamp(1.8rem,3vw,2.6rem);margin:.5rem 0}.play-teaser p:last-child{color:var(--body)}.play-teaser .button{flex-shrink:0}.play-page [hidden]{display:none!important}@media(max-width:800px){.play-layout{grid-template-columns:1fr;gap:1.5rem}.play-theatre{position:static}.play-heading{margin-bottom:1.2rem}.play-cast{padding:0 .6rem}.play-person{max-width:240px;margin:auto}.speech{min-height:4.2rem;font-size:.95rem}.play-recap p{min-height:0}.forecast-ground{min-height:0;padding:1rem 1.15rem}.forecast-ground strong{font-size:1.3rem}.play-teaser{flex-direction:column;align-items:flex-start}.play-contact>.text-link{margin-left:0;display:table}.play-page{padding-left:5%;padding-right:5%}.forecast-line{padding:.7rem .8rem;font-size:.75rem}.play-cast figcaption{font-size:.75rem}.play-heading h1{font-size:2rem}.play-heading>p{font-size:1rem}}@media(prefers-reduced-motion:reduce){.money-drop{animation:none;top:12%;transform:rotate(-8deg)}.money-drop:nth-child(n+4){display:none}}
/* Keep falling dollars visible in front of the illustrated cast. */
#money-rain{z-index:3}.forecast-line,.forecast-ground{z-index:4}.money-drop{opacity:.88}
.burn-stage{position:relative;background:#eaf3f7}.burn-stage img{width:100%;height:auto}.free-mode .play-person,.free-mode #money-rain{display:none}.free-mode .speech{min-height:3.5rem}.burn-dollars{position:absolute;inset:0;pointer-events:none;overflow:hidden}.burn-dollars span{position:absolute;left:59%;top:56%;font-size:1rem;font-weight:700;background:#d9edcf;color:#28694a;border:1px solid #89b699;padding:0 .4rem;border-radius:3px;animation:burn-money 2.8s ease-in infinite}.burn-dollars span:nth-child(2){animation-delay:-.56s}.burn-dollars span:nth-child(3){animation-delay:-1.12s}.burn-dollars span:nth-child(4){animation-delay:-1.68s}.burn-dollars span:nth-child(5){animation-delay:-2.24s}@keyframes burn-money{0%{left:59%;top:56%;transform:rotate(-15deg);opacity:0}12%{opacity:1}55%{left:74%;top:47%;background:#d9edcf;transform:rotate(25deg);opacity:1}85%{left:84%;top:64%;background:#ffc158;transform:rotate(65deg) scale(.7);opacity:1}100%{left:84%;top:66%;background:#ff7438;transform:rotate(95deg) scale(.2);opacity:0}}.rain-paused .burn-dollars span{animation-play-state:paused}.free-option{border-style:dashed}.free-option:has(:checked){background:#ffead8}.free-mode .forecast-ground{background:#593022}@media(prefers-reduced-motion:reduce){.burn-dollars span{animation:none;display:none}}
/* A customer's budget moves to the contractor; free extras burn the contractor's share. */
.play-person{position:relative}.customer-money{position:absolute;width:115%;max-width:none;left:-7.5%;bottom:-1%;height:53%;object-fit:contain;object-position:center bottom}.contractor-money{position:absolute;width:var(--contractor-pile,18%);max-width:none;right:2%;bottom:-1%;height:auto;max-height:40%;object-fit:contain;object-position:center bottom;transition:width .35s ease}.money-drop{animation-name:budget-transfer;top:0;left:24%}@keyframes budget-transfer{0%{left:24%;top:62%;transform:rotate(-12deg);opacity:0}10%{opacity:1}42%{left:var(--x);top:0;transform:rotate(10deg);opacity:1}92%{left:var(--x);top:85%;transform:rotate(30deg);opacity:1}100%{left:var(--x);top:92%;transform:rotate(30deg);opacity:0}}@media(prefers-reduced-motion:reduce){.contractor-money{transition:none}.money-drop{left:73%;top:25%}}
@media(max-width:800px) and (min-height:700px){.play-theatre{position:sticky;top:0;z-index:10;background:var(--paper);padding-bottom:.6rem;box-shadow:0 8px 15px #18332d0a}.play-person{max-width:145px}.play-cast .speech{font-size:.875rem;min-height:3.8rem}.play-scene{border-radius:12px}.forecast-line{padding:.45rem .7rem}.forecast-ground{padding:.6rem .85rem}.forecast-ground strong{font-size:1.05rem}.forecast-ground span{display:none}.play-recap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0}.play-disclaimer{font-size:.875rem;padding-top:.4rem;border:0;line-height:1.3}.burn-stage{max-height:220px;overflow:hidden}.burn-stage>img{max-height:220px;object-fit:contain}.control-heading{margin-top:.5rem}}
@media(max-width:800px) and (min-height:700px){.burn-stage{max-width:330px;max-height:none;margin:auto;overflow:visible}.burn-stage>img{max-height:none;object-fit:contain}}
.burn-stage>.burn-customer-money{position:absolute;left:0;bottom:10%;width:36%;height:42%;object-fit:contain;object-position:center bottom;max-height:none}.burn-stage>.angry-head{display:none;position:absolute;left:49%;top:7%;width:13.5%;height:25%;object-fit:fill;max-height:none}.angry-mode .burn-stage>.angry-head{display:block}.free-mode .play-cast{width:80%;grid-template-columns:46% 54%}.free-mode .speech{min-height:5.4rem}
@keyframes burn-money{0%{left:55%;top:84%;transform:rotate(-15deg);opacity:0}12%{opacity:1}50%{left:70%;top:52%;background:#d9edcf;transform:rotate(25deg);opacity:1}85%{left:85%;top:64%;background:#ffc158;transform:rotate(65deg) scale(.7);opacity:1}100%{left:86%;top:66%;background:#ff7438;transform:rotate(95deg) scale(.2);opacity:0}}
.customer-money{height:65%}.burn-stage>.burn-customer-money{height:50%}