:root{--font-family:"M PLUS Rounded 1c", sans-serif;--color-primary:#ff5c8a;--color-primary-dark:#d63d6b;--color-secondary:#4ecdc4;--color-secondary-dark:#2ba79e;--color-accent:#ffeaa7;--color-accent-dark:#e5b835;--color-success:#55efc4;--color-success-dark:#00b894;--color-danger:#ff7675;--color-danger-dark:#d63031;--color-dark:#4a3b52;--color-light:#fff;--color-gray:#b2bec3;--color-bg-light:#f8f9fa;--clay-shadow:0 10px 25px #4a3b5214;--clay-shadow-hover:0 16px 35px #4a3b521f;--border-radius-lg:32px;--border-radius-md:24px;--border-radius-sm:16px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{font-family:var(--font-family);color:var(--color-dark);background:linear-gradient(135deg,#ffeef2 0%,#f0eaff 50%,#e3f6fc 100%) 0 0/300% 300%;min-height:100vh;animation:14s infinite colorShift;position:relative;overflow:hidden}@keyframes colorShift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.bubble-bg{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.bubble{background:#ffffff8c;border-radius:50%;animation:14s ease-in-out infinite float-bubble;position:absolute;bottom:-150px;box-shadow:inset -5px -5px 15px #4a3b5205,inset 5px 5px 15px #ffffffe6}.bubble:first-child{width:90px;height:90px;animation-duration:12s;animation-delay:0s;left:8%}.bubble:nth-child(2){width:45px;height:45px;animation-duration:9s;animation-delay:3s;left:28%}.bubble:nth-child(3){width:110px;height:110px;animation-duration:16s;animation-delay:1.5s;left:45%}.bubble:nth-child(4){width:55px;height:55px;animation-duration:11s;animation-delay:5s;left:60%}.bubble:nth-child(5){width:80px;height:80px;animation-duration:14s;animation-delay:.8s;left:75%}.bubble:nth-child(6){width:50px;height:50px;animation-duration:10s;animation-delay:4s;left:90%}.bubble:nth-child(7){width:75px;height:75px;animation-duration:13s;animation-delay:7s;left:35%}.bubble:nth-child(8){width:100px;height:100px;animation-duration:18s;animation-delay:2s;left:15%}@keyframes float-bubble{0%{opacity:0;transform:translateY(0)scale(1)}15%{opacity:.8}85%{opacity:.8}to{opacity:0;transform:translateY(-110vh)scale(.95)}}.deco-item{z-index:2;pointer-events:none;opacity:.25;font-size:3.2rem;animation:5s ease-in-out infinite alternate float-deco;position:absolute}@keyframes float-deco{0%{transform:translateY(0)rotate(-5deg)}to{transform:translateY(-15px)rotate(10deg)}}.deco-cloud-1{top:10%;left:6%}.deco-cloud-2{top:20%;right:8%}.deco-star-1{bottom:22%;left:8%}.deco-star-2{bottom:12%;right:10%}.deco-paint{top:48%;left:3%}.deco-canvas-crayon{top:12%;right:4%}.deco-canvas-star{bottom:24%;left:4%}.deco-prev-toy{top:14%;left:4%}.deco-prev-star{bottom:25%;right:4%}.deco-gal-box{top:12%;left:4%}.deco-gal-star{bottom:12%;right:4%}.sound-toggle-btn{z-index:100;background:var(--color-light);width:50px;height:50px;box-shadow:0 4px 0 #d2c8d9, var(--clay-shadow);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;transition:transform .1s;display:flex;position:absolute;top:1rem;right:1rem}.sound-toggle-btn:active{box-shadow:0 0px 0 #d2c8d9, var(--clay-shadow);transform:translateY(4px)}.app-screen{opacity:0;z-index:10;flex-direction:column;width:100%;height:100dvh;padding:1.2rem;transition:opacity .3s ease-in-out;display:none;position:absolute;top:0;left:0;overflow-y:auto}.app-screen.active{opacity:1;z-index:20;display:flex}.btn-giant{font-family:var(--font-family);border-radius:var(--border-radius-md);cursor:pointer;box-sizing:border-box;border:none;justify-content:center;align-items:center;gap:.6rem;width:100%;max-width:320px;padding:1rem 2rem;font-size:1.3rem;font-weight:900;text-decoration:none;transition:transform .1s,box-shadow .1s;display:inline-flex}.btn-giant:active{transform:translateY(6px)}.btn-primary{background:var(--color-primary);color:var(--color-light);box-shadow:0 6px 0 var(--color-primary-dark), 0 8px 20px #ff5c8a40}.btn-primary:active{box-shadow:0 0px 0 var(--color-primary-dark), 0 2px 5px #ff5c8a1a}.btn-secondary{background:var(--color-secondary);color:var(--color-light);box-shadow:0 6px 0 var(--color-secondary-dark), 0 8px 20px #4ecdc440}.btn-secondary:active{box-shadow:0 0px 0 var(--color-secondary-dark), 0 2px 5px #4ecdc41a}.btn-sparkle{color:#5d4600;box-shadow:0 6px 0 var(--color-accent-dark), 0 8px 20px #e5b83540;background:#ffe066}.btn-sparkle:active{box-shadow:0 0px 0 var(--color-accent-dark), 0 2px 5px #e5b8351a}.btn-back{font-family:var(--font-family);border-radius:var(--border-radius-sm);background:var(--color-light);color:var(--color-dark);box-shadow:0 4px 0 #d2c8d9, var(--clay-shadow);cursor:pointer;border:none;align-items:center;gap:.3rem;padding:.5rem 1.1rem;font-size:.95rem;font-weight:900;transition:transform .1s,box-shadow .1s;display:flex}.btn-back:active{box-shadow:0 0px 0 #d2c8d9, var(--clay-shadow);transform:translateY(4px)}.screen-title-badge{color:var(--color-dark);border-radius:var(--border-radius-sm);box-shadow:var(--clay-shadow);white-space:nowrap;background:#fff;padding:.4rem 1.2rem;font-size:1.15rem;font-weight:900;display:inline-block}.screen-header{z-index:5;justify-content:space-between;align-items:center;width:100%;max-width:512px;margin-bottom:1.2rem;margin-left:auto;margin-right:auto;display:flex}.action-footer{z-index:5;justify-content:center;width:100%;margin-top:auto;padding:.8rem 0;display:flex}#screen-home{justify-content:center;align-items:center}.logo-container{text-align:center;z-index:5;margin-bottom:3.5rem}.sparkle-effect{margin-bottom:-.5rem;font-size:3.8rem;animation:2s ease-in-out infinite alternate float-deco}.main-title{color:var(--color-dark);text-shadow:0 4px 10px #4a3b520d;font-size:2.8rem;font-weight:900;line-height:1.3}.title-summon{color:var(--color-primary);font-size:3.6rem;display:inline-block}.subtitle{color:#7f8c8d;margin-top:.6rem;font-size:.95rem;font-weight:900;display:inline-block}.home-buttons{z-index:5;flex-direction:column;align-items:center;gap:1.2rem;width:100%;display:flex}#screen-canvas{background:linear-gradient(135deg,#ffeef5 0%,#fffbe6 100%)}.canvas-outer-frame{background:var(--color-light);border-radius:var(--border-radius-lg);aspect-ratio:1;flex-direction:column;flex:1;width:100%;max-width:480px;margin:0 auto;padding:10px;display:flex;position:relative;box-shadow:0 16px 40px #4a3b5214}.canvas-container{border-radius:var(--border-radius-md);background:#fff;border:1px solid #f1f2f6;flex:1;width:100%;position:relative;overflow:hidden}#paint-canvas{touch-action:none;cursor:crosshair;background:0 0;width:100%;height:100%}.canvas-frame-badge{background:var(--color-secondary);color:var(--color-light);box-shadow:var(--clay-shadow);border-radius:12px;padding:.2rem 1.2rem;font-size:.8rem;font-weight:900;position:absolute;bottom:-15px;left:50%;transform:translate(-50%)}.canvas-toolbar{background:var(--panel-bg);border-radius:var(--border-radius-md);width:100%;max-width:480px;box-shadow:var(--clay-shadow);z-index:5;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem;margin:1.2rem auto .6rem;padding:.8rem;display:flex}.tool-group{flex:180px;gap:.5rem;display:flex}.tool-btn{font-family:var(--font-family);border-radius:var(--border-radius-sm);color:var(--color-dark);cursor:pointer;background:#f1f2f6;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;padding:.5rem;font-size:.85rem;font-weight:900;transition:transform .1s,box-shadow .1s,background-color .2s;display:flex;box-shadow:0 4px #dfe4ea}.tool-btn:active{transform:translateY(4px);box-shadow:0 0 #dfe4ea}.tool-btn.active{background:var(--color-accent);box-shadow:0 4px 0 var(--color-accent-dark)}.btn-util{background:#f1f2f6;box-shadow:0 4px #dfe4ea}.btn-danger{color:var(--color-danger);background:#ffe8e8;box-shadow:0 4px #fcc}.btn-danger:active{box-shadow:0 0 #fcc}.brush-size-group{flex-direction:row;flex:100px;justify-content:center;align-items:center;gap:.5rem;font-size:.85rem;font-weight:900;display:flex}.brush-size-label{white-space:nowrap}#brush-size{-webkit-appearance:none;background:#e4e7eb;border-radius:6px;outline:none;width:75px;height:12px}#brush-size::-webkit-slider-thumb{appearance:none;background:var(--color-secondary);border:3px solid var(--color-light);cursor:pointer;width:22px;height:22px;box-shadow:var(--clay-shadow);border-radius:50%;transition:transform .1s}#brush-size::-webkit-slider-thumb:active{transform:scale(1.25)}.utility-group{flex:240px;gap:.4rem;display:flex}.palette-container{background:var(--panel-bg);border-radius:var(--border-radius-md);width:100%;max-width:480px;box-shadow:var(--clay-shadow);z-index:5;grid-template-columns:repeat(8,1fr);gap:.5rem;margin:.6rem auto;padding:.8rem;display:grid}.color-swatch{aspect-ratio:1;cursor:pointer;border:3px solid var(--color-light);border-radius:50%;width:100%;transition:transform .15s cubic-bezier(.175,.885,.32,1.275),box-shadow .15s;box-shadow:0 4px 10px #4a3b520d}.color-swatch.active{transform:scale(1.2)translateY(-2px);box-shadow:0 6px 15px #4a3b5226}#screen-magic{color:var(--color-light);background:radial-gradient(circle,#3d314a 0%,#201726 100%);justify-content:center;align-items:center}.magic-wrapper{text-align:center;z-index:10;position:relative}.magic-circle-decor{z-index:-1;border:3px dashed #ffeaa740;border-radius:50%;width:240px;height:240px;animation:20s linear infinite spin-decor;position:absolute;top:50px;left:50%;transform:translate(-50%,-50%)}.magic-circle-decor:before{content:"";border:1px solid #4ecdc426;border-radius:50%;position:absolute;inset:20px}@keyframes spin-decor{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.magic-circle{filter:drop-shadow(0 0 20px #ffeaa780);margin-bottom:2rem;font-size:7rem;animation:3s ease-in-out infinite alternate float-crystal;display:inline-block}@keyframes float-crystal{0%{transform:translateY(0)}to{transform:translateY(-12px)}}.magic-status{color:var(--color-accent);text-shadow:0 4px 10px #0003;margin-bottom:.5rem;font-size:1.6rem;font-weight:900}.magic-hint{opacity:.8;margin-bottom:2rem;font-size:.9rem;font-weight:700}.progress-bar-container{border:3px solid var(--color-light);background:#0000004d;border-radius:10px;width:240px;height:20px;margin:0 auto;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--color-accent), var(--color-primary), var(--color-secondary));border-radius:8px;width:0%;height:100%;transition:width .1s linear}#screen-preview{background:linear-gradient(135deg,#e3fcf9 0%,#d1f2ff 100%)}.viewer-3d-outer{background:var(--color-light);border-radius:var(--border-radius-lg);flex-direction:column;flex:1;width:100%;max-width:480px;margin:0 auto;padding:10px;display:flex;position:relative;box-shadow:0 16px 40px #4a3b5214}.viewer-3d-container{border-radius:var(--border-radius-md);background:#f8f9fa;flex:1;width:100%;overflow:hidden}.viewer-badge{background:var(--color-primary);color:var(--color-light);box-shadow:var(--clay-shadow);border-radius:12px;padding:.2rem 1.2rem;font-size:.8rem;font-weight:900;position:absolute;bottom:-15px;left:50%;transform:translate(-50%)}.character-setup-box{background:var(--panel-bg);border-radius:var(--border-radius-md);width:100%;max-width:480px;box-shadow:var(--clay-shadow);z-index:5;margin:1.2rem auto .6rem;padding:1rem}.input-row{align-items:center;gap:.8rem;width:100%;display:flex}.name-label{white-space:nowrap;font-size:1.1rem;font-weight:900}.input-wrapper{flex:1;gap:.5rem;display:flex}.input-wrapper input{font-family:var(--font-family);border-radius:var(--border-radius-sm);color:var(--color-dark);background:#f8f9fa;border:2px solid #e4e7eb;outline:none;flex:1;padding:.5rem 1rem;font-size:1.05rem;font-weight:700}.input-wrapper input:focus{border-color:var(--color-secondary);background:#fff}.btn-speech{border-radius:var(--border-radius-sm);background:var(--color-secondary);color:#fff;cursor:pointer;width:46px;height:46px;box-shadow:0 4px 0 var(--color-secondary-dark);border:none;justify-content:center;align-items:center;font-size:1.3rem;transition:transform .1s,box-shadow .1s;display:flex}.btn-speech:active{box-shadow:0 0px 0 var(--color-secondary-dark);transform:translateY(4px)}#screen-gallery{background:linear-gradient(135deg,#eef1f6 0%,#e3e9f5 100%)}.gallery-grid-container{z-index:5;flex:1;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1.2rem;width:100%;max-width:480px;margin:0 auto;padding-bottom:2rem;display:grid;overflow-y:auto}.gallery-card{background:var(--color-light);border-radius:var(--border-radius-md);box-shadow:var(--clay-shadow);text-align:center;cursor:pointer;flex-direction:column;align-items:center;padding:.6rem;transition:transform .15s,box-shadow .15s;display:flex}.gallery-card:active{transform:scale(.97)}.gallery-card-thumb{aspect-ratio:1;border-radius:var(--border-radius-sm);object-fit:contain;background:#f8f9fa;border:1px solid #f1f2f6;width:100%;margin-bottom:.5rem}.gallery-card-title{white-space:nowrap;text-overflow:ellipsis;width:100%;color:var(--color-dark);margin-bottom:.5rem;font-size:.9rem;font-weight:900;overflow:hidden}.gallery-card-buttons{gap:.3rem;width:100%;display:flex}.btn-card{font-family:var(--font-family);cursor:pointer;color:#fff;border:none;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:.2rem;padding:.4rem .2rem;font-size:.72rem;font-weight:900;transition:transform 50ms;display:flex;box-shadow:0 3px #00000026}.btn-card-ar{background:var(--color-primary);box-shadow:0 3px 0 var(--color-primary-dark)}.btn-card-del{background:#b2bec3;flex:0 0 28px;font-size:.75rem;box-shadow:0 3px #7f8c8d}.btn-card:active{transform:translateY(2px);box-shadow:0 1px #0000001a}.empty-gallery-msg{text-align:center;color:#7f8c8d;background:var(--panel-bg);border-radius:var(--border-radius-md);box-shadow:var(--clay-shadow);grid-column:1/-1;margin-top:2rem;padding:3rem 1rem;font-size:1.1rem;font-weight:700;line-height:1.8}#screen-ar{padding:0;overflow:hidden}#ar-video{object-fit:cover;z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.ar-canvas-container{z-index:2;pointer-events:auto;width:100%;height:100%;position:absolute;top:0;left:0}.ar-ui-overlay{z-index:3;pointer-events:none;flex-direction:column;width:100%;height:100dvh;padding:1rem;display:flex;position:absolute;top:0;left:0}.ar-header{pointer-events:auto;justify-content:space-between;align-items:center;display:flex}.ar-title-badge{background:var(--color-accent);color:#5d4600;border-radius:var(--border-radius-sm);box-shadow:var(--clay-shadow);padding:.4rem 1.2rem;font-size:1.05rem;font-weight:900}.ar-warning-alert{color:#fff;text-align:center;box-shadow:var(--clay-shadow);background:#ff7675f2;border-radius:12px;margin-top:.5rem;padding:.4rem;font-size:.8rem;font-weight:900;animation:1.2s ease-in-out shake}.ar-reticle-indicator{flex-direction:column;justify-content:center;align-items:center;display:none;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%)}.ar-reticle-indicator.active{display:flex}.reticle-circle{border:4px dashed var(--color-accent);background:#ffeaa733;border-radius:50%;width:80px;height:80px;animation:1.5s ease-in-out infinite pulse-reticle}.reticle-label{color:#fff;background:#4a3b52d9;border-radius:10px;margin-top:.5rem;padding:.3rem .8rem;font-size:.75rem;font-weight:900}@keyframes pulse-reticle{0%{opacity:.6;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}to{opacity:.6;transform:scale(.95)}}.ar-control-panel{background:var(--panel-bg);border-radius:var(--border-radius-lg);pointer-events:auto;flex-direction:column;gap:.6rem;width:100%;max-width:440px;margin-top:auto;margin-left:auto;margin-right:auto;padding:.8rem;display:flex;box-shadow:0 -10px 30px #4a3b521a}.animation-buttons-label{text-align:center;color:var(--color-dark);padding:.1rem 0;font-size:.85rem;font-weight:900}.ar-actions-row{grid-template-columns:repeat(4,1fr);gap:.4rem;display:grid}.btn-action{font-family:var(--font-family);border-radius:var(--border-radius-sm);cursor:pointer;color:var(--color-dark);background:#f1f2f6;border:none;flex-direction:column;align-items:center;gap:1px;padding:.5rem .2rem;font-size:.75rem;font-weight:900;transition:transform .1s,box-shadow .1s;display:flex;box-shadow:0 4px #dfe4ea}.btn-action:active{transform:translateY(4px);box-shadow:0 0 #dfe4ea}.btn-action.active{background:var(--color-success);color:var(--color-light);box-shadow:0 4px 0 var(--color-success-dark)}.btn-action.active:active{box-shadow:0 0px 0 var(--color-success-dark);transform:translateY(4px)}.ar-utility-row{gap:.6rem;display:flex}.btn-capture,.btn-share{font-family:var(--font-family);border-radius:var(--border-radius-sm);cursor:pointer;color:#fff;border:none;flex:1;justify-content:center;align-items:center;gap:.4rem;padding:.7rem;font-size:1.05rem;font-weight:900;transition:transform .1s,box-shadow .1s;display:flex}.btn-capture{background:var(--color-secondary);box-shadow:0 4px 0 var(--color-secondary-dark)}.btn-capture:active{box-shadow:0 0px 0 var(--color-secondary-dark);transform:translateY(4px)}.btn-share{background:var(--color-primary);box-shadow:0 4px 0 var(--color-primary-dark)}.btn-share:active{box-shadow:0 0px 0 var(--color-primary-dark);transform:translateY(4px)}.app-modal{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;opacity:0;background:#4a3b5266;justify-content:center;align-items:center;width:100%;height:100%;padding:1.2rem;transition:opacity .2s ease-out;display:none;position:absolute;top:0;left:0}.app-modal.active{opacity:1;display:flex}.modal-content{border-radius:var(--border-radius-lg);text-align:center;background:#fff;width:100%;max-width:360px;padding:1.8rem 1.4rem;transition:transform .2s cubic-bezier(.175,.885,.32,1.275);transform:scale(.85);box-shadow:0 20px 40px #4a3b5226}.app-modal.active .modal-content{transform:scale(1)}.modal-star-icon{margin-bottom:.5rem;font-size:2.5rem}.modal-content h3{color:var(--color-dark);margin-bottom:.6rem;font-size:1.25rem;font-weight:900}.modal-desc{color:#7f8c8d;margin-bottom:1.2rem;font-size:.85rem;font-weight:700;line-height:1.5}.btn-modal{font-family:var(--font-family);border-radius:var(--border-radius-sm);cursor:pointer;border:none;padding:.6rem 1.2rem;font-size:1rem;font-weight:900;transition:transform .1s,box-shadow .1s}.share-link-box{gap:.5rem;margin-bottom:1.2rem;display:flex}#share-url-text{color:#7f8c8d;background:#f8f9fa;border:1px solid #e4e7eb;border-radius:10px;outline:none;flex:1;padding:.5rem;font-size:.85rem;font-weight:700}.qr-container{border-radius:var(--border-radius-sm);background:#fff;border:2px dashed #e4e7eb;justify-content:center;margin-bottom:1.2rem;padding:.8rem;display:flex}.qr-container img{border-radius:6px;width:130px;height:130px}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}@media (height<=620px){.logo-container{margin-bottom:1.5rem}.main-title{font-size:2.1rem}.title-summon{font-size:2.5rem}.canvas-outer-frame{aspect-ratio:1.3;border-radius:var(--border-radius-md);max-height:240px;padding:6px}.canvas-container{border-radius:var(--border-radius-sm)}.canvas-toolbar{border-radius:var(--border-radius-sm);margin:.4rem auto;padding:.4rem;font-size:.75rem}.tool-btn{border-radius:12px;padding:.3rem .4rem}.brush-size-group{display:none}.palette-container{border-radius:var(--border-radius-sm);grid-template-columns:repeat(8,1fr);margin:.4rem auto;padding:.4rem}.color-swatch{border:2px solid var(--color-light)}.viewer-3d-outer{max-height:240px}.deco-item{display:none}}@media (height<=760px),(width<=480px){.ar-ui-overlay{padding:.5rem}.ar-control-panel{gap:.4rem;padding:.5rem}.animation-buttons-label{padding:.05rem 0;font-size:.75rem}.ar-actions-row{gap:.3rem}.btn-action{padding:.4rem .2rem;font-size:.7rem}.ar-utility-row{gap:.4rem}.btn-capture,.btn-share{padding:.6rem;font-size:.95rem}}