:root{
  --bm-paper:#f2f0e8;
  --bm-paper-2:#e8e5dc;
  --bm-paper-3:#dad6ca;
  --bm-ink:#111;
  --bm-muted:#77746d;
  --bm-line:rgba(17,17,17,.18);
  --bm-panel:#0d0d0d;
  --bm-panel-text:#f2f0e8;
  --bm-panel-muted:#96938c;
  --bm-panel-line:rgba(255,255,255,.14);
  --bm-alert:#a82c24;
  --bm-font:"Inter",Arial,Helvetica,sans-serif;
  --bm-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;background:var(--bm-paper);color:var(--bm-ink)}
body{font-family:var(--bm-font);font-weight:300;line-height:1.5}
button{font:inherit;color:inherit;cursor:pointer}
.app{width:min(1480px,100%);margin:auto;padding:22px}
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;padding-bottom:12px;border-bottom:1px solid var(--bm-line)}
.brand{display:flex;align-items:baseline;gap:14px}
.brand h1{font-size:27px;font-weight:500;letter-spacing:-.055em;margin:0}
.actions{display:flex;align-items:center;justify-self:end;gap:8px}
.clock{font:500 11px var(--bm-mono);color:var(--bm-muted);margin-right:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--bm-line);background:transparent;border-radius:999px;padding:8px 12px;color:inherit;font-size:11px;font-weight:500;text-decoration:none;white-space:nowrap}
.btn:hover,.btn:focus-visible{border-color:var(--bm-ink);outline:0}
.btn.dark{background:var(--bm-ink);border-color:var(--bm-ink);color:var(--bm-paper)}
.primary-cta{justify-self:center;padding:10px 22px;letter-spacing:.04em;box-shadow:0 5px 16px rgba(17,17,17,.14)}
.primary-cta:hover,.primary-cta:focus-visible{background:var(--bm-paper);color:var(--bm-ink)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:700px;border-bottom:1px solid var(--bm-line)}
.stage{padding:12px 18px 18px 0;min-width:0}
.label{font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--bm-muted)}
.telemetry{font-family:var(--bm-mono)}
.house-viewport{position:relative;aspect-ratio:12/8;min-height:540px;overflow:hidden;border:1px solid var(--bm-line);background:var(--bm-paper-3)}
.house-stage{position:absolute;inset:0;transform-origin:0 0;transition:transform 420ms cubic-bezier(.22,.8,.2,1);will-change:transform;background:#ded9cc}
.room{position:absolute;border:1px solid rgba(17,17,17,.25);background:rgba(255,255,255,.22)}
.room:after{content:"";position:absolute;inset:0;opacity:.15;background-image:linear-gradient(90deg,#777 1px,transparent 1px),linear-gradient(#777 1px,transparent 1px);background-size:18px 18px}
.room span{position:absolute;left:10px;top:9px;z-index:2;font-size:9px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;color:var(--bm-muted)}
.kitchen{left:0;top:0;width:38%;height:48%;background:#e2ddcf}
.bed1{left:38%;top:0;width:31%;height:48%;background:#d7d3ca}
.bed2{right:0;top:0;width:31%;height:48%;background:#dcd5c7}
.bath{left:0;top:48%;width:18%;height:26%;background:#d3dedb}
.sports{left:0;bottom:0;width:18%;height:26%;background:#d8d5cb}
.living{left:18%;bottom:0;width:51%;height:52%;background:#e3d8ca}
.outside{right:0;bottom:0;width:31%;height:52%;background:#d6ddcf}
.portal{position:absolute;z-index:5;display:block;background:var(--bm-paper);box-shadow:0 0 0 1px rgba(17,17,17,.08)}
.portal.horizontal{width:5%;height:5px;transform:translate(-50%,-50%)}
.portal.vertical{width:5px;height:9%;transform:translate(-50%,-50%)}
.furniture{position:absolute;z-index:3;transform:translate(-50%,-50%);display:grid;place-items:center;color:#4b4944;text-align:center;filter:drop-shadow(2px 3px 0 rgba(17,17,17,.13));transition:filter .2s ease,transform .2s ease}
.furniture img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges}
.furniture small{position:absolute;left:50%;top:calc(100% + 2px);transform:translateX(-50%);padding:1px 3px;background:rgba(242,240,232,.88);font-size:6px;font-weight:500;line-height:1;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.furniture-legacy{border:1px solid #69665f;background:#f7f4ec;color:#66625b;font-size:7px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;box-shadow:2px 2px 0 rgba(17,17,17,.12);filter:none}
.furniture[data-active="true"]{z-index:4;filter:drop-shadow(0 0 5px rgba(255,255,255,.95)) drop-shadow(2px 3px 0 rgba(17,17,17,.13));transform:translate(-50%,-50%) scale(1.08)}
.fridge-f{left:11%;top:25%;width:10%;height:30%}
.table-f{left:30%;top:29%;width:13%;height:9%}
.bed-a-f{left:52%;top:23%;width:14%;height:16%}
.bed-b-f{left:84%;top:23%;width:14%;height:16%}
.shower-f{left:9%;top:61%;width:8%;height:12%}
.gym-f{left:9%;top:87%;width:11%;height:8%}
.desk-f{left:35%;top:63%;width:11%;height:7%}
.cabinet-f{left:84%;top:62%;width:9%;height:8%;background:#c6b99e}
.sofa-f{left:47%;top:73%;width:16%;height:9%}
.tv-f{left:60%;top:73%;width:7%;height:7%}
.plant-living-f{left:25%;top:87%;width:6%;height:10%}
.plant-outside-f{left:92%;top:86%;width:6%;height:10%}
.car-f{left:82%;top:86%;width:9%;height:13%}
.decor-only{z-index:2}
.interaction-badge{position:absolute;z-index:13;display:flex;align-items:center;gap:5px;transform:translate(-50%,165%);padding:4px 7px;border:1px solid var(--bm-ink);background:var(--bm-ink);color:var(--bm-paper);font:500 8px/1 var(--bm-mono);letter-spacing:.08em;white-space:nowrap;pointer-events:none;transition:left .5s linear,top .5s linear,opacity .15s}
.interaction-action{font:inherit}
.interaction-symbol{min-width:12px;text-align:center;font:500 11px/1 var(--bm-mono)}
.interaction-badge[data-phase="approaching"]{background:var(--bm-paper);color:var(--bm-ink)}
.interaction-badge[data-phase="awaiting_consent"]{border-style:dashed;background:var(--bm-paper);color:var(--bm-ink)}
.interaction-badge[data-phase="acting"] .interaction-symbol{animation:interaction-pulse .8s ease-in-out infinite alternate}
.interaction-badge[data-action="flirt"] .interaction-symbol,.interaction-badge[data-action="kiss"] .interaction-symbol,.interaction-badge[data-action="romance"] .interaction-symbol,.interaction-badge[data-action="propose"] .interaction-symbol{color:#ff6d7f;font-size:15px}
.interaction-badge[data-action="sex"]{border-color:#5d214f;background:#5d214f}
.interaction-badge[data-action="sex"] .interaction-symbol{font-size:15px;letter-spacing:-.24em;padding-right:.24em;color:#ffd6ee}
.resident{position:absolute;z-index:9;width:72px;height:82px;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;transition:left .5s linear,top .5s linear;will-change:left,top}
.resident>img{--bm-face:1;position:relative;z-index:1;display:block;width:64px;height:64px;margin:auto;object-fit:contain;background:transparent;box-shadow:none;filter:none;transform:scaleX(var(--bm-face));transform-origin:50% 90%;image-rendering:auto}
.resident[data-facing="east"]>img{--bm-face:-1}
.resident-name{position:absolute;z-index:4;bottom:calc(100% + 3px);left:50%;display:block;width:max-content;max-width:78px;transform:translateX(-50%);padding:2px 5px;background:var(--bm-paper);border:1px solid var(--bm-ink);font-size:9px;font-weight:500;line-height:1;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.resident-action{position:absolute;z-index:4;top:calc(100% + 3px);left:50%;transform:translateX(-50%);padding:3px 5px;background:var(--bm-ink);color:var(--bm-paper);font-size:8px;font-weight:500;letter-spacing:.08em;line-height:1;text-transform:uppercase;white-space:nowrap;opacity:0;transition:opacity .15s}
.resident[data-action-visible="true"] .resident-action{opacity:1}
.resident[data-state="idle"]>img,.resident[data-state="cooldown"]>img{animation:resident-idle 2.2s ease-in-out infinite}
.resident[data-state="walking"]>img{animation:resident-walk 260ms steps(2,end) infinite}
.resident-fx{position:absolute;z-index:3;inset:0;overflow:visible;pointer-events:none}
.pose-prop{position:absolute;display:block;font-style:normal;line-height:1;filter:drop-shadow(0 1px 0 rgba(255,255,255,.9));will-change:transform,opacity}
.pose-sprite{object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges}
.resident[data-pose="eat"]>img{transform:scaleX(var(--bm-face)) translateY(2px) rotate(3deg);animation:resident-eat .7s ease-in-out infinite}
.pose-food{left:50%;top:43px;width:40px;height:40px;transform:translateX(-50%);animation:prop-food .7s ease-in-out infinite}
.resident[data-pose="drink"]>img{animation:resident-drink .8s ease-in-out infinite}
.pose-drink{left:58%;top:34px;width:31px;height:31px;animation:prop-drink .8s ease-in-out infinite}
.pose-pills{left:62%;top:-3px;width:32px;height:32px;animation:prop-pills 1s ease-in-out infinite}
.resident[data-pose="love"]>img,.resident[data-pose="sex"]>img{transform:scaleX(var(--bm-face)) rotate(-2deg);animation:resident-love 1.15s ease-in-out infinite}
.pose-heart{left:61%;top:-1px;color:#b51f3f;font:700 23px/1 Georgia,serif;text-shadow:0 1px 0 #fff;animation:prop-heart 1.15s ease-out infinite}
.pose-linked{left:57%;top:-5px;padding:3px 5px;border:1px solid #5d214f;background:#f6dce9;color:#5d214f;font:700 15px/1 var(--bm-mono);letter-spacing:-.28em;padding-right:calc(5px + .28em);animation:prop-linked 1.15s ease-in-out infinite}
.resident[data-pose="sleep"]>img{opacity:.72;transform:scaleX(var(--bm-face)) translateY(5px) rotate(7deg);animation:resident-sleep 2.2s ease-in-out infinite}
.pose-sleep{left:57%;top:-11px;width:48px;height:48px;animation:prop-sleep 1.8s ease-in-out infinite}
.resident[data-pose="exercise"]>img{animation:resident-exercise .5s ease-in-out infinite}
.pose-dumbbell{left:50%;top:43px;width:51px;height:32px;transform:translateX(-50%);animation:prop-dumbbell .5s ease-in-out infinite}
.pose-z{font:700 10px/1 var(--bm-mono);color:var(--bm-ink);opacity:0}
.pose-z1{left:61%;top:22px;animation:prop-z 1.8s ease-out infinite}
.pose-z2{left:70%;top:12px;animation:prop-z 1.8s .45s ease-out infinite}
.pose-z3{left:79%;top:2px;animation:prop-z 1.8s .9s ease-out infinite}
.resident[data-pose="fight"]>img{transform:scaleX(var(--bm-face)) rotate(-4deg);animation:resident-fight .34s ease-in-out infinite}
.pose-fist{left:57%;top:27px;font-size:17px;animation:prop-fist .52s ease-in-out infinite}
.pose-impact{left:70%;top:18px;font-size:18px;opacity:0;animation:prop-impact .52s ease-out infinite}
.resident.focused{z-index:14}
@keyframes resident-idle{0%,100%{transform:scaleX(var(--bm-face)) translateY(0)}50%{transform:scaleX(var(--bm-face)) translateY(-1px)}}
@keyframes resident-walk{0%,100%{transform:scaleX(var(--bm-face)) translateY(0) rotate(-1deg)}50%{transform:scaleX(var(--bm-face)) translateY(-2px) rotate(1deg)}}
@keyframes resident-eat{0%,100%{transform:scaleX(var(--bm-face)) translateY(2px) rotate(1deg)}50%{transform:scaleX(var(--bm-face)) translateY(5px) rotate(5deg)}}
@keyframes prop-food{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(.92)}}
@keyframes resident-drink{0%,100%{transform:scaleX(var(--bm-face)) rotate(0)}50%{transform:scaleX(var(--bm-face)) rotate(-4deg)}}
@keyframes prop-drink{0%,100%{transform:rotate(0) translateY(0)}50%{transform:rotate(-18deg) translateY(-5px)}}
@keyframes prop-pills{0%,100%{transform:translateY(2px) rotate(-3deg)}50%{transform:translateY(-3px) rotate(3deg)}}
@keyframes resident-love{0%,100%{transform:scaleX(var(--bm-face)) translateY(0) rotate(-2deg)}50%{transform:scaleX(var(--bm-face)) translateY(-2px) rotate(2deg)}}
@keyframes prop-heart{0%{opacity:0;transform:translate(-2px,7px) scale(.65)}35%{opacity:1}100%{opacity:0;transform:translate(4px,-13px) scale(1.12)}}
@keyframes prop-linked{0%,100%{transform:translateY(2px) scale(.9)}50%{transform:translateY(-3px) scale(1.06)}}
@keyframes resident-sleep{0%,100%{transform:scaleX(var(--bm-face)) translateY(5px) rotate(7deg)}50%{transform:scaleX(var(--bm-face)) translateY(6px) rotate(9deg)}}
@keyframes prop-sleep{0%,100%{opacity:.76;transform:translate(0,2px) scale(.94)}50%{opacity:1;transform:translate(3px,-3px) scale(1)}}
@keyframes resident-exercise{0%,100%{transform:scaleX(var(--bm-face)) translateY(1px)}50%{transform:scaleX(var(--bm-face)) translateY(-3px)}}
@keyframes prop-dumbbell{0%,100%{transform:translateX(-50%) translateY(2px) rotate(-3deg)}50%{transform:translateX(-50%) translateY(-7px) rotate(3deg)}}
@keyframes prop-z{0%{opacity:0;transform:translate(0,5px) scale(.7)}30%{opacity:1}100%{opacity:0;transform:translate(5px,-8px) scale(1.08)}}
@keyframes resident-fight{0%,100%{transform:scaleX(var(--bm-face)) translateX(-2px) rotate(-5deg)}50%{transform:scaleX(var(--bm-face)) translateX(3px) rotate(5deg)}}
@keyframes prop-fist{0%,100%{transform:translate(-5px,3px) rotate(-12deg) scale(.82)}55%{transform:translate(5px,-2px) rotate(5deg) scale(1.05)}}
@keyframes prop-impact{0%,42%,100%{opacity:0;transform:scale(.45) rotate(-8deg)}55%,72%{opacity:1;transform:scale(1.08) rotate(5deg)}}
@keyframes interaction-pulse{from{opacity:.45;transform:scale(.92)}to{opacity:1;transform:scale(1.08)}}
.camera-note{position:absolute;z-index:20;left:12px;bottom:12px;padding:5px 7px;background:var(--bm-ink);color:var(--bm-paper);font:500 9px var(--bm-mono);letter-spacing:.06em;text-transform:uppercase}
.sidebar{background:var(--bm-panel);color:var(--bm-panel-text);border-left:1px solid var(--bm-panel);min-width:0}
.side-section{padding:18px;border-bottom:1px solid var(--bm-panel-line)}
.sidebar .label{color:var(--bm-panel-muted)}
.side-title{margin:8px 0 4px;font-size:27px;font-weight:400;letter-spacing:-.05em;line-height:1}
.side-meta{margin:0;color:var(--bm-panel-muted);font-size:11px}
.metric{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:18px;min-height:46px;border-top:1px solid var(--bm-panel-line)}
.metric:first-child{border-top:0}
.metric-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--bm-panel-muted)}
.metric-value{font-size:18px;font-weight:500;font-variant-numeric:tabular-nums}
.metric-value.small{font-size:12px;text-align:right}
.meter{grid-column:1/-1;height:2px;margin-top:-10px;background:rgba(255,255,255,.12)}
.meter i{display:block;height:100%;width:0;background:var(--bm-panel-text);transition:width .3s ease}
.current-action{display:inline-block;margin-top:13px;padding:5px 7px;background:var(--bm-panel-text);color:var(--bm-panel);font-size:9px;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.side-copy{margin:10px 0 0;font-size:13px;line-height:1.55;color:var(--bm-panel-text)}
.side-events{max-height:265px;overflow:auto}
.side-event{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;padding:10px 0;border-top:1px solid var(--bm-panel-line)}
.side-event:first-child{margin-top:9px}
.side-event time{font:400 8px/1.4 var(--bm-mono);color:var(--bm-panel-muted)}
.side-event p{margin:0;font-size:10px;line-height:1.45}
.resident-identity{display:grid;grid-template-columns:68px minmax(0,1fr);gap:13px;align-items:center}
.resident-thumb{width:68px;height:68px;object-fit:contain;background:transparent}
.footer{display:flex;justify-content:space-between;padding:14px 0;font-size:10px;color:var(--bm-muted)}
.error{display:none;margin-top:12px;padding:10px;border:1px solid var(--bm-alert);color:var(--bm-alert);font-size:11px}
.error.show{display:block}
@media(max-width:950px){.layout{grid-template-columns:1fr}.stage{padding-right:0}.sidebar{border-left:0}.house-viewport{min-height:480px}}
@media(max-width:620px){.app{padding:14px}.topbar{grid-template-columns:1fr auto;gap:10px}.brand h1{font-size:23px}.actions{justify-content:flex-end}.primary-cta{grid-column:1/-1;grid-row:2;justify-self:stretch}.house-viewport{min-height:500px;aspect-ratio:4/5}.resident{width:60px;height:70px}.resident>img{width:52px;height:52px}.layout{min-height:0}.clock{margin:0}.side-events{max-height:none}.furniture small{display:none}}
@media(prefers-reduced-motion:reduce){.house-stage,.resident,.interaction-badge,.meter i{transition:none}.resident>img,.interaction-symbol,.pose-prop{animation:none}.pose-z,.pose-impact{opacity:1}}
