/* Crop Desk Design System v1 (CD-DS) – frozen 2026-10-30. Loaded last. See /docs DESIGN.md */
:root{--ds-brand:#0c6b62;--ds-brand-d:#09574f;--ds-brand-s:#e6f3f1;--ds-ink:#0f172a;--ds-muted:#526072;--ds-line:#dce4ed;--ds-bg:#f7f9fc;--ds-r-in:8px;--ds-r-btn:12px;--ds-r-card:16px;
--ds-sh-sm:0 1px 2px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.08);--ds-sh-md:0 8px 24px -10px rgba(15,23,42,.22);
--ds-font:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari",Arial,sans-serif;
--ds-cta:#c2410c;--ds-cta-d:#9a3412;--ds-success:#15803d;--ds-warning:#b45309;--ds-error:#b91c1c;
--cat-photo:#0f766e;--cat-pdf:#be123c;--cat-convert:#4d7c0f;--cat-typing:#4338ca;--cat-career:#1d4ed8;--cat-social:#a21caf;--cat-money:#a16207;--cat-intl:#0369a1;--cat-games:#475569;--cat-ai:#6d28d9}
body{font-family:var(--ds-font)!important}
h1,h2,h3,.brand-name{font-family:var(--ds-font)!important}
/* headings: solid ink, no gradient text */
.home h1,main h1,main h1:first-of-type{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:currentColor!important;color:var(--ds-ink)!important;animation:none!important;letter-spacing:-.01em;line-height:1.2}
main h1{font-size:clamp(1.6rem,1.1rem + 2vw,2.4rem)!important;font-weight:800}
/* tiles: one flat colour per category */
.hc-i,.ci,.hm-card .hc-i,.cd-hicon{background:var(--g1,var(--ds-brand))!important;box-shadow:none!important;border-radius:12px!important}
.home .pop .ci{background:var(--g1,var(--ds-brand))!important;color:#fff!important}
.hm-card:first-child{background:#fff!important;color:var(--ds-ink)!important;border:1px solid var(--ds-line)!important}.hm-card:first-child small{color:var(--ds-muted)!important}.hm-card:first-child .hc-i{background:var(--g1,var(--ds-brand))!important;color:#fff!important}
/* header */
.site-head .nav a[aria-current=page]{color:var(--ds-brand)!important;font-weight:700}
/* trust strip */
.cd-trust{display:flex;flex-wrap:wrap;gap:6px 14px;margin:6px 0 12px;padding:0;list-style:none;font-size:.86rem;color:var(--ds-muted);min-height:22px;align-items:center}
.cd-trust li{display:inline-flex;align-items:center;gap:5px}.cd-trust li:before{content:"";width:14px;height:14px;flex:none;border-radius:50%;background:var(--ds-brand-s) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c6b62' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/10px no-repeat}
/* universal 3-step bar */
ol.cd-steps.cd-ds-steps{display:flex;gap:0;margin:0 0 14px;padding:0;list-style:none;counter-reset:none;min-height:40px;align-items:stretch}
ol.cd-steps.cd-ds-steps li{flex:1 1 0;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;padding:8px 6px;margin:0;border:0!important;border-radius:0!important;background:none!important;color:var(--ds-muted);font-weight:600;font-size:.9rem;white-space:nowrap}
ol.cd-steps.cd-ds-steps li:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--ds-line);border-radius:4px}
ol.cd-steps.cd-ds-steps li+li{margin-left:6px}
ol.cd-steps.cd-ds-steps li .n{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:.8rem;background:#fff;border:2px solid var(--ds-line);color:var(--ds-muted)}
ol.cd-steps.cd-ds-steps li.on{color:var(--ds-brand-d)}ol.cd-steps.cd-ds-steps li.on:after{background:var(--ds-brand)}ol.cd-steps.cd-ds-steps li.on .n{background:var(--ds-brand);border-color:var(--ds-brand);color:#fff}
ol.cd-steps.cd-ds-steps li.done{color:#166534}ol.cd-steps.cd-ds-steps li.done:after{background:#22c55e}ol.cd-steps.cd-ds-steps li.done .n{background:#22c55e;border-color:#22c55e;color:#fff;font-size:0}ol.cd-steps.cd-ds-steps li.done .n:before{content:"✓";font-size:.8rem}
@media (max-width:520px){ol.cd-steps.cd-ds-steps li{font-size:.78rem;gap:5px}ol.cd-steps.cd-ds-steps li .n{width:20px;height:20px}}
/* drop zone */
.dz{border:2px dashed #9fc9c3!important;background:#f4faf9!important;border-radius:var(--ds-r-card)!important;padding:28px 16px!important;transition:border-color .15s,background-color .15s}
.dz:hover,.dz.over{border-color:var(--ds-brand)!important;background:var(--ds-brand-s)!important}
.dz:before{content:"";display:block;width:40px;height:40px;margin:0 auto 8px;border-radius:12px;background:var(--ds-brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m17 8-5-5-5 5'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3C/svg%3E") center/22px no-repeat;pointer-events:none}
/* buttons */
main .btn,main button.primary,main .btn-primary{border-radius:var(--ds-r-btn)}
main .btn:not(.ghost):not(.secondary):not(.alt):disabled,main button:disabled{opacity:.55}
.tool-box a[download].btn,.tool-box a.btn[download],.tool-box button[id*=dl i]:not([hidden]),.tool-box button[id*=download i]:not([hidden]){min-height:48px;font-size:1rem;font-weight:700;padding-inline:20px}
/* inline AI bar (replaces floating pills) */
.cd-ai-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;min-height:34px}
.cd-ai-bar .cd-ai-badge,.cd-ai-bar .cd-ai-open{position:static!important;transform:none!important;box-shadow:none!important;border:1px solid transparent!important;border-radius:999px!important;padding:7px 14px!important;font:600 13px/1.2 var(--ds-font)!important;cursor:pointer;min-height:34px}
.cd-ai-bar .cd-ai-badge[aria-pressed=false]{border-color:var(--ds-line)!important}
.cd-ai-bar .cd-ai-note{font-size:.8rem;color:var(--ds-muted)}
#cd-ai-panel.cd-inline{position:relative!important;left:auto!important;bottom:auto!important;transform:none!important;width:auto!important;max-height:none!important;margin:0 0 14px;box-shadow:var(--ds-sh-md)!important;border:1px solid var(--ds-line)}
/* ads never crowd tools */

@media (prefers-reduced-motion:reduce){.dz{transition:none}}

/* dark-mode tokens (ready, opt-in via [data-theme=dark]; site stays light by default) */
[data-theme=dark]{--ds-brand:#2dd4bf;--ds-brand-d:#5eead4;--ds-brand-s:#134e4a;--ds-ink:#e2e8f0;--ds-muted:#94a3b8;--ds-line:#334155;--ds-bg:#0f172a;--ds-cta:#fb923c;--ds-cta-d:#fdba74;--ds-success:#4ade80;--ds-warning:#fbbf24;--ds-error:#f87171;
--cat-photo:#2dd4bf;--cat-pdf:#fb7185;--cat-convert:#a3e635;--cat-typing:#a5b4fc;--cat-career:#93c5fd;--cat-social:#f0abfc;--cat-money:#facc15;--cat-intl:#7dd3fc;--cat-games:#cbd5e1;--cat-ai:#c4b5fd}
[data-theme=dark] .hc-i svg,[data-theme=dark] .ci svg,[data-theme=dark] .cd-hicon svg{color:#0f172a!important}
/* CTA colour: only the final Download action (one orange button per screen) */
.tool-box a[download].btn,.tool-box a.btn[download],.tool-box button[id*=dl i]:not([hidden]):not(:disabled),.tool-box button[id*=download i]:not([hidden]):not(:disabled){background:var(--ds-cta)!important;border-color:var(--ds-cta)!important;color:#fff!important}
.tool-box a[download].btn:hover,.tool-box button[id*=dl i]:hover,.tool-box button[id*=download i]:hover{background:var(--ds-cta-d)!important}
/* one trust strip only: hide the per-tool duplicate privacy pill when the strip exists */
body:has(.cd-trust) .cd-priv{display:none!important}
/* home hero: single chip row under the search */
.hx-hero .wrap{display:flex;flex-direction:column;align-items:center}
.hx-hero .wrap>*{max-width:100%}
.hx-hero .eyebrow{order:0}.hx-hero h1{order:1;margin-inline:auto!important;text-align:center!important}.hx-hero .lead{order:2;text-align:center}.hx-hero .hsearch{order:3;width:min(720px,100%)}.hx-hero .hx-hint{order:4}.hx-hero .cd-quick{order:5;justify-content:center}.hx-hero .hx-recent{order:6}
.hx-hero .hchips{display:none!important}
.hx-hero .cd-quick .btn{min-height:38px;padding:6px 14px!important;font-size:.9rem;border-radius:999px!important}
@media (max-width:560px){.cd-trust{font-size:.8rem;gap:4px 10px;margin:4px 0 10px}.cd-trust li:nth-child(n+4){display:none}.cd-ai-bar .cd-ai-note{display:none}.cd-ai-bar .cd-ai-badge,.cd-ai-bar .cd-ai-open{padding:6px 12px!important;font-size:12.5px!important}}
@media (max-width:560px){.hx-hero .cd-quick{gap:6px!important}.hx-hero .cd-quick .btn{min-height:34px;padding:5px 11px!important;font-size:.8rem}}
/* ---- readability (fonts) ---- */
@font-face{font-family:"CD Devanagari";src:url(/fonts/ndev-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
@font-face{font-family:"CD Devanagari";src:url(/fonts/ndev-600.woff2) format("woff2");font-weight:500 600;font-style:normal;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
@font-face{font-family:"CD Devanagari";src:url(/fonts/ndev-700.woff2) format("woff2");font-weight:700 900;font-style:normal;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
:root{--ds-font:system-ui,-apple-system,"Segoe UI",Roboto,"CD Devanagari","Noto Sans Devanagari",Arial,sans-serif;--muted:#475569;--cd-muted:#475569;--ds-muted:#475569}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:16px;line-height:1.55;font-weight:400;color:var(--ds-ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
main p,main li,main dd,main td,.prose p,.prose li{line-height:1.6}
small,.small,.hint,.muted,.hx-hint,.hx-sub{color:#475569!important;font-weight:400}
small,.small{font-size:max(.875rem,13.5px)}
:lang(hi),[lang=hi]{line-height:1.7}
input,select,textarea,button{font-family:inherit}
main p,main li,#v3 p,.cd-banner,.hcat p{line-height:1.55!important}
@media (max-width:560px){body{font-size:16px}
main p:not(.small):not(.crumbs):not(.hx-hint):not(.cd-games-hint):not(.cd-lb-note):not(.kb-pages):not(.cd-privacy-badge),main li,.prose p,#v3 .sub,.card p,.hx-sub,.cd-banner,p.note{font-size:16px!important}
main .small,main .crumbs,.hx-hint,.cd-games-hint,.cd-lb-note,.kb-pages,.cd-privacy-badge,#v3 .small{font-size:max(14px,.875rem)!important}
input,select,textarea{font-size:16px!important}}
/* ---- bulk cropper AI detect ---- */
.cd-bai{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:48px;margin:10px 0;padding:8px 12px;border:1px solid #ddd6fe;border-radius:10px;background:#f5f3ff;font-size:15px;color:#0f172a}
.cd-bai-t{display:flex;align-items:center;gap:6px;cursor:pointer}.cd-bai-t input{width:18px;height:18px;accent-color:#6d28d9}.cd-bai-t span{color:#475569}
.cd-bai-s{color:#4c1d95;font-weight:600;min-width:1px}
.cd-bai-b{margin-left:auto;border:1px solid #6d28d9;color:#6d28d9;background:#fff;border-radius:8px;padding:6px 12px;font-weight:600;cursor:pointer;min-height:40px;display:inline-flex;align-items:center}
.cd-bai-b+.cd-bai-b{margin-left:0}
.cd-bai-dlg{border:0;border-radius:12px;padding:12px;max-width:96vw;width:min(1140px,96vw);color:#0f172a}.cd-bai-dlg::backdrop{background:rgba(15,23,42,.6)}
.cd-bai-top{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline;margin-bottom:8px}.cd-bai-top span{color:#475569;font-size:14px}
.cd-bai-cv{overflow:auto;text-align:center}.cd-bai-cv canvas{max-width:100%;height:auto;touch-action:none;cursor:crosshair}
.cd-bai-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.cd-bai-act span{flex:1}.cd-bai-act button{min-height:40px;padding:6px 12px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;font-weight:600;cursor:pointer;color:#0f172a}
.cd-bai-act .cd-bai-go{background:#c2410c;border-color:#c2410c;color:#fff}
/* ---- mobile: upload drop zone above the fold (2026-10-30) ---- */
@media (max-width:640px){
main:has(.dz) .crumbs{display:none}
main:has(.dz) h1{font-size:1.5rem!important;line-height:1.25!important;margin:4px 0 6px!important}
main:has(.dz) h1 .cd-hicon{width:34px;height:34px;vertical-align:-6px}
main:has(.dz) .cd-trust{flex-wrap:nowrap;overflow:hidden;margin:2px 0 8px;font-size:14px;min-height:20px}
main:has(.dz) .cd-trust li{white-space:nowrap}
main:has(.dz) .cd-trust li:nth-child(n+3){display:none}
main:has(.dz) .cd-ai-bar{margin:0 0 6px}
main:has(.dz) p.lead{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;margin:0 0 8px}
main:has(.dz) p.lead.cd-open{display:block;-webkit-line-clamp:unset}
main:has(.dz) ol.cd-steps.cd-ds-steps{display:none}
main:has(.dz) .mode-sub{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:6px 0 8px}
main:has(.dz) .mode-tabs{margin-bottom:6px}
}
/* ---- /tool/ CLS: reserve room for the late "output size" box (#cd-size) and the share row (2026-10-30) ---- */
@media (min-width:861px){
#v3 #v3-setup[open]{--cds1:162px;--cds2:64px}
#v3 #v3-setup[open]:not(:has(#cd-size)):not(:has(.cd-preset-share)){padding-bottom:calc(14px + var(--cds1) + var(--cds2))!important}
#v3 #v3-setup[open]:has(#cd-size):not(:has(.cd-preset-share)){padding-bottom:calc(14px + var(--cds2))!important}
}
@media (min-width:1000px){#v3 #v3-setup[open]{--cds1:133px}}
@media (min-width:1200px){#v3 #v3-setup[open]{--cds1:112px}}
/* /tool/ CLS (mobile): the Kruti Dev header pill was shown by tool-chrome.css then hidden by JS; hide it from first paint like every other page */
html body #cd-site-head .hdr-ft{display:none!important}
@media(max-width:860px){body:has(#cd-chrome-css) #cd-site-head .wrap{gap:10px}body:has(#cd-chrome-css) #cd-site-head .nav-toggle{flex:none;width:42px}body:has(#cd-chrome-css) #cd-site-head .cd-lang{right:58px}body:has(#cd-chrome-css) #cd-site-head .brand{flex-shrink:0}}
@media(max-width:640px){body:has(#cd-chrome-css) #cd-site-head .header-actions{display:none!important}}