:root{--cream: #fdf6f0;--wine: #4a1a2e;--rose: #c4767a;--blush: #e8b4b8;--gold: #b8956a;--font-display: "Playfair Display", Georgia, serif;--font-body: "DM Sans", system-ui, sans-serif;--shadow-sm: 0 1px 3px rgba(74, 26, 46, .08);--shadow-md: 0 4px 16px rgba(74, 26, 46, .12);--shadow-lg: 0 8px 32px rgba(74, 26, 46, .16);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--transition: .2s ease}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background-color:var(--cream);color:var(--wine);min-height:100dvh;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.2}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.fade-in{animation:fadeIn .5s ease both}#root{display:flex;flex-direction:column;align-items:center;min-height:100dvh;padding:2rem 1rem 3rem}.app-header{text-align:center;margin-bottom:2rem;animation:fadeIn .6s ease both}.app-title{font-size:clamp(1.75rem,5vw,2.5rem);color:var(--wine);margin-bottom:.25rem}.app-subtitle{font-family:var(--font-display);font-style:italic;font-weight:400;color:var(--rose);font-size:1rem}.upload-zone{width:min(90vw,400px);aspect-ratio:1;border:2px dashed var(--blush);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;cursor:pointer;transition:border-color var(--transition),background-color var(--transition);animation:fadeIn .5s ease .2s both;background-color:transparent}.upload-zone:hover,.upload-zone.dragging{border-color:var(--rose);background-color:#c4767a0a}.upload-zone:focus-visible{outline:2px solid var(--rose);outline-offset:2px}.upload-icon{color:var(--blush);transition:color var(--transition)}.upload-zone:hover .upload-icon,.upload-zone.dragging .upload-icon{color:var(--rose)}.upload-text{text-align:center;font-size:1.05rem;color:var(--wine)}.upload-subtext{display:block;font-size:.85rem;color:var(--rose);margin-top:.25rem}.upload-zone.loading{border-style:solid;border-color:var(--blush);cursor:default}.upload-loading-text{font-family:var(--font-display);font-style:italic;color:var(--rose);animation:pulse 1.8s ease-in-out infinite}.puzzle-wrapper{display:flex;flex-direction:column;align-items:center;gap:1.25rem}.puzzle-board{position:relative;width:min(90vw,400px);aspect-ratio:1;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-md);background-color:var(--blush);border:4px solid var(--wine)}.puzzle-tile{position:absolute;width:33.3334%;height:33.3334%;background-size:cover;background-position:center;border:none;padding:0;outline:none;cursor:pointer;transition:transform var(--transition);box-shadow:inset 0 0 0 .75px #4a1a2e1f}.puzzle-tile:not(.puzzle-tile--empty):hover{filter:brightness(1.05)}.puzzle-tile:not(.puzzle-tile--empty):focus-visible{z-index:1;box-shadow:inset 0 0 0 2px var(--gold)}.puzzle-tile--empty{opacity:0;pointer-events:none;cursor:default}.puzzle-controls{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.move-counter{font-variant-numeric:tabular-nums;color:var(--rose);font-size:.95rem;min-width:5rem}.btn{font-family:var(--font-body);font-size:.9rem;font-weight:500;padding:.5rem 1.25rem;border-radius:999px;cursor:pointer;transition:all var(--transition);border:1.5px solid var(--rose)}.btn--outline{background:transparent;color:var(--rose)}.btn--outline:hover{background-color:var(--rose);color:var(--cream)}.btn--filled{background-color:var(--wine);color:var(--cream);border-color:var(--wine)}.btn--filled:hover{background-color:#5d2139;border-color:#5d2139}.btn--ghost{background:transparent;color:var(--rose);border-color:transparent}.btn--ghost:hover{background-color:#c4767a14}.modal-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem;background-color:#4a1a2e4d;animation:fadeIn .3s ease both}@supports (backdrop-filter: blur(8px)){.modal-overlay{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background-color:#4a1a2e33}}.modal-card{background:var(--cream);border-radius:var(--radius-lg);padding:1.5rem;max-width:380px;width:100%;text-align:center;box-shadow:var(--shadow-lg);animation:scaleIn .4s ease both}.modal-image{width:100%;border-radius:var(--radius-md);margin-bottom:1.25rem;box-shadow:var(--shadow-sm)}.modal-heading{font-size:1.5rem;color:var(--wine);margin-bottom:.25rem}.modal-moves{color:var(--rose);font-size:.95rem;margin-bottom:1rem}.modal-divider{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin-bottom:1rem}.modal-share{margin-bottom:.75rem}.btn--share{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background-color:var(--rose);color:var(--cream);border-color:var(--rose)}.btn--share:hover{background-color:#b06468;border-color:#b06468}.btn--share:disabled{opacity:.6;cursor:default}.btn--send{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background-color:var(--wine);color:var(--cream);border-color:var(--wine)}.btn--send:hover{background-color:#5d2139;border-color:#5d2139}.btn--send:disabled{opacity:.6;cursor:default}.modal-share .btn--send{width:100%}.send-puzzle-container{display:contents}.send-link-box{background-color:var(--cream);border:1px solid var(--blush);border-radius:var(--radius-md);padding:.75rem;margin-top:.5rem;min-width:260px;box-shadow:var(--shadow-md);animation:fadeIn .3s ease both}.puzzle-controls .send-link-box{flex-basis:100%}.modal-share .send-link-box{width:100%}.send-link-text{font-family:DM Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;color:var(--wine);background:#ffffff80;border-radius:var(--radius-sm);padding:.5rem .65rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;user-select:all;-webkit-user-select:all}.send-link-actions{display:flex;gap:.5rem;margin-top:.5rem}.send-link-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;font-size:.82rem;padding:.4rem .75rem}.challenge-loading{display:flex;align-items:center;justify-content:center;width:min(90vw,400px);aspect-ratio:1}.modal-actions{display:flex;justify-content:center;gap:.75rem}.sponsors{margin-top:auto;text-align:center;padding:2rem 1rem 0;animation:fadeIn .6s ease .4s both}.sponsors-label{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:.8rem;color:var(--blush);margin-bottom:.75rem}.sponsors-logos{display:flex;justify-content:center;align-items:center;gap:1.75rem;flex-wrap:wrap}.sponsor-link{opacity:.35;transition:opacity var(--transition)}.sponsor-link:hover{opacity:.65}.sponsor-logo{height:28px;max-height:28px;width:auto;max-width:120px;object-fit:contain;filter:grayscale(100%);transition:filter var(--transition)}.sponsor-link:hover .sponsor-logo{filter:grayscale(0%)}