:root{color:#171717;background:#f6f7f9;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.appShell{background:radial-gradient(circle at 20% 0,#fffffff2,#0000 34%),linear-gradient(135deg,#f7f8fb 0%,#e9edf3 48%,#f8f3ec 100%);grid-template-rows:auto 1fr;gap:22px;min-height:100vh;padding:28px;display:grid}.topBar{justify-content:space-between;align-items:center;gap:16px;width:min(1180px,100%);margin:0 auto;display:flex}.topBar.compact h1{font-size:clamp(2rem,5vw,3.7rem)}.eyebrow{color:#6d737c;letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;font-size:.74rem;font-weight:800}h1{letter-spacing:0;margin:0;font-size:clamp(3.1rem,11vw,8rem);line-height:.88}.landing{place-items:center;width:min(1180px,100%);min-height:64vh;margin:0 auto;display:grid}.dropPanel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffb8;border:1px solid #1717171a;border-radius:8px;align-content:center;place-items:center;gap:28px;width:min(700px,100%);min-height:430px;padding:34px;display:grid;box-shadow:0 28px 80px #39435429}.sparkIcon{color:#0f7bff;filter:drop-shadow(0 12px 28px #0f7bff3d)}.dropTitle{letter-spacing:0;margin:0;font-size:clamp(2.2rem,8vw,4.9rem);font-weight:850}.primaryActions,.actionRow{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.primaryButton,.secondaryButton,.ghostButton,.nudgeGrid button,.segmented button{min-height:44px;color:inherit;cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;gap:9px;padding:0 16px;text-decoration:none;transition:transform .16s,background .16s,box-shadow .16s;display:inline-flex}.primaryButton{color:#fff;background:#0f7bff;box-shadow:0 12px 26px #0f7bff42}.secondaryButton,.ghostButton,.nudgeGrid button,.segmented button{background:#ffffffd1;box-shadow:inset 0 0 0 1px #17171717}.primaryButton:hover,.secondaryButton:hover,.ghostButton:hover,.nudgeGrid button:hover,.segmented button:hover{transform:translateY(-1px)}.primaryButton.disabled,.secondaryButton:disabled{opacity:.45;pointer-events:none}.hiddenInput{display:none}.studio,.cropStudio{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:18px;width:min(1180px,100%);margin:0 auto;display:grid}.previewStage,.cropPreview,.controls{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffc2;border:1px solid #1717171a;border-radius:8px;box-shadow:0 24px 70px #39435424}.previewStage{min-height:660px;padding:18px;position:relative}.cropPreview{place-items:center;min-height:660px;padding:18px;display:grid}.cropFrame{aspect-ratio:1;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:#101318;border-radius:8px;width:min(620px,100%);position:relative;overflow:hidden;box-shadow:inset 0 0 0 2px #ffffffe6}.cropFrame img{object-fit:cover;transform-origin:50%;will-change:transform;touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.cropFrame:active{cursor:grabbing}.dragHint{z-index:8;color:#29313b;pointer-events:none;background:#ffffffe0;border-radius:8px;justify-content:center;align-items:center;min-height:34px;padding:0 12px;font-size:.86rem;font-weight:780;display:inline-flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.selectionShade{z-index:2;pointer-events:none;border-radius:8px;position:absolute;box-shadow:0 0 0 999px #05080c7a}.selectionBox{z-index:5;cursor:move;touch-action:none;background:linear-gradient(90deg,#0000 33.333%,#ffffffad 33.333% calc(33.333% + 1px),#0000 calc(33.333% + 1px)),linear-gradient(90deg,#0000 66.666%,#ffffffad 66.666% calc(66.666% + 1px),#0000 calc(66.666% + 1px)),linear-gradient(0deg,#0000 33.333%,#ffffffad 33.333% calc(33.333% + 1px),#0000 calc(33.333% + 1px)),linear-gradient(0deg,#0000 66.666%,#ffffffad 66.666% calc(66.666% + 1px),#0000 calc(66.666% + 1px));border:2px solid #fff;border-radius:8px;position:absolute;box-shadow:0 0 0 1px #0f7bfff2,0 14px 32px #00000038}.selectionBox.inactive{pointer-events:none}.resizeHandle{touch-action:none;background:#fff;border:2px solid #0f7bff;border-radius:50%;width:18px;height:18px;position:absolute;box-shadow:0 4px 12px #00000038}.resizeHandle.top-left{cursor:nwse-resize;top:-10px;left:-10px}.resizeHandle.top{cursor:ns-resize;top:-10px;left:50%;transform:translate(-50%)}.resizeHandle.top-right{cursor:nesw-resize;top:-10px;right:-10px}.resizeHandle.right{cursor:ew-resize;top:50%;right:-10px;transform:translateY(-50%)}.resizeHandle.bottom-right{cursor:nwse-resize;bottom:-10px;right:-10px}.resizeHandle.bottom{cursor:ns-resize;bottom:-10px;left:50%;transform:translate(-50%)}.resizeHandle.bottom-left{cursor:nesw-resize;bottom:-10px;left:-10px}.resizeHandle.left{cursor:ew-resize;top:50%;left:-10px;transform:translateY(-50%)}.eraseCanvas{z-index:4;pointer-events:none;touch-action:none;width:100%;height:100%;position:absolute;inset:0}.eraseCanvas.active{z-index:6;cursor:crosshair;pointer-events:auto}.cropMask{pointer-events:none;background:linear-gradient(#ffffffb8,#ffffffb8) 0 0/100% 1px no-repeat,linear-gradient(#ffffffb8,#ffffffb8) 0/100% 1px no-repeat,linear-gradient(#ffffffb8,#ffffffb8) 0 100%/100% 1px no-repeat,linear-gradient(90deg,#ffffffb8,#ffffffb8) 0 0/1px 100% no-repeat,linear-gradient(90deg,#ffffffb8,#ffffffb8) 50% 0/1px 100% no-repeat,linear-gradient(90deg,#ffffffb8,#ffffffb8) 100% 0/1px 100% no-repeat;position:absolute;inset:0}.compare,.emptyPreview{background-color:#f9fafb;background-image:linear-gradient(45deg,#dde1e7 25%,#0000 25%),linear-gradient(-45deg,#dde1e7 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#dde1e7 75%),linear-gradient(-45deg,#0000 75%,#dde1e7 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px;border-radius:8px;width:100%;min-height:624px;overflow:hidden}.compare img{object-fit:contain;background:0 0}.emptyPreview{color:#64707d;place-items:center;display:grid}.processing{z-index:3;background:#ffffffeb;border-radius:8px;align-items:center;gap:10px;min-height:42px;padding:0 14px;display:inline-flex;position:absolute;top:30px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #3943542e}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.controls{gap:18px;padding:18px;display:grid}.stepCopy{color:#59616c;margin:0;font-size:.95rem;line-height:1.45}.controlGroup{gap:9px;display:grid}.controlGroup>span{color:#59616c;font-size:.84rem;font-weight:760}select,input[type=range]{width:100%}select{background:#fff;border:1px solid #1717171a;border-radius:8px;height:44px;padding:0 12px}input[type=range]{accent-color:#0f7bff}.inlineControl,.sliderLine{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.sliderLine strong{color:#424a55;text-align:right;min-width:44px;font-size:.86rem}.colorInput{background:0 0;border:0;border-radius:8px;width:44px;height:36px;padding:0}.toggle{cursor:pointer;background:#d6dbe2;border:0;border-radius:999px;justify-content:flex-start;width:56px;height:32px;padding:3px}.toggle span{background:#fff;border-radius:50%;width:26px;height:26px;transition:transform .16s;box-shadow:0 3px 8px #0000002e}.toggle.on{background:#0f7bff}.toggle.on span{transform:translate(24px)}.segmented,.nudgeGrid{gap:8px;display:grid}.segmented{grid-template-columns:repeat(2,minmax(0,1fr))}.segmented button.active{color:#fff;background:#171717}.nudgeGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.nudgeGrid button{padding:0 10px;font-size:.9rem}.error{color:#b00020;background:#fff0f0;border-radius:8px;margin:0;padding:12px;font-weight:740}.advancedPanel{background:#ffffffd1;border-radius:8px;box-shadow:inset 0 0 0 1px #17171714}.advancedPanel summary{cursor:pointer;color:#424a55;justify-content:space-between;align-items:center;gap:12px;min-height:44px;padding:0 14px;font-size:.92rem;font-weight:760;list-style:none;display:flex}.advancedPanel summary::-webkit-details-marker{display:none}.advancedPanel[open] summary svg{transform:rotate(180deg)}.advancedPanel summary svg{transition:transform .16s}.advancedBody{gap:16px;padding:0 14px 14px;display:grid}@media (width<=920px){.appShell{padding:18px}.studio,.cropStudio{grid-template-columns:1fr}.previewStage,.cropPreview,.compare,.emptyPreview{min-height:460px}}@media (width<=620px){.topBar{flex-direction:column;align-items:flex-start}.dropPanel{min-height:380px;padding:22px}.primaryActions,.actionRow{width:100%}.primaryButton,.secondaryButton{flex:160px}}