/* The event page's Creative tab, drawn by app/event-creative-tab.js: her
   event page playground's creative() view (2 Nov 2026). The four groups sit
   side by side and wrap; each tool is a white row with its icon, its name,
   a small format chip with Ready or Waiting, and its button. The icons are
   the Creative box's (.event-creative-icon in event-creative-box.css). Adds
   no colour tokens. */
.event-creative-row-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:16px;align-items:start}
.event-creative-row-group{min-width:0}
.event-creative-row-group h4{margin:0 0 8px;color:var(--muted);font:600 11px/1.3 "Poppins",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.event-creative-row-list{display:grid;gap:8px}
.event-creative-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.event-creative-row .event-creative-icon{width:28px;height:28px;color:var(--ink)}
.event-creative-row-text{display:grid;min-width:0}
.event-creative-row-name{color:var(--ink);font:700 13px/1.3 "Poppins",sans-serif;overflow-wrap:anywhere}
.event-creative-row-status{display:block;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.event-creative-row-status.is-ready{color:#17613c}
.event-creative-row-status.is-waiting{color:#9a6817;font-weight:500}
.event-creative-row-format{display:inline-block;margin:0 4px 0 0;padding:3px 7px;border-radius:999px;background:#f3f2ee;color:var(--muted);font:600 10px/1 "Poppins",sans-serif;white-space:nowrap;vertical-align:1px}
.event-creative-row-open{white-space:nowrap}
.event-creative-row-open[aria-busy="true"]{cursor:progress;opacity:.6}
.event-creative-tab-note{margin:0 0 12px;color:var(--muted);font-size:13px}

/* On a phone the button goes under the words. */
@media(max-width:480px){
  .event-creative-row{grid-template-columns:auto minmax(0,1fr)}
  .event-creative-row-open{grid-column:2;justify-self:start}
}
