@keyframes marching-ants{0%{background-position:0 0,0 100%,0 0,100% 0}to{background-position:20px 0,-20px 100%,0 -20px,100% 20px}}:root{--rc-drag-handle-size:12px;--rc-drag-handle-mobile-size:24px;--rc-drag-handle-bg-colour:#0003;--rc-drag-bar-size:6px;--rc-border-color:#ffffffb3;--rc-focus-color:#08f}.ReactCrop{cursor:crosshair;max-width:100%;display:inline-block;position:relative}.ReactCrop *,.ReactCrop :before,.ReactCrop :after{box-sizing:border-box}.ReactCrop--disabled,.ReactCrop--locked{cursor:inherit}.ReactCrop__child-wrapper{max-height:inherit;overflow:hidden}.ReactCrop__child-wrapper>img,.ReactCrop__child-wrapper>video{max-width:100%;max-height:inherit;display:block}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection{touch-action:none}.ReactCrop__crop-mask{pointer-events:none;width:calc(100% + .5px);height:calc(100% + .5px);position:absolute;top:0;right:0;bottom:0;left:0}.ReactCrop__crop-selection{cursor:move;position:absolute;top:0;left:0;transform:translate(0)}.ReactCrop--disabled .ReactCrop__crop-selection{cursor:inherit}.ReactCrop--circular-crop .ReactCrop__crop-selection{border-radius:50%}.ReactCrop--circular-crop .ReactCrop__crop-selection:after{pointer-events:none;content:"";border:1px solid var(--rc-border-color);opacity:.3;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px}.ReactCrop--no-animate .ReactCrop__crop-selection{outline:1px dashed #fff}.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection){color:#fff;background-image:linear-gradient(90deg,#fff 50%,#444 50%),linear-gradient(90deg,#fff 50%,#444 50%),linear-gradient(#fff 50%,#444 50%),linear-gradient(#fff 50%,#444 50%);background-position:0 0,0 100%,0 0,100% 0;background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;background-size:10px 1px,10px 1px,1px 10px,1px 10px;animation:1s linear infinite marching-ants}.ReactCrop__crop-selection:focus{outline:2px solid var(--rc-focus-color);outline-offset:-1px}.ReactCrop--invisible-crop .ReactCrop__crop-mask,.ReactCrop--invisible-crop .ReactCrop__crop-selection{display:none}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after,.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{content:"";background-color:#fff6;display:block;position:absolute}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after{width:1px;height:100%}.ReactCrop__rule-of-thirds-vt:before{left:33.3333%}.ReactCrop__rule-of-thirds-vt:after{left:66.6667%}.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{width:100%;height:1px}.ReactCrop__rule-of-thirds-hz:before{top:33.3333%}.ReactCrop__rule-of-thirds-hz:after{top:66.6667%}.ReactCrop__drag-handle{width:var(--rc-drag-handle-size);height:var(--rc-drag-handle-size);background-color:var(--rc-drag-handle-bg-colour);border:1px solid var(--rc-border-color);position:absolute}.ReactCrop__drag-handle:focus{background:var(--rc-focus-color)}.ReactCrop .ord-nw{cursor:nw-resize;top:0;left:0;transform:translate(-50%,-50%)}.ReactCrop .ord-n{cursor:n-resize;top:0;left:50%;transform:translate(-50%,-50%)}.ReactCrop .ord-ne{cursor:ne-resize;top:0;right:0;transform:translate(50%,-50%)}.ReactCrop .ord-e{cursor:e-resize;top:50%;right:0;transform:translate(50%,-50%)}.ReactCrop .ord-se{cursor:se-resize;bottom:0;right:0;transform:translate(50%,50%)}.ReactCrop .ord-s{cursor:s-resize;bottom:0;left:50%;transform:translate(-50%,50%)}.ReactCrop .ord-sw{cursor:sw-resize;bottom:0;left:0;transform:translate(-50%,50%)}.ReactCrop .ord-w{cursor:w-resize;top:50%;left:0;transform:translate(-50%,-50%)}.ReactCrop__disabled .ReactCrop__drag-handle{cursor:inherit}.ReactCrop__drag-bar{position:absolute}.ReactCrop__drag-bar.ord-n{width:100%;height:var(--rc-drag-bar-size);top:0;left:0;transform:translateY(-50%)}.ReactCrop__drag-bar.ord-e{width:var(--rc-drag-bar-size);height:100%;top:0;right:0;transform:translate(50%)}.ReactCrop__drag-bar.ord-s{width:100%;height:var(--rc-drag-bar-size);bottom:0;left:0;transform:translateY(50%)}.ReactCrop__drag-bar.ord-w{width:var(--rc-drag-bar-size);height:100%;top:0;left:0;transform:translate(-50%)}.ReactCrop--new-crop .ReactCrop__drag-bar,.ReactCrop--new-crop .ReactCrop__drag-handle,.ReactCrop--fixed-aspect .ReactCrop__drag-bar,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w{display:none}@media(pointer:coarse){.ReactCrop .ord-n,.ReactCrop .ord-e,.ReactCrop .ord-s,.ReactCrop .ord-w{display:none}.ReactCrop__drag-handle{width:var(--rc-drag-handle-mobile-size);height:var(--rc-drag-handle-mobile-size)}}:root{color-scheme:dark;--bg: #161310;--bg-elev: #211c18;--bg-panel: #1c1814;--line: #3a322b;--line-strong: #5a4c40;--ink: #f3ece4;--muted: #b6a89a;--copper: #d4783a;--copper-deep: #a35422;--sage: #8fbfa8;--danger: #e07a6a;--shadow: 0 18px 40px rgba(0, 0, 0, .35);--font-display: "Syne", "Avenir Next", sans-serif;--font-body: "Figtree", "Segoe UI", sans-serif;--radius: 6px}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--ink);font-family:var(--font-body);background:radial-gradient(1200px 500px at 10% -10%,rgba(212,120,58,.12),transparent 55%),linear-gradient(180deg,#1b1612 0%,var(--bg) 40%);background-color:var(--bg)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(rgba(243,236,228,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(243,236,228,.03) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 80%);mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 80%)}button,input,select{font:inherit;color:inherit}button{cursor:pointer}.app{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:28px 20px 64px}.site-header{display:grid;gap:12px;margin-bottom:28px}.site-header-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.brand{display:flex;gap:14px;align-items:center}.brand-mark{width:44px;height:44px;border:1px solid var(--line-strong);background:conic-gradient(from 90deg,var(--copper) 0 90deg,#eadcc8 0 180deg,var(--sage) 0 270deg,#3d3530 0);box-shadow:var(--shadow)}.brand-kicker{margin:0;color:var(--copper);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}.brand-title{display:flex;align-items:baseline;gap:10px}.site-header h1{margin:0;font-family:var(--font-display);font-size:2.4rem;letter-spacing:-.03em;line-height:1}.brand-version{color:var(--copper);font-variant-numeric:tabular-nums;font-size:.85rem;letter-spacing:.04em}.brand-tag{margin:0;max-width:46rem;color:var(--muted)}.app-main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.9fr);gap:20px;align-items:start}.workspace{display:flex;flex-direction:column;gap:20px;min-width:0}.stage,.controls,.results{background:color-mix(in srgb,var(--bg-panel) 88%,black);border:1px solid var(--line);box-shadow:var(--shadow)}.stage{padding:12px 16px 16px;display:flex;flex-direction:column;gap:12px}.controls{display:flex;flex-direction:column;gap:0}.panel,.result-preview,.export-panel{padding:18px 18px 20px}.controls .panel+.panel{border-top:1px solid var(--line)}.panel-head{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}.panel-head h2,.export-panel h3,.bom h3{margin:0;font-family:var(--font-display);font-size:1.15rem}.step{color:var(--copper);font-family:var(--font-display);font-weight:800;font-size:.85rem;letter-spacing:.08em}.panel-help,.muted{color:var(--muted);font-size:.92rem}.file-name{margin:10px 0 0;word-break:break-all}.file-name-inline{max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;color:var(--muted)}.stage-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}.stage-tool{display:flex;align-items:center;gap:8px;min-width:0}.stage-dim{display:flex;align-items:center;gap:6px;font-size:.8rem;color:var(--muted)}.stage-dim input{width:4.6rem}.stage-toolbar .dim-times{padding-bottom:0}.stage-grid-toggle{margin-left:auto}.dim-row{display:flex;align-items:end;gap:10px}.dim-row label,.option-set label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted)}.dim-times{padding-bottom:10px;color:var(--copper);font-size:1.2rem}input[type=number],input[type=text],input:not([type]),select,.hex-input{background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--radius);padding:8px 10px;min-width:0}.dim-row input{width:100%}.btn{border:1px solid transparent;border-radius:var(--radius);padding:10px 14px;font-weight:600}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--copper);color:#1a1612}.btn-primary:hover:not(:disabled){background:#e08a4d}.btn-secondary{background:transparent;border-color:var(--line-strong)}.btn-secondary:hover:not(:disabled){border-color:var(--copper);color:var(--copper)}.crop-empty{min-height:420px;display:grid;place-content:center;text-align:center;border:1px dashed var(--line-strong);color:var(--muted)}.toggle{display:flex;align-items:center;gap:8px;color:var(--muted)}.sampling-hint{color:var(--sage);font-size:.88rem;margin:0 0 8px}.crop-stage .ReactCrop{max-width:100%;background:#0e0c0a}.crop-stage img{max-width:100%;display:block}.crop-stage--grid{--grid-cols: 48;--grid-rows: 48}.crop-stage--grid .ReactCrop__crop-selection:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(to right,rgba(243,236,228,.32) 1px,transparent 1px),linear-gradient(to bottom,rgba(243,236,228,.32) 1px,transparent 1px);background-size:calc(100% / var(--grid-cols)) calc(100% / var(--grid-rows));z-index:1}.crop-stage--sampling,.crop-stage--sampling img{cursor:crosshair}.palette-list{display:flex;flex-direction:column;gap:8px;margin:12px 0;max-height:320px;overflow:auto}.palette-list:has(.picker-pop){overflow:visible}.palette-row{display:grid;grid-template-columns:18px 32px minmax(0,1fr) 32px 32px;gap:6px;align-items:center}.palette-name-link{justify-self:start;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0;border:0;background:none;color:var(--copper);text-decoration:underline;text-underline-offset:3px;text-align:left;font:inherit}.palette-name-link:hover{color:#e08a4d}.palette-name-input{width:100%}.palette-row--sampling{outline:1px solid var(--sage);outline-offset:3px}.palette-row.is-drag-over{outline:1px dashed var(--copper);outline-offset:2px}.palette-grip{width:18px;height:32px;display:grid;place-content:center;cursor:grab;-webkit-user-select:none;user-select:none}.palette-grip:active{cursor:grabbing}.palette-grip-dots{display:block;width:8px;height:14px;background-image:radial-gradient(circle,var(--muted) 1.15px,transparent 1.25px);background-size:4px 5px}.palette-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.palette-file-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}.btn-text{background:none;border:0;padding:0;color:var(--muted);font-size:.85rem;text-decoration:underline;text-underline-offset:3px}.btn-text:hover{color:var(--copper)}.swatch-wrap{position:relative}.swatch{width:32px;height:32px;border:1px solid var(--line-strong);border-radius:2px;padding:0}.picker-pop{position:absolute;z-index:20;top:38px;left:0;padding:8px;background:var(--bg-elev);border:1px solid var(--line-strong);box-shadow:var(--shadow);display:grid;gap:8px}.picker-hsv{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.picker-hex,.picker-hsv label{display:flex;flex-direction:column;gap:2px;font-size:.7rem;color:var(--muted)}.palette-name-input,.hex-input,.picker-hsv input{width:100%}.icon-btn{width:32px;height:32px;padding:0;display:grid;place-content:center;background:transparent;border:1px solid var(--line);border-radius:var(--radius);color:var(--muted)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.icon-btn.is-active,.icon-btn:hover:not(:disabled){border-color:var(--sage);color:var(--sage)}.icon-btn.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,var(--line))}.icon-btn.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,transparent)}.option-set{border:0;margin:0 0 14px;padding:0}.option-set legend{padding:0;margin-bottom:8px;color:var(--muted);font-size:.85rem}.option-row{display:flex;align-items:center;gap:6px;margin-bottom:8px}.option-row>label{flex:0 1 auto;margin-bottom:0}.option-set>.option-row:last-child{margin-bottom:0}.option-sub{margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}.option-set label{flex-direction:row;align-items:center;gap:8px;margin-bottom:0}.option-set label.is-disabled{opacity:.45}.option-help{position:relative;flex-shrink:0}.option-help-btn{width:20px;height:20px;padding:0;border-radius:50%;border:1px solid var(--line-strong);background:transparent;color:var(--muted);font-size:.78rem;font-weight:700;font-family:var(--font-body);line-height:1;display:grid;place-content:center}.option-help-btn:hover,.option-help-btn.is-open{border-color:var(--copper);color:var(--copper)}.option-help-pop{position:absolute;z-index:40;left:0;top:calc(100% + 6px);width:min(280px,calc(100vw - 48px));padding:12px 14px;background:var(--bg-elev);border:1px solid var(--line-strong);box-shadow:var(--shadow)}.option-help-pop:before{content:"";position:absolute;left:0;right:0;height:10px;top:-10px}.option-help-pop.is-flip{top:auto;bottom:calc(100% + 6px)}.option-help-pop.is-flip:before{top:auto;bottom:-10px}.option-help-pop h3{margin:0 0 8px;font-family:var(--font-display);font-size:.95rem}.option-help-pop p{margin:0 0 8px;color:var(--muted);font-size:.82rem;line-height:1.45}.option-help-pop p:last-child{margin-bottom:0}.progress{margin-top:12px;color:var(--muted);font-size:.85rem}.progress-bar{height:6px;margin-bottom:6px;background:var(--copper);width:0}.error{color:var(--danger);margin-top:10px}.results{margin-top:0}.result-grid{display:grid;gap:16px}.mosaic-frame{background:#0e0c0a;padding:12px;border:1px solid var(--line)}.mosaic-canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.bom table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:.9rem}.bom th,.bom td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--line)}.bom .num{text-align:right}.bom-swatch{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:middle;border:1px solid var(--line-strong)}.export-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}.export-panel .muted{margin:0}.export-panel.is-idle .btn:disabled{opacity:.55;background:transparent;border-color:var(--line);color:var(--muted);cursor:not-allowed}.settings{position:relative;flex-shrink:0}.settings-btn{width:40px;height:40px;padding:0;display:grid;place-content:center;border:1px solid var(--line-strong);border-radius:var(--radius);background:transparent;color:var(--muted)}.settings-btn:hover,.settings-btn.is-open{border-color:var(--copper);color:var(--copper)}.settings-pop{position:absolute;z-index:40;right:0;top:calc(100% + 8px);width:min(240px,calc(100vw - 40px));padding:12px 14px;background:var(--bg-elev);border:1px solid var(--line-strong);box-shadow:var(--shadow)}.settings-pop h3{margin:0 0 10px;font-family:var(--font-display);font-size:.95rem}.settings-pop a{color:var(--copper)}.settings-pop a:hover{color:#e08a4d}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}@media(max-width:980px){.app-main{grid-template-columns:1fr}.stage-grid-toggle{margin-left:0}}@media(max-width:640px){.site-header h1{font-size:1.8rem}}