/* Small additions to Polaris: layout helpers only. Colours and type come from Polaris. */
body { margin: 0; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.92em; overflow-wrap: anywhere; }
.muted { opacity: 0.75; }
.wrap { overflow-wrap: anywhere; }
.pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.nowrap { white-space: nowrap; }
.cell-title { display: flex; gap: 10px; align-items: center; min-width: 0; }
.cell-title span { min-width: 0; overflow-wrap: anywhere; }
.steps { margin: 0; padding-left: 20px; display: grid; gap: 10px; }
.kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; }
.trail { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.value-list { margin: 0; padding-left: 18px; }
.cond-row, .act-row { display: grid; gap: 8px; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 2fr) auto; align-items: end; }
.act-row { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.6fr) minmax(0, 2.2fr) auto; }
@media (max-width: 640px) { .cond-row, .act-row { grid-template-columns: 1fr; } }
.preview-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.preview-table th, .preview-table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid rgba(127,127,127,.25); vertical-align: top; overflow-wrap: anywhere; }
.scroll-x { overflow-x: auto; }
.feed-bar { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: end; justify-content: space-between; margin: 0 0 12px; }
.feed-bar > s-select { flex: 1 1 260px; max-width: 480px; }
.bar { height: 6px; border-radius: 3px; background: rgba(127,127,127,.2); overflow: hidden; margin-bottom: 4px; min-width: 80px; }
.bar span { display: block; height: 100%; background: #008060; }
.score { display: flex; align-items: baseline; gap: 2px; padding: 14px 18px; border-radius: 12px; background: rgba(127,127,127,.12); }
.score strong { font-size: 40px; line-height: 1; font-weight: 700; }
.score[data-band="good"] strong { color: #008060; }
.score[data-band="ok"] strong { color: #b98900; }
.score[data-band="low"] strong { color: #d72c0d; }
.file-text { margin: 0; padding: 12px 16px; max-height: 70vh; overflow: auto; font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre; }
.preview-grid { max-height: 70vh; overflow: auto; }
.preview-grid th { position: sticky; top: 0; background: var(--p-color-bg-surface, #fff); white-space: nowrap; z-index: 1; }
.preview-grid td:first-child, .preview-grid th:first-child { position: sticky; left: 0; background: var(--p-color-bg-surface, #fff); min-width: 140px; max-width: 200px; z-index: 2; }
.preview-grid td { min-width: 120px; max-width: 320px; }
.clip { max-height: 7.5em; overflow: auto; }
.sep { border: 0; border-top: 1px dashed rgba(127,127,127,.35); margin: 4px 0; }
@media (max-width: 640px) { .preview-grid td:first-child, .preview-grid th:first-child { position: static; } }
/* Wide content scrolls inside its own box instead of widening the page on phones. */
.contain, .preview-grid { contain: inline-size; }
.wrap s-link { overflow-wrap: anywhere; word-break: break-all; }
.map-grid { display: grid; gap: 8px; }
.map-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px; align-items: center; }
.map-row > span { overflow-wrap: anywhere; font-size: 13px; }
@media (max-width: 640px) { .map-row { grid-template-columns: 1fr; gap: 2px; padding-bottom: 8px; border-bottom: 1px solid rgba(127,127,127,.2); } }
.ai-list { display: grid; gap: 12px; }
.ai-card { border: 1px solid rgba(127,127,127,.3); border-radius: 10px; padding: 12px; display: grid; gap: 8px; }
.ai-head { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ai-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px; }
@media (max-width: 640px) { .ai-cols { grid-template-columns: 1fr; } }
.spark { width: 100%; max-width: 420px; height: 60px; display: block; }
.spark path.line { fill: none; stroke: #008060; stroke-width: 2; }
.spark path.area { fill: rgba(0,128,96,.12); stroke: none; }
.loc-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 10px; align-items: end; }
@media (max-width: 640px) { .loc-row { grid-template-columns: 1fr; } }
.help summary { cursor: pointer; font-size: 13px; }
.help table { margin-top: 6px; }
.tax-box { display: grid; gap: 6px; padding: 10px; border-radius: 10px; background: rgba(127,127,127,.08); }
.tax-list { display: grid; gap: 2px; max-height: 260px; overflow: auto; }
.tax-item { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 13px; }
.tax-item > span { overflow-wrap: anywhere; }
/* Flex children may shrink below their content width, so wide tables scroll instead of widening the page. */
s-stack > *, s-grid > * { min-width: 0; }


/* FifteenFold feed workspace: restrained orange accent, white surfaces, clear actions. */
:root { --ff-accent: #ed6823; --ff-ink:#1d2428; --ff-border:#e4e8e8; --ff-soft:#fff6f0; }
.ff-workspace { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin:12px 0 24px; border-bottom:1px solid var(--ff-border); }
.ff-workspace-tabs { display:flex; gap:4px; overflow-x:auto; flex: 1 1 350px; scrollbar-width:thin; }
.ff-workspace-link { display:inline-flex; align-items:center; min-height:42px; padding:10px 15px; white-space:nowrap; color:var(--ff-ink); text-decoration:none; font-weight:600; font-size:14px; border-bottom:3px solid transparent; }
.ff-workspace-link:hover { background:#f6f7f8; }
.ff-workspace-link.is-active { color:#a9410b; border-bottom-color:var(--ff-accent); }
.ff-more { position:relative; align-self:center; font-size:14px; margin-left:auto; }
.ff-more summary { padding:10px; cursor:pointer; font-weight:600; }
.ff-more-menu { position:absolute; right:0; top:100%; z-index:40; background:white; box-shadow:0 6px 28px rgba(0,0,0,.11); border:1px solid var(--ff-border); width:220px; display:grid; padding:7px; border-radius:9px; }
.ff-more-menu a { padding:10px 12px; color:var(--ff-ink); text-decoration:none; border-radius:5px; }
.ff-more-menu a:hover { background:var(--ff-soft); }
.ff-bulk-bar { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; background:#fff8f3; padding:14px 16px; border:1px solid #f5dbc7; border-radius:9px; }
.ff-quiet-details { margin-top:0; }
.ff-quiet-details summary { font-size:13px; font-weight:600; cursor:pointer; width:max-content; }
.ff-map-section { padding:0; border:1px solid var(--ff-border); border-radius:12px; margin:14px 0 24px; overflow:hidden; background:white; }
.ff-map-section h2 { margin:0; padding:17px 20px; background:#f8f9f9; font-size:16px; font-weight:650; }
.ff-map-head { display:grid; grid-template-columns: 22% 48% 30%; padding:8px 20px; background:#fafafa; border-top:1px solid var(--ff-border); border-bottom:1px solid var(--ff-border); color:#626d70; font-size:12px; font-weight:700; }
.ff-map-row { display:grid; grid-template-columns:22% 48% 30%; gap:0; padding:16px 20px; border-bottom:1px solid var(--ff-border); align-items:start; }
.ff-map-row:last-child { border-bottom:none; }
.ff-map-label { display:flex; flex-direction:column; align-items:flex-start; gap:5px; padding:7px 12px 0 0; font-size:14px; }
.ff-map-key { font-size:11px; overflow-wrap:anywhere; font-family: ui-monospace,Menlo,monospace; }
.ff-map-controls { display:grid; gap:8px; padding-right:20px; }
.ff-source { min-width:0; }
.ff-input { display:block; width:100%; height:36px; padding:6px 10px; color:var(--ff-ink); border:1px solid #cfd6d8; border-radius:6px; background:#fff; font:inherit; font-size:13px; }
.ff-input:focus-visible, .ff-alias-item select:focus-visible { outline:2px solid var(--ff-accent); outline-offset:2px; }
.ff-row-actions { display:flex; justify-content:flex-start; gap:8px; }
.ff-small-btn { background:white; border:1px solid #cfd6d8; color:var(--ff-ink); border-radius:6px; padding:7px 11px; font:inherit; font-size:12px; cursor:pointer; }
.ff-small-btn.ff-save { color:#fff; background:#292c2d; border-color:#292c2d; }
.ff-small-btn:disabled { opacity:.35; cursor:default; }
.ff-inline-link { padding:0; color:#a9410b; background:transparent; border:0; text-decoration:underline; cursor:pointer; }
.ff-advanced-note,.ff-no-source { font-size:13px; color:#677273; line-height:1.5; }
.ff-map-example { padding:7px 8px 0 10px; font-size:13px; line-height:1.5; overflow-wrap:anywhere; max-height:160px; overflow:auto; }
.ff-map-meta { margin-top:6px; font-size:11px; opacity:.7; }
.ff-preview-note { border-left:3px solid var(--ff-accent); background:var(--ff-soft); padding:8px; font-size:12px; }
.ff-error,.ff-text-danger { color:#b1261e; font-size:12px; }
.ff-text-danger { width:max-content; cursor:pointer; background:transparent; border:none; text-decoration:underline; }
.ff-row-result { font-size:12px; }
.ff-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ff-alias-grid { display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)); gap:15px; margin:16px 0; }
.ff-alias-item { display:grid; gap:7px; font-weight:600; font-size:13px; }
.ff-alias-item select { background:white; border:1px solid #cfd6d8; border-radius:6px; padding:7px; min-height:110px; font:inherit; font-weight:400; }
.ff-export-first { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:18px 0; }
.ff-export-advanced { border:1px solid var(--ff-border); border-radius:9px; padding:10px 16px; margin:12px 0; }
.ff-export-advanced > summary { cursor:pointer; font-weight:600; padding:6px 0; }
@media(max-width:860px) { .ff-map-head { display:none; } .ff-map-row { grid-template-columns:1fr; gap:10px; padding:14px; } .ff-map-label { flex-direction:row; flex-wrap:wrap; align-items:center; } .ff-map-example { border-top:1px dashed var(--ff-border); padding:10px 0 0; } .ff-map-controls { padding-right:0; } .ff-alias-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:540px) { .ff-workspace { gap:0; } .ff-workspace-tabs { flex-basis:100%; } .ff-workspace-link { padding:10px 11px; font-size:13px; } .ff-more { margin:4px 0; } .ff-export-first,.ff-alias-grid { grid-template-columns:1fr; } .ff-bulk-bar { gap:8px; } }

.ff-map-controls [hidden], .ff-map-controls .ff-input[hidden] { display:none !important; }
/* Preserve HTML hidden semantics when Shopify/custom element display rules apply. */
[hidden], s-grid[hidden] { display:none !important; }