:root{color:#24262b;background:#f7f2e8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{min-height:44px;border:0;border-radius:8px;background:#24262b;color:#fff;cursor:pointer;font-weight:700;padding:0 18px}button:disabled{cursor:not-allowed;opacity:.42}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;min-height:100vh;padding:24px}.workspace,.side-panel{min-width:0}.top-bar{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:18px}.eyebrow{color:#16706f;font-size:.78rem;font-weight:800;letter-spacing:0;margin:0 0 4px;text-transform:uppercase}h1,h2{letter-spacing:0;margin:0}h1{font-size:clamp(2rem,5vw,4.3rem);line-height:.95}h2{font-size:1rem;margin-bottom:12px}.photo-button{align-items:center;background:#16706f;border-radius:8px;color:#fff;cursor:pointer;display:inline-flex;font-weight:800;min-height:48px;padding:0 18px;white-space:nowrap}.photo-button input{position:absolute;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden}.canvas-panel{align-items:center;background:linear-gradient(90deg,rgba(36,38,43,.04) 1px,transparent 1px),linear-gradient(rgba(36,38,43,.04) 1px,transparent 1px),#fff;background-size:24px 24px;border:1px solid rgba(36,38,43,.12);border-radius:8px;display:flex;justify-content:center;min-height:min(68vh,760px);overflow:auto;position:relative}.puzzle-canvas{background:#fff;border:1px solid rgba(36,38,43,.18);border-radius:4px;cursor:pointer;display:block;image-rendering:auto;margin:auto;max-height:calc(100vh - 190px);max-width:100%;touch-action:manipulation}.preview-panel{align-items:center;display:flex;flex-direction:column;gap:14px;margin:auto;max-width:100%;padding:12px;width:100%}.preview-panel img{background:#fff;border:1px solid rgba(36,38,43,.14);border-radius:6px;display:block;max-height:min(54vh,560px);max-width:100%;object-fit:contain}.preview-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%}.preview-actions .secondary{background:#fff;border:1px solid rgba(36,38,43,.18);color:#24262b}.empty-state{align-items:center;color:#4c5058;display:flex;flex-direction:column;gap:8px;max-width:360px;padding:24px;text-align:center}.empty-state strong{color:#24262b;font-size:1.25rem}.processing{align-items:center;background:#ffffffd6;display:flex;font-weight:800;top:0;right:0;bottom:0;left:0;justify-content:center;position:absolute}.control-strip{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.control-strip .secondary{background:#fff;border:1px solid rgba(36,38,43,.18);color:#24262b}.error-banner{background:#fff4f2;border:1px solid rgba(169,45,36,.28);border-radius:8px;color:#8d251e;font-weight:700;line-height:1.4;margin:14px 0 0;padding:12px 14px}.segmented{background:#24262b14;border-radius:8px;display:inline-flex;gap:4px;padding:4px}.segmented button{background:transparent;color:#24262b;min-height:40px}.segmented button.active{background:#fff}.style-strip{background:#fff;border:1px solid rgba(36,38,43,.12);border-radius:8px;display:grid;gap:6px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px;padding:6px}.style-strip button{background:transparent;color:#24262b;min-height:40px;padding:0 8px}.style-strip button.active{background:#16706f;color:#fff}.complete-banner{align-items:center;background:#fff;border:1px solid rgba(22,112,111,.24);border-radius:8px;color:#24262b;display:grid;gap:8px;justify-items:center;margin-top:14px;overflow:hidden;padding:16px;position:relative;text-align:center}.complete-banner strong{color:#16706f;font-size:1.25rem}.complete-banner button{background:#16706f;margin-top:4px}.complete-banner .secondary{background:#fff;border:1px solid rgba(36,38,43,.16);color:#24262b}.compare-panel{background:#fff;border:1px solid rgba(36,38,43,.12);border-radius:8px;display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px;padding:14px}.compare-panel h2{margin-bottom:8px}.compare-panel img{aspect-ratio:1;background:#f7f2e8;border:1px solid rgba(36,38,43,.12);border-radius:6px;display:block;object-fit:contain;width:100%}.compare-actions{display:flex;flex-wrap:wrap;gap:10px;grid-column:1 / -1;justify-self:center}.compare-actions .secondary{background:#fff;border:1px solid rgba(36,38,43,.16);color:#24262b}.confetti{top:0;right:0;bottom:0;left:0;pointer-events:none;position:absolute}.confetti span{animation:confetti-fall 1.3s ease-out infinite;background:#f6c85f;border-radius:2px;height:12px;left:12%;position:absolute;top:-16px;transform:rotate(20deg);width:7px}.confetti span:nth-child(2){animation-delay:.15s;background:#e95f76;left:28%}.confetti span:nth-child(3){animation-delay:.3s;background:#5ca8d6;left:44%}.confetti span:nth-child(4){animation-delay:.45s;background:#16706f;left:60%}.confetti span:nth-child(5){animation-delay:.6s;background:#c18f5b;left:76%}.confetti span:nth-child(6){animation-delay:.75s;background:#62666f;left:90%}@keyframes confetti-fall{0%{opacity:0;transform:translateY(0) rotate(0)}15%{opacity:1}to{opacity:0;transform:translateY(115px) rotate(220deg)}}.side-panel{display:flex;flex-direction:column;gap:24px;padding-top:14px}.palette-grid{display:grid;gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}.swatch{align-items:center;background:#fff;border:1px solid rgba(36,38,43,.1);border-radius:8px;color:#24262b;display:flex;gap:8px;justify-content:flex-start;min-height:44px;padding:6px}.swatch.selected{border-color:#16706f;box-shadow:0 0 0 2px #16706f2e}.swatch span{border:1px solid rgba(36,38,43,.18);border-radius:5px;display:block;height:28px;width:28px}.saved-list{display:grid;gap:8px}.saved-list button{align-items:center;background:#fff;border:1px solid rgba(36,38,43,.1);color:#24262b;display:grid;gap:10px;grid-template-columns:52px 1fr;justify-items:start;min-height:60px;padding:6px;text-align:left}.saved-list img{aspect-ratio:1;border-radius:6px;height:52px;object-fit:cover;width:52px}.muted,.status,.hint{color:#62666f;line-height:1.45;margin:0}.hint{margin-top:10px}.palette-clear{background:#fff;border:1px solid rgba(36,38,43,.16);color:#24262b;margin-top:12px;width:100%}.status{border-top:1px solid rgba(36,38,43,.1);padding-top:16px}@media(max-width:860px){.app-shell{display:block;padding:16px}.top-bar{align-items:flex-start;flex-direction:column}.photo-button{justify-content:center;width:100%}.canvas-panel{min-height:54vh}.puzzle-canvas{max-height:58vh}.preview-panel img{max-height:38vh}.control-strip>button,.segmented{width:100%}.segmented{display:grid;grid-template-columns:repeat(3,1fr)}.segmented button{padding:0 8px}.style-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.compare-panel{grid-template-columns:1fr}.preview-actions button{flex:1 1 120px}.compare-actions button{flex:1 1 140px}.side-panel{padding-top:24px}}