:root{color-scheme:light;--ink:#274c4b;--cream:#fff9df;--teal:#178f86}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%}body{background:#fff8e7;color:var(--ink);font-family:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent;font:inherit}button{cursor:pointer;color:inherit}button:focus-visible{outline:4px solid #2f527f;outline-offset:5px}h1,h2,p{margin:0}.game-shell{width:min(1440px,100%);height:100svh;min-height:650px;padding:18px 28px 12px;margin:auto;display:grid;grid-template-rows:76px minmax(0,1fr) 53px;gap:12px}.topbar .home-link{border-radius:18px;background:#fff;border:2px solid #eddfbf;box-shadow:0 4px 0 #eaddbb}.brand{display:flex;gap:13px;align-items:center}.brand-icon{background:#ffca3e;color:#d95a52;width:53px;height:53px;display:grid;place-items:center;font-size:48px;line-height:1;border-radius:18px;transform:rotate(-8deg)}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:900;color:#bc6550}.brand h1{font-size:clamp(24px,3.1vw,38px);font-weight:950;letter-spacing:-1.3px;line-height:1.2}.progress-card{width:238px;padding:14px 18px;border:1px solid #e5d9b9;border-radius:17px;background:#fffdf2}.progress-card>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:11px;font-weight:750}.progress-card strong{color:#107b72}.progress-track{height:9px;background:#e9e6cf;border-radius:20px;margin-top:10px;overflow:hidden}.progress-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#f45e78,#ffc735,#22baa1);border-radius:inherit;transition:width .35s}.laundry-room{position:relative;isolation:isolate;min-height:0;overflow:hidden;border-radius:27px;border:3px solid #edb290;box-shadow:0 7px 0 #eddfbf;background:#ffcfb9}.room-art{position:absolute;width:100%;height:100%;inset:0;z-index:-1}.sorting-spot{position:absolute;left:50%;top:20px;transform:translateX(-50%);width:350px;height:calc(100% - 220px);display:flex;flex-direction:column;align-items:center;justify-content:center}.item-number{font-size:10px;letter-spacing:2px;font-weight:900;background:#fff9de;border:1px solid #f5bc8b;border-radius:50px;padding:8px 16px;position:absolute;top:8px;z-index:2}.sorting-halo{position:absolute;width:245px;height:245px;border-radius:50%;background:#fff5d6bb;border:2px dashed #ffffffa6;box-shadow:0 0 0 13px #fff2d640;top:44px}.garment{position:relative;z-index:4;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;padding:0;width:280px;touch-action:none;user-select:none;transform:translate(var(--drag-x,0px),var(--drag-y,0px));transition:filter .2s;cursor:grab;outline-offset:-2px!important}.garment-art{width:245px;height:195px;display:block;filter:drop-shadow(0 12px 4px #98472d28);transition:transform .2s}.garment-art svg{width:100%;height:100%;overflow:visible}.garment strong{padding:6px 19px;background:#fffbed;border-radius:20px;font-size:16px;box-shadow:0 3px 0 #ecbf99}.garment small{margin-top:9px;font-size:11px;color:#864d43;font-weight:800}.garment:hover .garment-art,.garment.is-selected .garment-art{transform:rotate(-5deg) scale(1.05)}.garment.is-selected strong{box-shadow:0 0 0 3px #309d91}.garment.is-dragging{z-index:30;cursor:grabbing}.garment.is-dragging .garment-art{transform:rotate(8deg) scale(1.08)}.garment.is-sorted{animation:pop-away .4s forwards;pointer-events:none}.basket-heading{position:absolute;bottom:191px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;color:#795831;font-weight:850;font-size:10px;letter-spacing:1.5px}.basket-heading span:last-child{letter-spacing:.1px;font-size:12px}.basket-row{position:absolute;left:4%;right:4%;bottom:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:23px}.basket{position:relative;display:grid;justify-items:center;border:0;background:transparent;padding:0 2px 5px;transition:transform .18s;min-width:0;touch-action:manipulation}.basket-art{display:block;width:100%;height:140px}.basket svg{display:block;margin:auto;width:100%;max-width:235px;height:140px;overflow:visible;filter:drop-shadow(0 7px 0 #925f3120)}.basket-name{display:flex;align-items:center;gap:7px;font-size:17px;font-weight:900}.basket-name kbd{font-family:inherit;font-size:9px;border:1px solid #ac856144;border-radius:5px;width:17px;height:17px;display:grid;place-items:center;background:#fff3cba8;color:#785c42}.basket-count{font-size:10px;margin-top:1px;font-weight:750;color:#715331}.basket:hover,.basket.is-hovered{transform:translateY(-6px)}.basket.is-hovered{filter:drop-shadow(0 0 8px #fff)}.basket.is-correct{animation:basket-bounce .45s}.basket.is-wrong{animation:wiggle .4s}.basket.is-hint{filter:drop-shadow(0 0 10px #fff)}.instruction-bar{display:flex;align-items:center;gap:10px;padding:4px 6px;font-size:12px;font-weight:650}.instruction-bar p{flex:1}.instruction-icon{font-size:27px;color:#ec9f22}.key-hint{font-size:10px;color:#6e7b70;display:flex;gap:4px;align-items:center}.key-hint kbd{border:1px solid #d4d9c7;border-radius:4px;padding:2px 4px;font-family:inherit}.instruction-bar button{background:#fffdf3;border:1px solid #d9d9bb;border-radius:12px;padding:10px 13px;font-size:11px;font-weight:800;margin-left:10px}.effects{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:35}.sparkle{position:absolute;width:9px;height:9px;background:var(--color);border-radius:3px;animation:spark .7s ease-out forwards}.tumbling-sock{transform-origin:99px 88px;animation:tumble 8s linear infinite}dialog{border:3px solid #f0c55c;border-radius:30px;background:#fffbed;color:var(--ink);text-align:center;padding:35px 42px;max-width:calc(100vw - 32px);box-shadow:0 20px 100px #67462c44}dialog::backdrop{background:#23575290;backdrop-filter:blur(6px)}dialog h2{font-size:34px;letter-spacing:-1px;margin:8px 0 12px}dialog>p:not(.eyebrow){font-size:14px;line-height:1.7}.finish-medal{color:#fff5b9;background:#ffbf2e;box-shadow:0 0 0 8px #ffeab0;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;margin:0 auto 25px;font-size:55px}.finish-colors{display:flex;gap:9px;justify-content:center;margin:21px}.finish-colors i{height:13px;width:38px;border-radius:20px;background:#f05671}.finish-colors i:nth-child(2){background:#2ba5e4}.finish-colors i:nth-child(3){background:#ffca31}.finish-colors i:nth-child(4){background:#27b780}dialog button{padding:15px 27px;border:0;border-radius:15px;background:#168f80;color:white;font-weight:850;box-shadow:0 5px 0 #0b695f}@keyframes tumble{to{transform:rotate(360deg)}}@keyframes pop-away{to{opacity:0;transform:translate(var(--fly-x),var(--fly-y)) scale(.15) rotate(12deg)}}@keyframes basket-bounce{50%{transform:translateY(-12px) scale(1.06)}}@keyframes wiggle{25%,75%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes spark{to{transform:translate(var(--x),var(--y)) rotate(180deg);opacity:0}}
@media(min-width:1500px){.game-shell{max-height:880px}.sorting-spot{top:60px}.garment-art{width:285px;height:225px}}
@media(max-width:850px){.game-shell{padding:12px;grid-template-rows:76px minmax(0,1fr) 55px}.brand-icon{display:none}.progress-card{width:205px;padding:12px}.basket-row{gap:10px;left:2%;right:2%}.room-art{opacity:.85}.key-hint{display:none}.sorting-spot{width:280px}.basket-art,.basket svg{height:125px}.basket-heading{bottom:179px}.basket-row{bottom:12px}}
@media(max-width:700px){.game-shell{height:auto;min-height:100svh;grid-template-rows:auto 610px auto;gap:12px;padding:12px}.brand h1{font-size:25px;letter-spacing:-.8px}.eyebrow{font-size:8px;letter-spacing:1.2px}.progress-card{width:100%;padding:10px 14px}.progress-card>div:first-child{font-size:11px}.progress-track{margin-top:6px;height:7px}.laundry-room{border-radius:21px}.room-art{width:145%;left:-22.5%;opacity:.8}.sorting-spot{top:11px;height:270px}.sorting-halo{width:205px;height:205px;top:45px}.garment-art{width:217px;height:177px}.garment{width:238px;margin-top:27px}.garment strong{font-size:14px}.basket-row{grid-template-columns:repeat(2,1fr);gap:8px 12px;bottom:12px;left:5%;right:5%}.basket-art,.basket svg{height:105px}.basket-name{font-size:15px}.basket-heading{bottom:308px;left:6%;right:6%}.basket-heading span{font-size:8px;letter-spacing:.8px}.basket-heading span:last-child{font-size:9px}.instruction-bar{align-items:center;font-size:11px;gap:7px;padding:2px}.instruction-bar button{margin-left:0;padding:9px;font-size:10px;white-space:nowrap}.instruction-icon{display:none}.basket-count{font-size:9px}.item-number{top:2px}.room-art .tumbling-sock{animation:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.garment.is-sorted{opacity:0}}