.we-v2-visual{display:grid;gap:1.1rem}.we-v2-visual-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:clamp(1rem,2.5vw,1.5rem);border:1px solid var(--we-v2-line);border-radius:1.35rem;background:linear-gradient(135deg,#fff,#f0f7fb)}.we-v2-visual-heading p,.we-v2-visual-heading h2{margin:0}.we-v2-visual-heading p{color:var(--we-v2-primary);font-size:.72rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.we-v2-visual-heading h2{max-width:52rem;margin-top:.35rem;color:var(--we-v2-ink);font-size:clamp(1.15rem,2.3vw,1.55rem);line-height:1.35}.we-v2-visual-heading>span{flex:none;padding:.45rem .7rem;border-radius:999px;background:#fff;color:var(--we-v2-muted);font-size:.72rem;font-weight:850}.we-v2-visual-workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}.we-v2-visual-controls,.we-v2-image-stage,.we-v2-style-stage{display:grid;align-content:start;gap:.85rem;min-width:0;padding:1rem;border:1px solid var(--we-v2-line);border-radius:1.2rem;background:var(--we-v2-surface);box-shadow:var(--we-v2-shadow-sm)}
.we-v2-visual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.we-v2-visual-field{display:grid;gap:.38rem;min-width:0;color:var(--we-v2-ink);font-size:.78rem;font-weight:850}.we-v2-visual-field input,.we-v2-visual-field select,.we-v2-visual-field textarea,.we-v2-visual-controls>textarea{width:100%;min-height:2.75rem;border:1px solid var(--we-v2-line);border-radius:.78rem;background:#fff;padding:.62rem .7rem;color:var(--we-v2-ink);font:inherit}.we-v2-visual-field textarea,.we-v2-visual-controls>textarea{font:500 .78rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;resize:vertical}.we-v2-visual-field input[type="color"]{padding:.25rem}.we-v2-visual-check{display:flex;align-items:center;gap:.55rem;padding:.65rem .75rem;border:1px solid var(--we-v2-line);border-radius:.8rem;background:var(--we-v2-soft);font-size:.78rem;font-weight:800}.we-v2-visual-check input{width:1.05rem;height:1.05rem}.we-v2-visual-actions,.we-v2-visual-presets,.we-v2-color-presets{display:flex;flex-wrap:wrap;gap:.4rem}.we-v2-visual-actions button,.we-v2-visual-presets button,.we-v2-contrast-controls button,.we-v2-harmony button{min-height:2.45rem;border:1px solid var(--we-v2-line);border-radius:.7rem;background:#fff;padding:.5rem .7rem;color:var(--we-v2-muted);font-weight:800;cursor:pointer}.we-v2-visual-primary{min-height:2.75rem;border:0;border-radius:.75rem;background:var(--we-v2-primary)!important;padding:.65rem .85rem;color:#fff!important;font-weight:900;cursor:pointer}.we-v2-visual-status{margin:0;padding:.75rem .85rem;border-radius:.78rem;background:#eaf8f2;color:#17694f;font-size:.78rem;font-weight:750;line-height:1.55}.we-v2-visual-status[data-tone="danger"]{background:#fff0ef;color:#9f2f2b}
.we-v2-color-preview{display:grid;place-items:center;min-height:14rem;border-radius:1rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55);font-weight:900}.we-v2-color-preview--large{min-height:23rem}.we-v2-visual-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.we-v2-visual-values button{min-width:0;padding:.7rem;border:1px solid var(--we-v2-line);border-radius:.8rem;background:var(--we-v2-soft);text-align:left;cursor:pointer}.we-v2-visual-values small{display:block;color:var(--we-v2-muted)}.we-v2-visual-values strong{display:block;margin-top:.25rem;overflow-wrap:anywhere;white-space:pre-wrap;color:var(--we-v2-ink);font-size:.78rem}.we-v2-color-presets button{width:2rem;height:2rem;border:2px solid #fff;border-radius:999px;background:var(--swatch);box-shadow:0 0 0 1px var(--we-v2-line);cursor:pointer}.we-v2-palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.we-v2-palette-grid article{padding:.9rem;border:1px solid var(--we-v2-line);border-radius:1rem;background:#fff}.we-v2-palette-grid h3{margin:0 0 .55rem;font-size:.85rem}.we-v2-palette-grid article>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border-radius:.7rem}.we-v2-palette-grid button{display:flex;align-items:end;min-height:4.2rem;border:0;background:var(--swatch);padding:.35rem;cursor:pointer}.we-v2-palette-grid button span{padding:.12rem .25rem;border-radius:.25rem;background:rgba(255,255,255,.8);color:#111827;font-size:.58rem;font-weight:800}
.we-v2-contrast-controls{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:.7rem}.we-v2-contrast-controls>div{display:grid;gap:.35rem}.we-v2-contrast-preview{min-height:12rem;padding:2rem;border:1px solid var(--we-v2-line);border-radius:1.1rem;text-align:center}.we-v2-contrast-preview strong{font-size:clamp(1.4rem,4vw,2.4rem)}.we-v2-contrast-preview p{margin:.45rem auto 0;max-width:34rem}.we-v2-contrast-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.we-v2-contrast-results article{padding:1rem;border:1px solid var(--we-v2-line);border-radius:1rem;background:#fff}.we-v2-contrast-results small{color:var(--we-v2-muted)}.we-v2-contrast-results strong{display:block;margin:.3rem 0;font-size:clamp(1.4rem,3vw,2rem)}.we-v2-contrast-results p{margin:.25rem 0;color:var(--we-v2-muted);font-size:.76rem}.we-v2-contrast-results button{border:0;background:transparent;color:var(--we-v2-primary);font-weight:850;cursor:pointer}.we-v2-harmony{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.we-v2-harmony button{min-height:4.2rem;color:#fff;text-shadow:0 1px 2px #000;font-size:.7rem}
.we-v2-style-stage{place-items:center;min-height:25rem;background:linear-gradient(145deg,#edf4f8,#fff)}.we-v2-style-stage>div{display:grid;place-items:center;width:min(17rem,75%);aspect-ratio:1;border-radius:1.2rem;background:#fff;color:var(--we-v2-ink);font-weight:900}.we-v2-style-stage--gradient>div{width:100%;height:100%;min-height:21rem;aspect-ratio:auto;color:#fff;text-shadow:0 1px 4px #000}.we-v2-image-stage{place-items:center;min-height:25rem;overflow:hidden;background:linear-gradient(145deg,#f2f7fa,#fff)}.we-v2-image-stage canvas,.we-v2-image-stage img,.we-v2-image-stage svg{display:block;max-width:100%;height:auto}.we-v2-image-stage img:not([src]){display:none}.we-v2-image-stage p{margin:0;color:var(--we-v2-muted);font-size:.75rem}.we-v2-qr-output{display:grid;place-items:center;max-width:100%}.we-v2-qr-output canvas,.we-v2-qr-output img{max-width:100%;height:auto}.we-v2-file-drop{display:grid;place-items:center;gap:.3rem;min-height:7rem;padding:1rem;border:2px dashed #a8bfd1;border-radius:1rem;background:#f4f9fc;text-align:center;cursor:pointer}.we-v2-file-drop input{max-width:100%}.we-v2-file-drop small{color:var(--we-v2-muted)}.we-v2-image-meta{display:flex;flex-wrap:wrap;gap:.5rem}.we-v2-image-meta span{padding:.45rem .6rem;border-radius:.65rem;background:var(--we-v2-soft);font-size:.76rem}
@media(max-width:800px){.we-v2-visual-workbench{grid-template-columns:1fr}.we-v2-image-stage,.we-v2-style-stage{min-height:18rem}.we-v2-color-preview--large{min-height:15rem}}
@media(max-width:560px){.we-v2-visual-heading{display:grid}.we-v2-visual-heading>span{justify-self:start}.we-v2-visual-grid,.we-v2-visual-values,.we-v2-palette-grid,.we-v2-contrast-results{grid-template-columns:1fr}.we-v2-contrast-controls{grid-template-columns:1fr}.we-v2-contrast-controls>button{justify-self:center}.we-v2-harmony{grid-template-columns:1fr}.we-v2-palette-grid article>div{grid-template-columns:repeat(2,minmax(0,1fr))}.we-v2-palette-grid button{min-height:3.5rem}}