:root{--cda-ink:#0f172a;--cda-ink-soft:#334155;--cda-glow:#22d3ee;--cda-glow-dim:rgba(34,211,238,0.12);--cda-card:rgba(255,255,255,0.72);--cda-border:rgba(15,23,42,0.08);--cda-mesh-1:#f0fdfa;--cda-mesh-2:#eef2ff;--cda-mesh-3:#fdf4ff;--surface:#ffffff;--surface-muted:#f1f5f9;--border:rgba(15,23,42,0.1);--text-main:#0f172a;--text-muted:#64748b;--primary:#0d9488;--primary-dark:#0f766e;--accent:#6366f1;--shadow-soft:0 18px 50px rgba(15,23,42,0.08);--gradient:linear-gradient(135deg,var(--cda-mesh-1) 0%,var(--cda-mesh-2) 45%,var(--cda-mesh-3) 100%);}
.cda-hero-aside{flex:1;min-width:240px;display:flex;flex-direction:column;gap:10px;}
.cda-stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
@media (max-width:575px){.cda-stat-row{grid-template-columns:1fr;}}
.cda-stat-pill{background:var(--cda-card);backdrop-filter:blur(10px);border:1px solid var(--cda-border);border-radius:14px;padding:12px 14px;box-shadow:var(--shadow-soft);}
.cda-stat-pill strong{display:block;font-size:1.35rem;font-weight:700;color:var(--cda-ink);line-height:1.1;}
.cda-stat-pill span{display:block;font-size:0.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.04em;margin-top:4px;}
.cda-workbench{background:var(--gradient);border-radius:24px;border:1px solid var(--cda-border);padding:clamp(16px,4vw,28px);margin-bottom:2.5rem;position:relative;overflow:hidden;}
.cda-workbench::before{content:"";position:absolute;inset:-40%;background:radial-gradient(circle at 20% 20%,var(--cda-glow-dim) 0%,transparent 45%),radial-gradient(circle at 80% 60%,rgba(99,102,241,0.1) 0%,transparent 40%);pointer-events:none;}
.cda-workbench>*{position:relative;z-index:1;}
.cda-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;border:2px dashed rgba(13,148,136,0.35);border-radius:20px;background:rgba(255,255,255,0.55);cursor:pointer;transition:border-color 0.2s,background 0.2s,transform 0.2s;padding:24px 16px;text-align:center;}
.cda-dropzone:hover,.cda-dropzone.cda-dropzone--active{border-color:var(--primary);background:rgba(255,255,255,0.85);}
.cda-dropzone.cda-dropzone--hidden{display:none;}
.cda-dropzone-icon{width:56px;height:56px;border-radius:16px;background:linear-gradient(145deg,var(--primary),var(--accent));display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;margin-bottom:12px;box-shadow:0 12px 28px rgba(13,148,136,0.25);}
.cda-dropzone h2{font-size:1.1rem;font-weight:600;margin:0 0 6px;color:var(--cda-ink);}
.cda-dropzone p{margin:0;font-size:0.875rem;color:var(--text-muted);}
.cda-dropzone-actions{margin-top:16px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.cda-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;font-weight:600;font-size:0.9rem;padding:12px 20px;border:none;cursor:pointer;transition:transform 0.15s,box-shadow 0.15s;}
.cda-btn:active{transform:scale(0.98);}
.cda-btn--primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;box-shadow:0 8px 24px rgba(13,148,136,0.3);}
.cda-btn--ghost{background:rgba(255,255,255,0.9);color:var(--cda-ink);border:1px solid var(--cda-border);}
.cda-rail{margin-top:20px;display:none;flex-direction:column;gap:16px;}
.cda-rail.cda-rail--visible{display:flex;}
.cda-rail-grid{display:grid;gap:14px;grid-template-columns:1fr;}
@media (min-width:768px){.cda-rail-grid{grid-template-columns:minmax(0,220px) 1fr;align-items:start;}}
.cda-field label{display:block;font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;color:var(--cda-ink-soft);margin-bottom:6px;}
.cda-select{width:100%;border-radius:12px;border:1px solid var(--cda-border);padding:12px 14px;font-size:0.95rem;background:#fff;color:var(--cda-ink);}
.cda-toggle-cluster{display:flex;flex-direction:column;gap:10px;}
@media (min-width:576px){.cda-toggle-cluster{flex-flow:row wrap;}}
.cda-switch{display:flex;align-items:center;gap:10px;padding:10px 14px;background:rgba(255,255,255,0.75);border-radius:12px;border:1px solid var(--cda-border);cursor:pointer;user-select:none;font-size:0.875rem;color:var(--cda-ink);}
.cda-switch input{accent-color:var(--primary);width:18px;height:18px;}
.cda-analyze{width:100%;}
.cda-clear{width:100%;}
.cda-toolcard{display:none;gap:16px;margin-top:20px;}
.cda-toolcard.cda-toolcard--visible{display:grid;}
.cda-toolcard-left,.cda-toolcard-right{min-width:0;}
@media (min-width:992px){.cda-toolcard.cda-toolcard--visible{grid-template-columns:minmax(0,340px) minmax(0,1fr);align-items:start;}}
.cda-toolcard-left .cda-rail{margin-top:0;}
.cda-toolcard-left .cda-rail-grid{grid-template-columns:1fr;}
.cda-toolcard-left .cda-toggle-cluster{flex-direction:column;}
.cda-preview-panel{margin-top:8px;padding:16px;border-radius:18px;background:rgba(255,255,255,0.8);border:1px solid var(--cda-border);display:none;}
.cda-preview-panel.cda-preview-panel--visible{display:block;}
.cda-preview-panel h3{font-size:0.8rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-muted);margin:0 0 12px;}
#cda-imageCanvas{display:block;max-width:100%;height:auto;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--cda-border);}
.cda-results{display:none;flex-direction:column;gap:18px;margin-top:8px;}
.cda-results.cda-results--visible{display:flex;}
.cda-panel{background:rgba(255,255,255,0.88);border-radius:18px;border:1px solid var(--cda-border);padding:16px 18px;box-shadow:var(--shadow-soft);}
.cda-panel h3{margin:0 0 14px;font-size:1rem;font-weight:600;color:var(--cda-ink);}
.cda-palette{display:flex;flex-wrap:wrap;gap:14px 16px;padding-bottom:4px;}
.cda-swatch-wrap{position:relative;width:min(72px,22vw);}
.cda-swatch-wrap::before{content:"";display:block;padding-top:100%;}
.cda-swatch{position:absolute;top:0;left:0;right:0;bottom:22px;border-radius:14px;box-shadow:0 6px 18px rgba(15,23,42,0.12);border:2px solid rgba(255,255,255,0.9);cursor:default;transition:transform 0.15s;}
.cda-swatch:hover{transform:translateY(-2px);}
.cda-swatch-wrap span{position:absolute;left:0;right:0;bottom:0;height:20px;line-height:20px;text-align:center;font-size:0.7rem;font-weight:600;color:var(--cda-ink-soft);}
.cda-chart-host{position:relative;width:100%;min-height:260px;max-height:360px;}
#cda-chartCanvas{width:100%!important;height:260px!important;}
.cda-metric-grid{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (min-width:576px){.cda-metric-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
.cda-metric{background:var(--surface-muted);border-radius:14px;padding:14px;text-align:center;border:1px solid var(--cda-border);display:flex;flex-direction:column;gap:6px;}
.cda-metric-label{font-size:0.7rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--text-muted);}
.cda-metric-value{font-size:1.35rem;font-weight:700;color:var(--cda-ink);}
.cda-export{display:none;flex-wrap:wrap;gap:10px;margin-top:4px;}
.cda-export.cda-export--visible{display:flex;}
.cda-prose{margin-top:3rem;padding-bottom:2rem;}
.cda-prose h2{font-size:1.5rem;font-weight:700;margin:2.25rem 0 0.75rem;color:var(--cda-ink);}
.cda-prose h2:first-child{margin-top:0;}
.cda-prose h3{font-size:1.15rem;font-weight:600;margin:1.75rem 0 0.5rem;color:var(--cda-ink-soft);}
.cda-prose p{color:var(--cda-ink-soft);line-height:1.65;margin-bottom:1rem;}
.cda-prose ul{margin:0 0 1rem 1.1rem;padding:0;color:var(--cda-ink-soft);line-height:1.6;}
.cda-prose .cda-callout{border-left:4px solid var(--primary);background:var(--surface-muted);padding:14px 18px;border-radius:0 14px 14px 0;margin:1.25rem 0;font-size:0.95rem;color:var(--cda-ink-soft);}
.cda-prose dl{margin:1rem 0;display:grid;gap:10px;}
.cda-prose dt{font-weight:600;color:var(--cda-ink);}
.cda-prose dd{margin:0 0 0 0;color:var(--cda-ink-soft);}