.grid-aspect{display:grid;gap:8px;margin:0 0 16px;font-size:13px;font-weight:600;color:#424245}
.grid-aspect select{width:100%;min-height:44px;padding:10px 12px;border:1px solid #d2d2d7;border-radius:12px;background:#fff;color:#424245;font:inherit}
.png-import-entry{display:grid;gap:8px;margin:12px 0 20px}
.png-import-entry>button{min-height:44px;padding:11px 14px;border:1px solid #c994a8;border-radius:12px;background:#fff;color:#a7355d;font:600 13px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial;cursor:pointer}
.png-import-entry .small{margin:0;font-size:11px;line-height:1.55}
.png-import-entry>button:disabled{opacity:.5;cursor:wait}
.color-pick-hint{display:block;font:600 11px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial;color:#963655;padding:6px 10px;border-radius:10px;background:#fff0f6;text-align:center}
.assist-page #brush-options #tool-eyedropper,.conversion-editor-page .conversion-palette #editor-eyedropper{width:44px;height:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid #e9c5d3;border-radius:11px;background:#fff8fb;color:#a7355d;padding:8px}
.assist-page #brush-options #tool-eyedropper svg,.conversion-editor-page #editor-eyedropper svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}
.dropper-bulb{fill:currentColor;stroke-width:1}
.dropper-drop{fill:currentColor;stroke-width:.8}
.assist-page #brush-options #tool-eyedropper[aria-pressed=true],.conversion-editor-page .conversion-palette #editor-eyedropper[aria-pressed=true]{background:#a7355d;color:#fff;border-color:#a7355d;box-shadow:0 0 0 2px #f7d3e1}
.assist-pattern-hitarea[data-tool=eyedropper]{cursor:crosshair}
#brush-options{position:relative}
#brush-options>.color-pick-hint{width:100%;flex-basis:100%;margin-bottom:6px}
.conversion-editor-page .conversion-settings summary{padding:5px 10px}
body[data-pattern-source=png] #generate{background:#f5f5f7;color:#646469}
body[data-pattern-source=png] .grid-aspect{opacity:.65}
@media(max-width:600px){.grid-aspect{font-size:12px}.color-pick-hint{font-size:10px}}
@media(max-width:600px){.assist-inspector .assist-brush-palette>summary>span:first-child{visibility:hidden}}
.grid-aspect[hidden]{display:none!important}
#crop-dialog .crop-modal{max-height:calc(100dvh - 24px);overflow:auto}
#crop-dialog #crop-stage{position:relative;height:clamp(240px,52dvh,540px);margin:14px 0 10px;background:#f5f5f7;cursor:move;touch-action:none}
#crop-dialog .crop-image-ratios{position:absolute;z-index:1;top:12px;left:50%;transform:translateX(-50%);display:flex;gap:4px;padding:4px;background:rgba(255,255,255,.96);border:1px solid #e4e4e9;border-radius:14px;box-shadow:0 3px 14px rgba(0,0,0,.08);white-space:nowrap}
#crop-dialog .crop-image-ratios button{min-height:36px;min-width:54px;border:0;border-radius:10px;padding:7px 12px;background:transparent;color:#424245;font:600 13px -apple-system,BlinkMacSystemFont,"Segoe UI",Arial;cursor:pointer}
#crop-dialog .crop-image-ratios button[aria-pressed=true]{background:#ae4265;color:#fff}
#crop-dialog .crop-image-ratios button:focus-visible{outline:2px solid #0071e3;outline-offset:2px}
#crop-dialog .crop-footer-note{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;color:#6e6e73;font-size:12px}
#crop-dialog .crop-footer-note button{padding:7px 10px;border:1px solid #edd1dc;border-radius:9px;background:#fff;color:#963655;font:inherit;cursor:pointer}
#crop-dialog .crop-footer-note button[hidden]{display:none}
#crop-dialog .crop-controls #crop-reset{white-space:nowrap;min-width:64px}
@media(max-width:760px){#crop-dialog{height:fit-content;min-height:0;max-height:100dvh;border-radius:20px;width:calc(100vw - 16px)}#crop-dialog .crop-modal{padding:14px;max-height:calc(100dvh - 16px)}#crop-dialog .crop-modal-head h2{font-size:25px}#crop-dialog .crop-modal-head p:not(.eyebrow){font-size:13px}#crop-dialog #crop-stage{height:clamp(240px,48dvh,460px);border-radius:16px}#crop-dialog .crop-controls{display:flex;gap:6px;flex-wrap:wrap}#crop-dialog .crop-controls button{padding:10px 12px}#crop-dialog .crop-controls .primary{flex:1;min-width:130px}#crop-dialog .crop-image-ratios button{min-width:48px;padding:7px 10px;font-size:12px}#crop-dialog .crop-footer-note{font-size:11px}}
@media(max-height:480px){#crop-dialog .crop-modal-head .eyebrow{display:none}#crop-dialog .crop-modal-head h2{font-size:22px}#crop-dialog #crop-stage{height:240px}}
