/* UTM builder (dist/utm-builder.js). Fields on the left, the finished link and GA4 check on the right. */
.rs-tool{padding:10px 0 20px}
.utm{border:1px solid var(--line);background:#fff;min-height:880px}
@media(max-width:900px){.utm{min-height:1760px}}
.utm.sized{min-height:0}
.utm-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.utm-ed{padding:28px;display:flex;flex-direction:column;gap:20px;border-right:1px solid var(--line)}
.utm-out{padding:28px;background:#f5f4f0}
.utm-out>div{position:sticky;top:90px;display:flex;flex-direction:column;gap:16px}
.utm-k,.utm-f>label{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#555;display:block;margin-bottom:8px}
.utm-f>label code,.utm-k code{text-transform:none;letter-spacing:0;font-weight:500;color:#6b6b6b;font-size:12.5px}
.utm .opt{font-weight:400;text-transform:none;letter-spacing:0;color:#6b6b6b}
.utm input[type=text],.utm input[type=url],.utm textarea{width:100%;font:500 16px var(--sans);padding:11px 13px;border:1px solid #ccc;border-radius:2px;background:#fff;color:var(--ink);box-sizing:border-box}
.utm textarea{font:400 15px/1.55 var(--sans);resize:vertical;min-height:150px}
.utm input:focus,.utm textarea:focus,.utm button:focus-visible,.utm a:focus-visible,.utm summary:focus-visible{outline:2px solid var(--red);outline-offset:1px}
.utm-hint{font-size:14px;color:#6b6b6b;margin:6px 0 0;line-height:1.45}
.utm-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.utm-chips{display:flex;flex-wrap:wrap;gap:8px}
.utm-chip{font:600 14px var(--sans);padding:8px 13px;border:1px solid #ccc;background:#fff;border-radius:40px;cursor:pointer;color:var(--ink)}
.utm-chip:hover{border-color:var(--ink)}
.utm-chip[aria-pressed=true],.utm-chip[aria-pressed=true]:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.utm-sugg{display:flex;flex-wrap:wrap;gap:6px}
.utm-sugg button{font:500 14px var(--sans);padding:6px 11px;border:1px solid #ccc;background:#fff;border-radius:2px;cursor:pointer;color:var(--ink)}
.utm-sugg button:hover{border-color:var(--ink)}
.utm-sugg button[aria-pressed=true],.utm-sugg button[aria-pressed=true]:hover{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);font-weight:700}
.utm-tabs{display:inline-flex;border:1px solid #ccc;border-radius:2px;align-self:flex-start}
.utm-tabs button{font:600 14px var(--sans);padding:9px 16px;border:0;background:#fff;cursor:pointer;color:var(--ink)}
.utm-tabs button:hover{background:#e7e4dd;color:var(--ink)}
.utm-tabs button[aria-selected=true],.utm-tabs button[aria-selected=true]:hover{background:var(--ink);color:#fff}
.utm-meta label{font-size:15px;display:flex;gap:10px;align-items:flex-start;line-height:1.45;cursor:pointer}
.utm-meta input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink)}
.utm-build{display:flex;flex-direction:column;gap:20px}
.utm-tbl{width:100%;border-collapse:collapse;font-size:14.5px;margin:2px 0 0}
.utm-tbl th,.utm-tbl td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--line);vertical-align:top}
.utm-tbl th{font:600 13.5px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#555;width:42%;word-break:break-all}
.utm-tbl td{font:500 14px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all}
.utm-more{border-top:1px solid var(--line);padding-top:14px}
.utm-more summary{font:600 15px var(--sans);cursor:pointer;color:var(--ink)}
.utm-more[open] summary{margin-bottom:16px}
.utm-more .utm-f+.utm-f{margin-top:16px}
.utm [hidden]{display:none!important}
.utm-link{background:#fff;border:1px solid var(--line);padding:18px}
.utm-link.empty p{color:#555;font-size:15.5px;line-height:1.5;margin:0}
.utm-len{float:right;font-weight:500;text-transform:none;letter-spacing:0;color:#6b6b6b}
.utm-url{font:500 15px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;margin:0 0 14px;color:var(--ink)}
.utm-list{margin:0 0 12px;padding-left:22px;font:500 13.5px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;max-height:320px;overflow:auto}
.utm-list li{margin:0 0 6px}
.utm-btns{display:flex;flex-wrap:wrap;gap:10px}
.utm-btn{font:600 15px var(--sans);padding:11px 18px;border:1px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;text-decoration:none;border-radius:2px;display:inline-block}
.utm-btn:hover{background:#e7e4dd}
.utm-btn.pri{background:var(--ink);color:#fff}
.utm-btn.pri:hover{background:#333}
.utm-ga{background:#fff;border:1px solid var(--line);padding:16px 18px}
.utm-st{float:right;font-weight:700;letter-spacing:.04em;color:#1e7a46}
.utm-ga.warn .utm-st{color:#a14a06}
.utm-ga p{margin:0;font-size:15px;line-height:1.5;color:#333}
.utm-ga .utm-ga-h{font:700 22px/1.2 var(--sans);color:var(--ink);margin:0 0 6px}
.utm-ga a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}
.utm-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.utm-checks li{font-size:14.5px;line-height:1.5;padding:10px 12px 10px 34px;background:#fff;border:1px solid var(--line);position:relative;color:#333}
.utm-checks li::before{position:absolute;left:12px;top:10px;font-weight:700}
.utm-checks li.ok::before{content:"✓";color:#1e7a46}
.utm-checks li.warn::before{content:"!";color:#a14a06}
.utm-checks li.bad::before{content:"!";color:#d01a20}
.utm code{font-size:.92em;background:#f0eee8;padding:1px 5px;border-radius:2px}
.utm-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 18px;font:600 15px var(--sans);opacity:0;pointer-events:none;transition:.2s;z-index:50;margin:0}
.utm-toast.on{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.utm-grid{grid-template-columns:1fr}.utm-ed{border-right:0;border-bottom:1px solid var(--line);padding:20px}.utm-out{padding:20px}.utm-out>div{position:static}}
@media(max-width:520px){.utm-two{grid-template-columns:1fr}}
.utm-in{display:flex;flex-direction:column;gap:16px;margin-top:4px}
.utm-fs{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.utm-fs legend{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#555;margin-bottom:8px;padding:0}
.utm-fs label,.utm .utm-chk{display:flex;gap:10px;align-items:flex-start;font:400 15px/1.45 var(--sans);color:var(--ink);cursor:pointer}
.utm-fs input,.utm-chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink);flex:none}
.utm select{width:100%;box-sizing:border-box;font:500 16px var(--sans);padding:11px 13px;border:1px solid #ccc;border-radius:2px;background:#fff;color:var(--ink)}
.utm select:focus{outline:2px solid var(--red);outline-offset:1px}
.utm-xrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;margin-bottom:8px}
.utm-x,.utm-add,.utm-inline{font:600 14px var(--sans);background:none;border:0;padding:6px 2px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:var(--ink)}
.utm-add{align-self:flex-start}
.utm-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:520px){.utm-xrow{grid-template-columns:1fr 1fr}.utm-x{grid-column:1/-1;justify-self:start}}