/* Affiliate Choice Toolkit: UTM link builder v01.14. Loads after toolkit.css and shares its tokens.
   Each tag has one colour, used on the form swatches, the live link and the explainer. */
.ub-main{--ub-source:#5ce1e6;--ub-medium:#ffc857;--ub-campaign:#c4b0ff;--ub-content:#ff9f80;--ub-term:#8ee6a8;--ub-id:#a8bcc4;--ub-ink:#0f2a33;--ub-muted:#52696f;--ub-line:#d7e3e2;--ub-mist:#eef5f4;--ub-teal:#10c0df;--ub-teal-dark:#0a7a8e;--ub-night:#080a0e}
[data-key="source"]{--ub-c:var(--ub-source)}
[data-key="medium"]{--ub-c:var(--ub-medium)}
[data-key="campaign"]{--ub-c:var(--ub-campaign)}
[data-key="content"]{--ub-c:var(--ub-content)}
[data-key="term"]{--ub-c:var(--ub-term)}
[data-key="id"]{--ub-c:var(--ub-id)}
.ub-swatch{display:inline-block;flex:0 0 auto;width:10px;height:10px;border-radius:3px;background:var(--ub-c,#c6d6d5);box-shadow:inset 0 0 0 1px rgba(15,42,51,.18)}
.ub-visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[hidden]{display:none!important}
/* toolkit.css resets button fonts on .toolkit-page; restore the button type for buttons styled as .tk-btn */
.toolkit-page button.tk-btn{font:700 15.5px/1 "Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
.toolkit-page button.ub-link-btn{font:700 14.5px/1 "Schibsted Grotesk",system-ui,sans-serif}

/* Hero: compact, so the tool sits near the top of the screen */
.ub-hero{padding:34px 0 30px;background:linear-gradient(135deg,#fff 0%,#f5fbfa 60%,#e9f6f5 100%);border-bottom:1px solid var(--ub-line)}
.ub-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px;font-size:13px;color:var(--ub-muted)}
.ub-crumbs a{color:inherit;text-decoration:none}
.ub-crumbs a:hover{color:var(--ub-teal-dark);text-decoration:underline}
.ub-crumbs [aria-current]{color:var(--ub-ink);font-weight:600}
.ub-hero-row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.ub-hero h1{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(40px,4.6vw,62px);line-height:1;letter-spacing:-.035em}
.ub-lede{max-width:680px;margin:16px 0 0;font-family:"Source Serif 4",Georgia,serif;font-size:clamp(17px,1.4vw,20px);line-height:1.55;color:#3e565c}
.ub-hero-note{display:flex;align-items:center;gap:10px;flex:0 0 auto;max-width:300px;margin:0 0 4px;padding:12px 16px;border-radius:12px;background:#fff;border:1px solid var(--ub-line);font-size:14px;line-height:1.4;color:var(--ub-muted)}
.ub-hero-note svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:var(--ub-teal-dark);stroke-width:1.6;stroke-linecap:round}

/* Tool */
.ub-tool{padding:36px 0 64px;background:var(--ub-mist)}
.ub-tool-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:28px;align-items:start}
.ub-form{padding:28px 28px 24px;border-radius:20px;background:#fff;border:1px solid var(--ub-line)}
.ub-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.ub-field label{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--ub-ink)}
.ub-field label code{margin-left:auto;font:500 12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#6c8187}
.ub-form input[type=text],.ub-form input[type=url],.ub-form select,.ub-rules input[type=text],.ub-rules select{width:100%;min-height:48px;padding:0 14px;border-radius:10px;border:1.5px solid #c6d6d5;background:#fff;color:var(--ub-ink);font:500 16px/1.3 "Schibsted Grotesk",system-ui,sans-serif;transition:border-color .15s,box-shadow .15s}
.ub-form input::placeholder,.ub-rules input::placeholder{color:#93a6ab}
.ub-form input:focus,.ub-form select:focus,.ub-rules input:focus,.ub-rules select:focus{outline:none;border-color:var(--ub-teal);box-shadow:0 0 0 3px rgba(16,192,223,.2)}
.ub-field[data-key] input:focus{border-color:var(--ub-teal);box-shadow:0 0 0 3px rgba(16,192,223,.2),inset 4px 0 0 var(--ub-c)}
.ub-field-url input{min-height:54px;font-size:17px}
.ub-hint{margin:0;font-size:13.5px;line-height:1.45;color:var(--ub-muted)}

.ub-channels{margin:24px 0 0;padding:0;border:0;min-width:0}
.ub-channels legend{padding:0;font-size:15px;font-weight:700;color:var(--ub-ink)}
.ub-channels .ub-hint{margin-top:4px}
.ub-chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ub-chip{min-height:38px;padding:0 14px;border-radius:99px;border:1px solid #c9dadd;background:#fff;color:var(--ub-ink);font-size:14px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.ub-chip:hover{border-color:var(--ub-teal)}
.ub-chip.is-active{background:var(--ub-ink);border-color:var(--ub-ink);color:#fff}

.ub-core{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 18px;margin-top:24px}
.ub-field-wide{grid-column:1/-1}
.ub-more{margin-top:22px;border-top:1px solid var(--ub-line);padding-top:16px}
.ub-more summary{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--ub-teal-dark);cursor:pointer;list-style:none}
.ub-more summary::-webkit-details-marker{display:none}
.ub-more summary::before{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .2s}
.ub-more[open] summary::before{transform:rotate(45deg) translate(-2px,-2px)}
.ub-more .ub-core{margin-top:18px}

.ub-tidy{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:22px;padding:14px 16px;border-radius:12px;background:#f5f9f9;border:1px solid #e1ebea}
.ub-check{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;cursor:pointer}
.ub-check input{width:18px;height:18px;margin:0;accent-color:var(--ub-teal-dark)}
.ub-sep{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ub-muted)}
.ub-form .ub-sep select{width:auto;min-height:38px;padding:0 30px 0 10px;font-size:14px}

.ub-actions-nojs{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* Members' naming rules */
.ub-rules{padding:20px;border-radius:18px;border:1.5px dashed #bccfd0;background:#fff}
.ub-rules-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.ub-rules h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-size:21px;font-weight:600;letter-spacing:-.01em}
.ub-rules-badge{flex:0 0 auto;white-space:nowrap;padding:4px 10px;border-radius:99px;background:#d9f6fb;color:#065463;font-size:12px;font-weight:700}
.ub-rules p{margin:0;font-size:14.5px;line-height:1.5;color:#3e565c}
.ub-rules-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.ub-rules-use,.ub-rules-save{display:flex;gap:10px;margin-top:12px}
.ub-rules-use select,.ub-rules-save input{flex:1 1 auto;min-width:0}
.ub-rules .ub-rules-note{margin-top:10px;font-size:13px;color:var(--ub-muted)}
.ub-rules .ub-rules-status{margin-top:10px;font-size:13.5px;font-weight:600;color:var(--ub-teal-dark)}
.ub-rules .ub-rules-status:empty{display:none}
.ub-rules .ub-rules-status.is-error{color:#b3261e}
.ub-link-btn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:46px;padding:0 16px;border-radius:10px;border:1.5px solid var(--ub-ink);background:var(--ub-ink);color:#fff;font:700 14.5px/1 "Schibsted Grotesk",system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.ub-link-btn:hover{background:#1a3f4b;border-color:#1a3f4b;color:#fff}
.ub-link-quiet{background:transparent;color:var(--ub-ink);border-color:#c6d6d5}
.ub-link-quiet:hover{background:transparent;color:var(--ub-teal-dark);border-color:var(--ub-teal)}
.ub-link-btn:disabled{opacity:.45;cursor:not-allowed}

/* Result: the dark panel where the link takes shape */
.ub-result{align-self:stretch}
.ub-result-inner{position:sticky;top:calc(var(--acg-header-total-h,100px) + 20px);padding:24px 24px 20px;border-radius:22px;background:var(--ub-night);color:#fff;box-shadow:0 30px 60px -32px rgba(8,10,14,.6)}
.ub-result-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ub-result h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-size:24px;font-weight:600;letter-spacing:-.02em}
.ub-length{font-size:13px;color:#8fa6ac}
.ub-anatomy{margin-top:16px;min-height:120px;padding:18px;border-radius:14px;background:#121821;border:1px solid rgba(255,255,255,.08)}
.ub-url{margin:0;font:500 15px/1.75 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;overflow-wrap:anywhere;color:#e8f0f2}
.ub-seg{transition:opacity .15s,background .15s}
.ub-seg-origin{color:#fff;font-weight:700}
.ub-seg-path{color:#c9d6d9}
.ub-seg-kept{color:#8fa6ac}
.ub-seg-punct{color:#6f8790}
.ub-seg-hash{color:#c9d6d9}
.ub-seg-key{color:#8fa6ac}
.ub-seg-val{color:var(--ub-c);font-weight:700;border-bottom:2px solid var(--ub-c);padding-bottom:1px}
.ub-seg-base{display:block;font:500 15px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;color:#e8f0f2}
.ub-anatomy.has-focus .ub-seg{opacity:.35}
.ub-anatomy.has-focus .ub-seg.is-focus{opacity:1}
.ub-anatomy.has-focus .ub-seg-tag.is-focus{background:color-mix(in srgb,var(--ub-c) 18%,transparent);border-radius:4px}
.ub-empty{margin:0;font-size:15px;line-height:1.55;color:#a9bec3}
.ub-empty-error{color:#ffb4a8}
.ub-plain{width:100%;margin-top:12px;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:#121821;color:#fff;font:14px/1.5 ui-monospace,Menlo,Consolas,monospace;resize:vertical}
.ub-hint-dark{margin-top:8px;color:#a9bec3}

.ub-result-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ub-result-actions .tk-btn{flex:1 1 auto}
.ub-copy{min-width:150px}
.ub-copy:disabled{opacity:.4;cursor:not-allowed}
.ub-copy.is-done{background:#fff;border-color:#fff;color:var(--ub-ink)}
.ub-btn-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.ub-btn-dark:hover,.ub-btn-dark:focus-visible{border-color:var(--ub-teal);color:#fff}
.ub-btn-dark[aria-disabled="true"]{opacity:.4;pointer-events:none}

.ub-channel{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.ub-channel-label{margin:0;font-size:13px;color:#8fa6ac}
.ub-channel-name{margin:4px 0 0;font-family:"Source Serif 4",Georgia,serif;font-size:28px;font-weight:600;line-height:1.15;letter-spacing:-.02em;color:var(--ub-source)}
.ub-channel.is-unassigned .ub-channel-name{color:var(--ub-medium)}
.ub-channel-why{margin:6px 0 0;font-size:14px;line-height:1.5;color:#c3d2d6}

.ub-checks{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.ub-check-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:10px 12px;border-radius:10px;background:#121821;font-size:13.5px;line-height:1.5;color:#d5e1e4}
.ub-check-label{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:6px;font-size:11.5px;font-weight:800}
.ub-check-item.is-error .ub-check-label{background:#ffb4a8;color:#4a0f08}
.ub-check-item.is-warn .ub-check-label{background:var(--ub-medium);color:#3a2900}
.ub-check-item.is-tip .ub-check-label{background:#2a3a46;color:#cfe7ec}

/* Below the builder: naming rules and recent links side by side */
.ub-extras{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:28px;align-items:start}

/* Recent links on this device */
.ub-recent{padding:20px;border-radius:18px;background:#fff;border:1px solid var(--ub-line)}
.ub-recent-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ub-recent h2{margin:0;font-size:16px;font-weight:700}
.ub-recent-list{list-style:none;margin:10px 0 0;padding:0}
.ub-recent-item{padding:12px 0;border-top:1px solid #e6eeed}
.ub-recent-item:first-child{border-top:0;padding-top:4px}
.ub-recent-meta{margin:0;font-size:13px;font-weight:700;color:var(--ub-ink)}
.ub-recent-link{margin:3px 0 0;font:13px/1.5 ui-monospace,Menlo,Consolas,monospace;color:var(--ub-muted);word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ub-recent-actions{display:flex;gap:16px;margin-top:6px}
.ub-text-btn{padding:0;border:0;background:none;color:var(--ub-teal-dark);font-size:13.5px;font-weight:700;cursor:pointer}
.ub-text-btn:hover{text-decoration:underline}
.ub-text-btn.is-done{color:var(--ub-ink)}

/* Phone and tablet dock: shows while the link panel is out of view */
.ub-dock{display:none;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:60;align-items:center;gap:12px;padding:10px 10px 10px 16px;border-radius:16px;background:var(--ub-night);color:#fff;box-shadow:0 18px 40px -16px rgba(8,10,14,.7)}
.ub-dock-text{flex:1 1 auto;min-width:0;margin:0;font:13px/1.4 ui-monospace,Menlo,Consolas,monospace;color:#c9d6d9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ub-dock .tk-btn{flex:0 0 auto;min-height:44px;padding:0 18px}
.ub-dock .tk-btn.is-done{background:#fff;border-color:#fff;color:var(--ub-ink)}

/* A set for several channels */
.ub-set{padding:72px 0 76px;background:#fff}
.ub-set-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.ub-set h2,.ub-learn h2,.ub-habits h2,.ub-related h2{margin:0;font-family:"Source Serif 4",Georgia,serif;font-weight:600;font-size:clamp(30px,3.2vw,44px);line-height:1.08;letter-spacing:-.03em}
.ub-set-head p{max-width:680px;margin:14px 0 0;font-size:17px;line-height:1.6;color:#3e565c}
.ub-set-actions{display:flex;flex-wrap:wrap;gap:10px;flex:0 0 auto}
.ub-set-actions .tk-btn:disabled{opacity:.45;cursor:not-allowed}
.ub-set-actions .tk-btn.is-done{border-color:var(--ub-teal);color:var(--ub-teal-dark)}
.ub-set-picks{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 18px}
.ub-pick{position:relative;cursor:pointer}
.ub-pick input{position:absolute;opacity:0;width:1px;height:1px}
.ub-pick span{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 15px 0 12px;border-radius:99px;border:1px solid #c9dadd;background:#fff;font-size:14px;font-weight:600;transition:background .15s,border-color .15s,color .15s}
.ub-pick span::before{content:"";width:16px;height:16px;border-radius:5px;border:1.5px solid #9fb4b8;background:#fff center/11px no-repeat}
.ub-pick input:checked+span{background:var(--ub-ink);border-color:var(--ub-ink);color:#fff}
.ub-pick input:checked+span::before{border-color:#5ce1e6;background-color:#5ce1e6;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.6l4.6-5' fill='none' stroke='%230f2a33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.ub-pick input:focus-visible+span{outline:2px solid var(--ub-teal);outline-offset:3px}
.ub-set-table{position:relative;overflow-x:auto;border-radius:16px;border:1px solid var(--ub-line);background:var(--ub-mist)}
.ub-set-empty{margin:0;padding:28px 24px;font-size:15px;color:var(--ub-muted)}
.ub-table{width:100%;border-collapse:collapse;font-size:14px}
.ub-table th,.ub-table td{padding:13px 16px;text-align:left;vertical-align:top;border-top:1px solid #dbe6e5}
.ub-table thead th{border-top:0;background:#e3eeed;font-size:12.5px;font-weight:800;color:#3d5257}
.ub-table tbody tr{background:#fff}
.ub-td-channel{font-weight:700;white-space:nowrap}
.ub-td-code{font:13.5px/1.5 ui-monospace,Menlo,Consolas,monospace;white-space:nowrap;color:#3e565c}
.ub-td-link{min-width:320px;font:13px/1.55 ui-monospace,Menlo,Consolas,monospace;color:#3e565c;word-break:break-all}
.ub-td-btn{width:1%;white-space:nowrap}

/* Explainer */
.ub-learn{padding:76px 0;background:var(--ub-mist)}
.ub-learn-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:56px;align-items:start}
.ub-learn-intro p{max-width:360px;margin:14px 0 0;font-size:17px;color:var(--ub-muted)}
.ub-tags{margin:0;display:grid;gap:0;border-radius:18px;overflow:hidden;background:var(--ub-night)}
.ub-tags>div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:20px;padding:18px 22px;border-top:1px solid rgba(255,255,255,.08)}
.ub-tags>div:first-child{border-top:0}
.ub-tags dt{display:flex;align-items:center;gap:10px;font:700 14.5px/1.5 ui-monospace,Menlo,Consolas,monospace;color:var(--ub-c)}
.ub-tags dt .ub-swatch{box-shadow:none}
.ub-tags dd{margin:0;font-size:15px;line-height:1.6;color:#d5e1e4}

/* Habits */
.ub-habits{padding:80px 0 20px}
.ub-habits-inner{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:56px}
.ub-habits-copy p{max-width:680px;margin:0 0 18px;font-family:"Source Serif 4",Georgia,serif;font-size:19px;line-height:1.65;color:#2e464c}
.ub-habits-copy p:last-child{margin-bottom:0}

/* Related tools */
.ub-related{padding:20px 0 84px}
.ub-related-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:22px}
.ub-related-head a{font-size:15px;font-weight:700;color:var(--ub-teal-dark);text-decoration:none}
.ub-related-head a:hover{text-decoration:underline}
.ub-related-name{margin:12px 0 0;font-size:19px;line-height:1.25;letter-spacing:-.01em}
.tk-card.is-soon .ub-related-name{color:#36494f}
.tk-card.is-live .ub-related-name a{color:inherit;text-decoration:none}
.tk-card.is-live .ub-related-name a::after{content:"";position:absolute;inset:0;border-radius:18px}

.ub-faq{padding-top:76px;background:#fff;border-top:1px solid var(--ub-line)}

@media (max-width:1020px){
  /* On tablets and phones the link panel follows the form, and a small dock keeps Copy in reach. */
  .ub-tool-grid{grid-template-columns:1fr}
  .ub-result-inner{position:static}
  .ub-extras{grid-template-columns:1fr;gap:16px}
  .ub-learn-grid,.ub-habits-inner{grid-template-columns:1fr;gap:26px}
  .ub-set-head{flex-direction:column;align-items:flex-start;gap:20px}
  .ub-dock{display:flex}
  .ub-dock[hidden]{display:none!important}
  body.toolkit-tool-page{padding-bottom:84px}
}
@media (max-width:640px){
  .ub-hero{padding:24px 0 24px}
  .ub-hero-row{flex-direction:column;align-items:flex-start;gap:16px}
  .ub-hero-note{max-width:none}
  .ub-tool{padding:20px 0 48px}
  .ub-chip{min-height:34px;padding:0 12px;font-size:13.5px}
  .ub-chip-row{gap:6px}
  .ub-form{padding:20px 16px 18px;border-radius:16px}
  .ub-core{grid-template-columns:1fr;gap:18px}
  .ub-result-inner{padding:20px 16px 16px}
  .ub-tidy{flex-direction:column;align-items:flex-start}
  .ub-rules-use,.ub-rules-save{flex-direction:column}
  .ub-tags>div{grid-template-columns:1fr;gap:6px}
  .ub-set{padding:52px 0 56px}
  .ub-set-actions{width:100%}
  .ub-set-actions .tk-btn{flex:1 1 auto}
  .ub-habits{padding:56px 0 10px}
  .ub-habits-copy p{font-size:18px}
  .ub-related-head{flex-direction:column;gap:8px}
}
@media (prefers-reduced-motion:reduce){
  .ub-seg,.ub-more summary::before{transition:none}
}
