@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#213b35;background:#fff7e9;font-synthesis:none;--muted:#737c74;--green:#2f6551;--line:#e6d9bf}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #d09432;outline-offset:5px}button:disabled{cursor:default}.page{max-width:1120px;margin:auto;padding:0 40px}.topbar{height:98px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.wordmark{font-size:11px;font-weight:750;letter-spacing:1.7px;text-decoration:none;display:flex;align-items:center;gap:11px}.mark{font-size:23px;background:#2f5146;color:white;width:31px;height:31px;border-radius:8px;text-align:center;line-height:29px;letter-spacing:0}.text-button{border:0;background:none;color:#627169;font-size:12px;padding:8px 0}.text-button:hover{color:#183f31;text-decoration:underline}main{padding:34px 0 15px;min-height:calc(100svh - 180px)}.round-meta{display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:12px;color:var(--muted)}.round-label{text-transform:uppercase;letter-spacing:1.7px;font-size:10px;font-weight:650}.progress{display:flex;align-items:center;gap:7px}.dot{width:7px;height:7px;border-radius:50%;background:#d9ded4}.dot.current{box-shadow:0 0 0 3px #d9ded4;background:#586b5e}.dot.correct{background:#4b8266}.dot.wrong{background:#c08b6b}.score{margin-left:12px;color:#526b5b;font-variant-numeric:tabular-nums}h1{font-size:clamp(36px,5.7vw,64px);font-weight:650;letter-spacing:-2.7px;line-height:1.09;margin:25px 0 10px}h1 em{font-family:Georgia,serif;font-weight:400;color:#4b755f}.intro{color:#778073;margin:0 0 28px;font-size:14px;line-height:1.5}.matchup{margin-top:30px;display:grid;grid-template-columns:1fr 1fr;gap:28px;position:relative}.versus{position:absolute;z-index:2;left:50%;top:48%;transform:translate(-50%,-50%);border:1px solid #e0e1d8;background:#fff7e9;color:#8c9389;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-family:Georgia,serif;font-style:italic;font-size:14px}.card{--accent:#a16b50;--wash:#f5eee7;display:block;width:100%;padding:23px 27px 21px;text-align:left;border:1px solid #dfded4;border-radius:16px;background:#fffdf6;color:#233f36;position:relative;transition:transform .18s,border-color .18s,box-shadow .18s;overflow:hidden}.card:nth-of-type(2){--accent:#557985;--wash:#eaf0ef}.card:not(.revealed):hover{transform:translateY(-4px);border-color:#7d9785;box-shadow:0 10px 24px #213c3510}.card:not(.revealed):active{transform:translateY(-1px)}.scene{height:175px;position:relative;margin:8px 0 4px;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 54%,var(--wash),transparent 68%)}.scene svg{width:235px;height:170px;overflow:visible}.product-object{transform-origin:50% 55%;animation:arrive .5s cubic-bezier(.2,.8,.3,1) both}.card:nth-of-type(2) .product-object{animation-delay:.06s}.brand{display:block;font-size:28px;font-weight:650;letter-spacing:-.9px}.product{display:block;font-size:13px;margin-top:5px;color:#5c6f61;min-height:18px}.time-row{display:flex;justify-content:space-between;align-items:end;border-top:1px solid #e2e3da;padding-top:17px;margin-top:21px;gap:10px}.time{display:flex;flex-direction:column;gap:5px}.time small{text-transform:uppercase;font-size:9px;letter-spacing:1.6px;color:#889084;font-weight:500}.time strong{font-size:23px;font-weight:600;letter-spacing:-.6px}.choose{color:var(--accent);font-size:11px;font-weight:650;display:flex;align-items:center;gap:9px;padding-bottom:4px}.choose b{background:var(--wash);border:1px solid #dfdfd2;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:400}.result-count{font-size:25px;font-weight:650;letter-spacing:-.8px;font-variant-numeric:tabular-nums;display:block;text-align:right}.result-unit{font-size:10px;color:#768372;display:block;text-align:right;margin-top:3px}.card.winner{border-color:#568970;box-shadow:0 0 0 1px #568970;background:#fafcf7}.card.loser{background:#f6f5ef}.card.loser .scene{opacity:.65}.reveal-track{height:4px;background:#e5e8dd;border-radius:9px;overflow:hidden;margin:18px 0 0}.reveal-fill{height:100%;width:0;background:#a7b4a3;border-radius:9px;transition:width 1.2s cubic-bezier(.2,.7,.2,1)}.winner .reveal-fill{background:#53866a}.card-status{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:10px;color:#7a8576}.winner .card-status{color:#397556}.after-round{min-height:96px;padding:21px 0 10px;display:flex;justify-content:space-between;align-items:center;gap:20px}.before-hint{font-size:11px;color:#9a9f92;text-align:center;width:100%;margin:2px 0}.result-message{font-size:19px;letter-spacing:-.4px;font-weight:600;margin:0}.result-explanation{font-size:12px;color:#7b8576;margin:6px 0 0;line-height:1.5}.primary-button{border:0;background:#2f5146;color:#fff;padding:14px 25px;border-radius:8px;font-size:12px;white-space:nowrap}.primary-button:hover{background:#203c32}.keyboard-hint{display:block;font-size:9px;font-weight:400;color:#b7c5b9;margin-top:4px}footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:22px 0 24px;font-size:10px;color:#90988a;gap:20px}footer a{text-decoration:none;color:#60765f}.loading{padding:100px 0;text-align:center;color:#7b877b}dialog{border:1px solid #d9dfd1;border-radius:18px;background:#fafbf6;color:#254334;width:min(640px,calc(100% - 28px));max-height:85svh;padding:0;box-shadow:0 25px 100px #17342633}dialog::backdrop{background:#24382d55;backdrop-filter:blur(4px)}.dialog-inner{padding:36px}.close-button{position:absolute;top:14px;right:17px;background:none;border:0;font-size:25px;color:#7d8b77;width:30px;height:30px}dialog h2{font-size:30px;letter-spacing:-1px;margin:5px 0 5px;padding-right:15px}dialog h3{font-size:13px;margin:25px 0 10px}dialog p{font-size:13px;line-height:1.75;color:#70806b}.detail-kicker{text-transform:uppercase;font-size:10px;color:#85917c;letter-spacing:1.3px}.source-quantity{font-size:31px;color:#365b40;letter-spacing:-1px;margin-top:25px}.source-period{font-size:12px;color:#83927b}.detail-grid{display:grid;grid-template-columns:100px 1fr;font-size:12px;gap:12px;line-height:1.6;margin-top:23px}.detail-grid dt{color:#8c9584}.detail-grid dd{margin:0}.source-link{display:block;font-size:12px;line-height:1.6;margin-top:23px;color:#39775c;overflow-wrap:anywhere}details{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}summary{font-size:12px;color:#536b4c;cursor:pointer}.catalog-list{display:grid;gap:5px;margin-top:14px}.catalog-item{display:flex;text-align:left;justify-content:space-between;gap:12px;border:0;background:#eef1e7;border-radius:6px;padding:10px 12px;color:#3e5a37;font-size:11px}.catalog-item span:last-child{color:#87927d;white-space:nowrap}.finish{text-align:center;padding:23px 0}.finish .round-label{margin-top:10px}.finish h1{margin-top:18px}.final-score{font-size:112px;font-weight:650;letter-spacing:-8px;line-height:1.1;margin:24px 0;color:#335943}.final-score span{font-size:36px;color:#a4b19a;letter-spacing:-1px}.finish .primary-button{padding:16px 37px;margin:18px 0 12px}.recap{max-width:650px;margin:25px auto 16px;text-align:left}.recap-row{display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;border-bottom:1px solid #dfe4d6;padding:12px 0;font-size:11px}.recap-row .verdict{font-size:15px;color:#60906b}.recap-row .verdict.miss{color:#b87d5b}.recap-names{color:#4d6645}.recap-note{display:block;font-size:10px;color:#909b85;margin-top:5px}.recap-row button{background:none;border:0;font-size:10px;color:#6e8562;padding:8px}.error{text-align:center;padding:80px 0}.error p{color:#718269;line-height:1.7;font-size:14px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.time small{color:#6d7867}.result-explanation,.result-unit,.card-status{color:#677560}
@media(min-width:681px) and (max-height:850px){.topbar{height:74px}main{padding-top:20px}h1{font-size:52px;margin-top:16px;margin-bottom:8px}.intro{margin-bottom:20px}.card{padding:18px 24px}.scene{height:119px;margin:4px 0}.scene svg{width:199px;height:140px}.brand{font-size:25px}.time-row{margin-top:15px;padding-top:14px}.after-round{min-height:78px;padding:17px 0 7px}.reveal-track{margin-top:13px}.card-status{margin-top:9px}footer{padding:17px 0}}
.photo-scene{display:flex;align-items:center;justify-content:center;height:190px;margin:0 0 18px;background:#f4ebda;border-radius:9px;overflow:hidden}
.product-photo{display:block;width:100%;height:100%;object-fit:contain;object-position:center;animation:arrive .35s ease-out both}
.product-photo.contain{object-fit:contain;background:#f7f7f3}.product-photo[hidden]{display:none}
.photo-fallback{font-size:12px;color:#73806c}.photo-credit{border-top:1px solid var(--line);margin-top:23px;padding-top:17px;font-size:10px;line-height:1.8;color:#6b7a64}.photo-credit span{display:block;margin-top:7px}.photo-credit a{color:#446949}
.credits-dialog{width:min(1050px,calc(100% - 28px))}.photo-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px 17px;margin-top:25px}.photo-gallery figure{margin:0;min-width:0}.photo-gallery img{display:block;width:100%;height:125px;object-fit:contain;background:#f4ebda;border-radius:6px}.photo-gallery figcaption{font-size:9px;line-height:1.65;margin-top:9px;color:#6d7b65;overflow-wrap:anywhere}.photo-gallery strong,.photo-gallery figcaption span{display:block}.photo-gallery strong{font-size:11px;color:#35543b}.photo-gallery a{color:#497355}footer .text-button{font-size:10px;padding:0}
@media(min-width:681px) and (max-height:850px){.photo-scene{height:146px;margin:0 0 14px}}
@media(max-width:680px){.photo-scene{height:126px;margin:0 -3px 0;border-radius:5px}.product-photo{object-fit:contain;object-position:center}.photo-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 13px}.photo-gallery img{height:115px}footer{gap:10px}footer .text-button{font-size:9px}}
@keyframes arrive{from{transform:translateX(-18px);opacity:0}to{transform:translateX(0);opacity:1}}
@media(min-width:1400px){.page{max-width:1200px}.topbar{height:110px}main{padding-top:43px}.scene{height:210px}.scene svg{width:270px;height:195px}.card{padding:25px 32px}.intro{margin-bottom:35px}}
@media(max-width:680px){.page{padding:0 17px}.topbar{height:73px}.wordmark{font-size:9px;letter-spacing:1px;gap:8px}.mark{width:27px;height:27px;line-height:25px;font-size:21px}.text-button{font-size:10px}main{padding-top:25px;min-height:calc(100svh - 140px)}h1{letter-spacing:-1.6px;font-size:39px;margin:25px 0 10px}.intro{font-size:12px;max-width:260px;margin-bottom:24px}.round-label{font-size:9px;letter-spacing:1.1px}.score{font-size:10px;margin-left:5px}.dot{width:5px;height:5px}.progress{gap:5px}.matchup{gap:12px}.card{padding:14px 12px 15px;border-radius:12px;min-width:0}.scene{height:122px;margin:6px -9px 2px}.scene svg{width:100%;max-width:180px;height:122px}.brand{font-size:21px;letter-spacing:-.65px;min-height:50px;display:flex;align-items:end}.product{font-size:11px;line-height:1.45;min-height:32px}.time-row{margin-top:14px;padding-top:14px;display:block}.time strong{font-size:21px}.time small{font-size:8px}.choose{justify-content:space-between;margin-top:18px;font-size:10px;padding:0}.choose b{width:24px;height:24px}.versus{width:25px;height:25px;font-size:11px;top:45%}.result-count{text-align:left;font-size:24px;margin-top:12px}.result-unit{text-align:left}.reveal-track{margin-top:14px}.card-status{font-size:8px;gap:4px}.after-round{gap:12px;min-height:104px}.result-message{font-size:18px}.result-explanation{font-size:11px;max-width:215px}.primary-button{padding:13px 17px;font-size:11px}.keyboard-hint{display:none}.before-hint{font-size:10px}footer{font-size:9px;padding:18px 0}.dialog-inner{padding:29px 23px}dialog h2{font-size:25px}.detail-grid{grid-template-columns:78px 1fr;font-size:11px}.source-quantity{font-size:27px}.final-score{font-size:93px}.recap-row{gap:7px;grid-template-columns:21px 1fr auto}.recap-row button{font-size:9px}.finish h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.maker{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:36px;font-size:13px;text-decoration:none;color:#738068}
.maker img{width:24px;height:24px;object-fit:contain;margin-left:2px}
.maker-name{font-size:15px;font-weight:600;color:#263129}

.playground-nav{padding-top:20px;font-size:12px}.playground-nav a{color:#607058;text-decoration:none}.playground-nav a:hover{text-decoration:underline;text-underline-offset:3px}
.header-actions{display:flex;gap:18px;align-items:center;flex-shrink:0}@media(max-width:680px){.header-actions{flex-direction:column;align-items:flex-end;gap:0}.header-actions .text-button{padding:5px 0}.topbar{gap:12px}}

:root{font-family:'DM Sans',sans-serif}.wordmark,h1,.brand,.result-message,.final-score,dialog h2{font-family:'Fredoka','Trebuchet MS',sans-serif}h1{font-weight:500;letter-spacing:-.035em}h1 em{font-family:inherit;font-style:normal;color:#a95226}.mark{background:#b95c2c;transform:rotate(-5deg);border-radius:9px}.card{border-radius:22px;border-color:#e3d4b9;box-shadow:0 4px 0 #eadfc9}.primary-button{background:#b65325;border-radius:99px;font-weight:700}.primary-button:hover{background:#91401d}.card.winner{background:#f3f8e9}.reveal-fill{background-image:repeating-linear-gradient(110deg,transparent 0 12px,#ffffff55 12px 18px);background-size:24px 100%;animation:conveyor-flow .8s linear 2}.winner .reveal-fill{background-color:#53866a;background-image:repeating-linear-gradient(110deg,transparent 0 12px,#ffffff55 12px 18px)}@keyframes conveyor-flow{to{background-position:24px 0}}@media(prefers-reduced-motion:reduce){.reveal-fill{animation:none}}

@media(min-width:681px){
.playground-nav{padding-top:10px}.topbar{height:58px}main{padding:16px 0 8px;min-height:calc(100svh - 170px)}h1{font-size:46px;margin:12px 0 8px}.matchup{margin-top:18px;gap:24px}.card{padding:17px 23px}.photo-scene{height:clamp(110px,calc(100svh - 540px),190px);margin-bottom:12px}.brand{font-size:24px}.product{font-size:12px;margin-top:3px}.time-row{margin-top:12px;padding-top:12px}.time strong{font-size:21px}.after-round{min-height:76px;padding:14px 0 6px}.reveal-track{margin-top:10px}.card-status{margin-top:8px}footer{padding:10px 0}
}

.playground-nav a{display:inline-block;padding:5px 12px;border:2px solid #70538f;border-radius:12px 15px 11px 14px;background:#eee4fc;box-shadow:2px 3px 0 #d5c4f0;font-family:Fredoka,'Trebuchet MS',sans-serif;font-size:18px;font-weight:500;line-height:1.2;letter-spacing:-.02em;color:#493666;transform:rotate(-3deg);text-decoration:none}.playground-nav a:hover{background:#e6d8f8;text-decoration:none}

.daily-label{margin-right:auto;font-size:11px}.streak-summary{font-size:18px;margin:8px 0 12px}.streak-summary span{color:var(--muted)}.finish .intro{max-width:none;margin:0 auto 10px}#save-notice:empty{display:none}#save-notice{font-size:12px;color:var(--muted)}
@media(min-width:681px){.finish{padding:5px 0}.finish h1{margin-top:12px}.final-score{font-size:80px;margin:10px 0}.finish .primary-button{margin:8px 0}.recap{margin-top:12px}.recap-row{padding:9px 0}}

.playground-nav{display:flex;align-items:center;justify-content:space-between}
@media(min-width:681px){.finish .final-score{font-size:70px;margin:8px 0}.finish .recap-row{padding:6px 0}}

.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:24px}.archive-day{border:1px solid var(--line);border-radius:12px;padding:16px 10px;background:#fff7e9;color:inherit;text-align:left}.archive-day strong,.archive-day span{display:block}.archive-day strong{font-size:12px}.archive-day span{font-size:11px;color:var(--muted);margin-top:8px}.archive-day:hover{border-color:#b65325}.archive-pages{display:flex;align-items:center;justify-content:space-between;margin-top:18px;font-size:12px}.replay-day{margin-left:18px}@media(max-width:680px){.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header-actions .text-button{padding:3px 0}}