body.workshop{--ink:#66442d;--coral:#72c49b;--cream:#fff4db;--sky:#ead2b0;background:#ead2b0}
.workshop #home{background:#eacda4 url('/cloud/assets/workshop-world.png') center/cover no-repeat}
.workshop .intro-copy{left:4cqw;top:12cqh;width:45cqw}
.workshop .hero-logo{max-height:47cqh;filter:drop-shadow(0 9px 7px #63331744)}
.workshop .tagline{display:none}
.workshop .continue{margin-top:4cqh;box-shadow:0 6px 0 #378763,0 12px 25px #754a2c33;border-color:#b7ebcf}
.workshop .button{box-shadow:0 5px 0 #378763,0 8px 17px #6f47242b;border-color:#b7ebcf}
.workshop .button:active{box-shadow:0 2px 0 #378763}
.workshop .friends{width:58cqw;right:-1cqw;bottom:8cqh;max-height:61cqh;animation:train-arrive 1.7s .3s cubic-bezier(.2,.7,.3,1) both;filter:drop-shadow(0 13px 9px #5f361a30)}
.workshop .intro.ready .friends{animation:train-sway 4s ease-in-out infinite}
.workshop .sound-hint{color:#68472e;background:#fff6e8d9;border-radius:30px;left:32%;right:32%;padding:4px 10px;font-size:clamp(11px,1.05cqw,16px)}
.workshop .round{background:#fff0d4;border-color:#ffe9be;box-shadow:0 4px 0 #c39562,0 7px 12px #573e291a}
.workshop .round img{filter:invert(27%) sepia(19%) saturate(1451%) hue-rotate(344deg)}
.workshop .catalog{padding:2cqh 6cqw 4cqh}
.workshop .catalog-header{height:18cqh;gap:2cqw}
.workshop .catalog h2{font-size:clamp(23px,3cqw,46px);color:#603a25;text-shadow:0 2px #ffedcc;white-space:nowrap}
.workshop .brand-button{width:16cqw}
.workshop .cards{grid-template-columns:1fr 1fr .72fr;grid-template-rows:minmax(0,1fr) minmax(0,1fr);height:71cqh;gap:1.6cqh 1.7cqw}
.workshop .game-card{min-height:0;overflow:hidden;border:5px solid #cd9b61;background:#f5d49e;border-radius:clamp(16px,2cqw,30px);box-shadow:inset 0 0 0 2px #fff0bd,0 7px 0 #9d663a,0 12px 16px #64401d33}
.workshop .game-card:nth-child(1){grid-column:1;grid-row:1/span 2}
.workshop .game-card:nth-child(2){grid-column:2;grid-row:1/span 2}
.workshop .game-card:nth-child(3){grid-column:3;grid-row:1}
.workshop .game-card:nth-child(4){grid-column:3;grid-row:2}
.workshop .cover-wrap{flex:1 1 0;min-height:0;border-radius:clamp(12px,1.6cqw,25px) clamp(12px,1.6cqw,25px) 0 0}
.workshop .card-body{background:#fff0d1;border-radius:0 0 20px 20px;min-height:22cqh;padding:1.5cqh 1.3cqw 2.2cqh;gap:1.4cqh}
.workshop .card-body h3{color:#6d3e26;font-size:clamp(20px,2.65cqw,38px)}
.workshop .game-card:nth-child(n+3) .card-body{min-height:8cqh;padding:.8cqh .7cqw;display:flex;flex-direction:row;justify-content:space-evenly;gap:.5cqw;border-radius:0 0 15px 15px}
.workshop .game-card:nth-child(n+3) .card-body h3{font-size:clamp(14px,1.75cqw,24px)}
.workshop .game-card:nth-child(n+3) .card-cover{object-position:center 50%}
.workshop .soon-label{font-size:clamp(11px,1.2cqw,18px);min-height:24px;padding:.2em .7em;color:#83613f;background:#f1dbb4;border:1px solid #dfbb8c}
.workshop .play{min-width:65%;padding:.25em 1em}
.workshop .game-card[data-game="puzzles"] .play{min-width:0;font-size:clamp(12px,1.4cqw,20px);min-height:36px;gap:.3em;padding:.3em .6em}
.workshop .lock-button{right:.8cqw;bottom:12cqh;border-color:#ffecac;box-shadow:0 4px 0 #b88235;transform:rotate(5deg)}
.workshop .catalog-status{color:#68472e;margin-top:2cqh}
.workshop .modal{background:#fff5e3;border-color:#f9deb2}
@keyframes train-arrive{from{opacity:0;transform:translateX(40cqw)}to{opacity:1;transform:translateX(0)}}
.hub-carousel{height:73cqh;display:flex;flex-direction:column;gap:7px}
.cards.carousel-track{display:flex;align-items:center;grid-template-columns:none;grid-template-rows:none;height:100%;gap:0;margin:0}
.cards.carousel-track .game-card{flex:0 0 var(--carousel-slot,33.333333%);width:var(--carousel-slot,33.333333%);height:94%;animation:none;overflow:hidden;min-width:0;transform:scale(.92)}
.cards.carousel-track .game-card.is-active{transform:scale(.98)}
.cards.carousel-track .game-card .card-body{min-height:20cqh;flex-direction:column;justify-content:center;padding:1.2cqh 1.1cqw;gap:1cqh;border-radius:0 0 20px 20px}
.cards.carousel-track .game-card .card-body h3{font-size:clamp(18px,2.6cqw,36px)}
.cards.carousel-track .game-card .play{min-width:72%;font-size:clamp(16px,1.9cqw,29px);min-height:44px;padding:.3em 1em}
.cards.carousel-track .game-card .cover-wrap{flex:1;min-height:0}
.cards.carousel-track .game-card .card-cover{object-position:center;object-fit:contain;background:#fff0d1}
.cards.carousel-track .game-card .lock-button{bottom:11cqh}
.workshop .catalog-status{margin-top:0}
@keyframes train-sway{0%,100%{transform:translateY(0) rotate(-.3deg)}50%{transform:translateY(-5px) rotate(.3deg)}}
@media(prefers-reduced-motion:reduce){.workshop .friends{animation:none!important}}

/* Scaling follows the drag continuously; no second CSS animation may lag behind. */
.cards.carousel-track .game-card{transition:none}
