@font-face{font-family:Pixeloid;src:url('./fonts/PixeloidSans-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Pixeloid;src:url('./fonts/PixeloidSans-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Oxanium;src:url('./fonts/Oxanium.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:Chakra;src:url('./fonts/ChakraPetch-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Chakra;src:url('./fonts/ChakraPetch-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Chakra;src:url('./fonts/ChakraPetch-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{--apricot-unit:min(.08460237vw,.15037594dvh);--apricot-ink:#2d181c;--apricot-paper:#fef3cd;--apricot-edge:#5c382c;--apricot-font:Pixeloid,monospace}
.pixel-icon{display:block;width:32px;height:32px;flex-shrink:0;fill:initial;stroke:none;image-rendering:pixelated}
.workshop-ui .pixel-icon{fill:initial;stroke:none;stroke-width:0;stroke-linejoin:miter;stroke-linecap:butt}
.pc-picker{--u:min(.08460237vw,calc((100dvh - 150px) / 620));position:fixed;inset:120px 0 16px;margin:auto;padding:0;width:calc(846 * var(--u));height:calc(600 * var(--u));max-width:none;max-height:none;overflow:visible;border:0;background:none;color:var(--apricot-ink);font-family:var(--apricot-font);text-shadow:none;outline:none}
.pc-picker::backdrop{background:transparent}
.pc-picker-body{position:absolute;left:0;top:calc(37 * var(--u));width:100%;height:calc(540 * var(--u));isolation:isolate;padding:calc(75 * var(--u)) calc(24 * var(--u)) calc(51 * var(--u))}
.pc-picker-body::before{content:'';position:absolute;inset:0 0 calc(-23 * var(--u));z-index:-1;background:url('./frames/panel.svg') 0 0/100% 100% no-repeat;pointer-events:none}
.pc-picker-heading{position:absolute;top:calc(-37 * var(--u));left:50%;transform:translateX(-50%);width:calc(450 * var(--u));height:calc(80 * var(--u));display:flex;align-items:center;justify-content:center;background:url('./frames/title.svg') center/100% 100% no-repeat}
.pc-picker-heading h1{margin:calc(-4 * var(--u)) 0 0;font:700 calc(33 * var(--u))/1.2 Pixeloid,monospace;letter-spacing:0;color:#fff9e7;paint-order:stroke fill;-webkit-text-stroke:calc(5 * var(--u)) #45271f;text-shadow:0 calc(3 * var(--u)) #45271f;white-space:nowrap}
.pc-picker-subtitle{position:absolute;top:calc(45 * var(--u));left:0;width:100%;margin:0;text-align:center;font:700 calc(13.5 * var(--u))/1.3 Pixeloid,monospace}
.pc-picker-close{position:absolute;right:calc(-2 * var(--u));top:calc(7 * var(--u));display:grid;place-items:center;width:calc(57 * var(--u));height:calc(56 * var(--u));padding:0;color:#38231e;cursor:pointer;border:0;background:url('./frames/picker-close.svg') 0 0/100% 100% no-repeat}
.pc-picker-close .pixel-icon{width:calc(32 * var(--u));height:calc(32 * var(--u))}
.pc-picker-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(9 * var(--u));height:calc(414 * var(--u))}
.pc-choice{position:relative;min-width:0;min-height:0;background:url('./frames/card.svg') center/100% 100% no-repeat;text-align:center;padding:calc(10 * var(--u));display:flex;flex-direction:column;align-items:stretch}
.pc-choice{cursor:pointer;transition:translate .16s ease,filter .16s ease}
.pc-choice:has(button:disabled){cursor:not-allowed}
.pc-choice.is-selected{background-image:url('./frames/card-selected-green.svg')}
.pc-choice-art{position:relative;width:100%;height:calc(173 * var(--u));flex-shrink:0;overflow:hidden}
.pc-choice-art img{position:absolute;width:calc(236 * var(--u));height:calc(197 * var(--u));max-width:none;object-fit:contain;left:50%;top:calc(-9 * var(--u));transform:translateX(-50%);user-select:none}
.pc-choice[data-package=sprout] .pc-choice-art img{width:calc(294 * var(--u));height:calc(245 * var(--u));top:calc(-47 * var(--u))}
.pc-choice[data-package=grove] .pc-choice-art img{width:calc(260 * var(--u));height:calc(217 * var(--u));top:calc(-25 * var(--u))}
.pc-choice[data-package=bloom] .pc-choice-art img{width:calc(254 * var(--u));height:calc(212 * var(--u));top:calc(-16 * var(--u))}
.pc-choice[data-package=canopy] .pc-choice-art img{width:calc(226 * var(--u));height:calc(188 * var(--u));top:calc(1 * var(--u))}
.pc-choice h2{margin:0;font:700 calc(18 * var(--u))/calc(26 * var(--u)) Pixeloid,monospace;letter-spacing:0;color:#29212a}
.pc-choice-case{margin:0 0 calc(5 * var(--u));font:400 calc(11.5 * var(--u))/calc(17 * var(--u)) Pixeloid,monospace;white-space:nowrap;letter-spacing:calc(-.15 * var(--u));color:#514238}
.pc-choice-specs{font:400 calc(13 * var(--u))/calc(18 * var(--u)) Pixeloid,monospace;background:#fffbeeae;border-radius:calc(5 * var(--u));padding:calc(2 * var(--u)) 0}
.pc-choice-rate{display:block;font:700 calc(18 * var(--u))/calc(26 * var(--u)) Pixeloid,monospace;color:#692f26;margin:calc(3 * var(--u)) 0 0;background:#f9e6b7aa;border-radius:calc(3 * var(--u))}
.pc-choice.is-selected .pc-choice-rate{background:#b9dda077}
.pc-choice-price{display:flex;justify-content:center;align-items:center;gap:calc(8 * var(--u));height:calc(38 * var(--u));flex-shrink:0;font:700 calc(22 * var(--u))/1 Pixeloid,monospace;color:#622d25}
.pc-choice-price .pixel-icon{width:calc(27 * var(--u));height:calc(27 * var(--u))}
.pc-choice-price .pc-choice-free{color:#2c5c33}
.pc-choice-button,.pc-picker-start{position:relative;font-family:var(--apricot-font);font-weight:700;cursor:pointer;border:0;background:url('./frames/picker-button.svg') 0 0/100% 100% no-repeat;line-height:1.05}
.pc-choice-button{font:700 calc(16 * var(--u))/1.25 Pixeloid,monospace;height:calc(49 * var(--u));flex-shrink:0;width:100%;margin-top:auto;margin-bottom:calc(2 * var(--u));padding:0 0 calc(3 * var(--u));color:#fff9e7;paint-order:stroke fill;-webkit-text-stroke:calc(2.5 * var(--u)) #813823;text-shadow:0 calc(1 * var(--u)) #813823;white-space:nowrap}
.pc-choice.is-selected .pc-choice-button{display:flex;align-items:center;justify-content:center;gap:calc(5 * var(--u));background-image:url('./frames/picker-selected-green.svg');-webkit-text-stroke-color:#2c5c33;text-shadow:0 calc(1 * var(--u)) #2c5c33}
.pc-choice-button .pixel-icon{width:calc(19 * var(--u));height:calc(19 * var(--u));color:#fff9e7;filter:drop-shadow(0 calc(1 * var(--u)) #2c5c33)}
.pc-choice-check{position:absolute;z-index:1;top:calc(-4 * var(--u));right:calc(-1 * var(--u));display:none;width:calc(38 * var(--u));height:calc(38 * var(--u));border:0;padding:calc(4 * var(--u)) calc(3 * var(--u)) calc(7 * var(--u));background:url('./frames/picker-check.svg') 0 0/100% 100% no-repeat;color:#fff9e4;place-items:center}
.pc-choice.is-selected .pc-choice-check{display:grid;background-image:url('./frames/picker-check-green.svg')}
.pc-choice-check .pixel-icon{width:calc(24 * var(--u));height:calc(24 * var(--u))}
.pc-picker-start{position:absolute;bottom:calc(-17 * var(--u));left:50%;transform:translateX(-50%);width:calc(336 * var(--u));height:calc(58 * var(--u));font:700 calc(21 * var(--u))/1.2 Pixeloid,monospace;padding:0 12px calc(4 * var(--u));color:#251b19;background:none;white-space:nowrap;isolation:isolate;z-index:1}
.pc-picker-start::after{content:'';position:absolute;inset:0;z-index:-1;background:url('./frames/picker-start.svg') 0 0/100% 100% no-repeat;pointer-events:none}
.pc-picker,.workshop-ui .resource-pill,.workshop-ui .game-nav{font-synthesis:none}
.pc-picker button:focus-visible{outline:calc(3 * var(--u)) solid #944421;outline-offset:calc(4 * var(--u))}
.pc-picker button:disabled{opacity:.6;cursor:not-allowed}
.pc-picker button:not(:disabled):hover{filter:brightness(1.055)}
.pc-picker button:not(:disabled):active{translate:0 calc(2 * var(--u))}
.pc-picker-status{position:absolute;z-index:4;left:50%;top:40%;transform:translate(-50%,-50%);width:max-content;max-width:85%;padding:14px 20px;background:#fff7e4;border:2px solid #b46841;box-shadow:0 3px #54392a;text-align:center;font:700 16px/1.5 Chakra,monospace}
.pc-picker-status[hidden]{display:none}
.pc-picker-retry{display:block;margin:10px auto 0;padding:6px 16px;background:#ffb56b;color:#35211d;border:2px solid #8a5736;font:inherit}
body[data-pc-picker] .game-nav,body[data-pc-picker] .first-pc-card{visibility:hidden}
.workshop-ui .economy-hud{--u:var(--apricot-unit);top:calc(13 * var(--u));right:calc(16 * var(--u));gap:calc(16 * var(--u));font-family:var(--apricot-font);text-shadow:none}
.workshop-ui .resource-pill{box-sizing:border-box;display:flex;align-items:center;gap:calc(8 * var(--u));min-width:0;width:calc(155 * var(--u));height:calc(53 * var(--u));padding:calc(1 * var(--u)) calc(8 * var(--u)) calc(4 * var(--u));border:0;border-radius:0;background:url('./frames/resource.svg') 0 0/100% 100% no-repeat;color:var(--apricot-ink);box-shadow:none;text-shadow:none;font-family:var(--apricot-font);text-align:left}
.workshop-ui .resource-pill.energy-pill{width:calc(180 * var(--u))}
.workshop-ui .resource-pill .pixel-icon{width:calc(35 * var(--u));height:calc(35 * var(--u))}
.workshop-ui .resource-pill .resource-readout{display:flex;flex-direction:column;gap:0;white-space:nowrap}
.workshop-ui .resource-pill .resource-label{font:700 calc(12 * var(--u))/1.25 Pixeloid,monospace;color:#66372a;letter-spacing:0}
.workshop-ui .resource-pill strong{font:700 calc(21 * var(--u))/1.15 Pixeloid,monospace;color:#622d25;letter-spacing:0}
.workshop-ui .resource-pill:hover{filter:brightness(1.04)}
.workshop-ui .resource-pill.depleted .resource-label{color:#a24d2b}
/* The bottom navigation is one row of equal grid columns, one per button (Build, Market, Inventory and my-pcs.mjs's
   MY PCS): each button fills its column, so all are exactly as wide in every mode and at every size, whatever the label. */
.workshop-ui .game-nav{--u:var(--apricot-unit);display:grid;grid-auto-flow:column;grid-auto-columns:calc(154 * var(--u));bottom:max(calc(24 * var(--u)),env(safe-area-inset-bottom));gap:calc(12 * var(--u));width:auto}
.workshop-ui .game-nav button{display:flex;align-items:center;justify-content:center;gap:calc(8 * var(--u));width:auto;min-width:0;height:calc(64 * var(--u));padding:0 calc(3 * var(--u)) calc(5 * var(--u));border:calc(9 * var(--u)) solid transparent;border-image:url('./frames/cream.svg') 12 fill stretch;border-radius:0;background:none;box-shadow:none;font:700 calc(13 * var(--u))/1 Pixeloid,monospace;letter-spacing:calc(-.3 * var(--u));color:#211b22;text-shadow:none}
.workshop-ui .game-nav .pixel-icon{width:calc(40 * var(--u));height:calc(40 * var(--u))}
.workshop-ui .game-nav button:hover,.workshop-ui .game-nav button.active{background:none;border-image-source:url('./frames/start.svg');box-shadow:none}
.workshop-ui .game-nav button:active{translate:0 calc(2 * var(--u))}
.workshop-ui .game-nav button:focus-visible,.workshop-ui .resource-pill:focus-visible{outline:calc(3 * var(--apricot-unit)) solid #ad5b35;outline-offset:4px}
.workshop-ui .first-pc-card{font:700 17px Pixeloid,monospace;color:var(--apricot-ink);background:none;border:9px solid transparent;border-image:url('./frames/cream.svg') 12 fill stretch;border-radius:0;box-shadow:none;text-shadow:none;padding:8px 15px;bottom:calc(98 * var(--apricot-unit))}
@media(max-width:700px){
 :root{--apricot-unit:1px}
 .workshop-ui .economy-hud{top:12px;right:10px;gap:7px}
 .workshop-ui .resource-pill{width:126px;height:47px;padding:0 2px 4px;gap:5px}
 .workshop-ui .resource-pill.energy-pill{width:150px}
 .workshop-ui .resource-pill .pixel-icon{width:29px;height:29px}
 .workshop-ui .resource-pill .resource-label{font-size:11px}
 .workshop-ui .resource-pill strong{font-size:20px}
 .workshop-ui .game-nav{grid-auto-columns:minmax(0,1fr);gap:7px;width:calc(100% - 20px);bottom:max(14px,env(safe-area-inset-bottom))}
 .workshop-ui .game-nav button{height:55px;padding:0 0 4px;gap:4px;font-size:11px}
 .workshop-ui .game-nav .pixel-icon{width:29px;height:29px}
 .pc-picker{--u:1px;translate:none;inset:146px 0 18px;width:calc(100% - 16px);height:auto;max-height:calc(100dvh - 164px);overflow:auto;scrollbar-width:thin;scrollbar-color:#c99461 #fff4d2;background:#fff4d2;border:3px solid #76503b;padding:0 10px 10px}
 .pc-picker-body{position:relative;top:0;height:auto;padding:0;background:none}
 .pc-picker-body::before{display:none}
 .pc-picker-heading{position:relative;left:auto;top:auto;transform:none;width:calc(100% - 36px);height:60px;margin:8px auto 0}
 .pc-picker-heading h1{font-size:22px;-webkit-text-stroke:3px #4a2c24;margin-top:-2px}
 .pc-picker-close{right:-9px;top:2px;width:40px;height:40px;padding:0}
 .pc-picker-close .pixel-icon{width:24px;height:24px}
 .pc-picker-subtitle{position:relative;top:0;margin:8px 0 14px;font-size:11px}
 .pc-picker-grid{height:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .pc-choice{min-height:350px;padding:8px}
 .pc-choice-art{height:137px}
 .pc-choice .pc-choice-art img{width:211px;height:176px;top:-18px}
 .pc-choice[data-package=sprout] .pc-choice-art img{width:248px;height:207px;top:-40px}
 .pc-choice[data-package=grove] .pc-choice-art img{width:221px;height:184px;top:-21px}
 .pc-choice[data-package=bloom] .pc-choice-art img{width:216px;height:180px;top:-14px}
 .pc-choice[data-package=canopy] .pc-choice-art img{width:192px;height:160px;top:0}
 .pc-choice h2{font-size:17px}
 .pc-choice-case{font-size:10px;min-height:28px;line-height:1.3;white-space:normal}
 .pc-choice-specs{font-size:11px}
 .pc-choice-rate{font-size:17px}
 .pc-choice-price{height:35px;font-size:20px}
 .pc-choice-button{font-size:14px;height:44px;margin-bottom:3px}
 .pc-choice-check{width:30px;height:30px}
 .pc-choice-check .pixel-icon{width:20px;height:20px}
 .pc-picker-start{position:sticky;bottom:-5px;left:auto;transform:none;display:block;margin:10px auto 0;width:95%;height:54px;font-size:19px;z-index:2}
 .pc-picker-status{position:fixed;max-width:80vw;top:45%;font-size:14px}
}
@media(hover:hover) and (pointer:fine){
 .pc-choice-art img{transition:scale .16s ease;transform-origin:50% 65%}
 .pc-choice:not(.is-selected):not(:has(button:disabled)):hover{background-image:url('./frames/card-hover.svg');translate:0 -3px;filter:drop-shadow(0 0 3px #e6ba5c66)}
 .pc-choice:not(.is-selected):not(:has(button:disabled)):hover .pc-choice-art img{scale:1.04}
}
@media(prefers-reduced-motion:reduce){.pc-picker *,.workshop-ui .game-nav *{transition:none}.pc-picker .pc-choice{translate:none}.pc-picker .pc-choice .pc-choice-art img{scale:none}}

/* Keep each complete styled chassis inside its art slot at any card size. */
.pc-picker .pc-choice[data-appearance="starter-finishes-1"] .pc-choice-art img{width:auto;aspect-ratio:6/5}
.pc-picker .pc-choice[data-package=sprout][data-appearance="starter-finishes-1"] .pc-choice-art img{height:151.3%;top:-37.6%}
.pc-picker .pc-choice[data-package=grove][data-appearance="starter-finishes-1"] .pc-choice-art img{height:123.4%;top:-15.9%}
.pc-picker .pc-choice[data-package=bloom][data-appearance="starter-finishes-1"] .pc-choice-art img{height:124.7%;top:-17.7%}
.pc-picker .pc-choice[data-package=canopy][data-appearance="starter-finishes-1"] .pc-choice-art img{height:110.1%;top:-4.8%}
