.tool-detail-main:has(.blur-image-app) > .tool-detail-heading {
    grid-template-columns: 52px minmax(0, 1fr) auto !important;
}

.blur-heading-actions { display: flex; align-items: center; gap: 8px; }
.blur-heading-actions :is(a, button) {
    display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 7px;
    padding: 8px 12px; border: 1px solid #d9e0ed; border-radius: 10px;
    color: #17213a; background: #fff; font-weight: 700; text-decoration: none; cursor: pointer;
}
.blur-heading-actions :is(a, button):hover { border-color: #a995ff; color: #5331ef; }
.blur-heading-actions svg, .blur-image-app svg {
    width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8;
    stroke-linecap: round; stroke-linejoin: round;
}

.blur-image-app {
    --blur-ink: #10182f; --blur-copy: #5c6981; --blur-purple: #5936f5; --blur-border: #d8e0ed;
    color: var(--blur-ink);
}
.blur-status { margin: 0 0 8px !important; color: var(--blur-copy); text-align: center; }

.blur-dropzone {
    display: flex; min-height: 190px; align-items: center; justify-content: center; flex-direction: column; gap: 6px;
    padding: 18px; border: 1.5px dashed #9278ff; border-radius: 12px; background: #fcfbff;
    text-align: center; cursor: pointer; transition: border-color .2s, background .2s, transform .2s;
}
.blur-dropzone:hover, .blur-dropzone.is-dragging { border-color: #4e2af1; background: #f7f4ff; transform: translateY(-1px); }
.blur-upload-icon { display: grid; width: 46px; height: 46px; place-items: center; color: var(--blur-purple); }
.blur-upload-icon svg { width: 38px; height: 38px; }
.blur-dropzone > strong { font-size: .92rem; }
.blur-dropzone > span:not(.blur-upload-icon) { color: #78849a; }
.blur-dropzone > b {
    display: inline-flex; min-width: 180px; min-height: 42px; align-items: center; justify-content: center; gap: 8px;
    margin: 2px 0; padding: 8px 15px; border-radius: 9px; color: #fff;
    background: linear-gradient(135deg, #4d27ed, #6840ff); box-shadow: 0 9px 20px rgba(83, 48, 238, .2);
}
.blur-dropzone > b i { margin-left: auto; font-style: normal; }
.blur-dropzone small { color: var(--blur-copy); }

.blur-file {
    display: grid; grid-template-columns: 52px minmax(0, 1fr) auto auto; align-items: center; gap: 10px;
    margin-top: 10px; padding: 8px 10px; border: 1px solid var(--blur-border); border-radius: 11px; background: #fff;
}
.blur-file[hidden], .blur-workspace[hidden], .blur-selection-controls[hidden] { display: none; }
.blur-file img { width: 52px; height: 46px; border-radius: 7px; object-fit: cover; }
.blur-file p, .blur-file :is(strong, small) {
    display: block; min-width: 0; margin: 0 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.blur-file small { color: var(--blur-copy); }
.blur-file button {
    min-height: 36px; padding: 7px 12px; border: 1px solid var(--blur-border); border-radius: 8px;
    color: #243049; background: #fff; font-weight: 700; cursor: pointer;
}
.blur-file button:hover { border-color: #9c87fa; color: var(--blur-purple); }
.blur-file button:last-child { display: grid; width: 36px; padding: 0; place-items: center; color: #e63c54; }

.blur-workspace { display: grid; gap: 12px; margin-top: 12px; }
.blur-settings { padding: 12px; border: 1px solid var(--blur-border); border-radius: 12px; background: #fff; }
.blur-settings > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.blur-settings > header :is(h2, p) { margin: 0 !important; }
.blur-settings > header p, .blur-settings > header > span { color: var(--blur-copy); }
.blur-settings-grid { display: grid; grid-template-columns: 1fr 1.25fr 1.35fr auto; align-items: end; gap: 12px; }
.blur-settings-grid > label, .blur-intensity-control { display: grid; gap: 5px; color: #26314a; font-weight: 700; }
.blur-settings select, .blur-export-bar select {
    width: 100%; min-height: 40px; padding: 7px 10px; border: 1px solid var(--blur-border); border-radius: 8px;
    color: var(--blur-ink); background: #fff;
}
.blur-range-label { display: flex; align-items: center; justify-content: space-between; }
.blur-range-label output { padding: 3px 7px; border-radius: 6px; color: var(--blur-purple); background: #f0ecff; font-weight: 800; }
.blur-intensity-control input, .blur-selection-controls input { width: 100%; accent-color: var(--blur-purple); }
.blur-range-scale { display: flex; justify-content: space-between; margin-top: -5px; color: var(--blur-copy); font-size: .68rem; }
.blur-scope { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 0; padding: 0; border: 0; }
.blur-scope legend { margin-bottom: 5px; color: #26314a; font-weight: 700; }
.blur-scope button {
    display: flex; min-height: 40px; align-items: center; justify-content: center; gap: 6px; padding: 7px 9px;
    border: 1px solid var(--blur-border); border-radius: 8px; color: #34405a; background: #fff; font-weight: 700; cursor: pointer;
}
.blur-scope button.is-active { border-color: #7656ff; color: var(--blur-purple); background: #f8f6ff; box-shadow: inset 0 0 0 1px #7656ff; }
.blur-apply, .blur-export-bar button {
    display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 8px 14px;
    border: 0; border-radius: 8px; color: #fff; background: linear-gradient(135deg, #4b24ed, #673cff);
    box-shadow: 0 7px 16px rgba(82, 47, 239, .18); font-weight: 800; cursor: pointer;
}
.blur-selection-controls {
    display: flex; align-items: center; gap: 9px; margin-top: 10px; padding: 9px 11px;
    border: 1px solid #e1dcff; border-radius: 9px; color: var(--blur-purple); background: #f8f6ff;
}
.blur-selection-controls > svg { width: 24px; height: 24px; flex: 0 0 24px; }
.blur-selection-controls p, .blur-selection-controls :is(strong, span) { display: block; margin: 0 !important; }
.blur-selection-controls span { margin-top: 2px !important; color: var(--blur-copy); }

.blur-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.blur-comparison article { min-width: 0; padding: 11px; border: 1px solid var(--blur-border); border-radius: 12px; background: #fff; }
.blur-comparison article > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.blur-comparison article > header h2 { margin: 0 !important; }
.blur-comparison article > header span { color: var(--blur-copy); }
.blur-comparison article > header em { padding: 4px 8px; border-radius: 999px; color: #048543; background: #e8faef; font-size: .68rem; font-style: normal; font-weight: 800; }
.blur-before-panel > div, .blur-result-frame {
    position: relative; display: grid; width: 100%; aspect-ratio: var(--blur-aspect, 4 / 3); place-items: center; overflow: hidden; border-radius: 9px;
    background-color: #111d32;
    background-image: radial-gradient(circle at 50% 40%, rgba(255,255,255,.08), transparent 55%);
}
.blur-comparison :is(img, canvas) { display: block; width: 100%; height: 100%; object-fit: cover; }
.blur-result-frame.is-selecting { cursor: crosshair; touch-action: none; }
.blur-result-frame i {
    position: absolute; z-index: 3; border: 2px dashed #fff; border-radius: 3px;
    box-shadow: 0 0 0 1px #5936f5, 0 0 0 9999px rgba(16, 24, 47, .12); cursor: move; touch-action: none;
}
.blur-result-frame i > span {
    position: absolute; width: 12px; height: 12px; border: 2px solid #5936f5; border-radius: 3px; background: #fff;
}
.blur-result-frame i > span[data-blur-handle="nw"] { top: -7px; left: -7px; cursor: nwse-resize; }
.blur-result-frame i > span[data-blur-handle="ne"] { top: -7px; right: -7px; cursor: nesw-resize; }
.blur-result-frame i > span[data-blur-handle="sw"] { bottom: -7px; left: -7px; cursor: nesw-resize; }
.blur-result-frame i > span[data-blur-handle="se"] { right: -7px; bottom: -7px; cursor: nwse-resize; }

.blur-export-bar {
    display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 14px;
    padding: 9px 11px; border: 1px solid var(--blur-border); border-radius: 11px; background: #fff;
}
.blur-export-bar > p { margin: 0 !important; color: var(--blur-copy); }
.blur-export-bar > div { display: flex; align-items: end; gap: 9px; }
.blur-export-bar label { display: grid; min-width: 150px; gap: 4px; color: #26314a; font-weight: 700; }
.blur-export-bar button { min-width: 180px; }
.blur-export-bar button:disabled { cursor: not-allowed; opacity: .45; box-shadow: none; }

.blur-information { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.blur-information article { min-width: 0; padding: 14px; border: 1px solid var(--blur-border); border-radius: 12px; background: #fff; }
.blur-information article.is-green { border-color: #cfe8da; background: #f7fdf9; }
.blur-information article.is-blue { background: #f7faff; }
.blur-information article.is-warm { border-color: #eedfc7; background: #fffbf5; }
.blur-information h2 { margin: 0 0 8px !important; }
.blur-information :is(p, li) { margin-top: 0 !important; color: #53617a; }
.blur-information ol { display: grid; gap: 5px; margin: 0; padding-left: 20px; }
.blur-information strong { display: block; padding: 6px; border-radius: 7px; color: #008840; background: #e8f8ef; text-align: center; }
.blur-information dl { display: grid; gap: 6px; margin: 0; }
.blur-information dl div { display: flex; justify-content: space-between; gap: 8px; }
.blur-information :is(dt, dd) { margin: 0; }
.blur-information dt { color: #66738a; }
.blur-information dd { max-width: 62%; overflow: hidden; color: #1d2942; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 1050px) {
    .blur-settings-grid { grid-template-columns: 1fr 1fr; }
    .blur-information { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .tool-detail-main:has(.blur-image-app) > .tool-detail-heading { grid-template-columns: 52px minmax(0, 1fr) !important; }
    .blur-heading-actions { grid-column: 1 / -1; justify-content: flex-end; }
    .blur-comparison { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .blur-dropzone { min-height: 165px; }
    .blur-file { grid-template-columns: 46px minmax(0, 1fr) auto; }
    .blur-file button:nth-last-child(2) { display: none; }
    .blur-settings > header { flex-direction: column; }
    .blur-settings-grid, .blur-selection-controls, .blur-information { grid-template-columns: 1fr; }
    .blur-export-bar, .blur-export-bar > div { align-items: stretch; flex-direction: column; }
    .blur-export-bar button { width: 100%; }
}