.scene{position:absolute;inset:0;overflow:hidden}
.backdrop{display:block;width:100%;height:100%;image-rendering:pixelated}
.porch-title{position:absolute;left:4.5%;top:17%;width:27%;height:auto;image-rendering:pixelated;filter:drop-shadow(1px 2px 0 #26323c)}
.bell-target,.recipe-target{position:absolute;background:transparent;border:0;border-radius:4px;z-index:4}
.bell-target{top:51%;left:53.5%;transform:translate(-50%,-50%);width:max(44px,6%);height:max(44px,18%)}
.bell-target:hover,.recipe-target:hover{box-shadow:inset 0 0 0 1px #ffdb9cbb;background:#ffdb9c12}
.bell-glow{position:absolute;left:53.45%;top:52.3%;width:1.9%;aspect-ratio:1;border:1px solid #fff4c5;transform:translate(-50%,-50%);background:#ffe5a9;border-radius:50%;box-shadow:0 0 10px 3px #ffca7680;animation:bell-press .7s ease-out}
@keyframes bell-press{0%{box-shadow:0 0 0 10px #ffeab89c}100%{box-shadow:0 0 10px 3px #ffca7680}}
.scene-ticket,.wire-heading,.wire-name,.outside-name,.phone-receipt,.plug,.porch-tools{font-family:var(--mono)}
.scene-ticket{position:absolute;left:4.5%;bottom:6%;padding:4px 7px;border-left:2px solid #f0c984;background:#233735ed;color:#ffe0ae;font-size:clamp(.6rem,.85vw,.75rem);letter-spacing:.04em}
.snapshot{position:absolute;left:9.85%;top:25%;width:29.8%;height:41.8%;object-fit:cover;image-rendering:pixelated}
.phone-receipt{position:absolute;top:70%;left:10%;width:30.2%;color:#d6dfc6;font-size:clamp(.56rem,.9vw,.76rem);line-height:1.4}
.phone-receipt strong,.phone-receipt span{display:block}
.phone-receipt span{font-size:.9em;color:#b5d2c2}
.recipe-target{left:47.8%;top:45%;width:42%;height:39%}
.wire-heading{position:absolute;left:5%;top:6%;text-transform:uppercase;letter-spacing:.12em;font-weight:700;font-size:clamp(.63rem,1vw,.84rem);color:#d7e5cc}
.wifi-path{position:absolute;left:57.1%;top:50.4%;width:21.3%;border-top:3px dashed #9ddcb5}
.wifi-down .wifi-path{border-color:#657570;opacity:.65}
.wire-name,.outside-name{position:absolute;white-space:nowrap;color:#e7dec1;font-weight:700;text-transform:uppercase;font-size:clamp(.55rem,.8vw,.73rem);letter-spacing:.04em}
.wire-name{top:69%;transform:translateX(-50%)}.door-name{left:14.5%}.box-name{left:49.2%}.phone-name{left:83%}
.outside-name{left:48%;bottom:3.6%;font-size:clamp(.53rem,.76vw,.67rem);color:#c5ccbd}
.internet-pin{position:absolute;left:43.2%;top:88.7%;width:2.8%;height:4.7%;background:#c6c4a4;border-bottom:2px solid #867f6c}
.unplugged .internet-pin{transform:translateY(65%);background:#d4a482}
.small-snapshot{position:absolute;left:79.45%;top:43%;width:7%;height:13%;image-rendering:pixelated;object-fit:cover}
.box-light{position:absolute;left:53.9%;top:50.4%;height:2%;width:1%;background:#b3df9f}
.house-pulse{position:absolute;left:14%;top:56%;width:2.6%;aspect-ratio:1.25;transform:translate(-50%,-50%);border:1px solid #fff0ba;background:#ffc281;box-shadow:0 0 8px #ffce89;pointer-events:none}
.bench-controls{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:9px 2px 0}
.plug{display:flex;gap:9px;align-items:center;justify-content:center;min-height:44px;padding:7px 6px;background:#33443e;border:1px solid #788679;border-radius:3px;color:#f0eedc;font-size:clamp(.65rem,.86vw,.74rem);line-height:1.25}
.plug i{width:9px;height:9px;border-radius:2px;background:#a8d99f;border:1px solid #c0e8b8}
.plug[aria-checked="false"] i{background:#655f55;border-color:#c09378}
.plug b{font-weight:400;color:#c5dabc}
.plug[aria-checked="false"] b{color:#edc5a6}
.plug:hover{border-color:#c9d8be;background:#3e5147}
.porch-tools{margin:5px 4px 0;display:flex;align-items:center;justify-content:flex-end;gap:16px}
.porch-tools button{padding:5px 2px;background:transparent;color:#d3dbca;font-size:.72rem;text-underline-offset:3px}
.porch-tools button:hover{text-decoration:underline}
.porch-cabinet .game-description p{max-width:42ch}
@media(max-width:480px){.plug b{display:block}.porch-cabinet .play{white-space:normal;max-width:41%;text-align:center}.porch-tools button{min-height:32px}}