:root{--paper:#f7f1e5;--ink:#2b2925;--muted:#716c62;--line:#ddd5c5;--white:#fffdf8;--yellow:#efcf76;--soft:#f8e9b8;--radius:24px;font-family:Arial,"Hiragino Kaku Gothic ProN","Noto Sans Thai",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button,a,select,input{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #9a6518;outline-offset:5px}button{border:0}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2,.display{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.045em}h1{font-size:clamp(2.6rem,6vw,5rem);line-height:1.08}h2{font-size:2rem;line-height:1.18}p{line-height:1.65}button svg{vertical-align:middle}.preview-ribbon{padding:9px 5%;background:#e9dfcb;display:flex;justify-content:center;gap:18px;font-size:.75rem;letter-spacing:.06em}.preview-ribbon span:first-child{font-weight:700}.header{max-width:1200px;padding:30px 40px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;gap:12px;align-items:center;padding:0;text-align:left;background:none;font-weight:700;letter-spacing:-.025em;font-size:1.1rem}.brand-mark{font-size:2.6rem;font-weight:400;line-height:1}.brand-by{display:block;color:var(--muted);font-size:.75rem;font-weight:400;letter-spacing:.025em;margin-top:5px}.language{display:flex;gap:8px;align-items:center;font-size:1.1rem}.language select{border:0;background:transparent;padding:12px 4px;font-size:.875rem}.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}.home{max-width:1000px;margin:auto;text-align:center;padding:45px 24px 0}.eyebrow{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--muted);margin-bottom:20px}.home h1 em{font-style:italic}.home .intro{font-size:1.125rem;color:var(--muted);margin:23px auto 0;max-width:460px}.parade{display:flex;max-width:680px;margin:15px auto 8px;align-items:center;justify-content:center}.pet-art{display:block;aspect-ratio:1;width:100%;background-image:url('assets/pets.png');background-repeat:no-repeat;background-size:300% 200%;flex:none}.parade .pet-art{width:35%;margin:0 -1.5%}.parade .pet-art:nth-child(1){transform:rotate(-7deg) translateY(15px)}.parade .pet-art:nth-child(3){transform:rotate(7deg) translateY(15px)}.button{min-height:52px;padding:15px 28px;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-size:1rem;font-weight:600;line-height:1.4;transition:background .16s,transform .16s;border:1px solid transparent}.button:active{transform:translateY(1px)}.primary{background:var(--ink);color:#fffdf8}.primary:hover{background:#484237}.secondary{background:var(--white);border-color:var(--line)}.secondary:hover{background:#f3e9d5}.button:disabled{opacity:.48;transform:none}.home .primary{min-width:258px}.under-cta{margin-top:16px;color:var(--muted);font-size:.875rem}.small-link{background:none;padding:0;text-decoration:underline;text-underline-offset:4px;color:var(--muted);font-size:.875rem}.home .small-link{margin-top:20px}.steps-caption{display:flex;align-items:center;justify-content:center;gap:20px;margin:36px 0 0;color:var(--muted);font-size:.875rem}.steps-caption b{font-weight:400;color:#b4a68d}.game-section{max-width:870px;margin:64px auto 0;padding:27px 30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:24px;align-items:center;text-align:left}.game-image{width:100px;height:112px;object-fit:cover;object-position:45% 40%;border-radius:16px}.game-copy{flex:1}.game-copy .eyebrow{font-size:.75rem;letter-spacing:.1em;margin-bottom:7px}.game-copy h2{font-size:1.7rem;letter-spacing:-.025em}.game-copy p{font-size:.875rem;color:var(--muted);margin-top:9px;max-width:470px}.store-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.store{padding:9px 14px;background:transparent;border:1px solid var(--line);border-radius:8px;font-size:.8rem}.store-note{font-size:.75rem;color:var(--muted);display:block;margin-top:8px}footer{max-width:1040px;margin:0 auto;padding:34px 24px 26px;text-align:center;color:var(--muted);font-size:.8rem}.social{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:center;margin-bottom:27px;font-size:.875rem}.social a{text-decoration:none}.social a:hover{text-decoration:underline}.footer-bottom{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px 22px}.footer-bottom .small-link{font-size:.8rem}.flow{max-width:1120px;margin:auto;padding:20px 40px 40px}.flow-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.text-button{background:none;padding:10px 0;color:var(--muted);font-size:.875rem}.progress{display:flex;gap:24px;align-items:center;font-size:.8rem;color:var(--muted)}.progress span{display:flex;align-items:center;gap:7px}.progress i{font-style:normal;border:1px solid var(--line);border-radius:50%;height:24px;width:24px;display:grid;place-items:center}.progress .active{color:var(--ink);font-weight:700}.progress .active i{background:var(--yellow);border-color:var(--yellow)}.flow-title{margin-bottom:28px}.flow-title h1{font-size:2.6rem}.flow-title p{color:var(--muted);font-size:.95rem;margin-top:9px}.studio{display:grid;grid-template-columns:1.05fr 1fr;gap:28px}.stage{min-height:520px;border:1px solid var(--line);border-radius:var(--radius);background-color:#f3ecd9;background-image:radial-gradient(#d6ccb6 .9px,transparent .9px);background-size:22px 22px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.stage .pet-art{width:90%;max-width:460px}.stage-label{position:absolute;top:22px;left:24px;color:var(--muted);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}.stage-bottom{position:absolute;bottom:22px;left:20px;right:20px;text-align:center;color:var(--muted);font-size:.8rem}.tools{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;min-width:0}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding-bottom:20px;border-bottom:1px solid var(--line)}.tab{border-radius:14px;background:transparent;padding:12px 5px;font-size:.8rem}.tab .glyph{font-size:1.45rem;display:block;height:32px;letter-spacing:0}.tab.active{background:var(--soft)}.tab:hover{background:#f7efda}.controls-title{display:flex;justify-content:space-between;align-items:center;margin:20px 0 13px;font-size:.875rem}.badge{font-size:.75rem;color:var(--muted)}.palette{display:flex;gap:10px;flex-wrap:wrap}.swatch{width:28px;height:28px;border-radius:50%;background:var(--swatch);border:1px solid #00000018;position:relative;opacity:.7}.swatch.chosen:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:var(--ink);font-size:.8rem;font-weight:bold}.slider-label{display:flex;justify-content:space-between;font-size:.8rem;color:var(--muted);margin:17px 0 7px}.tools input[type=range]{width:100%;accent-color:#aa8841;height:10px;margin:5px 0 0}.art-note{font-size:.8rem;color:var(--muted);line-height:1.5;margin-top:14px;background:#f7f3e9;border-radius:10px;padding:10px 12px}.options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-height:280px;overflow-y:auto;padding:4px}.option{background:#f3f0e9;border:1px solid transparent;border-radius:14px;min-width:0;padding:4px 4px 9px;font-size:.8rem}.option.active{background:#f9e8ac;border:1px solid #b29449}.option .pet-art{width:100%;max-height:106px}.option .face{display:block;padding:25px 0;font-size:1.6rem}.option:disabled{opacity:.58}.tool-bottom{margin-top:21px;display:flex;align-items:center;justify-content:space-between;gap:14px;color:var(--muted);font-size:.8rem}.tool-bottom .button{padding:13px 26px;min-height:46px}.center-page{text-align:center;max-width:650px;margin:10px auto}.center-page h1{font-size:2.9rem}.center-page>p{margin-top:13px;color:var(--muted)}.center-page>.pet-art{max-width:320px;margin:15px auto}.center-page .actions{display:flex;justify-content:center;gap:12px;margin-top:25px;flex-wrap:wrap}.stack-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:32px;align-items:center}.stack-board{min-height:490px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius);background-color:#f3ecd9;background-image:radial-gradient(#d6ccb6 .9px,transparent .9px);background-size:22px 22px;padding:22px;overflow:hidden}.stack-board .pet-art{width:220px;margin:-30px 0;position:relative}.stack-board .pet-art:first-child{margin-top:0}.stack-board .pet-art:last-child{margin-bottom:0}.add-outline{border:1px dashed #aa9c80;background:transparent;border-radius:18px;width:160px;min-height:82px;margin-bottom:12px;display:grid;place-content:center;gap:4px;font-size:.8rem;color:var(--muted)}.add-outline strong{font-size:1.7rem;font-weight:400}.stack-list{display:flex;flex-direction:column;gap:13px}.stack-item{display:flex;align-items:center;gap:10px;padding:7px 14px 7px 5px;border-radius:18px;background:var(--white);border:1px solid var(--line)}.stack-item .pet-art{width:78px}.stack-info{flex:1}.stack-info strong{display:block;font-size:.9rem}.stack-info span{font-size:.75rem;color:var(--muted);display:block;margin-top:5px}.stack-item button{padding:10px;background:none;font-size:.8rem;text-decoration:underline;text-underline-offset:3px}.stack-item button:disabled{opacity:.3}.stack-actions{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}.naming-art{display:flex;justify-content:center;align-items:center;margin:20px auto;max-width:460px}.naming-art .pet-art{width:44%;margin:0 -5%}.name-label{display:block;font-size:.875rem;text-align:left;margin-top:25px}.name-field{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px;width:100%;font-size:1.8rem;text-align:center;font-family:Georgia,serif;margin-top:10px}.name-helper{display:flex;justify-content:space-between;margin:9px 0 24px;color:var(--muted);font-size:.75rem;gap:15px;text-align:left}.postcard{background:var(--white);padding:27px;border-radius:20px;max-width:460px;margin:24px auto 0;border:1px solid var(--line)}.postcard .stack-board{background:transparent;min-height:240px;padding:0}.postcard .stack-board .pet-art{width:185px;margin-top:-25px;margin-bottom:-25px}.postcard .stack-board .pet-art:first-child{margin-top:0}.postcard .stack-board .pet-art:last-child{margin-bottom:0}.postcard .display{font-size:2.4rem;margin-top:14px;overflow-wrap:anywhere}.postcard .postcard-credit{font-size:.7rem;letter-spacing:.12em;margin-top:18px;color:var(--muted);text-transform:uppercase}.result-links{display:flex;justify-content:center;gap:24px;margin-top:24px}.result-links button{font-size:.8rem}.storage-note{font-size:.8rem!important;margin-top:20px!important}.preview-spec{margin:45px auto 0;max-width:870px;border:1px solid var(--line);border-radius:16px;padding:18px 22px;text-align:left}.preview-spec summary{cursor:pointer;font-size:.875rem;font-weight:600}.preview-spec p{font-size:.875rem;color:var(--muted);margin-top:12px}.preview-spec ul{padding-left:20px;font-size:.875rem;color:var(--muted);line-height:1.8}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:14px 22px;background:var(--ink);color:white;border-radius:14px;font-size:.875rem;max-width:calc(100% - 32px);text-align:center;z-index:20;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}dialog{max-width:580px;width:calc(100% - 32px);border:0;border-radius:24px;padding:32px;background:var(--white);color:var(--ink)}dialog::backdrop{background:#24201988}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}.dialog-head h2{font-size:2rem}.icon-button{background:transparent;font-size:2rem;line-height:1;padding:0 5px}dialog p{font-size:.95rem;margin-bottom:18px;color:var(--muted)}dialog .primary{margin-top:5px}dialog h3{font-size:1rem;margin-bottom:10px}
@media(min-width:1500px){.home{padding-top:65px}.parade{max-width:740px;margin-top:20px}}@media(max-width:760px){.header{padding:22px 20px}.brand{font-size:.95rem}.brand-mark{font-size:2.2rem}.preview-ribbon{font-size:.68rem;gap:10px}.home{padding-top:30px}.home h1{font-size:3.35rem}.home .intro{font-size:1rem;max-width:290px}.parade{margin:26px auto 22px;max-width:520px}.parade .pet-art{width:37%;margin:0 -3%}.steps-caption{gap:10px;font-size:.75rem;margin-top:30px}.game-section{margin-top:42px;padding:24px 0;gap:16px;align-items:flex-start}.game-image{width:76px;height:88px}.game-copy h2{font-size:1.4rem}.game-copy p{font-size:.8rem}.store{font-size:.75rem;padding:8px 10px}.flow{padding:12px 20px 25px}.flow-top{gap:10px;margin-bottom:24px}.progress{gap:12px;font-size:.7rem}.progress span{gap:5px}.progress i{height:20px;width:20px}.flow-title{margin-bottom:20px}.flow-title h1{font-size:2.1rem}.flow-title p{font-size:.875rem}.studio{grid-template-columns:1fr;gap:16px}.stage{min-height:285px;height:300px}.stage .pet-art{max-width:280px}.stage-label{top:16px;left:18px;font-size:.7rem}.stage-bottom{bottom:13px;font-size:.7rem}.tools{padding:18px}.tabs{padding-bottom:14px}.tab{padding:8px 5px}.controls-title{margin-top:16px}.options{max-height:235px}.option .pet-art{max-height:none;max-width:105px;margin:auto}.stack-layout{grid-template-columns:1fr;gap:22px}.stack-board{min-height:330px}.stack-board .pet-art{width:175px;margin:-26px 0}.stack-list{gap:9px}.stack-item .pet-art{width:66px}.stack-actions .button{flex:1;white-space:nowrap;padding:13px 16px}.center-page h1{font-size:2.2rem}.center-page>p{font-size:.95rem}.center-page>.pet-art{max-width:270px}.postcard{padding:24px 16px}.postcard .display{font-size:2rem}.result-links{gap:18px}.social{gap:16px 22px}.footer-bottom{font-size:.75rem}.game-section-wrap{padding:0 20px}.preview-spec{margin-top:30px;padding:16px}.stack-board .add-outline{min-height:65px}.center-page .actions .button{padding:14px 22px}.flow .game-section{margin-top:42px}.tool-bottom{font-size:.75rem}}
.pet-art{mix-blend-mode:normal;background-image:none}.pet-art svg{display:block;width:100%;height:100%}
.game-photo{width:100%;max-width:430px;height:auto;display:block;margin:26px auto 0;border-radius:14px}
.home h1.logo-heading{line-height:0}.title-logo{display:block;width:min(100%,680px);height:auto;max-height:180px;object-fit:contain;margin:auto}
.contact-stack{position:relative;width:100%;isolation:isolate;overflow:hidden}.stack-pet{position:absolute;left:0;width:100%;aspect-ratio:1}.stack-board .stack-pet .pet-art{width:100%;margin:0;max-width:none;mix-blend-mode:normal}
.stack-interactive{position:relative;width:min(270px,70%)}.stack-hit{padding:0;border:0;background:none;display:block;width:100%;border-radius:24px}.stack-hit.selected{background:#efcf7640}.stack-hit:focus-visible{outline-offset:-5px}.pet-actions{position:absolute;right:-42px;z-index:20;display:flex;flex-direction:column;gap:6px;transform:translateY(-50%);background:var(--white);padding:6px;border:1px solid var(--line);border-radius:100px}.pet-actions button{width:44px;height:44px;background:transparent;border-radius:50%;display:grid;place-items:center}.pet-actions button:hover{background:var(--soft)}.pet-actions button:disabled{opacity:.3}.stack-flow{max-width:700px}.stack-flow .flow-title{text-align:center}.stack-flow .stack-board{min-height:410px;padding:35px 20px}.stack-count{text-align:center;margin-bottom:14px;color:var(--muted);font-size:.8rem;letter-spacing:.1em}.minimal-stack-actions{display:flex;justify-content:center;margin-top:24px}.minimal-stack-actions .button{min-width:180px}.stack-flow .add-outline{width:95px;min-height:55px;margin-bottom:20px}.toast.show{pointer-events:auto}.toast button{background:transparent;color:#efcf76;text-decoration:underline;text-underline-offset:3px;padding:8px;margin-left:12px}
#live-pet{width:95%;max-width:490px}#live-pet .pet-art{width:100%;max-width:none}.color-chip{width:22px;height:22px;border-radius:50%;border:1px solid var(--line)}.tools .options{max-height:345px;flex:1;min-height:210px}.tools .option .pet-art{height:100px;max-width:140px;margin:auto}.palette .swatch{opacity:1;width:32px;height:32px}.swatch.chosen:after{color:white;background:#2b292560;border-radius:50%}.fixed-color-note{font-size:.8rem;color:var(--muted);margin-top:22px}.tone-controls{margin-top:6px}.tools .tool-bottom{border-top:1px solid var(--line);padding-top:16px}.store-row{align-items:center;gap:8px}.store-badge{display:inline-flex;align-items:center;background:transparent;padding:0;min-height:54px}.store-badge img{display:block;height:44px;width:auto}.store-badge.google img{height:64px}.store-badge:disabled{opacity:1;cursor:default}.social{gap:14px}.social a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%}.social a:hover{background:#e9dfcb}.social img{display:block;object-fit:contain;width:24px;height:24px}.social img.social-youtube,.social img.social-discord{width:28px;height:28px}.social img.social-tiktok,.social img.social-x{width:22px;height:22px}
@media(max-width:760px){.tools .options{max-height:275px}.tools .option .pet-art{height:85px}.stack-interactive{width:min(250px,70%)}.stack-flow .stack-board{min-height:350px}.store-badge img{height:40px}.store-badge.google img{height:58px}}

@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Shared action icons: crisp at any size, with labels retained for clarity. */
.ui-icon{display:block;flex:none;width:21px;height:21px}
.text-button,.result-links .small-link,.toast button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.text-button{min-height:44px;padding-right:8px}
.result-links{flex-wrap:wrap;gap:10px 24px}
.result-links .small-link{min-height:44px}
.result-links .ui-icon,.toast .ui-icon{width:18px;height:18px}
.tab .glyph{display:flex;justify-content:center;align-items:center}
.tab .ui-icon{width:25px;height:25px}
.add-outline .ui-icon{margin:auto;width:28px;height:28px}