@font-face{font-family:Cart;src:url(./assets/studio-pixel.ttf) format("truetype");font-display:swap}
:root{color-scheme:dark;--ink:#21191c;--pine:#26382d;--pine2:#344a39;--green:#a9bd92;--paper:#f7e8bd;--muted:#c9b591;--rose:#f39b8d;--rust:#773d36;--gold:#ffd48a;--edge:#665247;--pixel:Cart,monospace;--serif:Georgia,serif}
*{box-sizing:border-box} [hidden]{display:none!important}html{background:var(--ink)}body{margin:0;min-height:100svh;color:var(--paper);font:16px/1.48 var(--serif);background:radial-gradient(ellipse at 67% 9%,#44302c,#21191c 64%);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
button,input{font:inherit}button{color:inherit;cursor:pointer;border-radius:0;min-width:44px;min-height:44px;border:1px solid var(--edge);padding:7px 8px;background:#362a29;touch-action:manipulation;-webkit-tap-highlight-color:#ffd48a33;font:11px/1.25 var(--pixel);text-transform:uppercase}button:active{background:#63443b}button:focus-visible,input:focus-visible{outline:2px solid #fff3c8;outline-offset:-3px}button:disabled{opacity:.56;cursor:default}button.primary{color:#281c19;background:#f1bb70;border-color:#ffd99e;box-shadow:inset 0 -3px #b97e49}button.secondary{background:var(--pine);border-color:#617460;color:#f7e8bd}button.danger{background:#683c37;border-color:#a27464}button.text-button{background:transparent;color:var(--muted)}button[aria-pressed=true]{border-color:var(--green)}p,h1,h2,h3{margin:0} canvas{display:block;width:100%;image-rendering:pixelated;background:#172130}
.mast{max-width:1150px;margin:auto;padding:10px 16px 9px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font:10px/1.4 var(--pixel);letter-spacing:.055em}.mastmark{color:var(--paper);white-space:nowrap}.holiday-star{color:var(--gold);margin-right:4px;font-family:serif}.mast-copy{display:none}.edition{text-align:right}
main{width:min(100%,1150px);margin:auto;padding:0 12px}.cabinet{position:relative;border:2px solid #8b6950;background:#281f21;box-shadow:0 3px 0 #573f32,0 18px 40px #110c10b0;isolation:isolate}.menu{padding:6px;display:grid;gap:0}.sleeve,.room-frame{position:relative;overflow:hidden;background:#131f29}.sleeve{border:1px solid #8b6950}.sleeve canvas{height:auto;aspect-ratio:384/230;object-fit:cover}.frame-top,.frame-bottom{position:absolute;display:flex;justify-content:space-between;gap:5px;left:0;right:0;padding:6px 9px;pointer-events:none;color:#fff3cb;font:9px/1.3 var(--pixel);letter-spacing:.045em;text-shadow:1px 2px #161623;background:linear-gradient(180deg,#13121bc4,transparent)}.frame-top{top:0}.frame-bottom{bottom:0;background:linear-gradient(0deg,#13121bc4,transparent)}.frame-top b,.kicker span{display:inline-block;width:6px;height:6px;margin-right:4px;background:#fa8876;box-shadow:0 0 8px #e98c69b0}.menu-copy{padding:10px 6px 3px}.kicker{font:9px/1.3 var(--pixel);letter-spacing:.085em;color:var(--rose);margin-bottom:8px}.kicker span{background:var(--rose);box-shadow:none;width:5px;height:5px}.menu h1{font:clamp(25px,8vw,42px)/.99 var(--pixel);letter-spacing:.015em;color:#fff2c8;text-shadow:2px 3px #503329}.menu h1 em{font-style:normal;color:var(--gold)}.tagline{font-size:clamp(16px,4.8vw,23px);font-style:italic;color:var(--paper);margin:5px 0 6px}.blurb{display:none;color:var(--muted)}.menu-starts,.menu-tools{display:grid;gap:4px}.menu-starts{grid-template-columns:repeat(auto-fit,minmax(105px,1fr))}.menu-tools{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:4px}.menu-tools button{background:#312624;font-size:10px}.menu-starts button{font-size:12px}.menu-note{color:var(--green);font:9px/1.35 var(--pixel);margin:6px 0 0}.jacket{display:grid;gap:6px;align-items:center;margin:12px 0 0;padding:10px 2px 20px;border-top:1px solid #644a40;color:var(--muted)}.jacket-title,.brand{font:9px/1.4 var(--pixel)}.jacket-title{color:var(--gold);letter-spacing:.06em}.jacket-mark{color:var(--rose);font:11px/1 var(--serif);margin-right:4px}.jacket p{font-size:14px}.brand{color:var(--muted);letter-spacing:.03em}
.field{display:grid;gap:5px;padding:5px}.field-scene,.field-panel{min-width:0}.rooms,.objects,.field-tools{display:grid;gap:3px}.rooms{grid-template-columns:repeat(4,minmax(44px,1fr));margin-bottom:4px}.rooms button{padding-inline:2px;font-size:10px}.rooms button[aria-current=true]{background:var(--pine2);border-color:#859477;color:#fff4cf}.room-frame{border:1px solid #a87b57}.room-frame canvas{aspect-ratio:3/2;height:auto}.markers{position:absolute;inset:0;pointer-events:none}.marker{position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;min-width:0;min-height:0;padding:0;pointer-events:auto;border:1px solid #fff1b6;background:#231d2494;color:#fff1b6;box-shadow:1px 1px 0 #21191c;font:14px/1 monospace}.field-title{display:flex;gap:6px;justify-content:space-between;align-items:center;padding:2px 3px 4px}.field-title h2{font:13px/1.2 var(--pixel);text-transform:uppercase}.field-title span{font:9px/1.2 var(--pixel);color:var(--gold);text-align:right}.objects{grid-template-columns:repeat(3,minmax(44px,1fr));margin-bottom:4px}.objects button{background:#42312b;border-color:#896954;font-size:10px}.field-tools{grid-template-columns:repeat(3,minmax(44px,1fr))}.field-tools .primary{font-size:10px}.status{padding:4px 3px 1px;color:var(--muted);font-size:13px;min-height:19px;line-height:1.25}.status:empty{display:none}.field.screening .field-tools{grid-template-columns:repeat(3,minmax(44px,1fr))}.field.screening .objects{display:none}.capture-flash{position:absolute;inset:0;opacity:0;pointer-events:none;background:#fff2bf}.flashing .capture-flash{animation:flash .28s ease-out}.quiet .flashing .capture-flash{animation:flash-quiet .44s ease-out}@keyframes flash{0%{opacity:.52}100%{opacity:0}}@keyframes flash-quiet{0%{opacity:.16}100%{opacity:0}}
.shade{position:fixed;z-index:5;inset:0;display:grid;place-items:center;background:#16131cbb;padding:max(9px,env(safe-area-inset-top)) max(9px,env(safe-area-inset-right)) max(9px,env(safe-area-inset-bottom)) max(9px,env(safe-area-inset-left))}.dialog{width:min(100%,530px);max-height:min(100%,calc(100dvh - max(9px,env(safe-area-inset-top)) - max(9px,env(safe-area-inset-bottom))));overflow:auto;overscroll-behavior:contain;color:var(--paper);background:#352828;border:2px solid #c09765;box-shadow:4px 4px 0 #21191c,0 20px 60px #100b10;scrollbar-color:#a18363 #302420}.dialog-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#4d3730;padding:4px 7px 4px 12px;border-bottom:1px solid #987356;min-height:53px}.dialog-head h2{font:14px/1.24 var(--pixel);text-transform:uppercase}.dialog-body{padding:12px;display:grid;gap:10px}.dialog-body p{line-height:1.44}.dialog-body .fine{color:var(--muted);font-size:14px}.actions{display:flex;flex-wrap:wrap;gap:5px}.actions>button{flex:1 1 110px}.brief{margin:0;padding:0;list-style:none;display:grid;gap:5px}.brief li,.note-card{border:1px solid #735646;background:#2b2325;padding:7px 9px;line-height:1.34}.brief li b,.smalltype{display:block;color:var(--gold);font:9px/1.4 var(--pixel);text-transform:uppercase;letter-spacing:.045em}.brief li[data-grade=matched] b{color:var(--green)}.brief li[data-grade=reorder] b{color:var(--rose)}.smalltype{margin-bottom:3px}.film-list{display:grid;gap:4px}.film-list button{display:flex;align-items:center;gap:7px;text-align:left;background:#2b2325;width:100%;justify-content:flex-start;font-size:10px}.film-list small{margin-left:auto;color:var(--green);text-align:right}.film-list .empty{padding:8px;color:var(--muted);border:1px dashed #735646;font-size:14px}.sprite{flex:none;display:inline-block;width:31px;height:31px;background:url(./assets/props.png) no-repeat;background-size:300% 200%;image-rendering:pixelated}.album{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.album .note-card{min-width:0;display:flex;gap:6px;align-items:center;font-size:13px;overflow-wrap:anywhere}.album .locked{color:var(--muted)}.item-detail{display:flex;gap:9px;align-items:flex-start}.item-detail .sprite{width:39px;height:39px;border:1px solid #735646}.volume{display:grid;grid-template-columns:1fr auto;gap:4px;font:10px/1.4 var(--pixel);text-transform:uppercase}.volume input{grid-column:1/-1;min-height:44px;width:100%;margin:0;accent-color:var(--gold);touch-action:pan-y}.dialog .title-card{font:20px/1.18 var(--pixel);text-transform:uppercase;color:var(--gold)}#storage-warning{padding:4px 10px;color:#ffc399;font-size:13px}
.expanded-body{overflow:hidden}.cabinet.expanded,.cabinet:fullscreen{position:fixed;inset:0;width:100%;height:100dvh;z-index:10;border:0;border-radius:0;box-shadow:none;background:#21191c;overflow:auto;overscroll-behavior:contain;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.cabinet.expanded #content,.cabinet:fullscreen #content{width:min(100%,1090px);margin-inline:auto}.cabinet:fullscreen::backdrop{background:#21191c}
@media (max-height:560px) and (orientation:portrait){.mast{padding:6px 9px;font-size:8px}main{padding-inline:6px}.field .room-frame canvas{aspect-ratio:auto;height:clamp(136px,40dvh,222px);object-fit:fill}.sleeve canvas{height:min(37dvh,210px);object-fit:cover}.jacket{margin-top:8px}}
@media (orientation:landscape), (min-width:680px){.menu{grid-template-columns:minmax(0,1.28fr) minmax(0,1fr);align-items:center}.menu-copy{padding:12px 14px}.menu h1{font-size:clamp(25px,4.5vw,55px)}.tagline{font-size:clamp(17px,2.25vw,26px)}.field{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:7px}.field-panel{align-self:center}.field-title h2{font-size:clamp(13px,2vw,22px)}.mast-copy{display:block}.jacket{grid-template-columns:auto 1fr auto;gap:14px}.field .room-frame canvas{height:auto}}
@media (orientation:landscape) and (max-height:450px){main{padding-inline:6px}.mast{padding:5px 9px;font-size:9px}.menu-copy{padding:3px 7px}.kicker{margin-bottom:4px}.tagline{margin:3px 0 4px}.sleeve canvas{height:clamp(150px,calc(100dvh - 44px),320px);object-fit:cover}.field .room-frame canvas{height:clamp(144px,calc(100dvh - 85px),284px);object-fit:fill}.cabinet.expanded .field .room-frame canvas{height:clamp(144px,calc(100dvh - 66px),302px)}.jacket{display:none}.status{max-width:55ch}.dialog-body{gap:7px;padding:9px}}
@media (min-width:850px) and (min-height:500px){.mast{padding-block:20px 13px}.menu,.field{padding:9px}.menu-copy{padding:23px}.blurb{display:block;margin-bottom:18px;max-width:33ch}.tagline{margin:12px 0}.menu-starts,.menu-tools{gap:7px}.menu-tools{margin-top:7px}.menu-tools button,.menu-starts button{min-height:48px}.jacket{margin-top:19px;padding-top:14px}.field-panel{padding:14px}.field-title{margin-bottom:8px}.objects,.field-tools{gap:6px}.objects button,.field-tools button{min-height:49px}}
@media (max-width:355px){.menu-copy{padding-inline:3px}.menu-starts{grid-template-columns:repeat(auto-fit,minmax(90px,1fr))}.menu-starts button{font-size:10px}.edition{font-size:8px}.frame-top,.frame-bottom{font-size:8px}.jacket p{font-size:13px}}
/* Keep the entire earned menu inside a notched short landscape viewport. */
@media (orientation:landscape) and (max-height:380px){
  .menu h1{font-size:clamp(23px,4vw,31px)}
  .menu-starts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .menu-starts button,.menu-tools button{font-size:9px;padding:4px 3px}
  .menu-note{margin-top:3px}
  .sleeve canvas{height:clamp(135px,calc(100dvh - 46px - env(safe-area-inset-top) - env(safe-area-inset-bottom)),320px)}
  .field .room-frame canvas{height:clamp(135px,calc(100dvh - 85px - env(safe-area-inset-top) - env(safe-area-inset-bottom)),284px)}
  .cabinet.expanded .field .room-frame canvas{height:clamp(135px,calc(100dvh - 66px - env(safe-area-inset-top) - env(safe-area-inset-bottom)),302px)}
}
.sprite.house-icon{background-image:url(./assets/house-icons.svg);background-size:600% 100%}
@media (orientation:landscape) and (max-height:380px){
  .tagline{line-height:1.17}
  .menu-note{line-height:1.12;margin-top:2px}
  .sleeve canvas{height:clamp(135px,calc(100dvh - 52px - env(safe-area-inset-top) - env(safe-area-inset-bottom)),320px)}
}
