:root{font-family:ui-rounded,"Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;color:#514332;background:#fffcf3;--yellow:#f4c44e;--brown:#514332;--green:#7fa58b;--orange:#e99553}*{box-sizing:border-box}body{margin:0}button,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation;border:0;font-weight:750;border-radius:18px;padding:13px 18px;background:#fff4d5;min-height:44px}button:hover{filter:brightness(.98)}button:active{transform:translateY(2px)}button:focus-visible,select:focus-visible{outline:4px solid #88611c;outline-offset:4px}[hidden]{display:none!important}header{max-width:1120px;margin:auto;padding:24px 30px;display:flex;justify-content:space-between;align-items:center}.brand{background:none;display:flex;align-items:center;gap:12px;padding:0;font-size:24px;text-align:left;letter-spacing:-.04em}.brand small{display:block;font-size:10px;letter-spacing:.13em;margin-top:5px;font-weight:600}.sun{font-size:54px;color:#d89b21;line-height:1}#sound{border:1px solid #e7d9b8;background:white;font-size:13px}main{max-width:1000px;margin:auto;padding:0 28px}.welcome{text-align:center;position:relative;padding:22px 0 30px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em;color:#947127}.welcome h1{font-size:44px;line-height:1.4;letter-spacing:.04em;margin:12px 0}.welcome p{color:#8a7c66;font-size:14px}.spark{position:absolute;color:#e8b549;font-size:55px}.one{left:10%;top:50px;transform:rotate(15deg)}.two{right:12%;bottom:30px;font-size:70px}.game-choices{display:grid;grid-template-columns:1fr 1fr;gap:24px}.game-choice{position:relative;overflow:hidden;border-radius:32px;border:2px solid #ecd496;background:#fff0bf;padding:26px 26px 24px;box-shadow:0 7px 0 #e6cd8f;text-align:center}.fitting{background:#f6e2bc;border-color:#e8cca0;box-shadow:0 7px 0 #dcc099}.choice-art{height:180px;display:flex;justify-content:center;align-items:center;gap:14px;position:relative}.preview-card{width:90px;line-height:0;transform:rotate(-10deg);filter:drop-shadow(0 5px 0 #51433218)}.preview-card:nth-child(2){transform:rotate(10deg)}.preview-card svg{width:100%;border-radius:8px;overflow:hidden}.preview-piece{width:95px;padding:8px;background:#fffcf3;border:3px dashed #c9a368;border-radius:22px;transform:rotate(8deg)}.preview-piece svg{width:100%;border-radius:16px}.preview-arrow{font-size:30px;color:#a67f38}.game-number{display:block;font-size:10px;letter-spacing:.14em;color:#8e6f38;margin-top:15px}.game-choice h2{font-size:25px;margin:8px 0}.game-choice p{font-size:13px;margin:0 0 22px;color:#7c6c53}.start-pill{display:flex;justify-content:space-between;align-items:center;border-radius:18px;background:var(--yellow);padding:13px 24px;font-size:17px;box-shadow:0 3px 0 #d8a636}.fitting .start-pill{background:#eeb16d;box-shadow:0 3px 0 #cf9050}.home-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:32px 4px 0;font-size:13px}.home-bottom button{background:transparent;border:1px solid #dfd4ba;font-size:12px}.home-note{text-align:center;font-size:12px;color:#9b8b70;margin:22px 0}footer{text-align:center;font-size:12px;color:#9b8b70;margin:26px 0}footer span{color:#d9a835;font-size:22px;vertical-align:middle}.game-toolbar{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px;gap:12px}.game-toolbar button{background:#f8efd8;font-size:13px}#game-name{font-size:13px;font-weight:700}.play{position:relative;background:#fff0bf;border:2px solid #ead59e;border-radius:30px;padding:22px 26px;min-height:460px}.play-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:20px}.play-head h1{font-size:22px;margin:0}#progress{font-size:15px;white-space:nowrap;border-radius:30px;padding:10px 14px;background:#fffcf3;font-weight:800;letter-spacing:3px;color:#a16b0f}.grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:14px;margin:auto;max-width:650px}.card{min-height:0;position:relative;padding:0;background:none;line-height:0;border-radius:12px;transition:transform .18s;min-width:0;justify-self:center;width:100%;max-width:115px}.card svg{display:block;width:100%;height:auto;border-radius:12px;pointer-events:none;overflow:hidden}.card.selected{outline:5px solid #c7792e;transform:translateY(-4px)}.card.matched{outline:4px solid #5d8769}.card.matched:after{content:'✓';position:absolute;right:3px;top:3px;width:25px;line-height:25px;border-radius:50%;color:white;background:#4f795c;font-size:17px}.card.wrong{animation:wiggle .25s 2}.target:not(.matched) svg{opacity:.35;filter:grayscale(.5)}.pieces{background:#fffcf3;border:2px dashed #d6b765;padding:14px;border-radius:22px}.piece{max-width:110px;border-radius:18px;overflow:hidden}.piece svg{aspect-ratio:1}.piece.used{visibility:hidden}.hint{text-align:center;margin:14px 0;font-size:12px;color:#8a6e3d}#status{text-align:center;min-height:20px;font-size:13px;font-weight:650;margin:20px 0 0}.parent-tip{text-align:center;margin:18px 0;color:#8d8069;font-size:12px;display:flex;align-items:center;justify-content:center;gap:12px}.parent-tip button{background:#f4eddb;font-size:13px}#finished{position:absolute;inset:0;background:#fffcf3f7;border-radius:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;z-index:2}#finished h2{font-size:32px;margin:10px 0}#finished>p:not(.eyebrow){font-size:13px;color:#8d8069}.celebrate{color:#e3ae2c;font-size:65px;letter-spacing:14px}#finished button{width:240px;margin-top:12px}.primary{background:#f4c44e;box-shadow:0 4px 0 #d5a439}dialog{max-width:440px;width:calc(100% - 32px);border:2px solid #e8d6a8;border-radius:28px;background:#fffcf3;color:#514332;padding:26px;max-height:85dvh}dialog::backdrop{background:#51433266;backdrop-filter:blur(3px)}dialog h2{margin:6px 0}dialog p{font-size:13px;line-height:1.8;color:#82745f}.close{float:right;padding:5px 13px}dialog label{display:grid;gap:8px;font-size:13px;font-weight:700;margin:20px 0}select{width:100%;background:white;border:1px solid #d9c9a7;border-radius:12px;padding:13px;font-size:15px}dialog .primary{width:100%;margin:5px 0 25px}details{font-size:12px}summary{cursor:pointer}body.playing header{padding-top:16px;padding-bottom:16px}body.playing .brand{font-size:20px}body.playing .sun{font-size:40px}@keyframes wiggle{25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}@media(max-width:600px){header{padding:18px 20px}.brand{font-size:20px}.sun{font-size:43px}main{padding:0 16px}.welcome{padding:14px 0 20px}.welcome h1{font-size:30px}.welcome p{font-size:12px}.spark{font-size:30px}.one{left:0;top:70px}.two{right:0;bottom:35px;font-size:36px}.game-choices{gap:15px}.game-choice{padding:14px 10px 15px;border-radius:23px}.choice-art{height:112px;gap:5px}.preview-card{width:53px}.preview-piece{width:50px;padding:3px;border-width:2px;border-radius:12px}.preview-arrow{font-size:16px}.game-choice h2{font-size:16px;line-height:1.6;min-height:50px;display:flex;align-items:center;justify-content:center}.game-choice p{font-size:10px;line-height:1.7;min-height:34px;margin-bottom:10px}.game-number{font-size:8px;margin-top:8px}.start-pill{padding:12px;font-size:14px;border-radius:13px}.home-bottom{margin-top:28px;font-size:11px}.home-bottom button{font-size:11px;padding:10px}.game-toolbar{gap:8px;margin-bottom:12px}#game-name{font-size:11px}.game-toolbar button{font-size:11px;padding:10px}.play{padding:16px 10px;border-radius:23px;min-height:380px}.play-head{flex-direction:column;gap:10px;margin-bottom:15px}.play-head h1{font-size:17px}#progress{font-size:13px;padding:7px 12px}.grid{gap:9px}.card{max-width:98px;border-radius:8px}.card svg{border-radius:8px}.pieces{padding:10px;gap:9px}.piece{max-width:88px}.parent-tip{font-size:10px;gap:8px;flex-wrap:wrap}.parent-tip button{font-size:12px}.card.selected{outline-width:3px}.card.matched{outline-width:3px}#status{font-size:11px;line-height:1.7;margin-top:15px}#finished h2{font-size:26px}.celebrate{font-size:50px}.hint{font-size:10px}.grid.pairs{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.targets,.grid.pieces{grid-template-columns:repeat(var(--cols),minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Cards spread across a tabletop; stable until the next round. */
.grid.pairs{display:block;position:relative;height:510px;max-width:760px;margin:0 auto;padding:0}
.pairs .card{position:absolute;left:var(--desk-x);top:var(--desk-y);width:14%;max-width:104px;transform:translate(-50%,-50%) rotate(var(--tilt));box-shadow:0 5px 9px #51433224}
.pairs .card.selected{transform:translate(-50%,-54%) rotate(var(--tilt));z-index:2}
.pairs .card:focus-visible{z-index:3}
.pairs .card.wrong{animation:scatter-wiggle .25s 2}
@keyframes scatter-wiggle{25%{transform:translate(-53%,-50%) rotate(var(--tilt))}75%{transform:translate(-47%,-50%) rotate(var(--tilt))}}
@media(max-width:600px){.grid.pairs{height:580px}.pairs .card{left:var(--phone-x);top:var(--phone-y);width:24%;max-width:86px}}
.ja{display:none!important}body.show-japanese .ja{display:block!important;font-size:11px;font-weight:400;line-height:1.55;letter-spacing:0;margin-top:5px;color:#7d705e}.en{display:block}.header-actions{display:flex;gap:8px;align-items:center}.header-actions button{font-size:12px;padding:10px 12px}.start-pill{display:block;text-align:left}.start-pill b{float:right}.game-choice h2{display:block!important}.game-choice h2 .ja{font-size:12px}.welcome h1 .ja{font-size:15px}.brand .ja{font-size:9px!important}.game-toolbar #game-name{text-align:center}.play-head h1 .ja{font-size:12px}#finished .ja{font-size:12px}.parent-tip span{max-width:300px}dialog label .ja{margin-top:0}footer .en{font-size:12px;color:#9b8b70}body.show-japanese #status .ja{font-size:10px}@media(max-width:600px){header{padding:14px 12px;gap:8px}.brand{font-size:17px;gap:6px}.brand .sun{font-size:30px}.brand small{font-size:8px}.header-actions{gap:5px}.header-actions button{font-size:10px;padding:8px;min-width:62px}.welcome h1{font-size:29px}.game-choice h2{font-size:19px;min-height:52px}.game-choice p{min-height:45px}.game-toolbar{flex-wrap:wrap}.play-head h1{font-size:18px}.home-bottom{align-items:flex-start}body.show-japanese .game-choice p{min-height:65px}body.show-japanese .game-choice h2{min-height:76px}.ja{overflow-wrap:anywhere}}

#finished:not([hidden]) h2{animation:clear-title-bounce 950ms cubic-bezier(.22,.61,.36,1) both;transform-origin:center;}
@keyframes clear-title-bounce{0%{opacity:0;transform:translateY(-100px) scale(.92)}45%{opacity:1;transform:translateY(12px) scale(1.04,.96)}65%{transform:translateY(-22px) scale(.99,1.02)}82%{transform:translateY(5px) scale(1.01,.99)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){#finished:not([hidden]) h2{animation:none;}}
#progress.collection{min-width:130px;max-width:190px;min-height:65px;white-space:normal;padding:8px 10px;letter-spacing:0;border:2px dashed #d5b765;border-radius:16px;flex-shrink:0}.collection-count{display:block;text-align:right;font-size:11px;color:#806833}.collection-cards{display:flex;gap:5px;min-height:33px;justify-content:flex-end;align-items:center;padding-top:4px}.collected-pair{width:24px;display:block;position:relative;transform:rotate(5deg);box-shadow:-3px 2px 0 #e9c55d;border-radius:3px}.collected-pair svg{width:100%;display:block}.collected-pair.arriving{opacity:0}.flying-card{position:fixed;z-index:30;pointer-events:none;transform-origin:center;filter:drop-shadow(0 3px 3px #51433230)}.flying-card svg{width:100%;height:100%;display:block}.pairs .card.collected{visibility:hidden}.card-back{position:absolute;inset:0;border:4px solid #fff9e9;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:40px;color:#fff9e9;background:repeating-linear-gradient(45deg,#edb540 0px,#edb540 12px,#e9ab33 12px,#e9ab33 24px);backface-visibility:hidden;transform:rotateY(180deg);transition:transform .55s}.pair>svg{backface-visibility:hidden;transform:rotateY(0deg);transition:transform .55s}.face-down .pair>svg{transform:rotateY(180deg)}.face-down .card-back{transform:rotateY(0deg)}.face-down .pair{cursor:default}.play-head{align-items:center}@media(max-width:600px){.play-head{flex-direction:row;align-items:center}.play-head h1{font-size:16px;flex:1}#progress.collection{min-width:135px;max-width:145px}.card-back{font-size:30px;border-width:3px}}@media(prefers-reduced-motion:reduce){.card-back,.pair>svg{transition:none}}

/* Hi Leo! — approved mascot artwork, framed without altering the original. */
[data-leo] svg{display:block;width:100%;height:100%}[data-leo]{pointer-events:none;flex-shrink:0}
.brand-leo{display:block;width:46px;height:57px}.home-leo{width:150px;height:185px;margin:0 auto 10px}.welcome{padding-top:8px}.welcome h1{margin-top:8px}.welcome .spark.one{top:130px}.welcome .spark.two{bottom:50px}
.leo-companion{display:flex;align-items:center;justify-content:center;gap:16px;min-height:115px;margin-top:12px}#game-leo{width:85px;height:106px}.leo-companion #status{margin:0;max-width:370px;text-align:left}.clear-leo{width:210px;height:230px;margin-bottom:8px}#finished:not([hidden]) .clear-leo{animation:leo-cheer .7s ease-out both}
@keyframes leo-cheer{0%{transform:scale(.8);opacity:0}65%{transform:scale(1.07);opacity:1}100%{transform:scale(1);opacity:1}}
@media(max-width:600px){.brand-leo{width:33px;height:42px}.home-leo{width:115px;height:145px}.welcome h1{font-size:27px}.brand{font-size:19px}.brand small{font-size:7px;letter-spacing:.04em}.leo-companion{gap:10px;min-height:95px}#game-leo{width:68px;height:85px}.leo-companion #status{max-width:210px}.clear-leo{width:170px;height:195px}}
@media(prefers-reduced-motion:reduce){#finished:not([hidden]) .clear-leo{animation:none}}

/* Keep the same image crop and rounded edge throughout collection. */
.flying-card{overflow:hidden}.flying-card svg{overflow:hidden;border-radius:inherit}.collected-pair{overflow:hidden}.collected-pair svg{overflow:hidden;border-radius:inherit}

#leo-cursor{display:none;position:fixed;left:0;top:0;width:44px;height:44px;transform:translate(-22px,-9px);pointer-events:none;z-index:2147483647}
.leo-cursor-active #leo-cursor{display:block}.leo-cursor-active,.leo-cursor-active *{cursor:none!important}
#leo-cursor svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 1px 1px #51433225)}
#leo-cursor g{fill:#FFF0CB;stroke:#514332;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform-origin:24px 27px;transition:transform .12s ease,opacity .1s ease}
#leo-cursor .paw-closed{opacity:0;transform:scale(1.1)}#leo-cursor .knuckle{fill:none;stroke:#BB914A;stroke-width:1.5}
#leo-cursor.gripping .paw-open{opacity:0;transform:scale(.75,.82)}#leo-cursor.gripping .paw-closed{opacity:1;transform:scale(.9,.88)}
@media(prefers-reduced-motion:reduce){#leo-cursor g{transition:none}}

/* Matching pictures uses the same card reveal and collection language. */
.card.collected{visibility:hidden}.target>svg,.piece>svg{backface-visibility:hidden;transform:rotateY(0deg);transition:transform .55s;overflow:hidden}
.face-down .target>svg,.face-down .piece>svg{transform:rotateY(180deg)}
.pieces{gap:22px;padding:24px 18px;margin-top:12px}.pieces .piece{transform:rotate(var(--tilt,0deg));box-shadow:0 5px 9px #51433224;border:3px solid #fff9e9;background:#fff9e9}.pieces .piece.selected{transform:translateY(-4px) rotate(var(--tilt,0deg))}
.targets{padding:16px 8px;gap:22px}.target{box-shadow:0 5px 9px #51433224}.target:not(.matched) svg{opacity:.45;filter:none}
@media(max-width:600px){.grid.targets,.grid.pieces{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.pieces{padding:18px 10px}.target,.piece{width:100%;max-width:85px}.targets .card:nth-child(4):last-child,.pieces .card:nth-child(4):last-child{grid-column:2}}
@media(prefers-reduced-motion:reduce){.target>svg,.piece>svg{transition:none}}

/* Illustration-only transparent pieces. */
.pieces .piece,.preview-piece{background:transparent;border:0;box-shadow:none;overflow:visible;border-radius:0;padding:3px}
.pieces .piece svg,.preview-piece svg{border-radius:0;overflow:hidden;filter:drop-shadow(0 2px 1px #51433220);aspect-ratio:1;object-fit:contain}
.pieces .piece.selected{outline:3px dashed #c7792e;outline-offset:5px;border-radius:12px}

.legal-footer{text-align:center;padding:24px 16px 32px;font-size:13px;color:#73634f}.legal-footer a{color:inherit}.legal-footer span{font-size:11px}

.home-brand-logo{display:block;width:min(100%,650px);height:auto;margin:8px auto 20px}.welcome .spark{display:none}@media(max-width:600px){.home-brand-logo{width:100%;margin:12px auto 18px}.welcome{padding-top:6px}}