/* Top-down study. Design decisions: plans/2026-09-06-walking/plan.md. */
.screen.game-ready .map-room.is-active, .map-room:target { display: block; }
.map-room { inset: 0; }
.room-heading { position: absolute; left: 13%; right: 12%; top: 10%; }
.room-heading h2 { margin: 0 0 7px; font-size: clamp(23px, 3.8cqw, 35px); }
.room-heading p { margin: 0; font: clamp(10px, 1.45cqw, 13px) / 1.6 "Courier New", monospace; opacity: .86; }
.room-map { position: absolute; left: 13%; right: 13%; top: 28%; bottom: 17%; isolation: isolate; background-color: #294c45; background-image: repeating-linear-gradient(0deg, transparent 0 calc(100% / var(--rows) - 1px), rgb(129 158 140 / .08) calc(100% / var(--rows) - 1px) calc(100% / var(--rows))), repeating-linear-gradient(90deg, transparent 0 calc(100% / var(--cols) - 1px), rgb(9 36 37 / .1) calc(100% / var(--cols) - 1px) calc(100% / var(--cols))); box-shadow: 0 8px 0 #123138, 8px 8px 0 rgb(6 21 30 / .15), inset 0 0 20px rgb(11 37 37 / .2); }
.room-map:focus { outline: none; }
.room-map::before { content: ''; position: absolute; bottom: 100%; left: 0; right: 0; height: 16px; background: #4c6a66; border-top: 4px solid #6b8580; box-shadow: inset 0 -4px #31534f; }
.room-map::after { content: ''; position: absolute; inset: 0; border-left: 5px solid #456762; border-right: 5px solid #456762; border-bottom: 3px solid #41625e; pointer-events: none; }
.room-rug { position: absolute; top: 37%; bottom: 25%; left: 36%; right: 36%; background: #335a61; border: 3px solid #557974; box-shadow: inset 0 0 0 2px #30545b, 2px 3px rgb(12 40 45 / .23); opacity: .8; pointer-events: none; }
.room-rug::after { content: ''; position: absolute; inset: 6px; border: 1px solid rgb(155 175 155 / .15); }
.back-window { position: absolute; bottom: calc(100% + 1px); height: 27px; left: 43%; right: 43%; background: #213f52; border: 3px solid #79938b; box-shadow: 0 2px #2c4b51; }
.back-window::before, .back-window::after { content: ''; position: absolute; background: #76938d; }
.back-window::before { left: 48%; width: 2px; top: 0; bottom: 0; }
.back-window::after { top: 45%; height: 2px; left: 0; right: 0; }
.room-items { position: absolute; inset: 0; }
.room-object { position: absolute; display: block; color: var(--ice); text-decoration: none; -webkit-tap-highlight-color: transparent; cursor: pointer; }
.object-art { width: 100%; height: 100%; display: block; overflow: visible; filter: blur(.15px) drop-shadow(1px 2px 1px rgb(4 24 33 / .3)); }
.object-name { position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); width: 150%; text-align: center; font: clamp(10px, 1.4cqw, 13px) / 1.25 "Courier New", monospace; text-wrap: balance; text-shadow: 0 1px 2px #123330, 0 0 5px rgb(174 205 222 / .2); }
.room-object:hover .object-art, .room-object.is-selected .object-art { filter: blur(.15px) drop-shadow(0 0 5px rgb(173 215 216 / .4)); }
.room-object:hover .object-name, .room-object.is-selected .object-name { color: #e7eee2; text-decoration: underline; text-underline-offset: 4px; }
.room-object:focus-visible { outline: 1px solid #bdd4ce; outline-offset: 4px; }
.room-object.is-selected::after { content: ''; position: absolute; top: 0; bottom: 0; left: -4px; right: -4px; border-bottom: 1px solid rgb(198 221 208 / .5); }
.map-room .room-exit { min-height: 0; min-width: 0; margin: 0; opacity: 1; }
.room-exit .object-name { top: calc(100% + 3px); bottom: auto; font-size: 10px; }
.room-exit .object-art { height: 90%; }
.writing-room .room-rug { left: 32%; right: 32%; top: 47%; bottom: 23%; }
.shelf-room .room-rug { top: 24%; bottom: 36%; }
.character .astronaut-back { display: none; }
.character[data-facing="up"] .astronaut-front { display: none; }
.character[data-facing="up"] .astronaut-back { display: inline; }
.character::before { content: ''; position: absolute; left: 7%; right: 7%; bottom: -1px; height: 4px; border-radius: 50%; background: rgb(4 22 32 / .35); filter: blur(1px); }
.character[data-facing="up"] svg, .character[data-facing="down"] svg { transform: none; }
.has-map .character .astronaut-front > path:nth-child(2) { fill: var(--suit-color, #deebf3); }
.has-map .character .astronaut-front > path:nth-child(5) { fill: var(--suit-color, #cedeea); }
.has-map .character .astronaut-back > path:first-child { fill: var(--suit-color, #bcd1df); }
.has-map .character .leg-left, .has-map .character .leg-right { fill: var(--suit-color, #c7dce9); }
.remote-character { transition: transform 100ms linear; }
.remote-character.is-walking .leg-left { animation: visitor-left .2s steps(1) infinite; }
.remote-character.is-walking .leg-right { animation: visitor-right .2s steps(1) infinite; }
@keyframes visitor-left { 0%, 100% { transform: translate(-1px, -1px); } 50% { transform: translate(1px, 0); } }
@keyframes visitor-right { 0%, 100% { transform: translate(1px, 0); } 50% { transform: translate(-1px, -1px); } }
@media (prefers-reduced-motion: reduce) {
  .remote-character { transition: none; }
  .remote-character.is-walking .leg-left, .remote-character.is-walking .leg-right { animation: none; }
}
.screen.has-map .contact { bottom: 3.5%; }
.photo-glass { display: block; cursor: zoom-in; }
.photo-error { font: 12px / 1.5 "Courier New", monospace; }
.photo-error a { color: inherit; }
@media (max-width: 600px) {
  .room-heading { top: 10%; left: 12%; }
  .room-heading h2 { font-size: 25px; }
  .room-map { left: 11%; right: 11%; top: 27%; bottom: 16%; }
  .room-map::before { height: 11px; border-top-width: 3px; }
  .back-window { height: 22px; left: 42%; right: 42%; }
  .object-name { font-size: 10px; width: 155%; bottom: calc(100% + 5px); }
  .room-rug { border-width: 2px; }
  .room-map::after { border-inline-width: 3px; }
  .screen.has-map .social-links { gap: 10px; }
  .touch-controls { display: grid; grid-template-columns: repeat(3, 44px) 48px; grid-template-rows: repeat(2, 44px); gap: 3px; }
  .touch-controls button { width: 44px; height: 44px; padding: 8px; }
  .touch-controls [data-control="up"] { grid-column: 2; grid-row: 1; }
  .touch-controls [data-control="left"] { grid-column: 1; grid-row: 2; }
  .touch-controls [data-control="down"] { grid-column: 2; grid-row: 2; }
  .touch-controls [data-control="right"] { grid-column: 3; grid-row: 2; }
  .touch-controls .open-section { grid-column: 4; grid-row: 2; margin-left: 4px; width: 44px; }
  .television { margin-bottom: 108px; }
}
@media (max-width: 360px) { .object-name { font-size: 9px; } .room-heading h2 { font-size: 23px; } }
.story-source { display: none; }
.screen:not(.game-ready) .story-source:target { display: block; position: absolute; inset: 12%; color: var(--ice); overflow: auto; }
.screen:not(.game-ready):has(.story-source:target) .world { display: none; }
.story-dialog { width: min(790px, calc(100vw - 56px)); max-height: min(80dvh, 710px); margin: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); container-type: inline-size; padding: 0; border: 1px solid rgb(175 200 224 / .42); border-radius: 4px; color: var(--ice); background: linear-gradient(120deg, #142c2e, #142336); box-shadow: 0 18px 80px rgb(0 0 0 / .55), 0 0 0 3px rgb(20 40 48 / .8), inset 0 0 25px rgb(6 16 25 / .4); overflow: hidden; }
.story-dialog[open] { display: flex; flex-direction: column; animation: story-open 200ms cubic-bezier(.22, 1, .36, 1); }
.story-dialog::backdrop { background: rgb(0 5 10 / .38); }
.story-dialog::after { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: .07; background: repeating-linear-gradient(0deg, rgb(0 3 8 / .3) 0 1px, transparent 1px 3px); }
.story-header { display: flex; align-items: start; justify-content: space-between; gap: 18px; flex: none; padding: 23px 28px 18px; border-bottom: 1px solid rgb(206 220 255 / .12); }
.story-context { margin: 0 0 7px; font: 11px / 1.5 "Courier New", monospace; color: #9fb8c6; }
.story-header h2 { margin: 0; font: 700 clamp(23px, 4vw, 31px) / 1.2 Georgia, serif; text-shadow: -.6px 0 .8px rgb(99 132 240 / .4), 0 0 9px rgb(120 165 255 / .2); }
.story-header h2:focus { outline: none; }
.story-close { display: flex; align-items: center; gap: 8px; border: 0; background: transparent; color: #bed0e1; min-height: 44px; padding: 0 0 0 12px; cursor: pointer; font: 11px "Courier New", monospace; }
.story-close span { font-size: 21px; }
.story-close:hover { color: #edf4ff; }
.story-close:focus-visible, .story-content:focus-visible { outline: 1px solid #bed0e1; outline-offset: -4px; }
.story-content { padding: 24px 28px 22px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #64808c transparent; }
.story-body { display: grid; gap: 28px; }
.has-photo .story-body { grid-template-columns: 1.1fr 1fr; align-items: start; }
.story-copy { font: 16px / 1.7 Georgia, serif; }
.story-copy p { margin: 0 0 18px; text-wrap: pretty; }
.story-copy p:last-child { margin-bottom: 0; }
.project-lede { color: #e0e7f5; font-size: 19px; line-height: 1.45; }
.project-fact { font: 12px / 1.7 "Courier New", monospace; }
.project-actions { display: flex; flex-wrap: wrap; gap: 0 24px; flex-shrink: 0; margin-top: 16px; }
.project-actions .reading-link { font-size: 12px; }
/* <design_plan> vibe_validity: PASS; motion_personality: PASS (static);
   button_contrast: PASS; honest_copy: PASS. See plans/2026-09-06-photo-treatment/plan.md. */
.story-photo { margin: 0; min-width: 0; }
/* <design_plan> vibe_validity: PASS; motion_personality: PASS (static);
   button_contrast: PASS; honest_copy: PASS. plans/2026-09-06-lived-in-room/plan.md */
.photo-glass { position:relative; display:block; overflow:hidden; aspect-ratio:4/3; border:0; border-radius:0; background:transparent; }
.photo-glass img { display:block; width:100%; height:100%; object-fit:cover; object-position:54% 48%; border-radius:0; }
.story-photo:has(.photo-glass:focus-visible) { outline:1px solid #bdd4ce; outline-offset:4px; }
.photo-glass:focus-visible { outline:none; }
.screenshot-photo .photo-glass { aspect-ratio: 1; }
.screenshot-photo .photo-glass img { object-position: center; }
.website-photo .photo-glass { aspect-ratio: 16 / 9; }
/* The mri is three scans side by side; cropping it to 16:9 would cut the outer two. */
.scan-photo .photo-glass, .story-dialog .scan-photo .photo-glass, .story-photo.scan-photo:not(.scholar-photo) .photo-glass { aspect-ratio: 1400 / 524; }
.story-photo figcaption { margin-top: 10px; font: 10px / 1.6 "Courier New", monospace; color: #acbfca; }
.story-footer { display: flex; justify-content: space-between; gap: 16px; flex: none; padding: 12px 28px; border-top: 1px solid rgb(206 220 255 / .1); color: #9fb8c6; font: 10px / 1.5 "Courier New", monospace; }
@keyframes story-open { from { opacity: 0; transform: translate(-50%, calc(-50% + 8px)) scale(.975); } to { opacity: 1; transform: translate(-50%, -50%); } }
@container (max-width: 530px) {
  .story-header h2 { font-size: 25px; }
  .story-header { padding: 17px 19px 13px; }
  .story-content { padding: 19px; }
  .story-footer { padding: 11px 19px; }
}
@container (max-width: 400px) {
  .has-photo .story-body { grid-template-columns: 1fr; gap: 18px; }
}

.room-iris, .travel-caption { position: absolute; z-index: 1; pointer-events: none; }
.room-iris { inset: 0; width: 100%; height: 100%; }
.travel-caption { left: 10%; right: 10%; top: 45%; display: flex; flex-direction: column; align-items: center; gap: 16px; color: var(--ice); opacity: 0; font: clamp(12px, 2cqw, 16px) / 1.6 "Courier New", monospace; text-align: center; letter-spacing: .08em; text-shadow: 0 0 8px rgb(120 165 255 / .3); }
.travel-caption svg { width: 14px; height: 14px; }
.screen.is-travelling .screen-content { pointer-events: none; }

@media (max-width: 600px) {
  .story-dialog { width: calc(100vw - 32px); }
  .story-header { padding: 15px 17px 12px; }
  .story-content { padding: 17px; }
  .has-photo .story-body { grid-template-columns: 1fr; gap: 18px; }
  .story-copy { font-size: 15px; line-height: 1.65; }
  .story-footer { padding: 10px 17px; }
  .story-header h2 { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) { .room-iris, .travel-caption { display: none !important; } .story-dialog[open] { animation: none; } }

.photo-hint { display: block; margin-top: 5px; color: #c2d3d5; }
.has-photo .research-story { grid-template-columns: 1fr; gap: 22px; }
.has-photo .civic-story { grid-template-columns: 1fr; gap: 30px; }
.story-chapter { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px; align-items: start; }
.story-chapter + .story-chapter { padding-top: 28px; border-top: 1px solid rgb(206 220 255 / .12); }
.board-photo .photo-glass { aspect-ratio: 4 / 3; }
.board-photo .photo-glass img { object-position: 68% center; }
.governor-photo .photo-glass img { object-position: 68% center; }
.voice-photo .photo-glass { aspect-ratio: 3 / 2; }
.inline-source { color: inherit; text-decoration-color: rgb(215 225 213 / .5); text-underline-offset: 4px; }
.inline-source:hover { color: #edf4ff; }
@container (max-width: 400px) {
  .story-chapter { grid-template-columns: 1fr; gap: 18px; }
  .story-photo:not(.scholar-photo):not(.screenshot-photo) .photo-glass { aspect-ratio: 16 / 9; }
  .governor-photo .photo-glass img { object-position: 68% 25%; }
}
@media (max-width: 600px) {
  .story-chapter { grid-template-columns: 1fr; gap: 18px; }
  .story-photo:not(.scholar-photo):not(.screenshot-photo) .photo-glass { aspect-ratio: 16 / 9; }
  .governor-photo .photo-glass img { object-position: 68% 25%; }
}
.scholar-photo .photo-glass { aspect-ratio: 4 / 1; }
.scholar-photo .photo-glass img { position: absolute; width: 156.1%; max-width: none; height: auto; left: -28.05%; top: -57.56%; object-fit: initial; }
.project-fact a { color: #d7e1d5; text-decoration-color: rgb(215 225 213 / .4); text-underline-offset: 4px; }
.citation-date { font-size: 10px; color: #acbfca; }

/* <design_plan> vibe_validity: PASS; motion_personality: PASS;
   button_contrast: PASS; honest_copy: PASS. plans/2026-09-06-personal-objects/plan.md */
.workroom .room-map { left: 13%; right: 13%; top: 31%; bottom: 17%; background-color: #756d51; background-image: repeating-linear-gradient(0deg, transparent 0 24px, rgb(205 181 135 / .12) 24px 25px), repeating-linear-gradient(90deg, transparent 0 14%, rgb(33 50 38 / .1) 14% 14.2%, transparent 14.2% 37%); box-shadow: 0 7px 0 #354537, 4px 8px 10px rgb(0 15 20 / .2), inset 0 0 24px rgb(16 30 24 / .2); }
.workroom .room-map::before { height: 14%; background: #73775e; border-top: 4px solid #a29876; box-shadow: inset 0 -4px #927653; }
.workroom .room-map::after { z-index: 502; border-color: #827053; border-bottom-color: #a48e66; border-inline-width: 4px; }
.workroom .back-window { left: 34%; right: 57%; height: 28px; bottom: calc(100% + 4px); border-color: #b7af8c; background: linear-gradient(150deg, #74938d, #3e5e68); }
.workroom .back-window::before, .workroom .back-window::after { background: #a19c80; }
.conversation-pit { position: absolute; pointer-events: none; filter: drop-shadow(1px 3px 1px rgb(20 42 30 / .25)); }
.conversation-pit svg { display: block; width: 100%; height: 100%; }
.room-furniture { position: absolute; pointer-events: none; }
.room-furniture svg, .workroom .object-art { position: relative; display: block; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(1px 3px 1px rgb(4 24 28 / .3)); }
/* Each project owns a distinct object; headings group the room without shared triggers. */
.project-group { position: absolute; inset: 0; pointer-events: none; }
.project-group .room-object { pointer-events: auto; }
.zone-label { position: absolute; margin: 0; color: #e3d7b9; text-align: center; font: 400 clamp(10px,1.65cqw,13px) / 1.35 "Courier New", monospace; text-shadow: 0 1px 2px #26382f; }
.workroom .personal-object .object-name { z-index: 1; width: max-content; max-width: 170px; bottom: calc(100% + 5px); padding: 5px 8px; border: 1px solid #758270; border-radius: 3px; background: #203a36; color: #eee3c7; font-size: 11px; text-decoration: none; text-shadow: none; opacity: 0; pointer-events: none; }
.workroom .personal-object:is(:hover,:focus-visible,.is-selected) { z-index: 600 !important; }
.workroom .personal-object:is(:hover,:focus-visible,.is-selected) .object-name { opacity: 1; }
.workroom .personal-object.is-selected::after { content: none; }
.workroom .personal-object:focus-visible { outline: none; }
.workroom .personal-object:is(:hover,:focus-visible,.is-selected) .object-art { filter: drop-shadow(0 0 3px rgb(233 208 157 / .45)); }
.workroom [data-item="driftwood"] .object-name, .workroom [data-item="voice-isolator"] .object-name, .workroom [data-item="eisenhower-box"] .object-name { left: 0; transform: none; }
.workroom [data-item="student-committee"] .object-name, .workroom [data-item="youth-governor"] .object-name { left: auto; right: 0; transform: none; }
.workroom .room-exit .object-name { font-size: 10px; }
.workroom .character { filter: drop-shadow(0 0 1px rgb(189 211 193 / .12)); }
.workroom .room-shade, .workroom .room-light { position: absolute; inset: 0; pointer-events: none; }
.workroom .room-shade { z-index: 500; inset: -14% 0 0; background: radial-gradient(ellipse at 56% 42%, transparent 20%, rgb(9 28 29 / .23) 67%, rgb(6 22 25 / .48) 100%); mix-blend-mode: multiply; }
.workroom .room-light { z-index: 501; background: radial-gradient(ellipse 26% 46% at var(--hearth-x) var(--hearth-y), rgb(231 151 69 / .22), transparent 100%), radial-gradient(ellipse 31% 35% at var(--lounge-x) var(--lounge-y), rgb(231 190 122 / .09), transparent 100%); mix-blend-mode: screen; }
.hearth-glow { position: absolute; left: -35%; right: -35%; top: 47%; bottom: -45%; background: radial-gradient(ellipse at 50% 35%, rgb(244 175 96 / .25), transparent 65%); animation: hearth-light 3.1s ease-in-out infinite alternate; }
.flame { transform-origin: 60px 72px; animation: flame-flicker .8s steps(3,end) infinite alternate; }
.flame-inner { animation-delay: -.35s; animation-duration: .55s; }
@keyframes flame-flicker { 0% { transform: scale(.95,.85); opacity: .78; } 50% { transform: scale(1.04,1); opacity: 1; } 100% { transform: scale(.94,.94); opacity: .9; } }
@keyframes hearth-light { to { opacity: .6; } }
.story-cluster-nav { display: flex; gap: 7px 16px; flex-wrap: wrap; flex: none; padding: 11px 28px; border-bottom: 1px solid rgb(206 220 255 / .12); }
.story-cluster-nav[hidden] { display: none; }
.story-cluster-nav a { font: 11px / 1.45 "Courier New",monospace; color: #aabdb7; text-decoration: none; padding: 3px 0; }
.story-cluster-nav a[aria-current="page"] { color: #e3dfc4; text-decoration: underline; text-underline-offset: 4px; }
.story-cluster-nav a:hover, .story-cluster-nav a:focus-visible { color: #fff0c7; outline-offset: 3px; }
@media (max-width: 600px) {
  .workroom .room-map { left: 9%; right: 9%; top: 29%; bottom: 13%; }
  .workroom .room-map::before { height: 12%; border-top-width: 3px; }
  .workroom .back-window { display: none; }
  .zone-label { font-size: 10px; }
  .workroom .personal-object .object-name { font-size: 10px; max-width: 140px; }
  .story-cluster-nav { padding: 9px 17px; }
}
@media (prefers-reduced-motion: reduce) { .flame, .hearth-glow { animation: none; } }

/* <design_plan> vibe_validity: PASS; motion_personality: PASS;
   button_contrast: PASS; honest_copy: PASS. plans/2026-09-06-connected-house/plan.md */
/* One continuous house, observed through a camera. */
.house .room-heading { top:7%; left:8%; right:8%; }
.house .room-heading h2 { margin:0 0 5px; font-size:clamp(23px,3.4cqw,32px); }
.house .room-heading p { font-size:clamp(10px,1.35cqw,12px); }
.house-nav { position:absolute; top:18%; left:8%; right:8%; display:flex; gap:20px; z-index:4; }
.house-nav a { color:#b5c6c0; font:11px/1.4 'Courier New',monospace; text-decoration:none; padding:8px 0; }
.house-nav a[aria-current] {color:#eadcbe;text-decoration:underline;text-underline-offset:5px;}
.house-nav a:focus-visible {outline:1px solid #d8c5a0;outline-offset:4px;}
.house-viewport { position:absolute; inset:25% 6% 11%; overflow:clip; border-radius:4px; touch-action:none; isolation:isolate; background:#142a29; }
.house .room-map { left:0;top:0;right:auto;bottom:auto; background:none; box-shadow:none; will-change:transform; transform-origin:0 0; }
.house .room-map::before,.house .room-map::after {content:none;}
.house .house-floor {position:absolute;background-color:#776d51;background-image:repeating-linear-gradient(0deg,transparent 0 23px, rgb(39 47 34 / .18) 23px 24px),repeating-linear-gradient(90deg,transparent 0 92px,rgb(193 166 121 / .13) 92px 93px);box-shadow:inset 0 -3px #aa9168;pointer-events:none;}
.house-wall {position:absolute;background:#777b60;border-top:3px solid #b0a47f;box-shadow:inset 0 -5px #aa9168,3px 0 4px rgb(9 24 22 / .12);pointer-events:none;}
.house-wall[data-item^="partition"] {background:linear-gradient(90deg,#72735a,#959176 62%,#aaa080 64%,#b2a381 72%,#74755c 74%);border:0;box-shadow:3px 0 5px rgb(8 24 21 / .18);}
.house-furniture,.house-decor,.house-window,.house-rug {position:absolute;pointer-events:none;}
.house .house-rug:not(.conversation-pit) {background:#596e61;border:3px solid #9b9272;box-shadow:inset 0 0 0 4px #3c5d53;}
.house-window {background:linear-gradient(145deg,#72978f,#3e6371);border:4px solid #baaf8b;box-shadow:0 3px #5a6652;}
.house-window::before {content:'';position:absolute;inset:0 48%;background:#b4ad88;}
.house-window::after {content:'';position:absolute;inset:46% 0;background:#b4ad88;}
.house .house-home {position:absolute;bottom:5.5%;left:8%;font:11px 'Courier New',monospace;color:#bfcbbd;text-underline-offset:4px;z-index:2;}
.screen.has-map .contact {bottom:4.5%;left:35%;right:7%;}
.house .personal-object {background:none;border:0;padding:0;touch-action:none;}
.house .personal-object .object-art {filter:drop-shadow(1px 3px 1px rgb(16 33 26 / .2));}
.house .wall-object .object-art {filter:drop-shadow(0 2px 0 rgb(30 42 30 / .3));}
.house .floor-object .object-art {filter:none;}
.house .personal-object:is(:hover,:focus-visible,.is-selected) {z-index:var(--item-depth) !important;}
.house .personal-object .object-name {font-size:11px;max-width:180px;bottom:calc(100% + 6px);}
.house [data-item] .object-name {left:50%;right:auto;transform:translateX(-50%);}
.house .wall-object .object-name {top:calc(100% + 3px);bottom:auto;}
.house .house-door {background:linear-gradient(90deg,rgb(214 201 160 / .05),rgb(225 201 159 / .15),rgb(214 201 160 / .05));}
.house .house-door .object-name {opacity:1;writing-mode:vertical-rl;white-space:nowrap;background:transparent;border:0;padding:0;top:50%;bottom:auto;left:50%;transform:translate(-50%,-50%);font-size:10px;text-shadow:0 1px 2px #244234;color:#ddd2af;}
/* <design_plan> vibe_validity: PASS; motion_personality: PASS;
   button_contrast: PASS; honest_copy: PASS. plans/2026-09-06-lived-in-room/plan.md */
/* Names belong to the camera overlay, so furniture cannot cover their text. */
.house .personal-object:not(.house-door) .object-name {display:none;}
.house-object-label {position:absolute;z-index:1000;pointer-events:none;box-sizing:border-box;width:max-content;max-width:180px;padding:6px 9px;border:1px solid #758270;border-radius:3px;background:#203a36;color:#eee3c7;font:11px/1.3 'Courier New',monospace;text-align:center;text-wrap:balance;overflow-wrap:anywhere;box-shadow:0 2px 4px rgb(16 33 26 / .18);}
.house .house-door:focus-visible {outline:1px solid #e1c99b;outline-offset:-4px;}
.house-atmosphere {position:absolute;inset:0;z-index:500;pointer-events:none;background:linear-gradient(0deg,rgb(8 25 28 / .12),transparent 25%),radial-gradient(ellipse 9% 30% at 57% 34%,rgb(222 168 97 / .10),transparent);}
.lamp-light {position:absolute;pointer-events:none;width:400%;height:230%;left:-145%;top:-35%;border-radius:50%;background:radial-gradient(ellipse,rgb(244 199 118 / .27),rgb(226 177 100 / .08) 38%,transparent 68%);mix-blend-mode:screen;opacity:1;transition:opacity 300ms ease;}
[data-action="lamp"][aria-pressed="false"] .lamp-light {opacity:0;}
[data-action="lamp"][aria-pressed="false"] .object-art {filter:brightness(.68) saturate(.6);}
.walk-marker {position:absolute;width:10px;height:6px;margin:-3px -5px;border:1px solid #eee1bc;border-radius:50%;z-index:1;pointer-events:none;}
.story-dialog {border-radius:15px;border-color:rgb(161 190 178 / .3);background:linear-gradient(130deg,#203a37,#1c3039);}
.story-header {padding:20px 24px 12px;border:0;align-items:center;}
.story-header h2 {font-size:26px;}
.story-content {padding:0 24px 23px;}
.story-dialog .story-body {display:flex;flex-direction:column;gap:17px;}
.story-dialog .project-lede {font:17px/1.55 Georgia,serif;margin:0;color:#dde3d2;}
.story-dialog .project-actions {margin:0;gap:12px 24px;}
.story-dialog .story-photo .photo-glass {aspect-ratio:16/9;max-height:270px;}
.story-dialog .scholar-photo .photo-glass {aspect-ratio:4/1;}
.story-dialog .screenshot-photo .photo-glass {aspect-ratio:16/10;}
.story-dialog .screenshot-photo img {object-fit:contain;background:#243e3d;}
.story-dialog .project-actions a {font-size:12px;line-height:1.4;padding:9px 0;}
.story-close {min-width:44px;min-height:44px;padding:0;justify-content:center;}
.story-close svg {width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;}
.home-touch {display:none;}
@media (max-width:600px), (pointer:coarse), (max-width:900px) and (max-height:500px) {
 .home-touch:not([hidden]) {display:flex;align-items:center;justify-content:space-between;width:100%;gap:16px;}
 .thumb-steer {position:relative;display:grid;place-items:center;height:68px;width:40%;color:#a8bab3;background:none;border:0;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;}
 .thumb-steer::before {content:'';width:90px;height:30px;border:1px solid #43594f;border-radius:20px;position:absolute;top:19px;background:rgb(37 62 53 / .14);}
 .thumb-steer i {width:22px;height:22px;border:1px solid #adbcad;border-radius:50%;position:absolute;top:23px;transform:translateX(var(--thumb-x,0px));background:#253e35;}
 .thumb-actions {display:grid;justify-items:center;gap:8px;width:40%;}
 .thumb-action {display:grid;place-items:center;width:44px;height:44px;padding:9px;border:1px solid #738d81;border-radius:50%;color:#a8bab3;background:transparent;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;}
 .thumb-action svg {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;}
 .thumb-action:active:not(:disabled) {background:rgb(139 163 140 / .2);}
 .thumb-action:focus-visible {outline:1px solid #d4dabe;outline-offset:3px;}
 .thumb-action:disabled {opacity:.35;cursor:default;}
 .thumb-action[data-home-action="down"].is-ready {color:#d4e2d5;border-color:#a0b6a6;background:rgb(139 163 140 / .12);}
 .world {touch-action:none;user-select:none;-webkit-user-select:none;}
 .controls {flex-wrap:wrap;justify-content:center;}
 .controls:has(.home-touch:not([hidden])) .sound-toggle {position:absolute;top:26px;left:calc(50% - 22px);margin:0;}
 .keyboard-hint {display:none;}.touch-hint {display:inline;}
 .play-instructions {width:100%;flex-basis:100%;text-align:center;}
}
@media (max-width:600px) {
 main {padding:max(16px,env(safe-area-inset-top)) 10px max(18px,env(safe-area-inset-bottom));min-height:100svh;}
 .television {width:min(100%,460px,calc((100svh - 155px) * .8));margin:0 0 118px;}
 .screen {aspect-ratio:4/5;min-height:0;clip-path:none;border-radius:8% / 6%;}
 .house .room-heading {top:6%;left:7%;right:7%;}
 .house .room-heading h2 {font-size:25px;}
 .house .room-heading p {font-size:10px;max-width:90%;}
 .house-nav {top:19%;left:7%;right:7%;gap:24px;}
 .house-nav a {font-size:11px;min-height:36px;padding:10px 0;}
 .house-viewport {inset:29% 3% 12%;border-radius:5px;}
 .house .house-home {bottom:5%;left:7%;font-size:11px;}
 .screen.has-map .contact {left:28%;right:6%;bottom:4%;}
 .screen.has-map .social-links {gap:8px;}
 .controls {top:calc(100% + 10px);gap:0;}
 .play-instructions {font-size:10px;line-height:1.6;}
 .sound-toggle {margin:0 auto;}
 .story-dialog .story-body {gap:15px;}
 .story-header {padding:17px 19px 10px;}
 .story-header h2 {font-size:25px;}
 .story-content {padding:0 19px 18px;}
 .story-dialog .project-lede {font-size:17px;line-height:1.5;}
 .story-dialog .story-photo .photo-glass {max-height:230px;}
}
@media (max-height:550px) and (min-width:601px) {
 main {padding:10px 20px 58px;}
 .television {width:min(92vw,calc((100svh - 70px) * 4 / 3));margin:0;}
 .screen {min-height:0;aspect-ratio:4/3;}
 .house .room-heading {top:5%;}.house .room-heading h2 {font-size:21px;}
 .house .room-heading p {display:none;}.house-nav {top:14%;}
 .house-viewport {top:25%;}
 .home-touch:not([hidden]) {position:fixed;bottom:max(8px,env(safe-area-inset-bottom));left:12px;width:calc(100% - 24px);pointer-events:none;}
 .thumb-steer,.thumb-actions {width:100px;pointer-events:auto;}
}
@media (prefers-reduced-motion:reduce) { .lamp-light {transition:none;} }
@media (max-height:500px) and (min-width:601px) {
 .screen.has-map .contact {left:26%;right:6%;}
 .screen.has-map .social-links {gap:10px;}
 .screen.has-map .social-links a {font-size:10px;}
 .story-dialog .story-body {display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;}
 .story-dialog .project-lede {grid-column:1;font-size:16px;}
 .story-dialog .story-photo {grid-column:2;grid-row:1 / span 2;}
 .story-dialog .project-actions {grid-column:1;}
 .story-dialog .story-photo .photo-glass {max-height:200px;}
 .story-header {padding:12px 20px 8px;}
 .story-content {padding:0 20px 16px;}
}
@media (max-width:600px), (pointer:coarse) {
 .house .personal-object:hover:not(.is-selected):not(:focus-visible) .object-name {opacity:0;}
}

/* <design_plan> vibe_validity: PASS; motion_personality: PASS;
   button_contrast: PASS; honest_copy: PASS. plans/2026-09-06-lived-in-room/plan.md */
/* A single seating group with shared furniture and clear circulation. */
.house .house-floor {background-color:#827457;background-image:repeating-linear-gradient(0deg,transparent 0 23px,rgb(47 48 32 / .14) 23px 24px),repeating-linear-gradient(90deg,transparent 0 119px,rgb(199 175 131 / .10) 119px 120px);}
.house .house-rug:has(.object-art) {background:none;border:0;box-shadow:none;}
.house .house-rug .object-art {filter:none;}
.house .house-furniture .object-art {filter:drop-shadow(1px 2px 1px rgb(21 34 25 / .22));}
.house .house-wall {background-color:#7d826a;}
.house .personal-object .object-art {filter:drop-shadow(0 1px 0 rgb(20 35 27 / .2));}
.house .personal-object:is(:hover,:focus-visible,.is-selected) .object-art {filter:drop-shadow(0 0 2px rgb(224 207 156 / .38));}
/* Card-bearing belongings carry a fine gold edge around their actual silhouette. */
.house .personal-object.story-object .object-art {
 --story-edge:rgb(221 190 103 / .7);
 filter:drop-shadow(1px 0 0 var(--story-edge)) drop-shadow(-1px 0 0 var(--story-edge)) drop-shadow(0 1px 0 var(--story-edge)) drop-shadow(0 -1px 0 var(--story-edge));
}
.house .personal-object.story-object:is(:hover,:focus-visible,.is-selected) .object-art {--story-edge:#efcf78;}
.house .house-light {position:absolute;pointer-events:none;mix-blend-mode:screen;}
.house [data-item="hearth-light"] {background:radial-gradient(ellipse at 50% 12%,rgb(237 176 99 / .32),rgb(213 156 79 / .11) 35%,transparent 70%);animation:hearth-light 3.1s ease-in-out infinite alternate;}
.house [data-item="window-light"] {background:linear-gradient(115deg,rgb(200 210 172 / .09),transparent 65%);clip-path:polygon(0 0,22% 0,100% 100%,25% 100%);}
.house-atmosphere {background:linear-gradient(0deg,rgb(17 31 25 / .12),transparent 30%),radial-gradient(ellipse 12% 40% at 54% 67%,rgb(235 204 144 / .055),transparent);}
.house [data-item="chicago-flag"] .object-art {transform-origin:50% 4%;}
.house [data-item="chicago-flag"].is-fluttering .object-art {animation:flag-flutter 1.15s ease-out;}
@keyframes flag-flutter {0%,100% {transform:skewX(0deg) scaleY(1);} 18% {transform:skewX(-4deg) scaleY(.975);} 40% {transform:skewX(3deg) scaleY(.99);} 64% {transform:skewX(-1.7deg);} 82% {transform:skewX(.7deg);}}
/* A soft throw shares the sofa's footprint and settles back into its folds. */
.house [data-item="umd-throw"] .object-art {transform-origin:50% 5%;}
.house [data-item="umd-throw"].is-fluttering .object-art {animation:blanket-ripple 1.15s ease-out;}
.house [data-item="cona-chair"] .object-art {transform-origin:50% 90%;}
.house [data-item="cona-chair"].is-fluttering .object-art {animation:chair-rock 1.4s ease-out;}
@keyframes chair-rock {0%,100% {transform:rotate(0);} 15% {transform:rotate(-7deg);} 35% {transform:rotate(5deg);} 55% {transform:rotate(-3deg);} 75% {transform:rotate(1.5deg);}}
.house [data-action="tilt"] .object-art {transform-origin:50% 4%;}
.house [data-action="tilt"].is-fluttering .object-art {animation:frame-tilt 1.1s ease-out;}
.house [data-action="play"] .object-art {transform-origin:50% 100%;}
.house [data-action="play"].is-fluttering .object-art {animation:instrument-bounce .6s ease-out;}
@keyframes instrument-bounce {0%,100% {transform:none;} 25% {transform:translateY(-3%) scaleY(1.02);} 55% {transform:translateY(1%) scaleY(.99);}}
@keyframes frame-tilt {0%,100% {transform:rotate(0);} 18% {transform:rotate(4deg);} 40% {transform:rotate(-3deg);} 62% {transform:rotate(1.5deg);} 82% {transform:rotate(-.5deg);}}
@keyframes blanket-ripple {0%,100% {transform:skewX(0deg) scaleY(1);} 18% {transform:skewX(-2.5deg) scaleY(.96);} 38% {transform:skewX(2deg) scaleY(1.025);} 60% {transform:skewX(-1.2deg) scaleY(.985);} 80% {transform:skewX(.5deg) scaleY(1.005);}}
.story-dialog::after {content:none;}
.story-dialog .story-photo {width:100%;max-width:480px;align-self:center;}
.story-dialog .story-photo .photo-glass {aspect-ratio:16/10;max-height:none;}
.story-dialog .story-photo img {object-position:58% 48%;}
.story-dialog .saved-photo img {transform:scale(1.12);transform-origin:60% 55%;}
.story-dialog .board-photo img {object-position:66% 45%;}
.story-dialog .governor-photo img {object-position:65% 34%;}
.story-dialog :is(.website-photo,.voice-photo) .photo-glass {aspect-ratio:16/9;}
.story-dialog .screenshot-photo .photo-glass {aspect-ratio:16/10;}
.story-dialog .screenshot-photo img {object-fit:contain;background:transparent;}
.story-dialog .scholar-photo .photo-glass {aspect-ratio:4/1;}
.story-dialog .scholar-photo img {border-radius:0;}
.story-dialog .scholar-photo .photo-glass {aspect-ratio:auto;}
.story-dialog .scholar-photo .photo-glass::before {content:'';display:block;padding-top:24.4%;}
.story-dialog .scholar-photo img {left:0;top:0;transform:translate(-17.97%,-15.97%);}
.story-dialog .screenshot-photo {max-width:340px;}
.story-dialog .screenshot-photo .photo-glass {aspect-ratio:auto;}
.story-dialog .screenshot-photo img {height:auto;}
.story-close {white-space:nowrap;flex-shrink:0;}
@media (max-width:600px) {
 .story-dialog .story-photo {max-width:100%;}
}
@media (max-height:500px) and (min-width:601px) {
 .story-dialog .story-photo .photo-glass {max-height:none;}
 .story-dialog .screenshot-photo {max-width:200px;justify-self:center;}
}
@media (prefers-reduced-motion:reduce) {
 .house [data-item="hearth-light"],.house :is([data-item="chicago-flag"],[data-item="umd-throw"],[data-item="cona-chair"],[data-action="tilt"],[data-action="play"]).is-fluttering .object-art {animation:none;}
}

.hearth-flames {transform-origin:60px 100px;animation:flame-flicker .9s steps(3,end) infinite alternate;}
@media (pointer:coarse), (max-width:600px) {
 .house :is([data-item="autosana"],[data-item="eisenhower-box"],[data-item="nfl-playoff-sim"])::before {content:'';position:absolute;inset:-6px;}
}
@media (prefers-reduced-motion:reduce) { .hearth-flames {animation:none;} }

/* Room chrome belongs on the home screen. Keep the house's name available to AT. */
.screen.has-map .contact {display:none;}
.house .room-heading.sr-only {inset:auto;width:1px;height:1px;}
.house-viewport {inset:7% 6% 10%;}
.house .house-home {bottom:4%;left:8%;}
@media (max-width:600px) { .house-viewport {inset:6% 4% 12%;} }
@media (max-height:550px) and (min-width:601px) { .house-viewport {inset:7% 6% 12%;} }
.screen:not(.has-map) .contact {left:8%;right:8%;bottom:7%;}
h1 {max-width:none;}
.section-links {gap:clamp(8px,3.6cqw,34px);}
.section-links a {font-size:clamp(8px,1.65cqw,16px);padding-inline:clamp(1px,.5cqw,5px);}
.social-links {gap:clamp(6px,1.8cqw,18px);}
.social-links a {font-size:clamp(8px,1.18cqw,11px);}

/* Discovery coins rest, still, just above each story object until it's opened; the counter mirrors the home link. */
.house .coin {position:absolute;left:calc(50% - var(--cell,16px) * .4);top:calc(var(--cell,16px) * var(--coin-lift,1.05) * -1);width:calc(var(--cell,16px) * .8);aspect-ratio:1;pointer-events:none;filter:drop-shadow(0 0 2px rgb(240 200 110 / .45));}
.house .coin svg {display:block;width:100%;height:100%;}
.house .coin:not(.is-collected) {animation:coin-float 2.8s ease-in-out var(--coin-delay,0s) infinite;}
@keyframes coin-float {50% {transform:translateY(calc(var(--cell,16px) * -.09));}}
.house .coin.is-collected {animation:coin-collect .7s ease-out forwards;}
@keyframes coin-collect {to {transform:translateY(calc(var(--cell,16px) * -2.5));opacity:0;}}
.house .coin-counter {position:absolute;bottom:4%;right:8%;z-index:2;display:flex;align-items:center;gap:6px;margin:0;font:11px 'Courier New',monospace;color:#bfcbbd;}
.house .coin-counter svg {width:12px;height:12px;}
.house .coin-balance {color:#f0d48f;}
.house .coin-found {opacity:.7;}
.house .coin-counter.is-short {animation:coin-short .45s steps(3);}
@keyframes coin-short {33% {transform:translateX(-3px);} 66% {transform:translateX(3px);}}
.story-dialog .coin-toast {margin:4px 0 0;font:10px/1.4 'Courier New',monospace;color:#f0d48f;animation:coin-toast 2.4s ease-out forwards;}
@keyframes coin-toast {0% {opacity:0;transform:translateY(3px);} 15%,75% {opacity:1;transform:none;} 100% {opacity:0;}}
.house [data-item="gumball"].is-turning .object-art {animation:gumball-turn .55s steps(4);}
@keyframes gumball-turn {25% {transform:rotate(-3deg);} 50% {transform:rotate(3deg);} 75% {transform:rotate(-2deg);}}
/* An always-visible sign names what an object is for, like the gumball machine's fun facts. */
.house .object-sign {position:absolute;left:50%;top:100%;transform:translate(-50%,4px);padding:3px 6px;border:1px solid #758270;border-radius:2px;background:#203a36;color:#f0d48f;font:11px/1.2 'Courier New',monospace;white-space:nowrap;pointer-events:none;}
/* A fun fact card's footer: the coin count on the left, the next-fact chip on the right with the coin it costs. */
.story-dialog .fact-actions {justify-content:space-between;align-items:center;flex-wrap:nowrap;width:100%;}
.story-dialog .fact-note {color:#c9bf9f;font:10px/1.4 'Courier New',monospace;}
.story-dialog .fact-next {display:inline-flex;align-items:center;gap:8px;flex:none;min-height:36px;padding:0 12px 0 14px;border:1px solid rgb(240 212 143 / .55);border-radius:4px;background:rgb(240 212 143 / .08);color:#f6dfa0;font:12px/1 'Courier New',monospace;cursor:pointer;transition:background .15s,border-color .15s;}
.story-dialog .fact-next:hover:not(:disabled) {background:rgb(240 212 143 / .18);border-color:#f0d48f;}
.story-dialog .fact-next:active:not(:disabled) {transform:translateY(1px);}
.story-dialog .fact-next:focus-visible {outline:1px solid #f0d48f;outline-offset:3px;}
.story-dialog .fact-next:disabled {opacity:.4;cursor:default;}
.story-dialog .fact-coin {width:16px;height:16px;filter:drop-shadow(0 0 3px rgb(240 200 110 / .45));}
.story-dialog .fact-next.is-free .fact-coin {display:none;}
/* Card photos open full-screen inside the site; a tap anywhere, the close control or Escape returns to the card. */
.photo-viewer {position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:max(56px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));border:0;background:rgb(2 6 8 / .94);color:#e8e3d4;cursor:zoom-out;}
.photo-viewer[open] {display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;align-items:center;gap:12px;animation:photo-open 180ms ease-out;}
.photo-viewer::backdrop {background:transparent;}
.photo-viewer img {display:block;max-width:min(100%,1600px);max-height:100%;object-fit:contain;border-radius:3px;box-shadow:0 10px 60px rgb(0 0 0 / .6);}
.photo-viewer-caption {margin:0;max-width:72ch;color:#a9b8b3;font:11px/1.5 'Courier New',monospace;text-align:center;}
.photo-viewer-caption a {color:#cedcff;text-underline-offset:4px;white-space:nowrap;cursor:pointer;}
.photo-viewer-close {position:absolute;top:max(8px,env(safe-area-inset-top));right:8px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:#e8e3d4;cursor:pointer;}
.photo-viewer-close svg {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;}
.photo-viewer-close:focus-visible, .photo-viewer-caption a:focus-visible {outline:1px solid #cedcff;outline-offset:3px;}
@keyframes photo-open {from {opacity:0;}}
@media (prefers-reduced-motion:reduce) {.photo-viewer[open] {animation:none;}}