/* Interaction-only styles. Page colors and mascot treatment live in landing-v6.css. */
.demoControls{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:16px 0;font:12px/1.5 Arial,sans-serif}.demoControls label{display:grid;gap:5px;flex:1;min-width:140px}.demoControls select,.demoControls button,.demoAction,.demoTab{font:inherit;color:inherit;border:1px solid currentColor;border-radius:8px;padding:9px 12px;background:transparent;cursor:pointer}.demoControls select{background:#222534;color:#f0edf5;width:100%}.demoControls input[type=range]{width:100%;accent-color:#c2a8e5}.demoControls button:hover,.demoAction:hover,.demoTab:hover{background:#c2a8e522}.demoControls button:focus-visible,.demoAction:focus-visible,.demoTab:focus-visible,.demoControls select:focus-visible{outline:2px solid #c2a8e5;outline-offset:3px}.demoTab[aria-selected=true],.demoControls button[aria-pressed=true]{background:#c2a8e5;color:#171923;border-color:#c2a8e5}.demoResult{padding:12px 14px;border:1px solid #c2a8e54d;border-radius:10px;font:12px/1.6 Arial,sans-serif;margin:12px 0;color:inherit}.demoResult:empty{display:none}.demoControls output{font-weight:700}.demoProductPhoto{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px}.v4ProductGlyph:has(.demoProductPhoto){width:130px;height:100px;padding:0;overflow:hidden}.demoHeroPhoto{float:right;width:42%;max-height:160px;object-fit:cover;border-radius:10px;margin:0 0 12px 14px}.a4CreativePreview .demoCreativePhoto{width:100%;height:160px;object-fit:cover;border-radius:8px;transform:none!important}.demoEvidence{margin:10px 0;border-bottom:1px solid #c2a8e530;font-size:12px}.demoEvidence summary{cursor:pointer;padding:10px 0;font-weight:700}.demoEvidence p{line-height:1.6;padding-bottom:10px}.demoChecklist{display:grid;gap:9px;font-size:12px;margin:16px 0}.demoChecklist label{display:flex;gap:9px;align-items:center}.demoChecklist input{accent-color:#c2a8e5;width:17px;height:17px}.demoPhotoCredit{font-size:10px;opacity:.65;line-height:1.5}.h4MiniTabs:has(button),.v4UITabs:has(button){display:flex;gap:6px;flex-wrap:wrap}.h4MiniTabs .demoTab,.v4UITabs .demoTab{font-size:11px;padding:7px 10px}.demoHint{font:11px/1.5 Arial,sans-serif;opacity:.7}.demoControls [hidden]{display:none!important}@media(max-width:600px){.demoHeroPhoto{max-height:125px}.demoControls{gap:8px}.demoControls label{min-width:120px}.demoControls button{min-height:42px}.demoTab{min-height:40px}}
/* Explicit line grouping survives older renderers and global br rules. */
.adsV4 .a4HeroCopy h1 .demoTitleLine{display:block;max-width:100%}.a4HeroInner>*{min-width:0}.a4CreativePreview .demoCreativePhoto{position:relative;inset:auto;right:auto;bottom:auto;margin:20px 0 38px;display:block}.a4CreativePreview>.demoPhotoCredit{position:static}.a4CreativePreview>div:has(.demoPhotoCredit){position:static;display:block;border:0;padding:0}.a4CreativePreview{height:auto}.demoControls select{min-width:0;max-width:100%}@media(max-width:600px){.adsV4 .a4HeroCopy h1{font-size:clamp(36px,10.2vw,48px);letter-spacing:-.05em}.a4HeroBoard,.a4WorkspaceBody{min-width:0}.demoHeroPhoto{float:none;width:100%;max-height:155px;margin:0 0 14px}.demoControls label{min-width:0;flex-basis:130px}.demoControls input{min-width:0}}
.v4ProductGlyph.demoPhotoGlyph{width:130px;height:100px;padding:0;overflow:hidden}.a4CreativePreview>.demoPhotoAttribution{position:static;display:block;border:0;padding:0}.a4CreativePreview>.demoPhotoAttribution p{margin:0}
