/* UTM link builder: uses the shared site tokens. Each part of a link keeps one accent colour everywhere:
   source violet, medium mint, campaign rose, term sky, content peach. */
.um-top h1{max-width:15ch}
.um-top .eyebrow{margin-bottom:6px}
.um-sec{padding:20px 0 8px;scroll-margin-top:8px}
.um-grid{display:grid;gap:20px;grid-template-columns:minmax(0,1fr)}
.um-col{min-width:0}
.um-card{border-radius:28px;padding:22px 16px}
.um-h{display:flex;align-items:center;gap:12px;font-size:1.25rem;letter-spacing:-.02em;margin:32px 0 14px}
.um-card>.um-h:first-of-type{margin-top:0}
.um-n{flex:none;display:grid;place-content:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--rose));color:#0B1020;font-weight:800;font-size:1rem;line-height:1}
.um-noscript{margin:0 0 18px;padding:12px 16px;border-radius:16px;background:rgba(255,185,137,.12);border:1px solid rgba(255,185,137,.35);color:#ffd9bd}

/* presets */
.um-presets{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}
.um-presets li{min-width:0}
.um-preset{width:100%;height:100%;min-height:56px;padding:10px 14px;border-radius:18px;border:1px solid var(--line);background:rgba(8,12,30,.55);color:var(--ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:2px;transition:transform .14s var(--ease),background .14s,border-color .14s}
.um-preset b{font-size:.9375rem;line-height:1.25;overflow-wrap:anywhere}
.um-preset span{display:none;font-size:.875rem;color:var(--muted);line-height:1.35;font-weight:500}
.um-preset:hover{background:var(--glass-hi);border-color:rgba(180,190,255,.45);transform:translateY(-2px)}
.um-preset[aria-pressed="true"]{background:rgba(139,123,255,.32);border-color:var(--violet);box-shadow:0 0 22px -8px rgba(139,123,255,.8)}

/* fields */
.um-f{margin:0 0 20px;min-width:0}
.um-lbl{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.um-lbl label{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:1.0625rem}
.um-dot{flex:none;width:12px;height:12px;border-radius:5px;background:var(--fc,var(--violet));box-shadow:0 0 12px var(--fc,var(--violet))}
.um-req,.um-opt{font-size:.875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.um-req{color:#c4baff}
.um-q{margin:0 0 8px;font-size:.9375rem;color:var(--muted)}
.um-f .field{border-left:4px solid var(--fc,var(--line));width:100%}
.um-urlf .field{border-left-width:1px}
.um-f .field[aria-invalid="true"]{border-color:var(--rose)}
.um-fmsg{margin:8px 0 0;font-size:.9375rem;color:var(--muted)}
.um-fmsg:empty{display:none}
.um-fmsg.bad{color:var(--rose);font-weight:600}
.um-addr{margin-top:10px;padding:12px 14px;border-radius:16px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:.9375rem;font-weight:600;line-height:1.4}
.um-addr.bad{background:rgba(245,143,180,.1);border:1px solid rgba(245,143,180,.4);color:#ffd3e2}
.um-addr.warn{background:rgba(255,185,137,.12);border:1px solid rgba(255,185,137,.35);color:#ffd9bd}
.um-fix{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid currentColor;background:transparent;color:inherit;font-weight:700;cursor:pointer}
.um-fix:hover{background:rgba(255,255,255,.1)}
.um-chips{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.um-mini{display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--ink);font-weight:600;font-size:.9375rem;cursor:pointer;overflow-wrap:anywhere;text-align:left;transition:background .14s,border-color .14s}
.um-mini:hover{background:rgba(255,255,255,.12)}
.um-mini[aria-pressed="true"]{background:rgba(139,123,255,.3);border-color:var(--violet)}
.um-mini.used::before{content:"";flex:none;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--mint)}
.um-two{display:grid;grid-template-columns:minmax(0,1fr);gap:0}

/* output */
.um-out .trust{margin-top:20px}
.um-sample{position:relative;margin:12px 0 22px;opacity:.85}
.um-sample-cap{position:absolute;top:-12px;left:14px;z-index:1;padding:2px 10px;border-radius:999px;background:var(--glass-hi);border:1px solid var(--line);font-size:.875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.um-link{margin:0;padding:18px 16px 16px;border-radius:18px;background:rgba(8,12,30,.82);border:1px solid var(--line);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9375rem;line-height:1.9;color:#e4defd;overflow-wrap:anywhere;word-break:break-word}
.u-sep{color:var(--dim)}
.u-p{padding:2px 4px;border-radius:8px;background:rgba(255,255,255,.07);box-shadow:inset 0 -2px 0 var(--fc);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.u-k{color:var(--fc);font-weight:700}
.u-eq{color:var(--dim)}
.u-v{color:var(--ink)}
.u-ex{--fc:var(--dim);color:var(--muted)}
.u-hash{color:var(--muted)}
.um-needhead{margin:0 0 10px;color:var(--muted)}
.um-need{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.um-need li{display:flex;align-items:center;gap:12px;min-height:44px;padding:6px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line);font-weight:600}
.um-need li.done{color:var(--mint);border-color:rgba(63,224,192,.35)}
.um-tick{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--dim)}
.um-need li.done .um-tick{border-color:var(--mint);background:var(--mint) center/12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.3 4.6-5' fill='none' stroke='%230B1020' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.um-read{margin:16px 0 0;color:var(--muted)}
.um-read strong{color:var(--ink);box-shadow:inset 0 -2px 0 var(--fc);padding:0 2px;overflow-wrap:anywhere}
.um-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px}
.um-acts .btn{flex:1 1 13rem}
.um-status{min-height:1.5em;margin:12px 0 0;color:var(--mint);font-weight:600;font-size:.9375rem}
.um-notes,.um-check{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.um-notes li,.um-check li{display:flex;gap:10px;align-items:flex-start;font-size:.9375rem;line-height:1.45;color:var(--muted)}
.um-notes li::before{content:"";flex:none;width:10px;height:10px;margin-top:.4em;border-radius:50%;background:var(--mint)}
.um-ico{flex:none;width:10px;height:10px;margin-top:.4em;border-radius:50%;background:var(--mint)}
.um-notes li.tidy::before,.um-check li.tidy .um-ico{background:var(--violet)}
.um-notes li.tip::before,.um-check li.tip .um-ico{background:var(--sky)}
.um-notes li.warn::before,.um-check li.warn .um-ico{background:var(--peach)}
.um-notes li.warn,.um-check li.warn{color:#ffd9bd}
.um-h3{margin:24px 0 0;font-size:.875rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700}

/* saved list */
.um-saved-head{display:flex;align-items:baseline;justify-content:space-between;gap:6px 12px;flex-wrap:wrap}
.um-saved-head h2{font-size:clamp(1.5rem,4vw,2rem)}
.um-count{font-weight:700;color:var(--muted)}
.um-sub{color:var(--muted);margin:8px 0 18px;max-width:46em}
.um-empty{margin:0;padding:20px 16px;border-radius:18px;border:1px dashed rgba(180,190,255,.3);color:var(--muted);text-align:center}
.um-warn{margin:14px 0 0;padding:12px 16px;border-radius:16px;background:rgba(255,185,137,.12);border:1px solid rgba(255,185,137,.35);color:#ffd9bd}
.um-list{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.um-item{min-width:0;padding:14px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.um-item-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.um-tag{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.07);font-weight:700;font-size:.875rem;overflow-wrap:anywhere}
.um-tag::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--fc)}
.um-item-url{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.6;color:#e4defd;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.um-item-meta{margin:8px 0 0;font-size:.875rem;color:var(--dim);overflow-wrap:anywhere}
.um-item-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.um-act{min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--glass-hi);color:var(--ink);font-weight:700;font-size:.9375rem;cursor:pointer;transition:background .14s}
.um-act:hover{background:rgba(139,123,255,.3)}
.um-act.danger{color:#ffb3cb}
.um-clear{margin-left:auto}
.um-undo{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border:0;background:none;color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.um-saved .privacy-line{margin-top:18px}

/* cheat sheet: a paper sheet on the dark page, cream and ink */
.um-cheat-head{max-width:46em}
.um-sheet{max-width:60rem;padding:22px 16px 18px;border-radius:22px;border-top:10px solid #D94229;background:#FFF8E8;color:#29251F;box-shadow:0 26px 54px -22px rgba(0,0,0,.75)}
.um-sheet-head{display:flex;align-items:center;gap:14px;padding-bottom:14px;margin-bottom:18px;border-bottom:2px solid #29251F}
.um-sheet-brand{margin:0;flex:none;padding:6px 14px;border-radius:999px;background:#29251F;color:#FFF8E8;font-weight:800;font-size:1.125rem;letter-spacing:-.02em}
.um-sheet-head h3{font-size:1.375rem;color:#29251F}
.um-sheet-head p{margin:2px 0 0;color:#5a5246;font-size:.9375rem}
.um-sheet h4{margin:6px 0 10px;font-size:.9375rem;text-transform:uppercase;letter-spacing:.08em;color:#29251F}
.um-tbl{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:.9375rem;line-height:1.45}
.um-tbl caption{text-align:left;font-weight:800;font-size:1.0625rem;padding:0 0 8px}
.um-tbl th,.um-tbl td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(41,37,31,.22);overflow-wrap:anywhere}
.um-tbl thead th{background:#F4E7B9;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}
.um-tbl tbody th{font-weight:800}
.um-tbl small{display:block;font-weight:700;font-size:.875rem;color:#A5301D}
.um-rules{margin:0 0 22px;padding-left:1.4em;font-size:1rem;line-height:1.5}
.um-rules li{margin-bottom:.4em;padding-left:.2em}
.um-rules li::marker{color:#D94229;font-weight:800}
.um-fill{margin:0 0 14px}
.um-fill p{margin:0 0 2px;font-weight:700;font-size:.9375rem}
.um-fill span{display:block;height:30px;border-bottom:1.5px solid #29251F}
.um-sheet-foot{margin-top:12px;padding-top:10px;border-top:1px dashed rgba(41,37,31,.4);text-align:right;font-size:.875rem;color:#5a5246}
.um-cheat-cta{margin-top:22px}
.um-cheat-cta .btn{width:100%}

/* how it works, closing */
.um-prose{margin-top:28px}
.um-steps{counter-reset:s;list-style:none;padding:0;margin:0 0 1.3em}
.um-steps li{counter-increment:s;position:relative;padding-left:48px;min-height:36px;margin-bottom:.9em}
.um-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;display:grid;place-content:center;font-weight:800;color:#0B1020;background:linear-gradient(135deg,var(--violet),var(--rose))}
.um-more{margin-top:32px;max-width:36rem}
.um-closer .btn{width:100%}

.sticky-cta.away{display:none}

@media (min-width:480px){
  .um-preset span{display:block}
  .um-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
  .um-cheat-cta .btn,.um-closer .btn{width:auto}
}
@media (min-width:720px){
  .um-card{padding:30px 28px}
  .um-sheet{padding:30px 32px 22px}
  .um-sheet-head h3{font-size:1.75rem}
}
@media (min-width:960px){
  .um-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:28px;align-items:start}
  .um-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:960px) and (min-height:780px){
  .um-out-col{position:sticky;top:16px}
}
/* narrow screens: table rows become stacked cards (screen only, never in print) */
@media screen and (max-width:719px){
  .um-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .um-tbl,.um-tbl tbody,.um-tbl tr,.um-tbl th,.um-tbl td{display:block;width:100%}
  .um-tbl tr{margin-bottom:10px;padding:10px 12px;border:1px solid rgba(41,37,31,.3);border-radius:14px;background:rgba(255,255,255,.5)}
  .um-tbl th,.um-tbl td{padding:3px 0;border:0}
  .um-tbl tbody th{font-size:1.0625rem}
  .um-tbl td::before{content:attr(data-label);display:block;margin-top:6px;font-size:.875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#6a6055}
  .um-tbl small{display:inline;margin-left:8px}
}
@media (prefers-reduced-motion:reduce){.um-preset:hover{transform:none}}

/* print: the cheat sheet only, black on white, one page */
@page{margin:14mm}
@media print{
  html,body{background:#fff!important;color:#000!important}
  body>*:not(main){display:none!important}
  main>*:not(#cheat){display:none!important}
  #cheat{padding:0!important}
  #cheat .wrap{max-width:none;padding:0}
  #cheat .sec-head,#cheat .cta-row,#cheat .trust{display:none!important}
  .um-sheet{max-width:none;padding:0;border:0;border-radius:0;background:#fff!important;color:#000!important;box-shadow:none!important;font-size:10pt}
  .um-sheet *{color:#000!important;box-shadow:none!important}
  .um-sheet-brand{background:none!important;border:1.5pt solid #000;padding:2pt 10pt}
  .um-sheet-head{margin-bottom:10pt;padding-bottom:8pt;border-bottom:2pt solid #000}
  .um-sheet-head h3{font-size:16pt}
  .um-sheet h4{margin:4pt 0 6pt;font-size:9.5pt}
  .um-tbl{margin-bottom:12pt;font-size:9.5pt;line-height:1.3;break-inside:avoid}
  .um-tbl caption{font-size:10.5pt;padding-bottom:4pt}
  .um-tbl th,.um-tbl td{padding:4pt 6pt;border-bottom:.75pt solid #555}
  .um-tbl thead th{background:#eee!important;font-size:8.5pt}
  .um-tbl small{font-size:8.5pt}
  .um-rules{margin-bottom:12pt;font-size:10pt;line-height:1.35}
  .um-rules li{margin-bottom:2pt}
  .um-fill{margin-bottom:8pt}
  .um-fill span{height:18pt;border-bottom:.75pt solid #000}
  .um-sheet-foot{margin-top:6pt;padding-top:6pt;border-top:.75pt dashed #555}
}