:root{--paper:#f7f4eb;--panel:#fcfaf4;--panel-2:#f0eee3;--text:#354739;--dim:#798276;--gold:#8b673d;--grass:#699275;--line:#dfdfd1;--jev:#3f8265;--routine:#827e6c}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--text)}body{font:13px/1.5 'DM Sans',sans-serif}button,select,input,textarea{font:inherit}button,select{color:inherit;cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #bf8854;outline-offset:3px}button{transition:background .2s,transform .2s}button:hover{background:#e8eddf}button:active{transform:translateY(1px)}h1,h2,p{margin:0}h1,h2,.brand{font-family:'DM Serif Display',Georgia,serif;font-weight:400}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--dim)}
#app{height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:80px minmax(350px,1fr);grid-template-areas:'top top' 'view side';overflow:hidden}
#top{grid-area:top;display:flex;align-items:center;gap:36px;padding:0 28px;border-bottom:1px solid var(--line);background:var(--paper);z-index:10}.brand{display:flex;gap:12px;align-items:center;font-size:26px;line-height:1.05;color:#354b38;text-decoration:none;white-space:nowrap}.brand small{display:block;font:8px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:7px;color:var(--dim)}.brand-mark{display:grid;place-items:center;width:38px;height:42px;background:#e4e9d8;border-radius:14px 14px 5px 5px;color:#668363;font-size:33px}.run-control{display:flex;flex-direction:column;gap:3px;border-left:1px solid var(--line);padding-left:28px}.run-control select{max-width:280px;border:0;background:transparent;font-size:12px;padding:0 16px 0 0}.spacer{flex:1}.live-note{color:var(--dim);font-size:11px;white-space:nowrap}.live-note i{display:inline-block;width:6px;height:6px;background:#81a078;border-radius:50%;margin-right:8px}.quiet-button{border:1px solid var(--line);border-radius:7px;padding:9px 13px;background:transparent;font-size:11px}#srcBadge:empty{display:none}
#view{grid-area:view;position:relative;overflow:hidden;background:#cbdcd0;isolation:isolate;touch-action:none}#view>canvas{display:block;image-rendering:auto;position:absolute;inset:0;width:100%;height:100%}.scene-heading{position:absolute;left:30px;top:25px;z-index:2;pointer-events:none}.scene-heading h1{font-size:clamp(22px,2.5vw,34px);color:#3b5549;line-height:1.2;margin:5px 0}.scene-heading p{font-size:11px;color:#60786a}.scene-heading .eyebrow{color:#617e6b}#hud{position:absolute;right:22px;top:29px;z-index:2;font-size:10px;color:#456353;background:#f8f7ecb8;padding:8px 12px;border:1px solid #faffed99;border-radius:20px;pointer-events:none}#legend{position:absolute;bottom:90px;left:26px;z-index:2;color:#4b6955;font-size:10px;pointer-events:none}.view-tools{position:absolute;right:22px;bottom:92px;z-index:4;display:flex;border:1px solid #f8f7ebad;border-radius:8px;overflow:hidden;background:#f7f4ebdf}.view-tools button{background:transparent;border:0;width:34px;height:34px;font-size:18px}.playback{position:absolute;bottom:20px;left:24px;right:24px;z-index:4;background:#faf8efed;box-shadow:0 7px 30px #3c584520;border:1px solid #fff9;border-radius:10px;display:flex;align-items:center;gap:16px;padding:11px 14px;backdrop-filter:blur(12px)}#playBtn{background:#3f624e;color:#fff8e8;border:0;border-radius:6px;min-width:80px;height:34px;font-size:11px}#tickLabel{font-size:10px;font-variant-numeric:tabular-nums;min-width:70px}#tickRange{flex:1;min-width:35px;accent-color:#67866a;height:4px}#speedSel{background:transparent;border:0;font-size:11px}.playback label{display:flex;align-items:center;gap:5px;font-size:10px;white-space:nowrap}.playback input[type=checkbox]{accent-color:#628469;width:12px;height:12px}.control-divider{height:18px;width:1px;background:var(--line)}
#side{grid-area:side;overflow:auto;background:var(--panel);border-left:1px solid var(--line);padding:26px 23px 16px}.side-intro{margin-bottom:22px}.side-intro h2{font-size:25px;margin:6px 0}.side-intro p{font-size:11px;color:var(--dim)}.card{padding:18px 0;border-top:1px solid var(--line)}.card h3,.summary summary{font-size:10px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;margin:0 0 14px;color:#5c6f5c}.count{float:right;font-size:9px;color:#87937a}.agents{display:grid;grid-template-columns:1fr 1fr;gap:7px}.agent-chip{border:1px solid #e5e6da;border-radius:6px;background:#f7f6ed;padding:8px 9px;display:flex;align-items:center;gap:8px;font-size:11px;text-align:left}.agent-chip.sel{border-color:#739276;background:#e6eddf}.swatch{width:13px;height:16px;border-radius:4px 4px 2px 2px;border-bottom:4px solid #34433255;display:inline-block}.empty-person{font-size:35px;color:#a5b894;text-align:center}.empty-copy{text-align:center;font-size:12px;color:var(--dim);margin:8px 0 12px}.kv{display:grid;grid-template-columns:55px 1fr;gap:5px 10px;font-size:11px}.kv dt{color:var(--dim);text-transform:capitalize}.kv dd{margin:0}.bars{display:flex;flex-direction:column;gap:7px}.bar{display:grid;grid-template-columns:103px 1fr 29px;align-items:center;gap:6px;font-size:10px}.bar .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dim)}.track{height:6px;background:#e9e9db;border-radius:2px;overflow:hidden}.fill{height:100%;background:#acc29b}.bar.chosen .fill{background:#70916d}.bar.chosen .name{color:#3d634b}.val{text-align:right;font-variant-numeric:tabular-nums}.meter{display:grid;grid-template-columns:135px 1fr 26px;gap:6px;align-items:center;font-size:10px;margin:7px 0;color:var(--dim)}.meter .fill{background:#c7a77b}.badge{display:inline-block;border:1px solid #b5c9af;color:#537857;border-radius:3px;font-size:8px;letter-spacing:1px;padding:3px 5px;margin:5px 4px 0 0}.badge.warn{color:#956a4b;border-color:#d9bc96}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:15px}.metrics span{display:block;color:var(--dim);font-size:9px}.metrics b{font-weight:500;font-size:23px;color:#4f684f}.summary summary{cursor:pointer;margin:0}.summary[open] summary{margin-bottom:16px}.side-footer{font-family:Georgia,serif;font-style:italic;color:#8b9480;font-size:12px;padding-top:20px}.side-footer span{display:block;font:8px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:10px}
.event-card{margin:0 -9px 18px;padding:16px 15px 15px!important;border:1px solid #d9ddca!important;border-radius:10px;background:linear-gradient(145deg,#f3f3e7,#ebeeda);box-shadow:0 7px 22px #4c66420d}.event-card[hidden]{display:none}.event-kicker{display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:1.8px;color:#687766;margin-bottom:7px}.event-kicker i{font-style:normal;font-weight:700;letter-spacing:1px;background:#3e674e;color:#f8f4df;padding:3px 6px;border-radius:3px}.event-card h3{font-family:'DM Serif Display',Georgia,serif;font-size:20px;text-transform:none;letter-spacing:0;color:#435642;margin-bottom:5px}.event-card>p{font:11px/1.5 'DM Sans',sans-serif;color:#75806f;margin-bottom:12px}
#bottom{position:fixed;z-index:9;left:24px;right:344px;bottom:91px;width:min(720px,calc(100vw - 392px));max-height:min(48vh,470px);margin-right:auto;background:#fffdf7f2;border:1px solid #fff;border-radius:13px;padding:17px 20px 19px;overflow:hidden;box-shadow:0 18px 55px #31452f2a,0 2px 7px #394a3517;backdrop-filter:blur(14px);transition:max-height .32s ease,width .32s ease,padding .32s ease}.chron-heading{display:flex;justify-content:space-between;align-items:center;gap:18px}.chron-heading h2{font-size:22px;line-height:1.1;margin-top:2px}.chron-actions{display:flex;align-items:center;gap:13px;color:var(--dim);font-size:9px;white-space:nowrap}.chron-actions button{border:1px solid #dfe2d5;border-radius:20px;background:#f7f7ee;padding:7px 10px;font-size:9px;color:#60705f}.story-card.is-collapsed{width:330px;max-height:61px;padding-top:13px;padding-bottom:13px}.story-card.is-collapsed #storyBody,.story-card.is-collapsed #storyProgress{display:none}#storyBody{overflow:auto;max-height:calc(min(48vh,470px) - 75px);margin-top:14px;padding-right:9px;scrollbar-color:#c9cfbc transparent}#chron{display:flex;flex-direction:column;gap:19px;font:14px/1.7 'DM Serif Display',Georgia,serif;color:#485448}.story-entry{position:relative;padding:0 5px 0 17px;border-left:2px solid #dbe2cc}.story-entry header{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:6px}.story-entry h3{font:400 18px/1.2 'DM Serif Display',Georgia,serif;margin:0;color:#334b39}.story-entry time{font:8px 'DM Sans',sans-serif;letter-spacing:1px;color:#90998a;text-transform:uppercase;white-space:nowrap}.story-entry p{margin:0 0 8px}.story-entry p:last-child{margin-bottom:0}.story-entry.latest{border-left-color:#7e9c73}.story-entry.latest:before{content:'✦';position:absolute;left:-7px;top:3px;color:#668163;background:#fffdf7;font:11px Georgia,serif}.story-source{display:inline-block;margin-left:7px;font:7px 'DM Sans',sans-serif;letter-spacing:1px;color:#87937f;text-transform:uppercase}#empty{position:absolute;inset:0;display:grid;place-items:center;background:#eff1e7f0;z-index:8;padding:20px}#empty[hidden]{display:none}#empty pre{white-space:pre-wrap;font:13px/1.7 monospace}
.nm-label{font:600 10px 'DM Sans',sans-serif;color:#fdf9df;background:#344c38cf;border:1px solid #f8f4d555;border-radius:4px;padding:2px 6px;white-space:nowrap;pointer-events:none}.bubble{font:11px/1.4 'DM Sans',sans-serif;color:#3e503c;background:#fffbedf5;border:1px solid #d6d5b9;border-radius:7px;padding:7px 10px;max-width:175px;text-align:center;box-shadow:0 3px 0 #3a503019;pointer-events:none}.bubble:after{content:'';position:absolute;bottom:-5px;left:50%;width:8px;height:8px;background:#fffbed;transform:rotate(45deg);border-right:1px solid #d6d5b9;border-bottom:1px solid #d6d5b9}.place-label{font:600 9px 'DM Sans',sans-serif;letter-spacing:2px;text-transform:uppercase;color:#fff7db;text-shadow:0 1px 3px #304d30;background:#355c386b;padding:4px 8px;border-radius:3px;pointer-events:none}
.focus-mode #app{grid-template-columns:1fr;grid-template-rows:80px 1fr;grid-template-areas:'top' 'view'}.focus-mode #side{display:none}.focus-mode #bottom{right:24px;width:min(720px,calc(100vw - 48px))}.focus-mode #bottom.is-collapsed{width:330px}
@media(min-width:1800px){#app{grid-template-columns:minmax(0,1fr) 360px;grid-template-rows:86px minmax(350px,1fr)}#side{padding:30px}.scene-heading{left:36px;top:30px}#bottom{right:384px}}
@media(max-width:1050px){#app{grid-template-columns:minmax(0,1fr) 285px}#top{gap:18px;padding:0 20px}.live-note{display:none}.run-control{padding-left:18px}.scene-heading h1{font-size:24px}.scene-heading p{display:none}#hud{top:83px;left:28px;right:auto}.playback{gap:9px;left:14px;right:14px}.playback label{font-size:0;gap:0}.control-divider{display:none}#side{padding:23px 17px}.chron-note{display:none}}
@media(max-width:720px){body{overflow:auto}#app{height:auto;min-height:100dvh;overflow:visible;grid-template-columns:1fr;grid-template-rows:70px 65dvh auto;grid-template-areas:'top' 'view' 'side'}#top{gap:12px;padding:0 15px}.brand{font-size:21px}.brand-mark{width:30px;height:34px;font-size:27px}.brand small{font-size:6px;letter-spacing:1.5px}.run-control{margin-left:auto;border:0;padding:0}.run-control select{max-width:155px;font-size:10px}.run-control .eyebrow{font-size:7px}.quiet-button,#top .spacer{display:none}.scene-heading{top:18px;left:20px}.scene-heading h1{font-size:24px}#hud{top:84px;left:20px}#side{border-left:0}.agents{grid-template-columns:repeat(3,1fr)}.playback{bottom:14px;padding:10px;gap:8px}#tickLabel{min-width:62px;font-size:9px}#playBtn{min-width:59px}.playback label{display:none}#legend{left:18px;font-size:9px}#bottom,.focus-mode #bottom{left:12px;right:12px;bottom:81px;width:auto;max-height:48vh;padding:14px 15px}.story-card.is-collapsed,.focus-mode #bottom.is-collapsed{width:calc(100vw - 24px)}#storyBody{max-height:calc(48vh - 70px)}.chron-actions{gap:7px}.chron-actions #storyProgress{display:none}.chron-heading h2{font-size:19px}#chron{font-size:13px}.bar{grid-template-columns:130px 1fr 35px}.meter{grid-template-columns:145px 1fr 30px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
@media(max-width:720px){.place-label{display:none}.bubble{font-size:10px;max-width:125px}.nm-label{font-size:9px}}
#liveDetails{font-size:11px;color:var(--dim);line-height:1.8;margin-bottom:12px}#liveDetails strong{color:var(--text);font-weight:600}#liveDetails .live-error{color:#956344;margin-top:7px}#liveCard[hidden]{display:none}.playback :disabled{opacity:.45;cursor:default}#playBtn:disabled{opacity:.6}#followLiveBtn{font-size:10px}.live-note.disconnected{color:#aa7558}
#liveDetails .condition-day{font-size:12px;font-weight:600;color:#435b45;text-transform:capitalize}#liveDetails .condition-weather{font:22px/1.3 'DM Serif Display',Georgia,serif;color:#354b38;text-transform:capitalize;margin:5px 0 15px}#liveDetails .condition-label{font-size:9px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#7c8978}#liveDetails .condition-situations{margin:7px 0 0;padding-left:17px;line-height:1.7;color:#576957}#liveDetails .condition-situations li{padding-left:2px}
#liveDetails .activity-heading{margin-top:14px}#liveDetails .live-activities{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:4px}#liveDetails .live-activities li{padding:5px 7px;background:#f2f0df;border-left:2px solid #8b9e77;border-radius:2px;line-height:1.3}#liveDetails .live-activities progress{display:block;width:100%;height:3px;margin-top:4px;accent-color:#5e8066}
#liveDetails .live-turn{margin-top:8px;padding:7px 9px;background:#fffbed;border:1px solid #d6d5b9;border-radius:5px;color:#42553e}#liveDetails .live-outcome{margin-top:8px;color:#65735f}#liveDetails .live-cost{margin-top:12px;padding-top:9px;border-top:1px solid #cbd2ba;line-height:1.4}#liveDetails .live-cost strong,#liveDetails .live-cost small{display:block}#liveDetails .live-cost small{margin-top:3px;color:#697966}
/* Reaction panel — measured response to an injected event, from the logged distributions. */
.reaction-card{margin:0 -9px 18px}.reaction-card[hidden]{display:none}.reaction-card h3{font-family:'DM Serif Display',Georgia,serif;font-size:19px;text-transform:none;letter-spacing:0;color:#435642;margin-bottom:4px}.reaction-card>p{font:11px/1.5 'DM Sans',sans-serif;color:#75806f;margin-bottom:10px}#reactionMeasure{margin-bottom:10px}#reactionMeasure[hidden]{display:none}#reactionMeasureBtn{border:0;border-radius:6px;background:#8a6b3d;color:#fff9e9;padding:8px 10px;font-size:10px}.reaction-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}#reactionNote{font-size:9px;color:#838b7d}.rxn-row{border:1px solid #e3e5d6;border-radius:7px;background:#f8f7ee;padding:8px 9px;margin-bottom:7px;cursor:pointer;text-align:left;width:100%;font:inherit}.rxn-row:hover{border-color:#c3cba8}.rxn-row.routine{opacity:.6;cursor:default}.rxn-head{display:flex;align-items:center;gap:7px;font-size:11px}.rxn-head .swatch{width:11px;height:13px}.rxn-head .rxn-action{margin-left:auto;font-size:9px;color:#687766}.rxn-head .rxn-action.changed{color:#8a5a2e;font-weight:600}.rxn-meter{display:grid;grid-template-columns:70px 1fr 28px;align-items:center;gap:6px;font-size:9px;color:#838b7d;margin-top:6px}.rxn-meter .fill{background:#c7a77b}.rxn-diff{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:9.5px;color:#5d6655;margin-top:6px}.rxn-diff dt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rxn-diff dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;color:#838b7d}.rxn-diff dd.up{color:#8a5a2e}.rxn-diff dd.down{color:#6c8a78}.rxn-nouls{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.rxn-nouls span{border:1px solid #d9ddca;border-radius:3px;font-size:8px;letter-spacing:.4px;padding:2px 5px;color:#6a755f}
/* Energy: the body, made visible. */
.nm-label.spent{opacity:.55}
.nm-label.spent::after{content:'· tired';font-size:8px;letter-spacing:.6px;color:#9a6a4a;margin-left:4px}
.meter.energy .fill{background:#8fae72}

.weather-card { margin: 0 -9px 6px; padding: 15px 15px 14px; border: 1px solid #d9ddca; border-radius: 10px; background: linear-gradient(150deg, #f4f4e7, #e9eee0); box-shadow: 0 7px 22px #4c66420d; }
.weather-card .eyebrow { display: block; color: #687766; }
.weather-card h3 { margin: 9px 0 5px; font-family: 'DM Serif Display', Georgia, serif; font-size: 20px; font-weight: 400; line-height: 1.2; letter-spacing: 0; text-transform: capitalize; color: #435642; }
.weather-card p { color: #75806f; font-size: 11px; line-height: 1.55; margin: 0; }
.season-track { display: flex; gap: 4px; margin-top: 13px; padding-top: 13px; border-top: 1px solid #d7dcc7; }
.season-track span { flex: 1 1 0; min-width: 0; padding: 6px 2px; border-radius: 5px; text-align: center; font-size: 9px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; color: #7c8978; }
.season-track span.active { background: #56754a; color: #f8f4df; }

/* Speech, and how they feel.
   Both are record fields, not styling inventions: `.speech` marks a quoted part of a passage the
   renderer already wrote, `.story-said` lists the same validated lines against their speaker, and
   `.feeling` shows the clause code composes from measured mood, strain and body. */
.story-entry p .speech { color: #3f6b52; font-style: italic; }
.story-entry header h3{min-width:0}.story-entry h3 time{font:inherit;letter-spacing:normal;color:inherit;text-transform:none;white-space:normal}.story-entry .story-context{font:9px/1.4 'DM Sans',sans-serif;letter-spacing:.5px;color:#87937f;text-align:right;max-width:40%}
@media(max-width:720px){.story-entry header{align-items:flex-start;flex-direction:column;gap:3px}.story-entry .story-context{max-width:none;text-align:left}}
.story-said { margin-top: 9px; padding-top: 8px; border-top: 1px dashed #dbe2cc; display: flex; flex-direction: column; gap: 4px; }
.story-said div { display: grid; grid-template-columns: 38px 82px minmax(0,1fr); align-items: center; gap: 8px; font: 11px/1.5 'DM Sans', sans-serif; }
.story-said .story-portrait { width: 36px; height: 36px; display: block; object-fit: cover; object-position: center 28%; border-radius: 50%; border: 2px solid #fffdf7; box-shadow: 0 1px 5px #394a3526; }
.story-said b { color: #65785f; font-weight: 600; }
.story-said span { color: #3f6b52; font-style: italic; }
@media(max-width:520px){.story-said div{grid-template-columns:34px 66px minmax(0,1fr);gap:6px}.story-said .story-portrait{width:32px;height:32px}}
.feeling { margin: 8px 0 0; font-size: 11px; line-height: 1.5; color: #6b7d63; font-style: italic; }
.feeling.dim { color: #9aa692; font-style: normal; }
.said { color: #3f6b52; font-style: italic; }

/* The dollhouse keeps the same paper, timber and sage palette as the village. */
.building-label{pointer-events:auto;border:1px solid #fff5d55e;border-radius:5px;background:#3d5744e6;color:#fff4d8;padding:5px 9px;font:600 9px 'DM Sans',sans-serif;letter-spacing:.6px;white-space:nowrap;box-shadow:0 2px 8px #263e2920}
.building-label:hover{background:#f8f2dc;color:#40563e}
.buildings-card>p{font-size:11px;color:var(--dim);margin-bottom:10px}
#buildingList{display:grid;gap:6px}
#buildingList button{border:1px solid var(--line);background:#f5f3e8;border-radius:6px;text-align:left;padding:9px 10px;font-size:11px}
.interior-open #bottom,.interior-open .scene-heading,.interior-open #hud,.interior-open #legend{display:none}
#interiorPanel{position:absolute;inset:0;z-index:3;pointer-events:none}
#interiorPanel[hidden]{display:none}
.interior-top{position:absolute;top:25px;left:30px;right:25px;display:flex;justify-content:space-between;align-items:center;gap:15px}
.interior-top h2{font-size:32px;line-height:1.2;margin-top:4px;color:#3c5141}
#leaveInterior{pointer-events:auto;border:1px solid #aeb7a3;background:#f8f5e9ee;border-radius:7px;padding:10px 14px;white-space:nowrap;font-size:12px}
#leaveInterior kbd{font:9px 'DM Sans',sans-serif;margin-left:12px;color:#7c8875}
#interiorFloors{position:absolute;top:107px;left:30px;display:flex;gap:6px;pointer-events:auto;max-width:calc(100% - 50px)}
#interiorFloors button{min-height:38px;border:1px solid #b8bcaa;border-radius:6px;padding:9px 14px;font-size:11px;background:#f5f1e3dd;color:#52604b}
#interiorFloors button[aria-pressed=true]{background:#48634f;border-color:#48634f;color:#fff8e5;box-shadow:0 3px 9px #3b51301a}
.interior-bottom{position:absolute;bottom:94px;left:30px;right:155px;max-width:660px;background:#f8f4e7eb;border:1px solid #fff7;border-radius:9px;padding:12px 16px;box-shadow:0 4px 20px #3b51300d}
#interiorDescription{font:17px/1.4 'DM Serif Display',Georgia,serif;color:#556149}
#interiorOccupants{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px;font-size:11px}
#interiorOccupants>span{color:#78806d;margin-right:4px}
#interiorOccupants button{pointer-events:auto;border:1px solid #cbd0bb;border-radius:20px;background:#edf0df;padding:4px 10px;font-size:11px}
.interior-note{font-size:9px;color:#7c8373;margin-top:7px;line-height:1.5}
@media(max-width:720px){
  .interior-top{top:15px;left:17px;right:17px;align-items:flex-start}
  .interior-top h2{font-size:23px;max-width:220px}
  #leaveInterior{padding:8px 10px;font-size:11px}#leaveInterior kbd{display:none}
  #interiorFloors{top:82px;left:17px;gap:5px;max-width:calc(100% - 34px)}
  #interiorFloors button{padding:8px;font-size:10px}
  .interior-bottom{left:14px;right:14px;bottom:110px;padding:9px 11px;max-height:110px;overflow:auto;pointer-events:auto}
  #interiorDescription{font-size:13px}.interior-note{font-size:8px}.building-label{font-size:8px;padding:4px 6px}
  .interior-open .view-tools{bottom:70px}
}

/* Keep the whole Chronicle scroll area inside its card, including the final line. */
#bottom{display:flex;flex-direction:column;max-height:min(70dvh,680px)}
#bottom .chron-heading{flex:0 0 auto}
#storyBody{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;padding-bottom:10px;scrollbar-color:#8da785 #edf0e5;scrollbar-width:auto}
@media(max-width:720px){#bottom,.focus-mode #bottom{max-height:60dvh}}

.sleep-label { color: #4d655e; font: italic 700 14px Georgia, serif; letter-spacing: 3px; text-shadow: 0 1px 3px #fff5de; pointer-events: none; }

/* Keep the village's overlays legible against the nighttime landscape. */
#view.after-dark .scene-heading h1{color:#f0e5cd;text-shadow:0 2px 12px #081321}
#view.after-dark .scene-heading p,#view.after-dark .scene-heading .eyebrow,#view.after-dark #legend{color:#c0ced4;text-shadow:0 1px 5px #081321}

/* Live visitors always follow the latest update; the timeline belongs to offline recordings. */
.playback[hidden]{display:none}
#liveCadence{font-size:12px}
.live-view .view-tools{bottom:20px}
.live-view #legend{bottom:24px;max-width:calc(100% - 165px)}
.live-view #bottom{bottom:72px}
@media(max-width:720px){#liveCadence{max-width:155px;font-size:10px}.live-view #bottom{bottom:81px}}

/* The music control and attribution stay together in the side panel. */
.music-state{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;flex-wrap:wrap}
.music-state #musicStatus{font-size:10px;color:#87937a;letter-spacing:.3px}
.music-action{border:1px solid #cbd0bd;border-radius:6px;background:#f2f4ea;padding:6px 10px;font-size:10px;font-weight:600;letter-spacing:.4px;color:#4c6b4a;white-space:nowrap}
.music-action:hover{background:#e6eddf;border-color:#b5c9af}
.music-credit[data-music-off="true"] .music-action{background:transparent;color:#5c6f5c}
.music-credit{font-size:10px;line-height:1.65;color:var(--dim)}
.music-credit .credit-track{font-family:Georgia,serif;font-style:italic;font-size:12px;color:#5c6f5c;margin:0 0 8px}
.music-credit .credit-line{margin:0}
.music-credit a{color:#537857;text-decoration:none;border-bottom:1px solid #c2d0b8}
.music-credit a:hover{border-bottom-color:#537857}
.music-credit .credit-url{margin:2px 0 7px;word-break:break-all}
.music-credit .credit-license{margin:0;color:#87937a;letter-spacing:.3px}
.ambience-card{padding-top:15px;padding-bottom:16px}
.ambience-card h3{margin-bottom:7px}
.ambience-card .ambience-note{font-size:10px;line-height:1.5;color:var(--dim);margin:0 0 9px}
.ambience-card .music-state{margin-bottom:0}
.ambience-card #ambienceStatus{font-size:10px;color:#87937a;letter-spacing:.3px;text-transform:capitalize}
.ambience-card[data-ambience-off="true"] .music-action{background:transparent;color:#5c6f5c}

.pets-card{padding-bottom:15px}.pets-card h3{margin-bottom:10px}#petList{display:grid;gap:7px}.pet-row{border:1px solid #e5e6da;border-radius:7px;background:#f7f6ed;padding:9px 10px}.pet-row-head{display:flex;align-items:center;gap:7px}.pet-icon{font-size:16px;line-height:1}.pet-row strong{font-size:11px;color:#405941}.pet-row small{margin-left:auto;font-size:9px;color:#87937a;text-transform:capitalize}.pet-row p{font-size:10px;color:#798276;margin:3px 0}.pet-status{font-size:10px;color:#4c765b}.pet-label{background:#815d3fd9}

/* The pomodoro — the study companion. The pill keeps the time, the toasts deliver the village:
   each one a villager's line arriving like a chat message, with the message ping for a knock. */
#pomodoroTimer{position:absolute;right:22px;top:64px;z-index:5;display:flex;align-items:center;gap:10px;background:#faf8efed;border:1px solid #fff9;border-radius:10px;padding:9px 12px;box-shadow:0 7px 30px #3c584520;backdrop-filter:blur(12px)}
#pomodoroTimer[hidden]{display:none}
.pomodoro-phase{font-size:9px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#5c6f5c}
#pomodoroTimer.is-break .pomodoro-phase{color:#8a5a2e}
.pomodoro-clock{font:600 16px 'DM Sans',sans-serif;font-variant-numeric:tabular-nums;color:#33503f;min-width:44px}
.pomodoro-dots{display:flex;gap:4px}
.pomodoro-dots i{width:6px;height:6px;border-radius:50%;background:#d8dcc8}
.pomodoro-dots i.done{background:#6c8a5f}
.pomodoro-tools{display:flex;gap:4px;margin-left:2px;border-left:1px solid var(--line);padding-left:8px}
.pomodoro-tools button{border:1px solid var(--line);background:transparent;border-radius:5px;font-size:10px;padding:3px 7px;color:#60705f;line-height:1.4}
.pomodoro-tools button:hover{background:#e8eddf}
.pomodoro-tools .pomodoro-sound[aria-pressed="false"]{opacity:.45;text-decoration:line-through}
#pomodoroToasts{position:absolute;left:50%;top:112px;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;gap:8px;width:min(380px,calc(100vw - 44px));pointer-events:none}
.pomodoro-toast{display:flex;gap:12px;align-items:flex-start;background:#fffdf7f5;border:1px solid #fff;border-left:4px solid #8da889;border-radius:12px;padding:13px 15px;box-shadow:0 14px 38px #263e3190;backdrop-filter:blur(12px);transform:translateY(-12px);opacity:0;transition:transform .28s ease,opacity .28s ease}
.pomodoro-toast.in{transform:none;opacity:1}
.pomodoro-toast.out{transform:translateY(-12px);opacity:0}
.pomodoro-toast .swatch{width:13px;height:16px;border-radius:4px 4px 2px 2px;border-bottom:4px solid #34433255;flex:0 0 auto;margin-top:1px}
.pomodoro-toast .pomodoro-mark{font-style:normal;font-size:12px;color:#668163;flex:0 0 auto;margin-top:1px}
.pomodoro-toast b{display:block;font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#7d8b73;margin-bottom:2px}
.pomodoro-toast span{font:italic 12px/1.45 'DM Serif Display',Georgia,serif;color:#3f6b52}
.pomodoro-toast.system span{color:#5c6f5c}
@media(prefers-reduced-motion:reduce){.pomodoro-toast{transition:none}}
@media(max-width:720px){#pomodoroBtn{display:inline-flex;flex:0 0 auto;padding:6px 8px;font-size:9px}#pomodoroTimer{top:18px;right:14px;padding:7px 9px;gap:7px}#pomodoroToasts{top:60px;width:calc(100vw - 28px)}}
@media(max-width:440px){#top{gap:6px;padding:0 8px}.brand{font-size:17px;gap:6px}.brand-mark{width:25px;height:28px;font-size:21px}.brand small,.run-control .eyebrow{display:none}.run-control select{max-width:85px}}

/* Map link shares the toolbar button treatment. */
a.quiet-button{color:inherit;text-decoration:none;white-space:nowrap}