:root{font-family:Avenir Next,Nunito,ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#3f3127;background:#fff8ed;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #3f3127;--muted: #7f6d5f;--cream: #fff8ed;--paper: #fffdf8;--coral: #f36f5f;--coral-dark: #d95346;--yellow: #f8cf66;--mint: #83c8ae;--sky: #89c9db;--line: #eadccc;--shadow: 0 18px 50px rgba(94, 68, 43, .13)}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100vh;min-height:100dvh;overflow-x:hidden}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:3px solid rgba(39,133,160,.45);outline-offset:3px}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.page-shell{min-height:100vh;min-height:100dvh;position:relative}.page-shell:before,.page-shell:after{content:"";position:fixed;z-index:-1;border-radius:999px;filter:blur(1px);pointer-events:none}.page-shell:before{width:340px;height:340px;top:-170px;right:-100px;background:#f8cf663d}.page-shell:after{width:300px;height:300px;bottom:-170px;left:-100px;background:#83c8ae2e}.brand{display:inline-flex;align-items:center;gap:10px;color:#564234;font-weight:800;letter-spacing:-.02em;font-size:1.08rem}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;color:#fff;background:var(--coral);transform:rotate(-5deg);box-shadow:0 5px #9f3d3124}.brand-small{font-size:1rem}.create-page{display:grid;grid-template-rows:auto 1fr auto;align-items:center;padding:max(24px,env(safe-area-inset-top)) clamp(20px,5vw,64px) max(22px,env(safe-area-inset-bottom))}.create-card{width:min(940px,100%);margin:32px auto 24px;padding:clamp(28px,5vw,56px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(330px,1.1fr);gap:clamp(30px,6vw,70px);align-items:center;border:1px solid rgba(228,210,190,.9);border-radius:36px;background:#fffdf8e0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.intro-copy h1,.setup-panel h1,.completion-card h1{margin:10px 0 14px;font-size:clamp(2.25rem,5vw,4.1rem);line-height:.98;letter-spacing:-.055em;color:#463528}.intro-copy p,.setup-lead,.completion-card p{margin:0;color:var(--muted);font-size:clamp(1rem,2vw,1.2rem);line-height:1.55}.eyebrow,.step-label{display:inline-block;color:#b7473b;font-size:.78rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.photo-picker{min-height:330px;padding:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:2px dashed #d7bfa8;border-radius:28px;background:#fffaf2;transition:border-color .16s ease,background .16s ease,transform .16s ease}.photo-picker.is-dragging{border-color:var(--coral);background:#fff1e9;transform:scale(1.01)}.photo-picker-icon{width:72px;height:72px;display:grid;place-items:center;margin-bottom:18px;color:#277f87;border-radius:24px;background:#dff3ec;transform:rotate(3deg)}.photo-picker strong{font-size:1.3rem}.photo-picker>span{margin:7px 0 23px;color:var(--muted);font-size:.88rem}.primary-button{min-height:54px;padding:0 25px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:17px;color:#fff;background:var(--coral);box-shadow:0 6px 0 var(--coral-dark),0 11px 24px #dc534633;font-weight:850;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.primary-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 7px 0 var(--coral-dark),0 13px 26px #dc53463b}.primary-button:active:not(:disabled){transform:translateY(4px);box-shadow:0 2px 0 var(--coral-dark)}.primary-button:disabled{opacity:.7;cursor:wait}.button-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.privacy-note{grid-column:1 / -1;margin-top:-10px;padding:15px 18px;display:flex;align-items:center;justify-self:center;gap:12px;color:#34735f;border-radius:16px;background:#eef8f3}.privacy-note svg{flex:0 0 auto}.privacy-note div{display:flex;flex-direction:column;gap:2px}.privacy-note strong{font-size:.9rem}.privacy-note span{color:#5d786e;font-size:.78rem}.error-message{grid-column:1 / -1;margin:-15px 0 0;padding:12px 16px;color:#a83e34;border-radius:12px;background:#fff0ec;text-align:center;font-weight:700}.parent-note{margin:0;color:#9b8878;font-size:.76rem;font-weight:800;letter-spacing:.12em;text-align:center;text-transform:uppercase}.top-bar{height:78px;padding:max(14px,env(safe-area-inset-top)) clamp(18px,4vw,48px) 10px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(218,196,175,.75);background:#fffaf2d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.top-bar>:last-child{justify-self:end}.back-button,.icon-button,.text-button{border:0;background:transparent;cursor:pointer}.back-button{padding:10px 4px;display:inline-flex;align-items:center;justify-self:start;gap:5px;color:#6e5a4b;font-weight:800}.icon-button{width:46px;height:46px;display:grid;place-items:center;color:#685344;border:1px solid var(--line);border-radius:15px;background:var(--paper)}.prepare-layout{width:min(1160px,100%);min-height:calc(100vh - 78px);min-height:calc(100dvh - 78px);margin:auto;padding:clamp(24px,5vw,64px);display:grid;grid-template-columns:minmax(340px,1fr) minmax(310px,.78fr);align-items:center;gap:clamp(36px,7vw,92px)}.preview-column{display:flex;flex-direction:column;align-items:center}.crop-surface{width:min(100%,570px);aspect-ratio:1;position:relative;display:grid;place-items:center;border-radius:38px;background:#efe4d6;box-shadow:inset 0 0 0 1px #6d523912,var(--shadow);overflow:hidden;touch-action:none;cursor:grab}.crop-surface:active{cursor:grabbing}.crop-preview{width:86%;height:86%;overflow:visible;filter:drop-shadow(0 12px 15px rgba(72,50,31,.18))}.crop-hint{position:absolute;bottom:18px;left:50%;transform:translate(-50%);padding:8px 13px;color:#fff;border-radius:999px;background:#382b21b8;font-size:.75rem;font-weight:750;pointer-events:none}.zoom-controls{width:min(78%,390px);margin-top:20px;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:12px}.zoom-controls button{width:40px;height:40px;border:1px solid var(--line);border-radius:13px;background:#fff;font-size:1.35rem;font-weight:700;cursor:pointer}.zoom-controls input{width:100%;accent-color:var(--coral)}.setup-panel{padding:12px 0}.setup-panel h1{font-size:clamp(2.3rem,4vw,3.7rem)}.choice-group{margin:28px 0 0;padding:0;border:0}.choice-group legend{margin-bottom:10px;color:#5d493a;font-size:.86rem;font-weight:850}.segmented-options{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.segmented-options button{min-height:88px;padding:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:2px solid var(--line);border-radius:18px;background:#fffdf8cc;font-size:.85rem;font-weight:800;cursor:pointer;transition:border-color .14s ease,background .14s ease,transform .14s ease}.segmented-options button:hover{transform:translateY(-2px)}.segmented-options button.is-selected{color:#a64337;border-color:var(--coral);background:#fff1ed}.shape-symbol{width:34px;height:28px;display:block;background:currentColor;opacity:.7}.shape-symbol.rectangle{border-radius:6px}.shape-symbol.heart{width:30px;transform:rotate(-45deg);border-radius:4px 0 6px}.shape-symbol.heart:before,.shape-symbol.heart:after{content:"";position:absolute;width:30px;height:28px;border-radius:50%;background:currentColor}.shape-symbol.heart:before{transform:translateY(-14px)}.shape-symbol.heart:after{transform:translate(14px)}.cut-symbol{width:48px;height:28px;display:block;border-radius:6px;background:linear-gradient(90deg,currentColor 0 47%,transparent 47% 53%,currentColor 53%);opacity:.7}.cut-symbol.classic{clip-path:polygon(0 0,47% 0,47% 32%,40% 32%,37% 48%,40% 64%,47% 64%,47% 100%,0 100%,0 0,53% 0,100% 0,100% 100%,53% 100%,53% 64%,60% 64%,63% 48%,60% 32%,53% 32%)}.cut-symbol.torn{clip-path:polygon(0 0,47% 0,49% 18%,45% 34%,50% 53%,46% 72%,48% 100%,0 100%,0 0,53% 0,51% 18%,55% 34%,50% 53%,54% 72%,52% 100%,100% 100%,100% 0)}.piece-count{margin-top:24px;padding:16px 18px;display:grid;grid-template-columns:1fr auto;gap:3px 15px;border-radius:16px;background:#f4eee5}.piece-count span{color:var(--muted);font-size:.78rem;font-weight:800;text-transform:uppercase}.piece-count strong{grid-row:span 2;align-self:center;color:#3e7565}.piece-count small{color:var(--muted)}.start-button{width:100%;margin-top:20px;justify-content:space-between}.play-page{display:flex;flex-direction:column;background:#f8f0e4}.play-top-bar{flex:0 0 auto}.play-heading{display:flex;flex-direction:column;align-items:center;gap:2px}.play-heading strong{font-size:1.05rem}.play-heading span{color:var(--muted);font-size:.76rem;font-weight:700}.game-layout{width:min(1220px,100%);flex:1;margin:auto;padding:clamp(20px,4vw,48px);display:grid;grid-template-columns:minmax(400px,1fr) minmax(300px,.62fr);align-items:center;gap:clamp(28px,5vw,70px)}.board-wrap{min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}.board-glow{width:min(90%,620px);aspect-ratio:1;position:absolute;top:50%;left:50%;border-radius:42px;background:#ffffffb3;box-shadow:0 16px 60px #654b3021;transform:translate(-50%,-53%)}.game-board{width:min(82%,550px);position:relative;overflow:visible;filter:drop-shadow(0 12px 13px rgba(75,52,32,.14))}.board-help{position:relative;margin:20px 0 0;color:#8c7765;font-size:.83rem;font-weight:750}.piece-tray{min-height:500px;padding:22px;border:1px solid rgba(218,197,176,.95);border-radius:28px;background:#fffdf8db;box-shadow:0 12px 35px #5d41261a}.tray-heading{margin:0 4px 14px;display:flex;align-items:baseline;justify-content:space-between}.tray-heading span{font-weight:900}.tray-heading small{color:var(--muted);font-weight:750}.tray-grid{display:grid;grid-template-columns:repeat(3,minmax(74px,1fr));gap:12px}.piece-tile{min-width:0;aspect-ratio:1;padding:2px;display:grid;place-items:center;border:0;border-radius:18px;background:#f3eadf;cursor:grab;touch-action:none;transition:background .18s ease,transform .18s ease,opacity .18s ease}.piece-tile:hover:not(:disabled){background:#eee0d0;transform:scale(1.025)}.piece-tile:active:not(:disabled){cursor:grabbing}.piece-tile.is-dragging{opacity:.18}.piece-tile.is-placed{background:#e4f1e9}.piece-tile.is-wrong{animation:gentle-no .36s ease}.tray-piece{width:94%;height:94%;overflow:visible;pointer-events:none}.placed-check{width:36px;height:36px;display:grid;place-items:center;color:#fff;border-radius:50%;background:var(--mint);font-size:1.25rem;font-weight:900;animation:pop-in .28s ease both}.drag-overlay{position:fixed;z-index:30;transform:translate(-50%,-50%) scale(1.04);pointer-events:none;filter:drop-shadow(0 14px 12px rgba(62,43,29,.25))}.drag-overlay svg{width:100%;height:100%;overflow:visible}.completion-overlay{position:fixed;inset:0;z-index:50;padding:24px;display:grid;place-items:center;background:#4934255c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fade-in .26s ease both}.completion-card{width:min(460px,100%);max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);padding:30px;display:flex;flex-direction:column;align-items:center;border:1px solid rgba(255,255,255,.8);border-radius:32px;background:var(--paper);box-shadow:0 30px 90px #3726184d;text-align:center;overflow:auto;animation:pop-in .42s cubic-bezier(.2,.85,.3,1.15) both}.completion-icon{width:72px;height:72px;display:grid;place-items:center;margin-bottom:15px;color:#fff;border-radius:24px;background:var(--coral);transform:rotate(-7deg)}.completion-card h1{margin:4px 0 5px;font-size:clamp(2.5rem,8vw,3.6rem)}.completed-photo{width:min(220px,64vw);margin:22px 0;filter:drop-shadow(0 9px 10px rgba(70,48,31,.17))}.completed-photo svg{display:block;width:100%}.completion-card .primary-button{width:100%}.text-button{margin-top:17px;color:#755f4f;font-weight:800}.celebration-sparkles{position:fixed;inset:0;pointer-events:none;overflow:hidden}.celebration-sparkles i{position:absolute;top:-8vh;color:var(--yellow);font-style:normal;animation:fall 2.4s ease-in infinite}.celebration-sparkles i:nth-child(1){left:10%;animation-delay:.1s;color:var(--coral)}.celebration-sparkles i:nth-child(2){left:26%;animation-delay:.65s;color:var(--mint)}.celebration-sparkles i:nth-child(3){left:42%;animation-delay:.3s}.celebration-sparkles i:nth-child(4){left:61%;animation-delay:.9s;color:var(--sky)}.celebration-sparkles i:nth-child(5){left:77%;animation-delay:.45s;color:var(--coral)}.celebration-sparkles i:nth-child(6){left:90%;animation-delay:1.1s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes gentle-no{0%,to{transform:translate(0)}30%{transform:translate(-5px)}65%{transform:translate(5px)}}@keyframes pop-in{0%{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fall{0%{transform:translateY(-10vh) rotate(0);opacity:0}12%{opacity:1}to{transform:translateY(115vh) rotate(520deg);opacity:.35}}@media(max-width:850px){.create-card{grid-template-columns:1fr;gap:26px}.intro-copy{text-align:center}.photo-picker{min-height:280px}.prepare-layout{grid-template-columns:1.1fr .9fr;gap:30px;padding:30px}.game-layout{grid-template-columns:1fr;align-items:start;padding:24px}.game-board{width:min(68vw,520px)}.board-glow{width:min(76vw,570px)}.piece-tray{width:min(100%,680px);min-height:auto;margin:0 auto}.tray-grid{grid-template-columns:repeat(7,minmax(70px,1fr))}}@media(max-width:650px){.create-page{padding-inline:15px}.create-card{margin-top:22px;padding:24px 18px;border-radius:28px}.photo-picker{min-height:260px;padding:25px 18px}.privacy-note{align-items:flex-start}.top-bar{height:70px;padding-inline:14px}.brand-small{display:none}.top-bar{grid-template-columns:1fr auto}.top-bar .brand-small+.icon-button{grid-column:2}.prepare-layout{min-height:auto;padding:20px 16px 36px;grid-template-columns:1fr;gap:28px}.crop-surface{width:min(88vw,460px);border-radius:27px}.setup-panel{width:min(100%,460px);margin:auto}.setup-panel h1{margin-top:7px}.play-top-bar{grid-template-columns:1fr auto 1fr}.game-layout{padding:18px 12px 30px;gap:22px}.game-board{width:min(78vw,420px)}.board-glow{width:min(88vw,470px);border-radius:28px}.piece-tray{padding:15px;border-radius:22px}.tray-grid{grid-template-columns:repeat(4,1fr);gap:8px}.piece-tile{border-radius:13px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.celebration-sparkles{display:none}}