html,body{background:#0c0807!important;color-scheme:dark}
.game-shell{padding:0!important;background:radial-gradient(ellipse at 50% 0%,#261812 0%,#0c0807 68%)!important;min-height:100dvh!important;box-sizing:border-box}
.game-frame{max-width:min(100vw,160vh)!important;border:1px solid #6f5037!important;box-shadow:0 0 0 1px #100a07,0 18px 70px #000b!important;background:#21150f!important}
.hud-left,.hud-right{gap:.55cqw!important}
.hud-left>div,.hud-right>div{background:linear-gradient(120deg,rgba(26,17,12,.95),rgba(20,13,10,.82))!important;border:1px solid rgba(175,132,82,.48)!important;box-shadow:0 6px 24px #0008, inset 0 1px #d5a86a18;backdrop-filter:blur(8px)}
.hud-left>div:nth-child(2){border:0!important;box-shadow:none;background:none!important;backdrop-filter:none}
.hud-left>div:nth-child(2)>div{background:rgba(25,16,11,.9)!important;border:1px solid #a5784b66!important;padding:.35cqw .5cqw!important}
.hud-left{max-width:25cqw}
.hud-left>div:first-child{min-width:21cqw!important;padding:.65cqw .8cqw!important;border-top:2px solid #d3a45e!important}
.objective-panel{max-width:21.5cqw!important;border-top:2px solid #d3a45e!important}
.hud-right canvas{width:13.5cqw!important;opacity:.88}
.hud-right>div:nth-child(2){min-width:13.5cqw!important}
.hud-right button,.graphics-toggle{border:1px solid #a77a4d99!important;background:linear-gradient(180deg,#3b2417,#1d110c)!important;color:#e2bb78!important;padding:.45cqw .7cqw!important;font:600 max(11px,.75cqw) Arial,sans-serif;letter-spacing:.08em;cursor:pointer;box-shadow:inset 0 1px #e6bf7c22}
.hud-right button:hover{background:#5a3420!important;border-color:#d7a65d!important;color:#fff0c9!important}
.build-dock{bottom:2.2cqw!important;gap:.35cqw!important;align-items:stretch;max-width:96%;padding:.45cqw;background:linear-gradient(180deg,#3a261b99,#120b08f2);border:1px solid #ad7d4c88;box-shadow:0 8px 35px #0009,inset 0 1px #e3b36a20;backdrop-filter:blur(8px)}
.build-slot{width:10.6cqw!important;min-height:6.2cqw!important;padding:.55cqw!important;border-width:1px!important;transition:background .15s,transform .15s}
.build-slot:hover{transform:translateY(-3px);background:#593620!important;opacity:1!important;border-color:#d3a45e!important}
.build-slot>div:first-child>div:last-child{font-size:.88cqw!important;letter-spacing:0!important;line-height:1.2!important}
.build-slot>div:last-child{display:flex!important;flex-direction:row!important;flex-wrap:wrap;gap:.25cqw .55cqw!important}
.build-slot>div:last-child>div>div:last-child{font-size:.65cqw!important;letter-spacing:.02em!important}
.build-slot>div:last-child>div>div:nth-child(2){font-size:.95cqw!important;min-width:0!important}
.start-screen{background:linear-gradient(90deg,rgba(14,8,6,.97),rgba(34,19,12,.86) 37%,rgba(42,22,13,.12) 78%)!important}
.start-screen>div:nth-child(2){background:#d09a50!important;width:3.2cqw!important;height:.24cqw!important}
.start-screen>div:nth-child(3){letter-spacing:.03em!important;font-weight:700!important;font-size:6.1cqw!important;line-height:1!important}
.start-screen>div:nth-child(4),.start-screen>div:nth-child(5){max-width:35cqw!important}
.start-screen button{background:linear-gradient(180deg,#d9aa5f,#9b5d2d)!important;color:#1b0e08!important;font-size:1.15cqw!important;letter-spacing:.12em!important;padding:1.1cqw 2.1cqw!important;border:1px solid #e6c17c!important;box-shadow:0 5px 22px #0008,inset 0 1px #fff4c155}
button:focus-visible{outline:2px solid #f0c878!important;outline-offset:3px}
@media(max-width:700px){.game-frame{max-width:100vw!important}.objective-panel{max-width:27cqw!important}.hud-left{max-width:29cqw}.build-dock{bottom:3cqw!important}.build-slot{min-height:8cqw!important}.graphics-toggle{font-size:8px!important}}

/* A compact equipment belt gives the playfield more space. Icons are rendered
   from the actual 3D build models so the belt matches the objects in the world. */
.game-frame{border:1px solid #53605b!important;box-shadow:0 16px 70px #000b!important}
.hud-left>div,.hud-right>div{background:linear-gradient(130deg,#131d1eef,#11191be0)!important;border-color:#78807177!important;box-shadow:0 8px 25px #0006,inset 0 1px #d7dbaf0d}
.hud-left>div:nth-child(2)>div{background:#121c1ded!important;border-color:#66716788!important}
.hud-left>div:first-child{border-top-color:#b3a373!important}
.objective-panel{border-top-color:#b3a373!important}
.hud-right button,.graphics-toggle{background:linear-gradient(180deg,#2c3834,#142020)!important;color:#d4c49a!important;border-color:#7e826499!important}
.build-dock{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr));width:89cqw;gap:.35cqw!important;padding:.5cqw!important;background:linear-gradient(180deg,#243332dc,#0c1618f5)!important;border:1px solid #86907b77!important;box-shadow:0 10px 30px #0009,inset 0 1px #d3c29633;bottom:2.5cqw!important}
.build-slot{display:grid;grid-template-columns:2.8cqw 1fr;grid-template-rows:1fr auto;column-gap:.5cqw;row-gap:.3cqw;width:auto!important;min-height:4.9cqw!important;padding:.35cqw!important;border-radius:2px;position:relative;overflow:hidden}
.build-art{grid-column:1;grid-row:1/3;background-size:cover;background-position:center;width:2.8cqw;height:3.25cqw;align-self:center;border:1px solid #70827655;box-shadow:inset 0 0 5px #0008}
.build-slot>div:nth-child(2){grid-column:2;grid-row:1;align-items:flex-start!important;gap:.25cqw!important;margin:0!important}
.build-slot>div:nth-child(2)>div:first-child{font-size:.79cqw!important;line-height:1.2;color:#d5bc75!important}
.build-slot>div:nth-child(2)>div:last-child{font-size:.81cqw!important;line-height:1.15!important;font-weight:700!important;letter-spacing:.01em!important}
.build-slot>div:last-child{grid-column:2;grid-row:2;gap:.2cqw .4cqw!important;align-items:center}
.build-slot>div:last-child>div{gap:.22cqw!important}
.build-slot>div:last-child>div>div:first-child{width:.4cqw!important;height:.4cqw!important;transform:rotate(45deg)}
.build-slot>div:last-child>div>div:nth-child(2){font-size:.87cqw!important}
.build-slot>div:last-child>div>div:last-child{display:none!important}
.build-slot:hover{background:#3c514aaa!important;transform:translateY(-2px);border-color:#c1b079!important}
.start-screen{background:linear-gradient(90deg,#080f13f2,#101b20ba 38%,#101b2000 83%)!important}
@media(max-width:800px){.build-dock{width:94cqw}.build-slot{grid-template-columns:1fr;min-height:6.4cqw!important;row-gap:.25cqw}.build-art{display:none}.build-slot>div:nth-child(2),.build-slot>div:last-child{grid-column:1}.build-slot>div:nth-child(2)>div:last-child{font-size:1.04cqw!important}.build-slot>div:last-child>div>div:nth-child(2){font-size:1.05cqw!important}}
