/* Black background and wide desktop layout for the main-game pages (like /gear/).
   Linked by tools/apply_wide_black.py. */
html,body{background:#000!important}
body::before,body::after{display:none!important}
main#main.wrap:not(.planw){max-width:1720px!important;margin:0 auto!important;padding:0 clamp(16px,3vw,48px) 40px!important;box-sizing:border-box}
main#main.wrap>h1+p,main#main.wrap>p{max-width:960px}
/* shared buttons and chips */
.ctab,.chip,.gcmp,.qmore,.dbtn,.fvnav button{background:#141414!important;border-color:#333!important}
.ctab:hover,.chip:hover,.qmore:hover,.dbtn:hover{border-color:#ffc94d!important;filter:none!important}
.ctab.on,.ctab[aria-selected="true"],.chip.on,.chip[aria-pressed="true"]{background:#ffc94d!important;border-color:#ffc94d!important;color:#1b1405!important}
/* furniture */
.fgrid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;gap:14px!important}
.fc{background:radial-gradient(circle at 50% 38%,#1f1f1f,#0b0b0b 72%)!important;border-color:#262626!important}
.fc:hover,.fc:focus-visible{border-color:#ffc94d!important;box-shadow:0 0 0 1px rgba(255,201,77,.35),0 10px 30px rgba(0,0,0,.6)}
dialog.fv{background:#0b0b0b!important;border-color:#333!important}dialog.fv::backdrop{background:rgba(0,0,0,.85)!important}
.fvcan{background:radial-gradient(circle at 50% 45%,#2a2a2a,#050505 75%)!important}
/* crafting, items, museum */
.rgrid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))!important}
.rc,.insp{background:#0e0e0e!important;border-color:#262626!important}
.cslots{grid-template-columns:repeat(auto-fill,minmax(124px,1fr))!important}
/* quiz */
.qmode{background:linear-gradient(160deg,#181818,#0b0b0b)!important;border-color:#2a2a2a!important}
.qmode:hover{border-color:#ffc94d!important}
.qopt{background:#141414!important;border-color:#333!important}
/* wiki */
.wikidb>*,.modesel>*{background:#0e0e0e!important;border-color:#262626!important}
/* planner */
.pstage,.pload{background:#0b0b0b!important}
.dexp{background:#0b0b0b!important;border-color:#262626!important}
.gridwrap{background:#060606!important;border-color:#222!important}
.cslot{background:#141414!important;border-color:#2c2c2c!important}
.qg{max-width:1120px!important}
.qcard,.qsetup{background:#0e0e0e!important;border-color:#262626!important}
input[type=search],input[type=text],select{background-color:#111!important;border-color:#333!important}
/* phones keep their own layout */
@media (max-width:520px){.fgrid,.cslots{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.rgrid{grid-template-columns:1fr!important}}
.trk-hero img{max-height:78vh;object-fit:cover}
/* museum dexes on wide screens: grid left, a compact sticky info card right (model beside the text), both fit the screen */
@media (min-width:1100px){
  .dexp .dmain{grid-template-columns:minmax(0,1fr) minmax(520px,640px)!important;gap:20px!important}
  .dexp .gridwrap{max-height:calc(100vh - 110px)!important;position:sticky;top:84px}
  .dexp .slots{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important}
  .dexp .insp{display:grid!important;grid-template-columns:230px minmax(0,1fr);grid-template-areas:"box info" "tog info";column-gap:20px;align-items:start;align-content:start;top:84px!important;max-height:calc(100vh - 110px);overflow:auto}
  .dexp .insp .pbox{grid-area:box;width:230px!important;margin:0!important}
  .dexp .insp .vtog{grid-area:tog;justify-content:center;margin-top:8px}
  .dexp .insp #insp{grid-area:info;min-width:0}
  .dexp .insp h2{font-size:28px!important;margin-top:0!important}
}
@media (min-width:1100px){
  .dexp aside.insp#insp{grid-template-areas:none;grid-auto-flow:row dense}
  .dexp aside.insp#insp>*{grid-column:2;margin-top:0}
  .dexp aside.insp#insp>:first-child{grid-column:1;grid-row:1 / span 30;width:230px;margin:0}
}
@media (min-width:700px){.dexp .tabs{grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}}
