:root{font-family:'Trebuchet MS',system-ui,sans-serif;color:#3a4f3d;background:#163f38}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;padding:12px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:4px solid #d48d32;outline-offset:3px}[hidden]{display:none!important}.game-shell{width:min(1120px,100%);height:min(890px,calc(100dvh - 24px));min-height:560px;display:grid;grid-template-rows:54px 77px minmax(150px,1fr) 140px 44px 140px 64px;background:#faf7ed;border-radius:22px;overflow:hidden;position:relative;box-shadow:0 22px 70px #09241f88;padding:0 24px}header{display:flex;align-items:center;justify-content:space-between;background:#fff9df;border-bottom:3px solid #e6cf83;margin:0 -24px;padding:0 24px;font-size:13px}header strong{letter-spacing:2px}header a{color:#385747;text-decoration:none}#progress{font-size:12px;color:#798267}.intro{display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{font-size:9px;font-weight:bold;letter-spacing:1.7px;color:#8c855e;margin:0 0 5px}h1{font-size:30px;letter-spacing:-1px;margin:0}#dayProgress{display:flex;gap:5px}#dayProgress i{width:12px;height:12px;border-radius:50%;background:#e0dccb}#dayProgress i.done{background:#73995b}#dayProgress i.current{background:#efbd55;outline:2px solid #f4dfae;outline-offset:2px}#shopScene{min-height:0;background:#f3e4c9;border-radius:16px 16px 0 0;overflow:hidden}#scene{display:block;width:100%;height:100%}#doorLeaf{transform-box:fill-box;transform-origin:right center;transition:transform .35s}#doorLeaf.open{transform:scaleX(.18)}#sun,#sky,#stars{transition:transform 1.4s,fill 1.4s,opacity 1.4s}.counter{display:flex;gap:22px;border:5px solid #bb8a55;border-top:10px solid #cd9d66;background:#e7c894;border-radius:0 0 15px 15px;padding:10px 14px;min-height:0}.payment{width:180px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-right:1px solid #b8915f;padding-right:14px}.label{font-size:9px;letter-spacing:1.5px;font-weight:bold;color:#80633b}#coins{display:flex;gap:4px;min-height:37px;align-items:center;justify-content:center}.coin{display:grid;place-items:center;border:3px double #a77925;border-radius:50%;width:34px;height:34px;background:#f5d17b;color:#77591e;font-size:15px;font-weight:900;box-shadow:0 2px 0 #966f3450}.coin.silver{background:#e6e6d7;border-color:#929585;color:#5c6157}#budget{font-size:24px;color:#654b2f;white-space:nowrap}.tray-area{flex:1;min-width:0;display:flex;flex-direction:column}.tray-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:5px}h2{font-size:15px;margin:0}.tray-top span{font-size:10px;color:#816a48}#tray{flex:1;min-height:0;display:flex;align-content:center;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px;background:#fbf0d9;border:3px solid #d3b282;border-radius:13px;padding:4px}#tray:empty:after{content:'Læg bagværk her';font-size:15px;color:#b29b75}.tray-item{display:flex;align-items:center;gap:3px;background:#fffaf0;border:1px solid #dbbf93;border-radius:8px;color:#735639;min-height:38px;padding:2px 5px;font-weight:bold;font-size:12px}.tray-item .emoji{font-size:25px}#message{text-align:center;display:grid;place-items:center;font-size:14px;font-weight:bold;line-height:1.25;padding:3px 7px}#baskets{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;padding:7px 0 5px;min-height:0}.basket{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;border:2px solid #cba372;border-bottom:7px solid #b78952;border-radius:10px 10px 20px 20px;background:repeating-linear-gradient(0deg,#e4c48e 0 7px,#d7b37b 7px 9px);color:#63492d;min-width:0;padding:7px 4px}.basket .goods{font-size:36px;line-height:1.1;text-shadow:12px -4px #0000}.basket .name{font-size:12px;margin:2px 0;font-weight:bold}.basket .price{padding:3px 11px;border-radius:6px;background:#fff9e8;font-size:19px;font-weight:900;box-shadow:0 2px 0 #9c77454d}.basket:hover:not(:disabled){filter:brightness(1.05);border-color:#9d723d}.basket:active:not(:disabled){transform:translateY(2px)}button:disabled{cursor:default}.basket:disabled{opacity:.65}footer{display:flex;align-items:center;justify-content:space-between;gap:12px}footer>span{font-size:12px;color:#7c816b;max-width:520px}footer button,.welcome button{background:#347654;color:#fff;border:0;border-bottom:5px solid #245b3e;border-radius:13px;font-size:22px;font-weight:bold;padding:10px 31px;min-height:48px}footer button:disabled{opacity:.45}.overlay{position:absolute;inset:0;z-index:10;display:grid;place-items:center;padding:20px;background:#243e3388;backdrop-filter:blur(5px)}.welcome{width:min(510px,100%);max-height:100%;overflow:auto;background:#fffaf0;border-radius:26px;text-align:center;padding:30px;box-shadow:0 25px 80px #20392f44}.welcome p{line-height:1.65}.welcome h1{font-size:32px}.mascot{font-size:49px;margin-bottom:12px}.head.shake{transform-box:fill-box;transform-origin:center;animation:headshake .65s 2}@keyframes headshake{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-9deg)}40%,80%{transform:rotate(9deg)}}.sunset #sky{fill:#e7a080}.night #sky{fill:#485c77}.night #sun{transform:translateY(135px)}.night #stars{opacity:1}.night #shopScene{filter:brightness(.85)}@media(min-width:701px) and (max-height:720px){.game-shell{grid-template-rows:48px 54px minmax(120px,1fr) 116px 40px 112px 54px;min-height:540px}.intro .eyebrow{display:none}.intro h1{font-size:25px}.counter{padding:5px 10px;gap:12px}.payment{width:150px}.basket .goods{font-size:29px}.basket .name{font-size:11px}.basket .price{font-size:17px}.tray-item{min-height:33px;font-size:11px}.tray-item .emoji{font-size:23px}.welcome{padding:22px}#budget{font-size:22px}#coins{min-height:32px}.coin{height:29px;width:29px;font-size:13px}.tray-top span{font-size:9px}}@media(max-width:700px){body{padding:8px}.game-shell{height:auto;min-height:calc(100dvh - 16px);grid-template-rows:54px 92px 178px auto 65px 258px 78px;padding:0 12px}header{margin:0 -12px;padding:0 12px;font-size:11px}header strong{letter-spacing:1px}#progress{font-size:10px}.intro{display:block;padding:14px 0}.intro h1{font-size:24px}#dayProgress{margin-top:10px}.counter{min-height:170px;gap:8px;padding:7px}.payment{width:97px;padding-right:7px}.label{font-size:8px;letter-spacing:.5px}#coins{flex-wrap:wrap;max-width:82px}.coin{width:28px;height:28px;font-size:12px}#budget{font-size:22px}.tray-top{display:block}.tray-top span{font-size:9px;display:block;margin-top:3px}.tray-item{min-height:36px}#tray{min-height:92px}.tray-item .emoji{font-size:24px}#baskets{grid-template-columns:repeat(3,1fr);gap:10px}.basket .goods{font-size:30px}.basket .name{font-size:11px}#message{font-size:13px}footer>span{max-width:190px;font-size:11px}footer button{padding:10px 22px}#scene{width:145%;max-width:none;transform:translateX(-19%)}.welcome{padding:23px}.welcome h1{font-size:28px}.mascot{font-size:39px}}@media(prefers-reduced-motion:reduce){*,*:before{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(min-width:701px) and (max-height:720px){footer button{font-size:20px;padding:8px 28px;min-height:48px}}
.counter{position:relative;z-index:1}
.counter:before{content:'';position:absolute;left:-5px;right:-5px;bottom:calc(100% + 10px);height:var(--cover-height,40px);background:#e7c894;border:5px solid #bb8a55;border-top:10px solid #cd9d66;border-bottom:0;box-sizing:border-box;pointer-events:none}
#sun{transition:transform .8s ease-in-out}
@media(prefers-reduced-motion:reduce){#sun{transition-duration:.01ms}}
.counter{border-top-color:#e7c894}
/* Kunden lægger mønterne på skrankens øverste flade. */
.counter .payment{position:absolute;left:var(--coins-x,65%);top:calc(-10px - var(--cover-height,40px)/2);transform:translate(-50%,-50%);width:auto;border:0;padding:0;z-index:2;gap:0}
.counter #coins{flex-wrap:nowrap;max-width:none;min-height:0}
/* Hvert synligt stykke i kurven svarer til én vare på lager. */
.basket .goods{display:grid;grid-template-columns:repeat(3,1fr);align-content:center;justify-items:center;gap:0 4px;min-height:54px;line-height:1;width:100%;max-width:116px}
.stock-piece{font-size:26px;line-height:1;display:block}
.stock-label{position:absolute;top:23px;background:#fff7e5;border:1px solid #bd9966;border-radius:5px;padding:4px 8px;font-weight:bold;font-size:13px;color:#8a603c;transform:rotate(-7deg)}
.stock-label:empty{display:none}.basket.sold-out{opacity:.8}
@media(min-width:701px) and (max-height:720px){.basket .goods{min-height:42px;max-width:100px}.stock-piece{font-size:21px}.stock-label{top:15px;font-size:12px}}
@media(max-width:700px){.basket .goods{min-height:46px;max-width:95px}.stock-piece{font-size:23px}}
