:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f4efe7;background:#151311;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:#151311}.app{max-width:720px;margin:0 auto;padding:24px 18px 80px}.screen{display:none}.screen.active{display:block}.brand{font-size:12px;letter-spacing:.18em;font-weight:800;color:#c7a97d}.muted{color:#aaa198;line-height:1.45}h1{font-size:34px;margin:8px 0 6px}h2{font-size:25px;line-height:1.2;margin:8px 0}.clothing-grid{display:grid;gap:10px;margin:24px 0}.clothing-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.clothing-row.three{grid-template-columns:1fr 1fr 1fr}
.clothing-row.four{grid-template-columns:1fr 1fr 1fr 1fr;gap:8px}
.clothing-row.four button{padding:14px 6px;font-size:14px}
.group-label{margin:14px 2px 8px;font-size:12px;letter-spacing:.08em;color:#c7a97d;font-weight:700;text-transform:uppercase}button{border:1px solid #4a433b;background:#25211d;color:#f5efe7;border-radius:14px;padding:14px 12px;font-size:16px;font-weight:650}button.selected{background:#6b573e;border-color:#b7905f;position:relative}
button.selected::after{content:'✓';position:absolute;right:10px;top:8px;color:#e9d5ab;font-weight:800}button.primary{width:100%;background:#d0ac7b;color:#17130f;border-color:#d0ac7b}.actions{display:flex;gap:10px;margin:12px 0}.actions>*{flex:1}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.command-card,.panel{background:#201c19;border:1px solid #3d3630;border-radius:18px;padding:18px;margin:18px 0}.command-card{min-height:150px}.eyebrow,.panel-title{font-size:11px;letter-spacing:.14em;color:#c7a97d;font-weight:800}.doll-wrap{display:grid;grid-template-columns:130px 1fr;gap:18px;align-items:center;margin-top:16px}.doll{position:relative;width:100px;height:220px;margin:auto}.head{position:absolute;width:44px;height:44px;border:2px solid #c9bfb4;border-radius:50%;left:28px;top:0}.torso{position:absolute;width:56px;height:80px;border:2px solid #c9bfb4;border-radius:18px 18px 14px 14px;left:22px;top:49px}.arm,.leg{position:absolute;width:18px;border:2px solid #c9bfb4;border-radius:12px}.arm{height:86px;top:54px}.arm.left{left:2px;transform:rotate(8deg)}.arm.right{right:2px;transform:rotate(-8deg)}.leg{height:92px;top:125px}.leg.left{left:27px}.leg.right{right:27px}
.doll{transition:transform .25s ease}
.garment{position:absolute;border-radius:10px;opacity:0;transition:opacity .2s;background:#8a7350;pointer-events:none}
.garment.show{opacity:.92}
.garment.top{left:19px;top:47px;width:58px;height:62px}
.garment.bottom{left:20px;top:122px;width:56px;height:88px;background:#5f5138}
.garment.feet{width:20px;height:12px;top:210px;background:#332c24;border-radius:6px}
.garment.feet.left{left:26px}.garment.feet.right{right:26px}
.wallbar{position:absolute;left:-14px;top:0;bottom:0;width:6px;background:#4a433b;border-radius:3px;opacity:0;transition:opacity .2s}
.doll[data-wall="1"] .wallbar{opacity:1}
/* Family-based transforms (item 22). 43 base positions share ~30 visual
   families rather than each getting bespoke art — see app.js comment on
   POSITION_VISUAL for why. Mirrored pairs get their own rule. */
.doll[data-family="standing"]{transform:none}
.doll[data-family="standing-lean"]{transform:translateY(6px) rotate(10deg)}
.doll[data-family="kneeling"]{transform:translateY(26px) scaleY(.82)}
.doll[data-family="kneeling-back"]{transform:translateY(34px) scaleY(.7)}
.doll[data-family="one-knee-l"]{transform:translateY(20px) scaleY(.88) rotate(-6deg)}
.doll[data-family="one-knee-r"]{transform:translateY(20px) scaleY(.88) rotate(6deg)}
.doll[data-family="head-down"]{transform:rotate(18deg) translate(6px,18px)}
.doll[data-family="all-fours"]{transform:rotate(85deg) translate(-46px,4px)}
.doll[data-family="all-fours-forearms"]{transform:rotate(85deg) translate(-52px,10px) scaleY(.92)}
.doll[data-family="seated"]{transform:translateY(30px) scaleY(.75)}
.doll[data-family="seated-floor"]{transform:translateY(40px) scaleY(.68)}
.doll[data-family="seated-side-l"]{transform:translateY(38px) scaleY(.7) rotate(-8deg)}
.doll[data-family="seated-side-r"]{transform:translateY(38px) scaleY(.7) rotate(8deg)}
.doll[data-family="squat"]{transform:translateY(46px) scaleY(.68)}
.doll[data-family="squat-deep"]{transform:translateY(54px) scaleY(.58)}
.doll[data-family="crouch"]{transform:translateY(40px) scaleY(.65) rotate(8deg)}
.doll[data-family="bent"]{transform:rotate(38deg) translate(-4px,10px)}
.doll[data-family="fold"]{transform:rotate(55deg) translate(-10px,20px) scaleY(.9)}
.doll[data-family="fold-wide"]{transform:rotate(55deg) translate(-10px,20px) scaleY(.9) scaleX(1.15)}
.doll[data-family="lying-back"]{transform:rotate(90deg) translate(-58px,20px)}
.doll[data-family="lying-front"]{transform:rotate(-90deg) translate(-40px,58px)}
.doll[data-family="lying-side-l"]{transform:rotate(90deg) translate(-58px,20px) scaleY(.9)}
.doll[data-family="lying-side-r"]{transform:rotate(-90deg) translate(-58px,58px) scaleY(.9)}
.doll[data-family="wall"]{transform:translateX(6px)}
.doll[data-family="wall-sit"]{transform:translate(6px,34px) scaleY(.8)}
.doll[data-family="wall-lean"]{transform:rotate(-20deg) translate(10px,6px)}
.doll[data-family="wall-forearms"]{transform:rotate(-25deg) translate(6px,10px) scaleY(.95)}
.doll[data-family="inverted-v"]{transform:rotate(70deg) translate(-40px,-6px) scaleY(1.05)}
.doll[data-family="arched-up"]{transform:rotate(-95deg) translate(-30px,60px) scaleY(1.05)}
.doll[data-family="arched-low"]{transform:rotate(-92deg) translate(-34px,64px) scaleY(.9)}
.doll[data-family="arched-forearm"]{transform:rotate(-92deg) translate(-34px,64px) scaleY(.85)}
.doll[data-family="child-pose"]{transform:translateY(40px) scaleY(.6) rotate(4deg)}
.doll[data-family="bridge"]{transform:rotate(95deg) translate(-40px,-30px) scaleY(1.1)}
.doll[data-family="happy-baby"]{transform:rotate(90deg) translate(-58px,20px) scaleY(.85)}
.doll[data-family="pigeon-l"]{transform:translateY(42px) scaleY(.65) rotate(-10deg)}
.doll[data-family="pigeon-r"]{transform:translateY(42px) scaleY(.65) rotate(10deg)}
.doll[data-family="balance-l"]{transform:translateY(4px) rotate(-4deg)}
.doll[data-family="balance-r"]{transform:translateY(4px) rotate(4deg)}
.arm{transition:transform .25s ease}
.garment-state{display:flex;flex-wrap:wrap;gap:7px}
.muted.small{font-size:12px;margin:-6px 0 10px}
.history li.violation{color:#e8a34d;font-weight:700}
.panel.has-violations{border-color:#e8a34d}
#stallInfo .state-item{margin-top:6px}
.pos-group-title{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#c7a97d;font-weight:800;margin:14px 0 6px}
.pos-group-title:first-child{margin-top:0}
.pos-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #2c2822}
.pos-info{display:flex;flex-direction:column;gap:2px;font-size:13px}
.pos-info .muted{font-size:11px}
.pos-actions{display:flex;gap:6px;flex-shrink:0}
.pos-actions button{padding:8px 10px;font-size:12px}
.update-banner{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#3a2f1c;border:1px solid #b7905f;border-radius:12px;padding:10px 14px;margin:10px 0;font-size:13px}
.update-banner.hidden{display:none}
.update-banner button{padding:8px 10px;font-size:12px;background:#d0ac7b;color:#17130f;border-color:#d0ac7b}
.version-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:10px 0 4px;flex-wrap:wrap}
.debug-details{margin:10px 0 18px;color:#aaa198;font-size:13px}
.debug-details summary{cursor:pointer;color:#c7a97d;font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.debug-details .state-grid{margin-top:10px}
.env-indicator{margin-top:10px;font-size:11px;letter-spacing:.04em;color:#9f958b;min-height:14px}
.env-indicator[data-type="wall"], .env-indicator[data-type="wall-proximity"]{color:#c7a97d}
.env-indicator[data-type="bed"]{color:#8fb3c7}
.env-indicator[data-type="table"]{color:#c78f8f}
.env-indicator[data-type="seat"]{color:#a8c78f}
.env-indicator[data-type="floor_modifier"]{color:#c7bb8f}
.coverage-table{width:100%;border-collapse:collapse;font-size:11px;margin-top:8px;overflow-x:auto;display:block}
.coverage-table th,.coverage-table td{border:1px solid #3d3630;padding:6px 8px;text-align:center;white-space:nowrap}
.coverage-table th{color:#c7a97d;font-weight:700}
.coverage-table td:first-child,.coverage-table th:first-child{text-align:left}
.chip{border:1px solid #4a433b;border-radius:999px;padding:7px 9px;font-size:12px}
.chip.on{background:#5b4935}.chip.off{opacity:.45}
.state-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.state-item{background:#171411;border-radius:10px;padding:10px}
.state-item b{display:block;font-size:11px;color:#9f958b;margin-bottom:4px}
.compact button{padding:10px;font-size:13px}
.history{padding-left:22px;margin-bottom:0}
.history li{margin:8px 0;color:#d7cfc7}
@media(max-width:480px){.doll-wrap{grid-template-columns:100px 1fr}.state-grid{grid-template-columns:1fr 1fr}.app{padding-left:14px;padding-right:14px}}

/* Obey V1.3: keep engine metadata in diagnostics, not player dialogue box */
.command-debug-meta{display:none}
.command-card h2{line-height:1.28}

.tone-panel{margin:14px 0;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:12px;display:grid;gap:8px}.tone-panel select,.control-grid select,.control-grid input{width:100%;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:#211e1a;color:inherit}.control-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.control-grid label{display:grid;gap:6px;font-size:.9rem}

/* Obey V1.5: visible three-way dialogue tone selector */
.tone-panel{margin:16px 0;padding:14px;border:1px solid rgba(255,255,255,.14);border-radius:14px;display:grid;gap:10px}
.tone-title{display:flex;justify-content:space-between;align-items:center;gap:10px}
.tone-current{font-size:12px;color:#e9d5ab;text-transform:uppercase;letter-spacing:.08em}
.tone-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tone-buttons button{padding:12px 7px;font-size:14px}
.tone-buttons button.selected{background:#6b573e;border-color:#d0ac7b}
.tone-preview{background:#171411;border:1px solid #3d3630;border-radius:10px;padding:11px 12px;font-size:14px;line-height:1.35;color:#f4efe7}

/* Obey V1.8 setup ordering and room selector */
.setup-start{width:100%;margin:18px 0 14px;}
.room-panel{margin:14px 0 16px;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.025);}
.room-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px;}
.room-grid button.selected::before{content:"✓ ";font-weight:800;}
.room-grid button.selected{outline:2px solid currentColor;outline-offset:-2px;}
@media (min-width:700px){.room-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}


/* Visual V22 narrative testing tools */
.patient-name-label{display:grid;gap:7px;font-weight:700}
.patient-name-label input{width:100%;box-sizing:border-box;padding:12px 13px;border-radius:10px;border:1px solid var(--line,#454a3b);background:rgba(255,255,255,.04);color:inherit;font:inherit}
.narrative-actions{display:flex;gap:10px;flex-wrap:wrap}
.narrative-status{margin-top:8px;min-height:1.2em}
.narrative-box{margin-top:12px;padding:16px;border:1px solid var(--line,#454a3b);border-radius:12px;background:rgba(0,0,0,.16);white-space:pre-wrap;line-height:1.62;max-height:52vh;overflow:auto}
.narrative-trace{margin-top:10px}
.narrative-trace pre{white-space:pre-wrap;word-break:break-word;max-height:34vh;overflow:auto;padding:12px;border-radius:10px;background:rgba(0,0,0,.2);font-size:.78rem;line-height:1.4}

/* Intake Storymode V30: copy control becomes visibly active only after generation */
#copyNarrative:disabled{opacity:.38;filter:saturate(.35);cursor:not-allowed;}
#copyNarrative.narrative-copy-ready{opacity:1;font-weight:800;box-shadow:0 0 0 2px currentColor inset,0 0 16px rgba(255,255,255,.18);}
