/* B-053: each Observer domain is a separate, full-viewport workspace. */
.app{grid-template-columns:minmax(0,1fr)}
.sidebar{
  position:fixed!important;inset:0!important;z-index:1000;width:100vw!important;height:100dvh!important;
  max-height:none!important;min-height:0;padding:0!important;overflow:visible!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  pointer-events:none
}
.sidebar::before{content:'';position:absolute;top:0;right:0;left:0;height:55px;
  background:#101f19f7;border-bottom:1px solid #73907470;pointer-events:none}
.sidebar-head{display:none!important}
.sidebar-status,.sidebar-vitals,.sidebar-time-controls,.sidebar-tabs,.sidebar-pages,.urgent-alerts{pointer-events:auto}
.sidebar-status{position:absolute;top:8px;left:12px;width:250px;margin:0;padding:8px 10px;
  border-radius:9px;background:#15271feb;box-shadow:0 5px 18px #06120bbb}
.sidebar-vitals{position:absolute;top:8px;left:270px;width:320px;margin:0;gap:5px}
.sidebar-vitals>div{border-radius:8px;background:#15271feb;box-shadow:0 5px 18px #06120b99}
.sidebar-time-controls{position:absolute;top:8px;right:88px;width:275px;margin:0;
  padding:4px;border:1px solid #79916e70;border-radius:9px;background:#15271feb}
.sidebar-time-controls button{min-height:30px}
.urgent-alerts{position:absolute;top:48px;left:12px;max-width:min(420px,calc(100vw - 110px));
  max-height:90px;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;padding-right:22px;box-sizing:border-box;overflow-wrap:anywhere;margin:0;box-shadow:0 6px 18px #06120bbb}
.sidebar-tabs{position:absolute;top:90px;right:12px;display:grid!important;
  grid-template-columns:1fr!important;gap:9px;width:64px;padding:0;border:0}
.sidebar-tabs button{display:grid;place-items:center;gap:2px;width:64px;min-height:64px!important;
  padding:7px 3px!important;border:1px solid var(--domain-accent,#9fbd93)!important;
  border-radius:12px!important;background:#1b3027f5!important;color:#f4efd9!important;
  box-shadow:0 8px 20px #07130dac;font-size:9px!important;line-height:1.1;cursor:pointer;
  transition:transform .16s ease,background .16s ease,box-shadow .16s ease}
.sidebar-tabs button:hover,.sidebar-tabs button[aria-expanded="true"]{
  transform:translateX(-3px);background:#304638!important;box-shadow:0 9px 24px #07130dcc}
.sidebar-tabs .domain-icon{display:block;width:34px;height:34px;object-fit:contain;image-rendering:pixelated}
#sidebarTab-people{--domain-accent:#8dbfaf}
#sidebarTab-world{--domain-accent:#87b8d5}
#sidebarTab-war{--domain-accent:#d6a07d}
#sidebarTab-village{--domain-accent:#c5be84}
#sidebarTab-quests{--domain-accent:#bea7d1}
#sidebarTab-goals{--domain-accent:#d8bd78}
.sidebar-goal-badge{max-width:58px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#f2d991;font-size:9px;line-height:1.1}
.sidebar-pages{position:absolute;top:62px;right:86px;bottom:150px;left:12px;
  min-height:0;padding:0;overflow:hidden;border:1px solid #7e987e99;border-radius:16px;
  background:#16281f;box-shadow:0 20px 55px #06110dcc;
  animation:domain-open .18s ease-out both}
.sidebar-pages[hidden],.sidebar-page[hidden]{display:none!important}
.sidebar-page{--domain-accent:#a8cba2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  align-content:start;align-items:start;gap:14px;max-height:100%;padding:20px 24px 26px;
  overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}
.sidebar-page[data-sidebar-category="people"]{--domain-accent:#8dbfaf}
.sidebar-page[data-sidebar-category="world"]{--domain-accent:#87b8d5}
.sidebar-page[data-sidebar-category="war"]{--domain-accent:#d6a07d}
.sidebar-page[data-sidebar-category="village"]{--domain-accent:#c5be84}
.sidebar-page[data-sidebar-category="quests"]{--domain-accent:#bea7d1}
.sidebar-page[data-sidebar-category="goals"]{--domain-accent:#d8bd78}
.domain-screen-heading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;
  gap:18px;padding:2px 2px 14px;border-bottom:2px solid var(--domain-accent)}
.domain-screen-heading small{color:var(--domain-accent);font-size:10px;font-weight:700;letter-spacing:.18em}
.domain-screen-heading h2{margin:4px 0 0;color:#f5efdc;font:600 28px Georgia,serif}
.domain-screen-close{min-height:40px;padding:9px 14px;border:1px solid var(--domain-accent);
  border-radius:9px;background:#2d4335;color:#f7efdf;cursor:pointer}
.domain-screen-close:hover{background:#3c5842}
.sidebar-page>.sidebar-section{margin:0;border-radius:10px;background:#21372b;
  border-color:color-mix(in srgb,var(--domain-accent) 44%,transparent)}
.sidebar-page>.sidebar-section>summary{min-height:44px;padding:11px 13px;
  background:color-mix(in srgb,var(--domain-accent) 15%,#263e31);font-size:13px}
.sidebar-page>.sidebar-section>summary::before{color:var(--domain-accent)}
.sidebar-page .sidebar-section-body{padding:13px}
.sidebar-page .sidebar-section-metric{color:var(--domain-accent)}
.sidebar-page .resident-faces{grid-template-columns:repeat(auto-fill,54px);max-height:none;overflow:visible}
.sidebar-page .resident-faces button{height:50px}
@keyframes domain-open{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:800px){
  .sidebar::before{height:132px}
  .sidebar-status{top:6px;left:8px;right:72px;width:auto;min-height:28px}
  .sidebar-vitals{top:59px;left:8px;right:72px;width:auto}
  .sidebar-time-controls{top:97px;left:8px;right:72px;width:auto}
  .urgent-alerts{top:133px;left:8px;right:72px;max-width:none}
  .sidebar-tabs{top:135px;right:7px;width:58px;gap:7px}
  .sidebar-tabs button{width:58px;min-height:58px!important}
  .sidebar-pages{top:135px;right:72px;bottom:150px;left:8px}
  .sidebar-page{grid-template-columns:1fr;padding:15px}
}
@media(max-width:460px){
  .sidebar::before{height:139px}
  .sidebar-pages{right:65px;top:142px;bottom:150px}
  .sidebar-tabs{top:142px;right:7px;bottom:auto;left:auto;width:52px;
    grid-template-columns:1fr!important;gap:5px}
  .sidebar-tabs button{width:52px;min-height:49px!important;font-size:8px!important}
  .sidebar-tabs .domain-icon{width:26px;height:26px}
  .sidebar-status,.sidebar-vitals,.sidebar-time-controls{right:7px}
  .domain-screen-heading h2{font-size:24px}
  .domain-screen-close{padding:7px 9px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.sidebar-pages{animation:none}.sidebar-tabs button{transition:none}}

/* B105 B1: PC/Mac cards follow each other at full workspace width.
 * A tall open card cannot reserve an empty second-column cell. */
@media(min-width:801px){
  .sidebar-page:is([data-sidebar-category="village"],[data-sidebar-category="war"],[data-sidebar-category="goals"]){grid-template-columns:minmax(0,1fr)}
  .sidebar-page:is([data-sidebar-category="village"],[data-sidebar-category="war"],[data-sidebar-category="goals"])>.sidebar-section{min-width:0;width:100%;box-sizing:border-box}
}

/* B105 B2: preserve native disabled eligibility, show its actual reason. */
#goalButtons .goal-option{display:contents}
#goalButtons .goal-unavailable-reason{display:none}
@media(min-width:801px){
  #goalButtons .goal-option{display:grid;gap:5px;min-width:0}
  .sidebar-page #goalButtons .goal-option>button:disabled{opacity:1;color:#e6dec5;background:#26352e;border-color:#738373;cursor:not-allowed}
  #goalButtons .goal-unavailable-reason{display:block;color:#e6dec5;font:12px/1.4 Segoe UI,Arial,sans-serif;opacity:1;overflow-wrap:anywhere}
  #goalButtons .goal-unavailable-reason[hidden]{display:none}
}