:root{font-family:Prompt,sans-serif;color:#4b3035}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input{font:inherit}button{cursor:pointer}.game-shell{width:100vw;height:100vh;height:100dvh;min-height:530px;position:relative;overflow:hidden;background:#f9dede}.scene{position:absolute;inset:0;background:radial-gradient(circle at 53% 43%,#fffaf0 0,#ffecdc 35%,#f9dce4 75%,#f1d5e5 100%);overflow:hidden}.glow{position:absolute;width:70vw;height:70vw;border-radius:50%;background:#fff9e4aa;filter:blur(20px);left:50%;top:43%;transform:translate(-50%,-50%)}.ground{position:absolute;width:52%;height:14%;left:30%;bottom:10%;border-radius:50%;background:#ab788650;filter:blur(55px)}#webgl{position:absolute;inset:0;touch-action:none}#webgl canvas{display:block;width:100%;height:100%;touch-action:none}.spark{position:absolute;color:#fff;font-size:35px;pointer-events:none}.spark.a{left:29%;top:22%}.spark.b{right:16%;top:20%;font-size:56px}header{position:absolute;top:0;left:0;right:0;padding:20px 30px;display:flex;justify-content:space-between;align-items:center;z-index:5;pointer-events:none}header>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;font:900 28px Nunito,sans-serif;line-height:.9;letter-spacing:-1px}.brand b{background:#eb8794;color:white;width:39px;height:39px;border-radius:13px;display:grid;place-items:center;transform:rotate(-10deg);box-shadow:0 5px #d87985}.brand em{font-style:normal;color:#e88694}.brand small{display:block;font:900 8px Nunito,sans-serif;color:#b68180;letter-spacing:2px;margin-top:8px}.top-right{display:flex;gap:10px}.score,.round{height:44px;border:1px solid #fff9;border-radius:30px;background:#ffffffc9;box-shadow:0 7px 22px #9b607521;backdrop-filter:blur(8px)}.score{min-width:100px;display:flex;align-items:center;gap:9px;padding:0 18px;color:#e9aa46;font-size:23px}.score strong{color:#654446;font:900 17px Nunito}.round{width:44px;color:#aa6569;font-size:22px}.info{position:absolute;z-index:3;left:4vw;top:27%;pointer-events:none}.eyebrow{font:900 11px Nunito;letter-spacing:2.4px;color:#c47b83}.info h1{font-size:clamp(38px,4vw,62px);margin:10px 0 2px;line-height:1.1}.info>div:nth-of-type(1){color:#af8180;font-size:15px}.line{width:55px;height:3px;background:#e7a0a0;border-radius:3px;margin:24px 0}.count{color:#957576;font-size:13px}.count strong{font:900 34px Nunito;color:#e8918e;margin-right:7px}.info p{font-size:13px;color:#a68785;max-width:210px}.modes{position:absolute;z-index:5;top:20%;right:3vw;display:flex;flex-direction:column;gap:10px}.mode{min-width:135px;height:49px;border:1px solid #fff9;background:#fffbf7bf;border-radius:17px;color:#855e66;box-shadow:0 6px 20px #b88a941f;font-weight:600;text-align:left;padding:0 17px;backdrop-filter:blur(10px);font-size:20px}.mode span{font-size:14px;margin-left:7px}.mode.active{background:#e88d9a;color:#fff;border-color:#e88d9a;box-shadow:0 8px 22px #e88d9a55}.paint-panel{position:absolute;z-index:6;top:45%;right:3vw;width:240px;background:#fffdf4e8;border-radius:23px;box-shadow:0 12px 35px #9b657d30;padding:16px;backdrop-filter:blur(12px)}.paint-panel[hidden]{display:none}.paint-panel strong{font-size:14px;display:block}.paint-panel small{font-size:11px;color:#a38782}.swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:16px 0 10px}.swatch{width:29px;height:29px;border:3px solid white;border-radius:50%;box-shadow:0 0 0 1px #ddbfc0}.swatch.selected{box-shadow:0 0 0 2px #9b626f}.custom-color{position:absolute;right:17px;top:82px;width:29px;height:29px;border:2px dashed #d1aeb2;border-radius:50%;display:grid;place-items:center;color:#a57c82;cursor:pointer}.custom-color input{position:absolute;opacity:0;width:100%;height:100%}.brush-row{border-top:1px solid #eadad8;padding-top:10px;display:grid;grid-template-columns:1fr auto;gap:5px}.brush-row label{grid-column:1/-1;font-size:11px;color:#947879}.brush-row input{width:100%;accent-color:#e88694}.brush-row button{border:0;background:#f9e3e3;color:#a06570;padding:5px 8px;border-radius:9px;font-size:11px}.collection{position:absolute;z-index:5;bottom:34px;left:4vw;right:4vw;background:#fffdf4dc;border:1px solid #fff;backdrop-filter:blur(14px);border-radius:28px;padding:14px 19px 16px;box-shadow:0 16px 45px #ae77802e}.collection-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:9px}.collection-head h2{font-size:20px;margin:2px 0 0}.collection-head em{color:#ea8895;font-style:normal}.collection-head>span{font-size:11px;color:#9d7b7c}.grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.character-card{min-width:0;border:2px solid transparent;border-radius:16px;padding:6px;background:#fff;display:flex;align-items:center;gap:8px;text-align:left;color:#63484b;transition:transform .15s,border-color .15s}.character-card:hover{transform:translateY(-3px)}.character-card.active{border-color:#e9919c;background:#fff7f6}.char-art{width:46px;height:46px;flex:none;border-radius:12px;display:grid;place-items:center}.char-art svg{width:42px;height:42px}.char-text{min-width:0}.char-text strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.char-text small{font-size:10px;color:#a48685;white-space:nowrap}.char-text .cost{color:#d39640}.footer-note{position:absolute;bottom:9px;left:0;right:0;text-align:center;font-size:10px;color:#a17d80;pointer-events:none}#floatLayer{position:absolute;inset:0;pointer-events:none;z-index:4}.float{position:absolute;color:#e8ab48;font:900 25px Nunito;text-shadow:0 2px #fff;animation:rise .9s ease-out forwards}@keyframes rise{to{transform:translateY(-90px) scale(1.2);opacity:0}}#webglError{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:10;background:white;padding:20px;border-radius:16px}button:focus-visible,input:focus-visible{outline:3px solid #af6383;outline-offset:2px}@media(max-width:950px){.info{top:15%}.info h1{font-size:36px}.line,.count,.info p{display:none}.modes{top:15%}.collection{bottom:20px}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.character-card{padding:4px}.char-art{width:38px;height:38px}.char-art svg{width:36px;height:36px}.footer-note{display:none}}@media(max-width:600px){.game-shell{min-height:0}header{padding:14px}.brand{font-size:21px}.brand b{width:31px;height:31px}.brand small{font-size:6px;margin-top:5px}.score,.round{height:37px}.round{width:37px}.score{min-width:78px;padding:0 12px;font-size:18px}.info{top:12%;left:17px}.info h1{font-size:28px;margin:4px 0}.info>div:nth-of-type(1){font-size:11px}.eyebrow{font-size:8px}.modes{top:12%;right:12px;gap:6px}.mode{min-width:100px;height:36px;border-radius:12px;padding:0 10px;font-size:17px}.mode span{font-size:11px;margin-left:5px}.paint-panel{top:28%;right:12px;width:190px;padding:12px}.swatches{gap:5px}.swatch{width:22px;height:22px}.custom-color{top:74px;right:13px;width:22px;height:22px}.collection{left:10px;right:10px;bottom:10px;padding:9px;border-radius:20px}.collection-head{margin-bottom:5px}.collection-head .eyebrow{display:none}.collection-head h2{font-size:15px}.grid{gap:5px}.character-card{gap:3px;padding:3px;border-radius:10px}.char-art{width:30px;height:30px;border-radius:8px}.char-art svg{width:29px;height:29px}.char-text strong{font-size:10px}.char-text small{font-size:8px}.spark.a{left:10%}.spark.b{right:6%}}@media(max-height:670px){.collection{padding-top:7px;padding-bottom:7px}.paint-panel{top:39%}}
@media(max-width:600px){.paint-panel{top:auto;bottom:170px;left:10px;right:10px;width:auto;padding:9px 12px;border-radius:16px}.paint-panel strong{font-size:12px}.paint-panel small{font-size:9px}.swatches{grid-template-columns:repeat(10,1fr);margin:7px 30px 7px 0;gap:3px}.swatch{width:21px;height:21px;border-width:2px}.custom-color{top:38px;right:12px;width:22px;height:22px}.brush-row{padding-top:5px;display:flex;align-items:center;gap:7px}.brush-row label{font-size:9px;white-space:nowrap}.brush-row input{min-width:0;flex:1}.brush-row button{font-size:9px;white-space:nowrap;padding:4px 6px}}@media(max-width:600px) and (max-height:700px){.paint-panel{bottom:150px}}

html,body,.game-shell{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input{user-select:auto;-webkit-user-select:auto}@media(min-width:601px) and (max-width:950px){.info p{display:block;max-width:180px}}

header{padding-top:calc(20px + env(safe-area-inset-top))}.collection{bottom:calc(34px + env(safe-area-inset-bottom))}@media(max-width:950px){.collection{bottom:calc(20px + env(safe-area-inset-bottom))}}@media(max-width:600px){header{padding-top:calc(14px + env(safe-area-inset-top))}.collection{bottom:calc(10px + env(safe-area-inset-bottom))}.paint-panel{bottom:calc(170px + env(safe-area-inset-bottom))}}

.grid{grid-template-columns:repeat(7,minmax(0,1fr))}.char-art img{width:100%;height:100%;border-radius:10px;object-fit:cover}.photo-placeholder{font-size:24px}.photo-panel{position:absolute;z-index:6;top:48%;right:3vw;width:270px;background:#fffdf4ed;border-radius:23px;box-shadow:0 12px 35px #9b657d30;padding:17px;backdrop-filter:blur(12px)}.photo-panel[hidden]{display:none}.photo-panel strong{display:block;font-size:15px}.photo-panel small{display:block;font-size:11px;color:#a38782;line-height:1.5;margin:4px 0 13px}.photo-actions,.photo-styles{display:flex;gap:7px}.photo-actions button{flex:1;border:0;border-radius:12px;background:#e88d9a;color:#fff;font-size:12px;font-weight:700;padding:10px 4px}.photo-actions button+button{background:#f5e1e3;color:#9b6470}.photo-styles{margin-top:11px}.photo-style{flex:1;border:1px solid #ead0d5;border-radius:10px;background:#fff;color:#9b6b73;font-size:11px;padding:7px 4px}.photo-style.active{background:#fff0f1;border-color:#e88d9a;color:#bd6877}.photo-panel p{font-size:10px;color:#957576;line-height:1.4;margin:10px 0 0}@media(max-width:950px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.photo-panel{top:43%}}@media(max-width:600px){.grid{display:flex;overflow-x:auto;scrollbar-width:thin;padding-bottom:3px}.character-card{flex:0 0 116px}.photo-panel{top:auto;bottom:calc(128px + env(safe-area-inset-bottom));left:10px;right:10px;width:auto;padding:12px;border-radius:16px}.photo-panel strong{font-size:12px}.photo-panel small{font-size:10px;margin-bottom:8px}.photo-actions button{padding:8px 4px}.photo-styles{margin-top:7px}.photo-panel p{margin-top:7px}}@media(min-width:601px) and (max-height:700px){.photo-panel{top:39%;padding:11px}.photo-panel small{margin-bottom:7px}.photo-styles{margin-top:6px}.photo-panel p{margin-top:6px}}
.game-toast{position:absolute;z-index:12;top:calc(76px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);max-width:85vw;padding:10px 18px;border-radius:999px;background:#5d4650e8;color:#fff;font-size:12px;text-align:center;box-shadow:0 9px 28px #5d465055;pointer-events:none}.game-toast[hidden]{display:none}@media(max-width:600px){.top-right{gap:5px}.score{min-width:68px;padding:0 8px}.round{width:35px}.game-toast{top:calc(62px + env(safe-area-inset-top))}}

/* Keep every character reachable with a horizontal swipe on tablets and desktop. */
.grid{display:flex;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;touch-action:pan-x;overscroll-behavior-x:contain;padding-bottom:4px}.character-card{flex:0 0 150px}.grid::-webkit-scrollbar{height:5px}.grid::-webkit-scrollbar-thumb{background:#e8bdc3;border-radius:10px}@media(max-width:950px){.character-card{flex-basis:135px}}@media(max-width:600px){.character-card{flex-basis:116px}}
.ar-camera{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(1);z-index:0}.scene.ar-active{background:#202025}.scene.ar-active .ar-camera{display:block}.scene.ar-active .glow,.scene.ar-active .ground,.scene.ar-active .spark{display:none}.scene.ar-active #webgl{z-index:1}.scene.ar-active #floatLayer{z-index:2}.scene.ar-active~.info,.scene.ar-active~.footer-note{color:#fff}.ar-panel{position:absolute;z-index:6;left:4vw;bottom:190px;width:265px;background:#fffdf4e8;border:1px solid #fff;border-radius:19px;padding:12px 15px;box-shadow:0 8px 25px #513d4d33;backdrop-filter:blur(10px)}.ar-panel[hidden]{display:none}.ar-panel strong{display:block;font-size:13px}.ar-panel small,.ar-panel span{display:block;color:#8e7278;font-size:11px;line-height:1.45;margin-top:4px}.round.recording{background:#dc5f6a;color:#fff;animation:record-pulse 1.1s ease-in-out infinite}.record-status{position:absolute;z-index:9;top:calc(78px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);background:#c84b58e8;color:#fff;font:800 12px Nunito,sans-serif;padding:7px 13px;border-radius:999px;pointer-events:none}.record-status[hidden]{display:none}@keyframes record-pulse{50%{box-shadow:0 0 0 7px #e66e7766}}@media(max-width:600px){.top-right{gap:3px}.score{min-width:55px;padding:0 6px}.round{width:30px;height:34px;font-size:17px}.ar-panel{left:10px;right:10px;bottom:calc(130px + env(safe-area-inset-bottom));width:auto;padding:10px 12px}.record-status{top:calc(61px + env(safe-area-inset-top))}}
.record-preview{position:absolute;z-index:20;left:50%;top:50%;transform:translate(-50%,-50%);width:min(90vw,480px);max-height:85dvh;overflow:auto;border:1px solid #fff;border-radius:20px;background:#fff9f4;padding:15px;box-shadow:0 18px 60px #4c303766}.record-preview[hidden]{display:none}.record-preview strong{display:block;margin-bottom:10px}.record-preview video{display:block;width:100%;max-height:60dvh;border-radius:12px;background:#2b2327}.record-preview>div{display:flex;gap:10px;margin-top:12px}.record-preview a,.record-preview button{display:grid;place-items:center;border:0;border-radius:11px;padding:9px 12px;text-decoration:none;background:#e88d9a;color:#fff;font-size:13px;font-weight:700}.record-preview button{background:#f0dadd;color:#855e66}
.screenshot-preview img{display:block;width:100%;max-height:52dvh;object-fit:contain;border-radius:12px;background:#f5e0e4;-webkit-touch-callout:default;user-select:auto}.screenshot-preview p{font-size:12px;line-height:1.5;color:#775c65;margin:10px 0}.screenshot-preview>div{flex-wrap:wrap}.screenshot-preview #shareScreenshot{background:#e88d9a;color:#fff}.screenshot-preview #screenshotDownload{background:#f4e2e5;color:#855e66}
.ar-controls{display:grid;gap:3px;margin-top:7px}.ar-controls label{display:grid;grid-template-columns:55px 1fr;align-items:center;gap:6px;font-size:10px;color:#8e7278}.ar-controls input{width:100%;accent-color:#e88d9a}@media(max-width:600px){.ar-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.ar-controls label{display:block;font-size:9px}.ar-controls input{display:block;width:100%;height:16px}}
.ai-generate{display:block;width:100%;border:0;border-radius:11px;background:#e88d9a;color:white;font-size:11px;font-weight:700;padding:8px 7px;margin-top:9px}.ai-generate:disabled{opacity:.6;cursor:progress}#aiStatus{min-height:16px}@media(max-width:600px){.ar-panel{max-height:38dvh;overflow:auto}.ai-generate{font-size:10px;padding:7px 5px}}
.ai-panel{position:absolute;z-index:6;left:4vw;bottom:190px;width:265px;background:#fffdf4e8;border:1px solid #fff;border-radius:19px;padding:12px 15px;box-shadow:0 8px 25px #513d4d33;backdrop-filter:blur(10px)}.ai-panel[hidden]{display:none}.ai-panel strong{display:block;font-size:13px}.ai-panel small{display:block;color:#8e7278;font-size:11px;line-height:1.45;margin-top:4px}@media(max-width:600px){.ai-panel{left:10px;right:10px;bottom:calc(130px + env(safe-area-inset-bottom));width:auto;padding:10px 12px;max-height:38dvh;overflow:auto}}